Some suggestions for adding interactivity to otherwise static media include:

• Creating an HTML button linked to an online resource, for example, a patient information site
• Using motion to visually guide the viewer to key pieces of information, for example, efficacy results, rather than animating background or secondary information
• Providing interactions which meaningfully customize the message for an HCP, for example, filtering data by demographic or zip code
• Adding audio narration of important aspects of content
• For videos also available on YouTube, embedding a local copy of the video and display it within a frame or open it full screen via a button, so it is always available regardless of 3G coverage. The YouTube URL can be referenced as a hyperlink.
• Linking to or embedding (using a frame) external systems, for example, a send additional info mini-website or a subscribe to mailing list web-form

HTML5 media can be tested by loading it into a website and viewing the website from iPad’s Safari browser. Various HTML editor applications can provide more accurate representations of how content displays. These tools are a good proxy for how content displays in Veeva, with the following exceptions:

• Page loading times are slightly faster than loading from a website, but significantly slower than loading from the browser cache. If the initial page load creates any flashes or wait time, smaller media files or different background colors are recommended.
• The top left corner of the page (60 x 176 pixels) is obscured by navigation controls, so interactive media should not be placed there

In order to increase interactive options and dynamic content within HTML5 media, Veeva provides several API functions that can be embedded within HTML5 slides. See the CLM JavaScript library for more information on the available functions.

Considerations

• HTML5 speed - HTML5 documents in CLM render faster than loading from a remote website but slower than loading from the browser’s cache. Testing all content in CLM is recommended.
• JavaScript speed - The JavaScript execution speed of Safari on the iPad is less than 10% of the speed on a desktop computer. Complex animations that render smoothly on a computer may appear to stutter on the iPad. Using subtler or slower animations reduces the visibility of these performance limitations.
• Navigation - The Vault CRM app handles transitioning to the next piece of media via a swipe to the left. Internal navigation should be limited so users do not lose their place when swiping left and right through media. Each slide should be created as a separate piece of media.
• Zooming - This can be disabled on iPad using <meta name=viewport content=width=device-width,initial-scale=1,user-scalable=no /> as part of the HTML. See Apple’s developer documentation for more information.