Home > UX and Prototyping > How to design an omnichannel user experience
Omnichannel user experience: what every brand needs to connect better with users right now

Omnichannel user experience: what every brand needs to connect better with users right now

The landscape of connecting users and their devices is changing.

Ten years ago, users interacted with brands in person, on desktop or their smartphones, via mail, phone or on social media. They rarely interacted across more than one device or channel to complete one single task.

Since then, users have become more sophisticated and their behavior less predictable. Nowadays, users interact with organizations on various devices and engage across many channels in order to complete one single activity.

To help keep users connected and engaged, it’s in your brand’s best interest to create fluidity between channels and devices. As Kim Flaherty from the Nielsen Norman Group puts it: “organizations must create omnichannel UX strategies that optimize the end-to-end user experience of completing a task across devices and interaction channels”.

So how do you design experiences that enable users to complete tasks whenever, wherever? This is where omnichannel user experience takes center stage. Omnichannel UX not only allows users to connect to brands across multiple channels, it also enables them to act on their product or service triggers and makes each interaction more intuitive and effortless.

Today’s post looks at what we really mean by omnichannel UX, why your brand needs it and how you can design an omnichannel experience that puts users at the center of your design with Justinmind.

Get the best tool for creating seamless omnichannel UX

Download free

What is omnichannel UX?

Frost & Sullivan defines omnichannel as “seamless and effortless, high-quality customer experiences that occur within and between contact channels.” With these seamless and effortless experiences, the goal is to put users the core of your UX strategy.

Omnichannel UX seeks to create transitions and experiences in accordance with five principles:

  • Consistency – coherent and meaningful experiences in every interaction with your brand
  • Availability – proactively leading customers through their individual journeys by offering a choice when selecting an online or offline channel, with personalized interactions and messages at the right time
  • Seamlessness – channel transitions available across all channels, as effortlessly as possible
  • Context-optimization – channel experiences that are best suited for that particular device
  • Channel-neutrality – providing the same data and options across channels so that users can jump between touchpoints across several platforms without interruption or delay

3 great examples of omnichannel UX

Bank of America’s omnichannel UX

Image credit: On MSFT

Bank of America’s customer-centered model offers users a dynamic experience across board. Users can deposit checks, schedule appointments, cancel payments, access lending specialists and even get cash back from both the mobile and desktop apps.

Sephora’s omnichannel UX

Image credit: Emarsys

Sephora users can access Sephora’s Beauty Bag both on mobile and desktop. This includes all the data required to inform browsing and purchases, such as favorites list, past purchases, and how many rewards points they have. Users can also scan items in store to see other options available online, watch video tutorials, and find their nearest store.

Walgreens’ omnichannel UX

Image credit: Emarsys

Walgreen’s mobile app allows users to view and manage their pharmacy prescriptions directly in the app, fill out rapid refill requests, print photos from device, browse deals and discounts on in-store products, and make orders that can then be picked up at their nearest location.

So how do designers achieve omnichannel experiences? Through designing flows from one device to another and checking the synchronization and usability of each jump, as Thomas Fischer puts it.

But it’s not just about technique, it’s about having the right tool too. Next we’ll see how you can design an effective omnichannel user experience early on in your design process, using Justinmind prototypes.

How to design an effective omnichannel user experience

In our latest release, we announced our brand-new omnichannel UX feature. This feature allows you to design screens and interactions for web, mobile and tablet all within the same prototype.


Designing an omnichannel ecosystem starts with understanding the customer journey through user research. Then, designers need to map out all the touchpoints of their interface and all the possible ways the user might take to reach their goal, in order to make those touchpoints connect across channels and devices.

Creating an omnichannel experience within your prototype

Defining omni-channel prototypes is simple. Let’s create one together now.

Here’s a short omnichannel scenario (based on this example):

Cassie wants to make a special meal tonight, but on closely reading the recipe, realizes that in order to make vegan lasagna from scratch, she is going need a pasta machine.

Cassie googles pasta machines on her smartphone, and reads up on electric vs manual, the pros and cons of different brands and consumer product reviews, and finally decides on the make she wants. She’s all ready to order from the retailer’s app when she realizes that they don’t do same day delivery.

