Interactive Video Tips: How to optimize Interactive Video for mobile devices [Week 5]

by Basho Mosko |

How would you react if you heard that mobile video viewing has increased by over 700 percent since Q4 of 2011? Shock, amazement, disbelief? “Yes to all of those!” was my reaction before downloading the Ooyala Global Video Index Q4 2013, which reports that year over year, time spent watching video on tablets and mobile devices is up an astounding 719 percent since Q4 of 2011, and up 160 percent since Q4 of 2012.

Brands and agencies aren’t sleeping on these statistics, and we’re regularly fielding questions about how to optimize Interactive Video for mobile devices. Want to know how to engage viewers on all devices? We’ll provide a framework for how to think about Interactive Video (IV) on mobile here. Read on.

Define who you want to reach and where you want to reach them

How are you defining mobile? While some solutions work on some devices, finding a solution that works on all devices is not easy, so the primary question you need to ask your team is what devices are important to the campaign? Do you expect most of your viewers to be interacting on an iPad, iPhone, Galaxy, Kindle Fire, or are you targeting a specific operating system, like Windows, iOS, Android, OS X, or the new Windows Phone 8.1? Devices and browsers abound so it’s important to know who you’re trying to reach and choose your solution accordingly.

News flash: Flash-based solutions will not work on the majority of smartphones or tablets, and while some may offer an app as a solution to view the project, you’ll need to evaluate whether an app download is a significant blocker to customer acquisition. Are you comfortable with viewers being forced to download an app to view your IV on mobile? Be clear about your target mobile audience, and choose a solution that meets those needs.

Custom build vs. platform

Some of our favorite IV experiences are custom-built, partly because, with a big enough budget, there are very few limitations when building a site from scratch. For example, we can’t get enough of Pharell’s dynamic interactive music video site 24hoursofhappy. Combine a catchy track with joyful dancing and a fully immersive, user-driven, interactive experience and you have a recipe for success. Built in HTML5, it works great on iPad but not on iPhone. When trying to watch on iPhone or Android Galaxy phone, the message states: “This website doesn’t work on mobile. Please try on your desktop or tablet.”

The interactive music video also took a huge creative team (credits take over two minutes to watch, making it 24 hours and 2 minutes of Happy). There’s no doubt it was expensive to produce, and, because it’s custom built, it’ll likely not stand the test of time as maintaining a site like that is non-trivial engineering work as browsers, operating systems, and devices advance. Lastly, a hard-coded experience lies completely in the hands of the engineers and creatives that are building it. Changes can be difficult if not impossible to implement, meaning once it the ship has sailed, it has sailed.

In contrast, most IV authoring platforms provide a heightened level of creative control to the brand, department, or agency. Platforms offer an in-house solution that can be scalable, cost efficient, quick to publish, and require minimal technical knowledge. New content can be created specifically to leverage the strengths of a certain platform, be that branching, clickable calls-to-action, or full Site Pairing.

Interactivity can also be added to existing content to increase its stickiness or power to convert. Overall, the decision to add interactivity is often determined by budget and campaign goals. You either have a high-dollar, agency-built, custom one-off project with a limited life span, or a scalable, in-house solution for adding an engaging third dimension to mobile video.

The 4-inch design 

User interaction and overall visual design are crucial when scoping an IV for mobile. We recommend designing to your smallest device, which means you should consider how the interactive project will look on a 4-inch screen. To do this, you should:

  • Force landscape orientation for viewing.
  • Make any CTAs or clickable buttons very large – think small screen, big thumbs.
  • Minimize on-screen choices, as they take up real estate. Use a maximum of three on-screen choices.
  • Make any copy larger than you think is “normal.” Use it as a design style.
  • Use the touchscreen medium by making clickable areas obvious and inviting.
  • Shoot for mobile: less movement, close-ups, clear images, well lit, and great audio.

Keep it light – mobile bandwidth is finicky

WiFi, 3G, 4G, LTE … you don’t really know what kind of connectivity your users are going to have, so it’s best to plan for the worst. Keep in mind that mobile video and mobile Interactive Video are very different beasts. Mobile video performance depends mostly on your CDN, whereas mobile interactive video performance is affected by many of the same factors as a mobile website. Plan your mobile IV like you would your mobile website, and try to keep the embedded page lightweight. Whenever possible, limit plugins, add-ons, extra JavaScript, and heavy images.

In terms of project design, keep clips short and leverage the interactivity to move the story. A number of 30-second-long clips linked together can capture an audience's attention and quickly engage them while also keeping the project snappy on mobile. And per the above design tips, with branching video it’s best to limit video choices to no more than three per node and two choices being ideal. This will ensure that the next choices are able to load quickly and deliver a seamless experience.

Plan and test CTAs for mobile

If adding buttons that link to other URLs – product pages, download materials like coupons, or trigger actions like adding to a cart – be sure to think through the user experience on the target devices to ensure the experience isn’t broken. One-click adding of a coupon to a smartphone camera roll could be an ideal call-to-action, but it will need to be tested on all the target devices to make sure that users are experiencing what your creatives designed.

Shoppable videos, while fabulous on tablets, aren't viable on smartphones without the proper design. Link-outs to product pages could open a new tab in some browsers or a new window in others, and the linked product page should also be a mobile-optimized page for a smooth experience. Designing with mobile in mind and then testing all CTAs on targeted devices is the only way to ensure a high-quality end-user experience.

Make it sharable

Embed social sharing right into the video content both at choice transition points in the project and always at the end. Make the icons big. Pick two or three targeted social networks to focus on, and make it obvious and easy to share. This will maximize the opportunity for your videos to enter the video zeitgeist and catch great traffic.

Optimized mobile Interactive Video? Check!

While the thinking around creating a mobile Interactive Video might be similar to building a mobile website, fortunately, the building process doesn’t have to be. Spend a little extra time planning for success, and making a mobile IV will be a breeze. And once you plan for your masterpiece and capture some clips, take a FREE spin with the Rapt Media authoring platform, or schedule a free session with one of our specialists to set up your business account and start winning with mobile Interactive Video.

Have any questions about Interactive Video you’d like answered? Drop them in the comments below and we’ll add them to our list of IV Tips. See you next week!

Missed last week’s IV Tips? Check it out here: Using call-to-action buttons in Interactive Video [Week 4] 

Employee Engagement Report

Employee Engagement Report

Recent Posts