Retailers worldwide recognize the significance of e-commerce. Although some brick-and-mortar stores refuse to get with the times, the e-commerce industry expands rapidly year-over-year. In fact, eMarketer estimates sales will surpass $27 trillion in 2020—that equals double-digit annual growth from now until then.
E-commerce promises various benefits to retailers such as reduced overhead—labour and storefront—and widened geographic reach. That said, there’s a pain webmasters have been feeling for years regarding virtual versus physical shopping: online products are intangible. To overcome this challenge, many brands are now investing in advanced front-end technologies to bring elements of interactivity to their shop pages.
How Interactivity Helps Achieve Total User Immersion
Interactivity, when done correctly, can markedly improve the online user experience. It adds personalization and playfulness to a webpage, resonating more with users who engage the functionality.
Besides the element of delight through clever micro- and macro-interactions, user interactivity can boost comprehension, which is the most powerful benefit of all. For this to happen, every interaction needs to be intuitive and purposeful. To illustrate this point, we’re going to explore some examples from around the web.
Linear and Non-Linear Interactivity
In the examples below, there’s a divide in approach to product interactivity—linear versus non-linear. The difference comes down to user control and information sequence, as these next few examples will explain.
Trefecta Mobility does an incredible job touring their products online. When you arrive on the website and request information about their technology, you are greeted with a series of video walkthroughs. Although there is navigation available to hop to different sections, most users will scroll for more information. Thus, the interactivity triggers largely up or down.
The Smartscooter page from Gogoro offers similar functionalities. However, rather than being scroll activated, users must swipe or click tabs to learn more. Videos play and information pops up to deliver fine-tuned descriptions, but this is upon request only.
This example is a somewhat hybrid because the user can control which interactive experience he or she wants to begins as he or she scrolls. It’s less straightforward. But once a selection has been made, the direction is one-way.
Considering both examples, linear interactivity is passive compared to non-linear activity. Simply, there are fewer chances for a user to alter the narrative flow. From a storytelling point-of-view, linear is more cohesive. But let’s see what a fragmented experience looks like and how it affects usability.
Project Graham is the best example of non-linear interactivity we’ve come across in a long time. It is executed masterfully, putting full control on the user (making them work for any information) but without creating barriers in the information flow. The site achieves this in the falling ways:
- The user can toggle between sections using the sidebar, which groups information together and contextualizes the buttons displayed in the main view;
- There are various sound queues and labels to visually and audibly direct the user where to go;
- The interactivity relies on multiple gestures, including touch and swipe, giving the user freer reign over the interactions;
- Each independent screen (after selection) is very focused and easy to navigate.
Project Graham demonstrates how information can be served from a high level (the full body) and segmented into smaller, deeper levels (the body parts). The user needn’t follow a path to learn more either—he or she can jump around without injuring the user experience.
BMW also exhibits non-linear interactivity but in a less isolated environment. Project Graham deals with a single subject—a reason why the experience is intuitive—whereas BMW builds a virtual showroom full of multiple subjects (cars).
Interestingly, it works despite being complex because it’s familiar. Anyone visiting the webpage likely knows what a showroom looks like. They’ve also come across the interactivity prompts on services like Google Street View. To reduce the burden on the user when given total control, each directive should be evidence and self-explanatory in this way.
Interactivity for Delight
We mentioned earlier that interactivity can make the experience more fun for users. Sometimes this is the only purpose—it’s a branding asset and not a marketing one. And that’s totally find. For instance, Beoplay includes a draggable volume dial on their product page. It’s novel—it does not heighten product comprehension—but it does bring to life their product in a virtual space.
On an entirely different spectrum, there’s Campo Alle Comete. The website is spectacularly designed and coded, but the purpose is not abundantly clear. At first glance, most users would not recognize the brand as a wine maker. Nevertheless, we had to add it because the homepage truly is immersive and fully interactive (360 degrees). It’s delightful above all else.