The “Making Of” our Interactive Postcard Player
uStudio Staff | Interactive Video, Video Leaders, Video Platform
uStudio Staff | Interactive Video, Video Leaders, Video Platform
We had so much interest in this month's SXSW Postcard Player that we decided to interview its developer on the inspiration behind the interaction and how he made it real.
What were your goals when you set out to build uStudio's Postcard Player?
We had two goals -- one communications and one technical. The communications goal was to find a way to speak to our audience about SXSW in a way that was differentiated and relevant. SXSW is about discovery. It’s a chance to immerse yourself in media, technology and content creation. We wanted to send a welcoming message that was as playful and fun as Austin and - fittingly - unique. Rather than create new videos, we thought it would be fun to curate a “best of” Austin list and focus on delivering the content in a new way. This fit with our technical goal of showcasing the possibilities of interactive video design that become possible when you use a Player Framework.
“Player Framework” is a term than some people may not be familiar with. What is that exactly? Is it the same thing as a customizable player?
Not exactly. There are a lot of customizable players out there that limit “customization" to superficial aesthetics. A Player Framework is so much more than that. You have to think of a Player Framework like a player factory. For example, different car models such as the Toyota Camry and Lexus ES share the same chassis. The most difficult parts to develop – the floorplan, wheelbase, steering and suspension – are shared across models. But there is still a tremendous amount of customization related to the exterior, interior, engine, performance, ride characteristics, material choices, etc that can be manipulated on top of the chassis. Basic customizable players lock you into a certain model. They force you down a path where all you get is a specific model, like a Toyota, and your customization options are limited to basic styling of color and trim. A Player Framework gives you the player chassis and invites you to build any kind of player on top of it, for any business purpose.
What does the Player Framework specifically enable you to do that you can’t do with a basic player?
uStudio's Player Framework enables me to create a rich, custom interactive experience on top of a player, without worrying about the details of video playback. Instead I can focus on getting the user experience and interaction elements just right, and the framework takes care of the rest. These days, we’re increasingly meeting creative types who want to differentiate themselves from their competitors. We’re getting businesses asking for more capabilities because they have pressing needs. They need viewers to be able to engage in live dialogue on Twitter, download videos and presentations and reports, or make purchases in frame. A Player Framework makes these types of unique experiences possible.
In the case of the Postcard Player, what were you able to do by using the Player Framework that you would not have been able to do otherwise?
A traditional playlist limits you to static video content delivered in a linear progression (video A, B, C) through the playlist. Using the player framework, I was able to completely revamp the user experience to be more interactive and non-linear. Now the user can "play" with the player itself, scrolling over the image to discover videos hidden under each of the letters and watching them in any order he chooses.
How easy or difficult is it to use the framework? How long did this theme take you?
The Player Framework lets me tailor a player to an audience using standard web development code: HTML, CSS, and JavaScript. It means any company can have custom interactive video players, without having to worry about the more complex details of playback, like capturing analytics and all the different formats that deliver device compatibility, for instance. Instead, I was able to develop the theme, using straightforward HTML and JavaScript, in just a couple of days, followed by another day integrating the final artwork into the theme.
Now that the Postcard Player has been created, how else might it be used?
The Austin mural artwork is just a superficial thumbnail on top of the player. It uses an image map form factor to guide the user through video selection and playback. If you take the thumbnail art away, you can still reuse the interaction design and player functionality. As I said, the artwork integration took about a day. The beauty of this particular theme, i.e. the Postcard Player, is that it provides a non-linear way to watch videos in a playlist. So, for example, if I wanted to use the same code to create a training player for cyclists, I could simply find a cycling image for the thumbnail, arrange a few training videos into a playlist player with this player framework theme applied, and the user could click around on the cycling diagram to discover the relevant training videos. The Austin postcard is just the skin. The actual code for this theme is reusable and allows you to playfully discover videos in a playlist and watch them in any sequence.
By continuing to use the site, you agree to the use of cookies. more information
The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.