Break.com, a popular online video destination (August 2007 stats were approximately 500M video clips, 17M unique users/month, and 1.3M unique users/day who consume 15M videos/day), best characterized as a channel catered to guys aged 18-35, worked with BLITZ agency to launch a “spatial search” application built using Silverlight 1.0. It is an interesting visualization of search results and related hits in a “non-linear” presentation.

slide

he spatial search application provides a next-generation user experience for search, adding to the traditional HTML list-based search results display. The idea came from an observation that it is difficult to effectively distinguish direct hits and related hits in the traditional one-dimensional search results list type of presentation. There are many different ways of visualizing these data relationships today, such as popular ones to draw out three-dimensional representations of connections, (like ThinkMap’s VisualThesaurus). The project team here decided to use a remarkably different approach which elegantly enhances the video preview experience by not presenting the user with too many choices, while at the same time simplifying the technical requirements on loading the amount of results to be displayed. The resulting application is intuitive and easy to use, and adds to the “fun” factor.

The project team used Expression Blend to create the user interface and the interactive design elements (animations, timelines, transitions, etc.), and Expression Encoder to handle the large-volume video transcoding jobs. The technical implementation was actually remarkably simple - a combination of XAML generated by Blend, JavaScript code, some HTML integration, and some static images. The deployment did not require Break to make any changes in the server infrastructure, other than publishing the applications and videos as new content released on the website.

In addition to the spatial search application, the project team also built a full-featured video player using Silverlight.

slide slide

It allows the user to resize the player dynamically (dragging the lower right corner), find other content while watching the same video clip, as well as many other neat features. Here the project team took a different direction on user experience design - more functional than “next-gen”.

The project team released a video describing the application sand their development process (hosted in the new Silverlight player). Also check out BLITZ at www.blitzagency.com and their blogs at http://labs.blitzagency.com.

A few more interesting live Silverlight applications:

(originally published at https://blogs.msdn.microsoft.com/dachou/2007/10/04/silverlight-at-break-com/)