Why emotional design matters.

Taking lead from ecommerce giants

Our recent whitepaper, “The value of emotion in ecommerce,” explored why so many ecommerce platforms follow the “tried and tested” templates instigated by ecommerce giants like Amazon, eBay, and ASOS.  We’re led to believe that the more traditional design systems, like using a rigid box or card-based blocks for products, often set against white backgrounds, give consumers confidence and familiarity in buying products. Yet when we shop in person, we’re drawn towards stores that consider every aspect of their interiors. Whether that’s the furniture and lighting or sound and smell, all the way to visual details such as staff uniforms and how products are displayed. So why do we settle for online shopping experiences that all feel so bland and similar?

In this article, we’ll look at ways motion design can be used on ecommerce websites to stand out in a crowded market, help create a better user experience and increase brand engagement with consumers.

1.    First impressions make a difference.

The homepage acts as the virtual storefront and plays a huge part in drawing users in and keeping them engaged. It’s the perfect place to display video or animation to capture attention. For example, Cliik sell clever storage solutions which, on the surface, may not be the most fashionable product but their use of full-screen video shot using a deliberate retro aesthetic shows the product in action, keeping the user engaged longer than just using static images. The research conducted, as part of our whitepaper, found that the brands that used emotive design techniques to create positive initial emotional responses benefitted from a subsequent increase in brand memorability, and desirability. The initial gut response created a far more emotionally engaged participant throughout the complete journey.

2. Enhance how products are presented.

Ecommerce websites are increasingly offer different product views, virtual try-ons, augmented reality placement and interactive 3D models as ways to give consumers all the detail they need to make an informed purchase. It is often spoken about how we design to delight users. By creating surprising moments or innovative interactivity, it is possible to create an emotional attachment with a brand. Ikea is an excellent example of this, offering several ways to view the product in a way that’s as engaging as buying in-store. As this becomes 'the norm' in ecommerce, consumers will come expect more compelling ways of presentation as standard. 

3. Improve user navigation through micro-interactions.

Regardless of how visually pleasing a website may be, it’s important that users can still proceed smoothly through the buying process. Rollie adds micro-interactions like in-situ previews on hover and subtle animations to the main navigation. They allow speedy shopping where products can be added to the basket without navigating to a product detail page. Modal transitions animate in to maintain focus on the checkout process. These can all help to visually guide the user through the buying experience and reduce the likelihood of them leaving or getting lost.

4. Don’t water down the mobile experience.

The use of smartphones to make online purchases is ever increasing and it’s essential to maintain a consistent experience between the desktop and mobile experience of a website. Vitra offers an identical buying experience no matter what size screen you view their chair configurator on. Making use of smartphone cameras to view the product within the user’s real space via augmented reality, and allowing more intuitive controls to view 3D objects via swiping gestures, all help to elevate the user’s experience beyond what’s possible on the desktop version.

5. Optimisation is key.

Adding motion design to a website can enhance the buying experience but it mustn’t slow down the user in making a purchase. A sluggish or slow loading website can result in high bounce rates and in turn, lower conversions, so it’s important to make technical considerations. Optimising your website can make a difference in whether visitors stick around to explore or leave promptly.

How does composable architecture help with the experience?

Brands don’t want feelings of annoyance to undermine branding and design efforts. Bring your technical team into the conversation early, make sure your choice of platform, architecture and hosting support all align with your ambition. 

At true, our tech team have gone on to advice and build many of our clients’ websites using a composable approach, a key factor in improving the experience of the platform. Implementing a composable architecture will mean that once complex, often outdated systems, become more streamlined and manageable which in turn, improve user experience. This approach allows businesses to tailor their digital presence by integrating only the necessary tools and features, creating a flexible and more efficient platform.

From a brand perspective, the customisable nature of the platform means that content can be reused across multiple front-end applications, helping to ensure a consistent brand message and experience across all digital touchpoints, reinforcing brand identity and trust.  

Adding motion to design

Motion design can add to the overall experience of an ecommerce website, but it shouldn’t be relied on as a magic wand to increase conversions. Its use should be carefully considered – does it feel part of the brand identity?  Does it help to create a more engaging shopping experience, and does it elevate the overall user experience? If used effectively, consumer emotions can be positively influenced during online shopping experiences and therefore increased conversion rates.

To find out more about how emotions can play a part in ecommerce, download the true whitepaper here - The value of emotion in ecommerce.

true partnered with Odaptos, an AI learning tool, to analyse users’ emotive responses when viewing both traditional and immersive ecommerce websites. 

Want to find out more about UX testing? Drop us a line info@truedigital.co.uk.