With the world moving on to 2024, the e-commerce industry is also moving towards it with new strategies for user interface and experience design. According to HubSpot, 88% of consumers agree that they won’t return to an e-commerce website that features a poorly designed user experience. The brands are expected to balance functionality with rich aesthetics that can adapt to the changing minds of consumers.

Here are the five UI/UX design trends that can be used by the brands for 2024.

Gamified UX

The strategy of inserting gamification in online shopping has been a thing since 2021. The new approach on this topic is that brands need to collaborate with potential UX designers and incorporate a platform that understands the users’ emotions and acts accordingly. This strategy has to prioritise not only shopping but also entertainment.

As collaboration is the key, involving Gen Z and Alphas in creative aspects is important. The experience offered by the brands and e-retailers has to be as immersive as possible. It can be anything from interactive homepages to virtual painting canvases.

Maison Martin Margiela launched its own blockchain bingo with its numbering system from its in-real collections. Lacoste used its storefront to display its summer collection by creating a virtual metaverse-based shopping experience that includes scavenger hunts to offer users discounts and vouchers. Macy's introduced Mstylelab on Journee which allows the users to curate their styles on both physical and digital spaces. This engagement platform invites people to join its community, collect their customised products and play on the immersive experience.

Landing.space encouraged its users to build mood boards and add shopping links on them by giving them access to a library containing more than 4,5 million pictures along with other editing tools.

Nostalgic Visuals

The brands can leverage some retro tools such as analogue and pixelated visuals into their websites. The internet graphics and aesthetics from the early days can empathise with the consumers who are no longer interested in today’s overwhelming digital presence. Using the appropriate colour themes and doodle illustrations to deliver a playful message with brand value can grab the attention of the viewers. At the same time, they can focus on delivering analogue content with some retro references.

Rhode released a 90s-inspired pixelated film featuring Hailey Bieber for its peptide lip tint launch. UK-based skincare label I Am Proud used retro-style aesthetics on its website to show its inclusive culture.

I.AM.GIA had its website set with curated banners featuring Y2K-themed visuals. The bag brand Baboon to the Moon has changed its storefront with a street-forward and grunge aesthetic with kitsch elements that give a nostalgic feel. RAD Makeup showcased its products with doodle and scribble art along with other Y2K elements on its website.

Sensory Interface

Tapping into the five senses of the human body can increase the dwell time and engage in emotional episodes. E-retailers and brands can create a virtual world with sensory interfaces through various designs such as the parallax effect, ASMR, oversized graphics, glass morphism, and synesthesia. One can also put AI-powered tools into effect in this strategy.

The parallax effect is an aesthetic with overlaid images and video that can give a sense of depth. This 3D space can be further engaged with background sounds and music that can trigger the consumers’ sensors. Oversized typographies and graphics will make the brand statement more captivating and inject the brand personality into the customers. Glass morphism is another way to create a sense of depth by designing a transparent, frosted glass aesthetic with modals, cards, and navigation panels.

Another trend to follow is setting up the theme based on the user’s system. Websites need to adapt with the user’s system theme to offer a personalised comfort over visuals. Bento Grids are the right type of grid layouts for e-commerce websites with complex content. It will adapt to the information and allocate them in a flexible, responsive and visually pleasing way.

Glossier displayed a looping short video on its storefront with an ASMR sound. Youswim from London designed a motion-driven landing page that has both sound and sight-pleasing visuals of ocean waves and sensual dancing.

Obayaty has a homepage with smooth slides featuring oversized letterings and product videos that are a treat to the eyes. It also showcases the mood-based colour palette, mood board-like banners, and changes in product image once the cursor moves to it.

e-Magazines

Gen Z readers and writers are expecting the early news reading culture to come again. E-retailers have the opportunity to use this as a way to engage with Gen Z. They can publish a mini-magazine that can comprise brand-based storytelling. In this world of young people slashed by social media, e-magazines can provide an emotional ride and give shoppers an experience more than shopping. This can be both educational and profitable.

Once the strategy gets picked up by many, the e-retailers can go for paid subscriptions. They can also invite the customers to write a news piece or to brainstorm a column idea. Here, they can incorporate the same nostalgic aesthetic including analogue and badly-organised visuals.

Carhartt launched its curated virtual magazine called Carhartt WIP focusing on weekly community topics. Net-a-Porter has Porter, a digital magazine to support its shoppers to buy suitable products. The department store of UK, Selfridges dropped Yellow Pages, an e-magazine with nostalgic, badly oriented visuals. It is published in both physical and digital. The magazine is curated by a set of artists, influencers, and designers from the art, fashion, and film industries.

Give an Extra

Consumers want e-commerce websites to be extra in every aspect. They want it to be hyper-realistic (Skeuomorphism) and maximal in a way. There is a new trend of infusing utopian surrealism into physical and digital aesthetics. It offers an escapism to the younger audiences. The elements used in the website have to be raw and unconventional which gives an unsettling-yet-wondering vibe. Using the parallax effect and other 3D movements to add a chaotic effect on the website along with a dark colour palette and motifs is crucial in this strategy. Rick Owens holds a website with a dystopian format. The afterlife-style products are shown in a black-and-white palette on the homepage. Demobaza has displayed its collections like a survival kit for the utopian world on its website.

VR and AR are further developing to optimise themselves for 2024. Brands such as Burberry (with AR-driven brand experience on app and website), Zalando GmbH (Try-on on Snapchat), and H&M (with get dressed challenge on Metaverse) have already been in touch with these technologies. In 2024, they can use VR and AR technology to incorporate a real-world experience using software such as Blender, Spline, and Unity.

Another opportunity to use is the 404 error and loading pages. The users often get frustrated with these pages. Over one in four viewers will leave the page if the loading time exceeds four seconds. Work on these pages to integrate fun activities such as gifs, videos, and games. It can engage the users for some time. An accessory label from the UK, Good Squish, displays its iconic scrunchies rotating on the loading page to distract the viewers.

Cover image: Home page of I Am Proud website, courtesy official website of I Am Proud.