Viddler’s founding premise centered on making engaging video content interactive. With mobile video use on the rise, bring your own device on the rise, and lack of flash support on mobile devices intersecting with a demand for anytime, anywhere delivery, Viddler needed to make sure the interactive features already supported in the flash player could be delivered without flash and be responsive to any device being used. Plus, we had to ensure there was room to add in new interactions and activities planned for in our roadmap.

How could we fit features and controls that are found outside the player, like personal notes and bookmarks, chapters, and related document resources, inside the player instead? How should we indicate to viewers that there are comments or questions at a particular point in time? And how do we get this all to work on a small smartphone screen?

We needed a focus group, so we turned to our local distance learning association, PADLA. At a PADLA meeting on September 23, 2014, our senior UX designer and product owner drove to Philadelphia to present our challenge. Using paper prototypes, PADLA members moved controls around the player window and told us what they expected and why. They looked to the top left of the video for published information and to the top right to add their own contributions. We learned hiding controls wouldn’t work because they weren’t expected to be in a video player in the first place. Their current mental model for video player controls needed to remain untouched.

Armed with this feedback and pictures of their paper prototypes, we started our design iterations. First, hand drawings shared our findings with the development team to get additional feedback. Then designed files were created and shared with the PADLA group using LinkedIn. After their approval, we started coding our responsive design and user experience for testing a release to production. The new video player launched in March of 2015.

Viddler’s player design deserves to win the UX award because we have revolutionized the way video is understood - actions that were once only thought possible to do outside the video can now occur within the player window, reinventing the way we learn and interact with video. Users are amazed by the possibilities that they had never considered before - students contributing to their learning process by answering questions, responding to discussions, and taking notes - right within the video player!

Video has always been known for being engaging. However traditional video controls only offer a passive viewing experience so the impact of learning is entirely dependant on the quality of storytelling. Study after study concludes active learning approaches are more effective than passive ones. We knew we had to go beyond the perception that video itself is engaging to make a player that reinvents the way people learn with video.

We needed to add simple access to chapters, questions in the video player, and timeline specific discussion boards in a way that is equally delightful to use from smartphones and desktop monitors. We needed to do it in a way that made users aware of these actions they didn’t expect to be in a video player, but without completely masking the video content at all times.

Our solution is grounded in focus group testing, prototyping, and iterations of progressive feedback. The user centered design, progressive disclosure elements, and adherence to existing mental models make the player functional. Attention to detail and aesthetics make it delightful to use. And the concept allows engaging video content to be delivered in an effective, active learning experience that revolutionizes the way video is understood.