She needs it today, so can’t order online and wait for delivery. She switches over to her laptop for ease of browsing and checks the retailer’s website for pricing and stock availability. She reserves and pays for the pasta machine via the website. Then, she drives off to the store to collect it, using the order summary she receives in her Inbox on her smartphone as proof of reservation and purchase.

She swings through the vegan market on the way home for the rest of the ingredients and her meal is a great success!

We’re going to design the touch points of this omnichannel experience using Justinmind. To do this, you’ll need to have the
latest version of Justinmind downloaded.

Touchpoint 1 – creating the pasta machine mobile app screen

Cassie gets ready to order her pasta machine online from the retailer’s app.

To reproduce this touchpoint, create an iPhone X app prototype in Justinmind. Start, by opening the tool and choosing the iPhone X app device template (or choose your preferred mobile template).

Design your mobile app by dragging widgets that you’ll find in the Widget library palette to the canvas. Make sure you check out the readymade screens for iPhone in the iPhone library.

Touchpoint 2 – creating the pasta machine website screen

Cassie switches over to her laptop for ease of browsing and checks the retailer’s website for pricing and stock availability. Then, she reserves and pays for the pasta machine via the website.

Now you’ll need to add a second screen to your prototype, this will be a web screen that represents the retailer’s website.

To do so, head over to the Screens palette in the Justinmind editor. Click the ‘+’ icon. In the dialog that appears, give your web screen a name (e.g. Retailer website stock), and choose ‘Web’ from the Device drop down.


Customize your web screen, adding a data list with records of paginated items. Then, try creating a Data Master in order to input real data into your web screen and create a shopping cart experience.

Touchpoint 3 – creating the Gmail Inbox app screen

Cassie uses the order summary, which she receives in her Inbox on her smartphone, as proof of reservation and purchase.

Finally, it’s time to create another iPhone X screen so that Cassie can pull up her order summary on her smartphone in-store. Go back to the Screens palette and click the ‘+’ icon. In the dialog that appears, name this screen ‘Inbox order summary’ and choose ‘iPhone X’ from the Device drop down.

Lucky for you, Justinmind includes a readymade screen for the Gmail Inbox app. Simply locate it in the iPhone Widget library and drag it to the canvas.

Notice that you can any of Justinind’s widgets and icons at any time when designing your prototype, no matter the operating system.

And that’s it! Your very first omnichannel experience, done!

Why do we need omnichannel UX?

To every single customer, a journey is one holistic interaction with your organization, one experience rather than a collection of individual experiences. Kim Flaherty, Nielsen Norman Group

As Kim quite rightly points out, users don’t think about each step they take to complete a task, or through which channels they journey. There is however a trend of users completing activities across multiple channels, devices and sittings.

Why is this? Kim suggests three reasons:

  • There is an external interruption or change in context
  • The task is better suited for another channel
  • The activity requires it

Omnichannel v multichannel UX

Omnichannel UX is not the first attempt made at designing holistic interactions around the user. First we had multichannel UX, or cross-channel UX. This allows users to interact natively with brands wherever they prefer to browse. These experiences offer users choices, making it easier for them to complete a task in whatever way is most comfortable for them.

There has been much debate over this, but suffice to say, multichannel UX strategy is not omnichannel. Just because a brand offers their services across numerous channels – mail, social media, chat, phone, in-store – and on multiple devices (web or mobile browser, or mobile app), doesn’t mean they offer an omnichannel experience.

Omnichannel UX extends across these cross-channel experiences, creating experience loops across your brand’s channels according to user behavior. Omnichannel is about allowing users to browse and connect with your brand wherever they are, while communicating in a way that is in tune with why they use a given channel and showing awareness of their individual stage in the customer lifecycle, according to Tommy Walker.


And as the interaction possibilities continue to grow and life gets busier, users expect complete experiences from brands. Tasks should be accessible and straightforward, no matter where users are or when they connect.

Omnichannel user experience puts the user at the front and center of your brand’s UX strategy and allows you to create fluid, personalized user experience. With this post, you’ve got everything you need to create your own. So what are you waiting for? Download Justinmind now and great your first omnichannel UX now!

Emily is Marketing Content Editor at Justinmind


Your email address will not be published. Required fields are marked *