The way we access information has changed dramatically over the last few years, and it’s still accelerating. Smartphones and tablets are ubiquitous, and responsive web design is the game- changer we needed to take into account the ever-increasing variety of screen sizes. Now, with voice UIs becoming more popular, the rulebook is changing once again. User expectations, meanwhile, have grown just as fast, and so developing an effective UX strategy that works across all these devices is a major challenge.

We asked some leading experts about how they approach UX strategies now that there’s seemingly no limit to the devices and platforms people use to access the web.

Follow the framework of the 4 Cs

Cover art for Michal Levin's book outlining a practical framework for designing multi-device experiences. Published by O'REILLY.
UX designer Michal Levin has created a practical framework for designing multi-device experiences.

 

Patrick Haney, UX designer at Hanerino, recommends using a simple framework that can help you create designs that transcend devices.

He swears by the 3 C’s framework from the book “Designing Multi-Device Experiences” by user experience designer Michal Levin, and suggests throwing in an extra C for good measure to craft exceptional experiences:

Consistency

Design consistency is not only important for brand recognition, but also for the user experience. “Consider your strategy for answering the question ‘How do I use this?’” Patrick says. “When in doubt, follow the expected design patterns for a device rather than breaking away from people’s existing learned behaviors.”

Continuity

In order for a well-designed experience to be seamless, we must plan for and design the entire customer journey. “Creating a continuous path for everyone interacting with your brand is key,” Patrick says.

Complementary

Today’s devices not only help us complete tasks on their own, they must also work with other devices to get things done. “From large TVs to screen-free fitness trackers, we use our devices in tandem with others,” Patrick says. “We as designers must consider this ecosystem rather than focusing on single devices.”

Contextual

When our screens are becoming smaller and larger at the same time, the context of how and when someone experiences something becomes even more important. Patrick points out that it’s our job as designers in this multi-device ecosystem to deliver the right thing at the right time, to the best available device.

Create consistent user experiences with design systems

The easiest way to address usability on a variety of devices is to focus on creating consistent user experiences, says Sarah Federman, design engineer at Adobe.

“We need to create and maintain users’ expectations on how to interact with our products,” she says. “A great tool to do this with is a design system. A design system breaks down the UI into reusable parts and creates a system of interactions that users can recognize across devices. An experience like a share flow should be cohesive across devices, but also across applications in an ecosystem. With a design system we can really focus on the ecosystem, which includes the experiences of all the products across the brand and all of the devices from which they are accessed.”

Devices are portals, not products

A change in perspective is another way to help us ensure consistency. “Think of your company as an environment filled with valuable objects, as opposed to a collection of feature-laden tools,” says Sophia Prater, founder and lead UXer at Rewired.

“Your websites, apps, and Alexa skills are not products — they are portals to access your content. Before optimizing the interaction design for each portal, UX designers can start by modeling the objects within the app’s environment. Regardless of the point of access, the objects inside should be valuable, recognizable, and they should match the user’s mental model.”

By way of an example, Sophia points to Delta Air Lines — an environment filled with flights, trips, airports, gates, and seats. “These objects have relationships,” she explains. “A trip is made up of flights, a flight leaves from an airport at a gate. Users want to manipulate Delta’s objects by booking a flight or perhaps upgrading a seat. Barring rare exceptions, these truths don’t change based on the portal of choice.”

So, to create an effective UX strategy, Sophia recommends defining the objects that make up your content, as well as the connections between the objects. “Start with a prioritized list of what users want to do to these objects, and how effectively users currently can take those actions on each device,” she says. “This ‘mapping’ is where I start when teaching object-oriented UX, as I have with dozens of organizations. The effect is when a customer visits your content through a chatbot, a kiosk, and a smart watch — all in the span of a week — your world has a fighting chance to feel familiar, recognizable, and even seamless.”

Sophia Pratter and her team discuss a call-to-action inventory and object-map in their UX strategy process.
An object map helps teams answer these critical system design questions: what are the objects? What’s their structure? And what are the relationships between them?

Meet users where they’re at

Cover art of Chris Risdon and Patrick Quattlebaum's book
Chris Risdon and Patrick Quattlebaum have written a practical guide for anyone struggling to create products and services in complex environments.

A universal principle for developing for multiple devices, touchpoints, and contexts of user interactions is to meet users where they’re at, says Chris Risdon, director of design at Getaround and co-author of “Orchestrating Experiences.”

“Users don’t want to bend their lifestyle to you, they want you to come to them,” he says, suggesting to go deeper into understanding the context in which each device lives and how it will be used. “Imagine creating an empathy map for one of your users as they experience your product on a particular device. Now line up a series of empathy maps for different devices at different moments in time. An experience map based on a series of empathy maps over time. You will see patterns emerge that help you unify the experience, and you’ll see differences that will help you tailor the experience for that particular moment in time.”

Chris explains that any device affords us opportunities while also containing constraints. If you understand and model them and map that with the context of using that device in a given time at a specific, representative moment, you will find the patterns that define the principles that inform any experience regardless of device. You will also find the differences that will define the best experiences for a particular device. This is how you will meet users where they’re at.

Adobe Design Engineer Sarah Federman agrees. “Performance is a huge aspect of this issue that we designers sometimes forget to think about,” she says. “We love to create beautiful high-resolution images and effects that take advantage of our great screens, but if that doesn’t help the user complete their task and costs $3 to download in a developing country or 10 minutes on hotel Wi-Fi, we’re not actually helping anyone.”

An example of an experience map for auto insurances by Adaptive Path: what are drivers feeling, thinking and doing?
An example of an experience map for auto insurances by Adaptive Path: what are drivers feeling, thinking and doing?

Research your users

For Laura Elizabeth, who’s teaching design to developers at Design Academy, it’s crucial to understand the different situations people will be using your website in.

She recommends starting with user research: “If you don’t understand how your users are experiencing your website, how can you make that experience a good one?

For example, you could have two types of users in an upscale restaurant:

  1. Those looking for somewhere to host an event or a special occasion. They’ll likely be on their laptops or tablets and would like to see plenty of images, the menu, and booking information. These people are browsing.
  2. Those who are on their way to your restaurant but need directions, or want to call ahead to request something. They will likely be on a mobile device. These people are wanting to complete a task quickly.

“Knowing why people are using your website and which devices they’re on will help you make good UX decisions from the get-go,” Laura says. “A good example is the contact information for the restaurant. On mobile, people will most likely need to call the restaurant quickly. Instead of having the phone number hidden behind a menu or in the footer, consider placing a ‘call us’ button that users can easily tap to make a call. On desktop a button isn’t appropriate, so as the screen sizes get larger, you can switch this button out for a phone number they can jot down or manually key in to their phone.”

By defining such use cases, you can ensure users have a seamless experience that’s appropriate to the task they’re trying to achieve at the time. Laura points out and advises that this is an ongoing task.

“When you’re creating a website from scratch, you’re going to be making your best guess as to where and why people are using your website. But it’s important to couple that with ongoing user research to prove or disprove your hypothesis, and set aside time to be consistently tweaking and improving the experience.”