Jun 24, 2014
Designing for Multiscreen — Think Multiscreen (1/6)
6 things you should consider when developing strategies for digital services across multiple screens
Introduction
More and more people are using more and more screens — and more often than not they do this simultaneously. We see this in our own lives, whether personally or professionally. Users expect to access information on all relevant screens and across multiple channels. Everything needs to work across devices. Digital services are no longer isolated applications but part of a whole ecosystem. They require a holistic strategy.
As part of our Multiscreen Experience Project, the Designer Valentin Fischer and I gathered and developed — over many years — a number of patterns, methodologies, and insights and compiled them in a book to help and inspire professionals looking to develop this strategy for their own digital products and services.
Update (12/14/2015): The completely revised and updated English book “Multiscreen UX Design” is available since 14th December 2015.
There are three important elements of a useful and user-friendly multiscreen offering: Firstly knowing the devices and their capabilities; secondly understanding the users and their capabilities; and finally considering the context in which users use these devices.
Together with Pascal Raabe, from the UI/UX studio ustwo™, who has helped us during the process of writing the book, I’m going to introduce six practical tips (in an article series) that can help you improve your own digital products and services by employing an effective multiscreen strategy.
Overview
- Think multiscreen
- Know your screens
- Put the user at the centre
- Context is King
- Multiscreen-ready layout and content!
- Challenges are chances
This is my first article on Medium with the first tip. The other articles will follow on a weekly to two-weekly basis.
So let’s get started…
1) Think Multiscreen
Increasing device fragmentation leads to a change in how these devices are being used. This is one of the greatest challenges we’re facing today when developing concepts and strategies for digital services. Multiscreen is not a nice add-on any more, it’s a requirement. In principle every digital offering needs to cater for multiple devices. A holistic approach will help you to offer a considered experience to your users across multiple screens. It will increase your chances to cater for your customers in a way they naturally expect. We discovered and compared a number of typical patterns, strategies and examples that emerged with the multiscreen landscape. It’s important to consider the particular aspects and best practices for each.
Some of the following models are based partially on the classification and definition of the precious design studio from Hamburg. We have expanded, aggregated and adapted this model.
Mobile First
It is advisable to concentrate on the most important device first. The smallest screen forces a meaningful structure of information. If one develops initially for small screens, owing to the necessity for size reduction, this will result in a better structuring of the information. Luke Wroblewski wrote a great book about that topic.
Simultaneity
Different devices or information services are used simultaneously. Different pieces of information may complement one another.
Social TV
Spatially-separated viewers can quasi watch TV together or directly participate. Programmes are recommended based upon the user profiles.
Device Shifting
The display of information or content is shifted to a separate device by the user. The display is switched from one screen to the other.
Complementarity
Devices influence, control and complement both each other and the information displayed on the screens.
Synchronisation
Information is always synchronised between devices and thus is kept updated to the same extent on all devices.
Screen Sharing
The display of information or an information source is extended and distributed across multiple screens.
Coherence
Information is displayed in a manner that is device and screen independent, logical, and coherent. Individual features are optimised for device capabilities and form of use.
Fluidity
Informational offerings should function similarly between devices and offer a uniform and fluid user experience.
Smart Content
Content should be as flexible as possible, to be easily used and published across different channels and devices.
Mashability
Platform-independent and flexible information can be combined with interfaces in order to create new added-value services.
Communification
Social networking and creating a community can make an information service more attractive for the users. Users create, share, rate, and comment on content.
Gamification
Game mechanics simulate a competitive environment. A game factor can motivate people if it is challenging and provides relevant goals.
Storyfication
With a story, one can create a cross-device user experience and increase the understanding of the product.
Emotionality
A service is emotionally more attractive, if it is fun and supports a device fragmented daily routine.
Microjoyment
Owing to the increasing density of information, one must maximally optimise the user experience for small, but important sub-tasks.
Hybrid Media
The cross-media combination of analogue and digital media in order to form a cumulative informational offering is the expansion of purely digital approaches.
Technical Challenges
As with all digital projects, one should also be familiar with the technical challenges and take them into consideration.
Legal Issues
There are various valid legal directives which must be responsibly followed.
Most of the briefly described patterns will be explained in the upcoming articles.
So, that’s the introduction for now. Stay tuned for the second article, because it’s important to “Know your screens”. Any questions? Just send me an e-mail.
Update (12/14/2015): If you’re more interested in the topic. My new English book “Multiscreen UX Design” is available sind 14th December 2015.
You can use the code COMP315 for 30% off (incl. free shipping, worldwide).
