Share on facebook
Share on twitter
Share on linkedin
Share on email

User Experience Design: Blending e-Commerce into Web Design

Web design sometimes means separating the initial landing page design elements from showcasing products. These products frequently become relegated to a separate page where real, static photos are shown of each item. Nowadays, things are starting to change in relation to how e-commerce works in-tandem with the design elements. Online businesses now want their products incorporated into the design in creative ways for branding. Take a minute to see how this works now and how e-commerce looks slightly different in UX than it did five years ago.

Overly Realistic Photos Are Becoming Outdated

Many UX analysts now say the old realistic photos of products that used to be on product pages are passé. While the age of providing 360-degree views in those photos helps customers get a realistic view of the item, this doesn’t always blend with the company’s brand.

New trends have many e-commerce sites bringing a more surreal approach to the products they sell. Rather than go with reality, it now means a more artistic view of the product on the main page. Incorporating the product into the user experience is also becoming more popular.

How this works might sound vague until seeing real examples of how creative this new UX trend is. The point of doing it is to mesmerize the viewer with branded products and find a way to make the visitor use their imagination. In many cases, this means going a little surreal in imagery to make the products a part of the overall page design.

Use of More Animation in Product Images

A 360-degree view of a product certainly helps a viewer be able to see what a product looks like from all angles. Yet, seeing it in action is even better. This is why extensive use of (subtle) animations is a new way to incorporate a product into the user experience.

Is your product an overly actionable one that helps solve a particular physical problem? If so, using micro-interactions is also in wider use. With a micro-interaction, more subtle animation is possible with the product being shown in use.

Sometimes a micro-interaction can become as simple as using a GIF or a swipe animation. Latter is also very popular where the animation occurs when hovering over a product image. You can make your products look real in this case. Regardless, what about making the product a more surreal design element in e-commerce?

Visual Storytelling in e-Commerce

Many examples exist of e-commerce being turned into a visual storytelling experience. Sometimes this means not even using a real photo of the product and turning it into an abstract graphic.

Incorporating that graphic into an illustrative story is something you’ll be seeing more of this year and beyond. In some of those visuals, it makes the product more clear. Others bring a more abstract feel, with occasional graphics seeming to have no relation to the product, if still a strong sense of brand.

The surreal visuals on the Ruby Atelier Furniture Store is a good example. Their landing page has an abstract animation of amorphous shapes that look like they’re underwater. Still, it gives a sense of color and class, denoting the type of modern furniture items they sell.

Making the e-Commerce/UX Combination Mobile Accessible

This new e-commerce trend in UX needs careful consideration on mobile as well. On a mobile device, the ability to animate or “spin” an object on the screen works differently on a smartphone or tablet. One of the biggest challenges here is the hovering animations, something obviously done by touch on a mobile device rather than a mouse on a desktop.

Most important is to tell a story and be able to do it through more product visuals than text. This is where creative use of product imagery really makes a difference, including when it brings some laughs and in a vein everyone finds appealing.

It turns out e-commerce and UX are now one, bringing a more personal sense to the user experience than ever before.

To learn more about how e-commerce blends with web design, visit us at Jaroop.

Share this post:

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on email
Email
Share on facebook
Share on twitter
Share on linkedin
Share on email

Related Posts

This website uses cookies to ensure you get the best experience on our website.