a new medium

A very insightful creative mind once said that people don’t remember much about your site’s design. Fonts, colours, layout are all very important, yes, but the one things people don’t forget is their first emotional reaction. That’s all you have to design for. That first glimpse that without any objectivity defines the entire future of your relationship. Along the same lines Clotaire Rapaille (The Culture Code book) preaches the science of creating very deep connections between products and consumers, sometimes inquiring into our collective childhood to unlock cultural elements that have defined the behavior for an entire generation.

Fast forward to the age of interactive sites and you’ll have @jjg, the very own “father of AJAX” and author of “The Elements of User Experience” explaining how all you can control is the emotion. Most people are already wired to react to certain codes (cultural codes, that is). So, when building a new tool or application, it makes sense to build a foundation that is deeply engrained into our collective story.

How? From strategy to visual design any good product needs to be evaluated from two perspectives: what do users need and what does the product is trying to accomplish? In the following video I explain the first:

Provide a new medium, fluid and boundless, that allows the hive mind to quickly scan through a vast library of digital videos to uncover the most important snippets in order to keep up with the growing volume of video content.

None of us is young enough to have grown up surrounded by media. And so we look for artificial organization schemes to serialize our consumption. They are called TV “series” for a reason. But observation of how younger generations consume media has led me to believe that a new medium where multiple storylines are being played out simultaneously is not only possible but it will eventually improve our ability to digest through the increasing volume of information using patterns of consumption that we haven’t even discovered.

Of course, creating such a medium to interact with video seems like an impossible task today. But with a little help from standards, open source projects and the power of a very energetic Mozilla community I’m convinced we have all the elements to make it happen:
HTML5 with its capabilities to display video directly provides the perfect lightweight canvas for this project.

CSS3 can provide all the fluid layout without sacrificing performance.

JQuery and other javascript libraries like Modernizr will enable this dashboard to run across a variety of platforms without having to worry about all the different implementation details.

Because the challenge is to unlock video we’ll have to leverage libraries like popcorn.js to make sure the video content is actionable and the dashboard truly serves as a discovery tool.

Finally AJAX will enable realtime measurement of any action on the dashboard in such a way that the actions of users will influence how videos are presented to subsequent visitors.

Try the live demo.

6 Comments

6 Responses to “a new medium”

  1. Amy Z. July 24, 2011 at 3:49 pm #

    Hi Juan. I really like your video dashboard idea. And I really like how just a select part of the video is shown — the best part. What a great resource for the multimedia desk of newsrooms.

    Is there a way to place transparent headlines over them that only appear when you roll over it? Could give information about a when it was shot, or a particular scene, etc. Short words. Just a thought. Well done.

    • juan July 25, 2011 at 2:39 am #

      Absolutely. In fact, I use that kind of overlay on TinyWrld to reveal place tags. That should do.

  2. Raynor Vliegendhart July 26, 2011 at 5:29 am #

    Hi Juan, your concept is interesting, but the live demo takes a while to load. For a next version, I suggest that you load the page incrementally. For example, you could first load all the thumbnails and display those. After that, you could load only a few animated summaries (certainly not all) and display those. When a summary is loaded, you could start loading the next summary. I think this will make the user experience a bit smoother.

    But again, an interesting concept. I’m looking forward to how your idea will develop. :)

    • juan July 27, 2011 at 3:05 pm #

      Thanks for the feedback! Yes, as much as I tried to compress the videos, the resulting thumbnails (all of them) were still over 1Mb which makes for a very heavy page. Not only that, since they are animations, unless you have a pretty good graphics processor the frame animation on GIFs is pretty bad so they will appear to be very slow. These are some of the challenges we face with this project. Your suggestion as to how to selectively animate certain thumbnails is very much along the lines of what I have planned.

  3. Phillip Smith August 1, 2011 at 9:08 pm #

    Hey there Juan,

    Very exciting to watch this idea develop. Looking forward to what comes next. :)

    –Phillip.

Trackbacks/Pingbacks

  1. » #MozNewsLab week two: From consuming news to joining the conversation Alexandra Samur - August 1, 2011

    [...] they need. With the abundance of video content available on the interwebs, this tool created by Juan Gonzalez shows a lot of [...]

Leave a Reply

You must be logged in to post a comment.