Innovative video navigation on TED.com

March 14th, 2008 . by polyGeek

TED video interface, MouseOut

The TED.com website has undergone quite a few changes recently with a new design and features. This morning I saw a video on their site that uses a very simple and usable form of video navigation that I think everyone should see. (In addition the video content itself is worthy of viewing.)

The video interface looks simple enough, as you see here. It pretty much your standard layout. What they did that is unique is when you mouse over the video timeline it expands - as you can see to the right here. In the expansion you get additional information about the video in how the content is arranged. So you can drag your playhead to view a specific portion. But even better, you con simply click on a label in the expansion and jump to that section of the video. So not only do you get more information about how the video content is organized and it’s length but you can navigate straight to it.

It’s pretty clear that to make this work you need to have Adobe Communication Server, or whatever they’re calling it today, because the video needs to be streamed instead of progressive. But this is TED where pretty much everything they do is top shelf.

TED video interface, MouseOut

You could do this with a progressive download but the user wouldn’t be able to jump to portions of the video that haven’t been downloaded yet.

This is the sort of User eXperience (UX) that when you see it you think, “Well, I can’t believe I didn’t think of that.” I’ll see what I can do to add a UX like this to my video.Maru code.

Share and Enjoy: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google

Leave a Reply

Name

Mail (never published)

Website