We watch TV with our family and friends, often together, synchronously in the same place and time; but perhaps more commonly now we consume this media asynchronously - on our own time, from our separate living rooms, at different times of the day, and different days altogether. We’re no longer synced up with the broadcast medium, and we are exposed to content at different times.
Being the person who shares spoilers is rarely fun. Now we start our conversations with the sentence “have you seen the …?” before we dish out our reaction to our most recently viewed show.
The experiences of togetherness is harder to attain. If we could more easily know if our friend is currently watching, has finished watching, or is yet to watch a show, could make watching a more shared experience despite the distance.
In this exploration we challenged the typical time markers found in timeline scrubbers in favour of displaying our friends’ progress through a series. My position in relation to my friends could be just as useful for references, as time. A social nuance was added to the experience, and transformed the typical friends list to a more contextually impactful design pattern.
FOUR GUIDELINES FOR THE MULTI-SCREEN EXPERIENCE
The entertainment and streaming video industry are a natural early adopter of multiple-screen experiences. Use cases could range from gaming to movie and television viewing. Incorporating the users’ personal devices, such as smartphones and wearables into the experience will be more common, and we’ll continue to push for deeper and meaningful engagement.
Below are four guidelines to help you get started designing for multi-screen:
1. LEAD THE EYE
MIMICKING AND TIMING EFFECTS BETWEEN SCREENS
There is a need for visual cues to guide the user beyond the border of one screen and onto the next. Transition detail, timing, and selective use of colour, are key parts of how to execute this.
In our tv example, this meant mapping gestures to transitions and using non-committal gestures like confirm-on-release. It also meant embracing the sloppiness that comes with gesture based input, such as scrubbing, by allowing gestures to begin anywhere on the screen and not mapping gesture inputs 1:1.
2. DEDICATE CONTENT
ONLY REQUIRE THE USER TO FOCUS ON ONE SCREEN AT THE TIME
It’s important to be selective of choosing the content that goes on what screen. Assign different types of information and inputs to the different screens to avoid a disrupted experience. The user shouldn´t have to toggle their focus, hunt, between screens for inputs and feedback in the same flow.
In our TV example, this meant having overviews on the TV screen and details on the hand-held screen. It also meant recognising that remote control inputs are imprecise and input might be performed on one device while looking at another. The feedback, for this reason, had to be glanceable.
3. CONTEXTUALLY MORE
MAKE CONTEXTUAL CONTENT AVAILABLE ON REQUEST
Another unique opportunity is to separate the content and adapt it to the screen it is displayed on. To add more value to the experience, design a seamless interaction to reveal contextual content connected to wherever the user is in the film or show.
In our TV example, this meant using a non-committal swipe up to bring up more content. Zooming in to detailed episode content on the hand-held screen and zooming out to the series timeline overview on the TV screen.
4. EMBED SOCIAL CUES
THINK BEYOND THE FRIENDS LIST
This TV specific insight is to leverage social context in a more subtle way than a list. Using social connections as references or a means to extend discoverability is especially interesting for viewing experiences.
In our TV example, this meant we used a friend´s progress through a timeline as the reference rather than using timestamps.
DESIGN OPPORTUNITIES AHEAD
Multi-screen experiences, and convergent experiences in general, have become a key consideration for UX designers who are developing new products and services. These relatively new set-ups are providing great creative opportunities and new restraints on how we design interfaces. The natural first use-cases of multi-screen experiences are in the home media and TV context.
In this project we asked ourselves if we could begin to rethink one of the basic components of the consumption experience - the timeline scrubber. This is just the beginning, of course. There are countless opportunities to employ the multi-screen experiences, and within the TV experience plenty more patterns to challenge.