« Previous | Main | Next »

BBC Music Showcase: UX&D perspective

Post categories:

Sacha Sedriks Sacha Sedriks | 15:30 UK time, Thursday, 16 December 2010


Guy Debord, ‘The Naked City’, 1957

Guy Debord, ‘The Naked City’, 1957

BBC Music has recently launched an alpha version of its Music Showcase and as a member of the User Experience & Design (UX&D) team involved in its development, I’ve been asked to offer some additional insights around the rationale of the site design specifically. (Please also refer to blogs by my colleagues Matt Coulson and Andy Puleston).
I could talk in detail about the visual design of the site, but I’d prefer to take this opportunity to discuss the myriad of interaction design challenges we’ve been wrestling with as a team in order to create an ambitious website whose features are, I believe, without precedent on the web, never mind the BBC.

The current version of the site certainly isn’t without its faults. But better to fail spectacularly rather than continue along the well-trodden path of mediocrity, no? The challenge to establish a cohesive UX and editorial voice is still ongoing and it’s the little details (i.e. visual cues, seamless transitions from one state to another, clarity of language, etc) that we are focusing on now to make the Showcase shine as a fully polished product. Over the coming sprints — with the help of experiential insight and input from our users — we’ll be reiterating, adding some new features and improving the overall UX of the Showcase (as well as integrating other sections of the BBC Music site) in order to fully realize our overall ambitions.

Mental ModelsAn illustration of the 'mental models' idea
The main issue we face with the BBC Music Showcase is establishing an intuitive mental model where none currently exists.

For those unfamiliar with the concept, mental models is a term used in the cognitive sciences to understand how people know, perceive, make decisions and construct behaviour in a variety of environments. These concepts of information processing and cognition can aid interface designers when considering UX and Graphical User Interfaces (GUIs) for websites and software, in general. We try to model interactions and employ interface metaphors in ways familiar to the user, but this can become problematic once the user encounters situations that are unfamiliar to them, resulting in a cognitive dissonance and ergo, confusion.

Continuous Playback
Of all the features of the Showcase, the most ambitious at this point is its ‘continuous playback’ mechanism, which allows users (via our Playbar) to consume a sequence of audio and video clips, either as the main focal point, or ‘in the background’ whilst browsing other areas of the site.

In essence we are attempting to mash-up two types of familiar interface and in doing so we suddenly make the familiar unfamiliar. Hence the initial difficulty in comprehension for many, despite the excitement it may also elicit. You could say it’s a scenario similar to peeps encountering a Reese’s Peanut Butter Cup for the first time (pardon the advertising in-joke for a child of the 80s).

The continuous playback of AUDIO whilst browsing is a very familiar model to most. It’s built into your iPod or mp3 player. It’s the foundation of applications such as iTunes and Spotify. And it can be found to varying degrees in websites like We7, We Are Hunted, The Hype Machine, or the ingenious browser plug-in ex.fm.

Whereas the continuous playback of VIDEO whilst browsing has inherently different qualities and adopts an entirely different interface model found only on certain television-centric devices (i.e. freeview, sky, xbox360).

Yet no one to my knowledge has released a product that offers the continuous playback of both Audio AND Video in the same space. Ambitiously (foolishly?) we’ve done just that. But because people are accustomed to only dealing with these two types of playback in isolation, we face the formidable challenge of creating a UX that can accommodate both.

I won’t get into the technical details of how we achieved this, but I will just briefly mention that in considering the technical feasibility of continuous A/V playback while browsing other areas of the site we opted to employ a combination of javascript, AJAX, and CSS3.

Same content, different view
The Showcase is composed of several different but interconnect views of its content. Perhaps it might be one view too many, for I’m a believer in the adage that “a design is perfect not when there is nothing left to add, but when there is nothing left to take away.” Nonetheless, we are experimenting with different ways of exposing a potentially large number of A/V clips to suit the preferences and motivations of a wide range of users.

The main space for the consumption of A/V clips (and their associated details) is what we call the ‘Expanded Clip View’ —  a view that any visitor of YouTube or Vimeo would find familiar — but with several pathways to get there...

Many users want to just see the full scope of what music clips are currently on offer without any editorial intervention. Thus we offer the ability to Browse By Genre in a List View — a utilitarian interface familiar to people accustomed to iTunes, Spotify and the like — with an ability to toggle between the two views. (Incidentally, there is also an Artist Quick Find feature, for those wishing to search for clips by a particular artist).

While the List View is fine for many, it obviously has no narrative around it. It’s literally just a faceless feed of all that’s on offer. For those users that crave some sense of curation, we also offer Showcase Collections, which are select set of clips compiled and curated by knowledgeable BBC talent and staff around a particular theme. (Again, read Andy Puleston’s blog post about the editorial nuances concerning Collections).

To highlight the special nature of these collections, they are signposted with a different masthead, and offer an alternate Grid View, which gives more prominence to the individual clips by displaying them as distinct ‘modules’ within the context of the set. These modules also offer a rather novel feature of optionally allowing clips to be played ‘in situ’, albeit at a smaller size, to provide an alternative to consuming and browsing content quickly. Admittedly, user responses to this feature have been mixed thus far. It’s a bit like Marmite, you either love it or you don’t. It’s certainly an unconventional and unexpected interface (for video, in particular) that surprises first time visitors to the site. We still need to improve upon the GUI so that people better understand the two-prong functionality of the clip modules (to consume the A/V either in situ or in expanded clip view), but we still think that there is distinctive value in this scenario for some.

And all the while, there is the ubiquitous Playbar. It’s GUI mimics the current ‘chrome’ controls associated with the BBC Embeddable Media Player (EMP), but since it’s autonomous from the clip and attached to the browser window, itself, in some sense you could say the Playbar’s presence converts the entire ‘page’ into a multi-channel EMP, of sorts. It’s value (and necessity) becomes more apparent to the user once they opt to browse other sections of the site while still playing something else, in which case the media clip minimizes and docks to the controls, to allow a glanceable play-in-the-background experience. Again, unconventional. Again, further refinement is needed. But as a general model we feel it is sound.

As with any unconventional interface, some learned behavior is required in order for the user to fully ‘get it’. That’s not to say that we don’t continually strive to create interactive spaces that are as intuitive as possible by adopting familiar metaphors and mental models when we can.

The guitar is perhaps one of the best examples of a perfect interface and one that as interaction designers we can aspire towards. The barrier to entry is low. Anyone encountering it for the first time can strum on it right away and still derive some enjoyment from it. But after a little practice, you can appreciate the instrument on an entirely different level.

I should stress that the BBC Music Showcase will be continually evolving over the coming months and to help shape its further development we would really value any and all input from our users.

Sacha Sedriks is a Senior Designer, Future Media & Technology for Audio & Music Interactive




More from this blog...


Sign in

BBC navigation

BBC © 2014 The BBC is not responsible for the content of external sites. Read more.

This page is best viewed in an up-to-date web browser with style sheets (CSS) enabled. While you will be able to view the content of this page in your current browser, you will not be able to get the full visual experience. Please consider upgrading your browser software or enabling style sheets (CSS) if you are able to do so.