How to Build Ecommerce Experiences for the Metaverse

The COVID-19 pandemic has made consumers expect much more from retailers. If it’s not omnichannel, it’s not good enough for them anymore.

Beyond the usual avenues of physical retail and online shopping, modern consumers also demand an experience that motivates them to buy. The days of text, images and basic ecommerce experiences in a 2D browser window have served us well, but virtual, augmented and mixed reality experiences are getting better all the time — and shoppers are noticing.

The metaverse — a convergence of these 3D worlds into a shared virtual experience — is the path that the technology industry is pursuing. Retailers need to think beyond the store window and the browser window and prepare for the immersive future that’s already here.

It’s Not Just a Wild Dream This Time

Many have been very skeptical about VR and AR in the past because, despite grand promises about what they would achieve, they’ve mostly failed to deliver on the scale that the industry hoped for.


But it’s different this time — seriously. With industry leaders like Facebook, Apple and Microsoft pursuing a range of different mixed reality projects, they see the opportunity and know where the market is going.

Consumer behavior also proves why retailers need to take it seriously: data from a Google survey shows that 66% of people say they are interested in using AR for help when shopping, and Shopify revealed that interactions with products having 3D/AR content showed a 94% higher conversion rate than those without it.

In a survey from Perkins Coie LLP and the XR Association, nearly nine in 10 respondents said that by the year 2025, immersive technologies — including augmented reality, virtual reality, and mixed reality — will be as ubiquitous as mobile devices. 

That’s a bold prediction, but we’re already going in that direction at a breakneck pace.

Seeing is Believing

You don’t have to look very hard to see that forward-thinking retailers are deploying immersive 3D experiences for their customers. These experiences enable them to explore virtual showrooms, try on items and get a 360-degree view of something they want to buy.

Want to see what furniture looks like in your house? Check out IKEA.

Curious to see what eyeglasses will look like on your face? Give Warby Parker a try.

Need new shoes? Try them on virtually with Wanna Kicks.

Looking for new makeup products? Sephora has you covered.

Choose Your Platforms

Adding immersive ecommerce experiences will require various technical skills from your team, based on what you’re trying to create. The main difference is that you’re switching from a 2D to a 3D experience. Development in VR/AR is much closer to developing 3D video games than creating web applications.

First of all, you need to decide on the hardware that you’re building for. Are your customers mainly using computers, smartphones or a headset like the Oculus Quest? Each hardware category offers a different set of capabilities for what’s possible.

Next, when we look at 3D engines and frameworks on the market, some big names like Unity, Unreal Engine and CRYENGINE stand out. Most of these engines were spun out of game development. While very powerful, they’re overkill for anyone trying to create a basic immersive experience.

Apple’s ARKit and Google’s ARCore are fantastic ways for iOS and Android developers to get started with AR. The good news for web developers is that the WebXR Device API is an open standard, specified by the W3C, with a JavaScript API that makes immersive experiences possible in the browser. Your web development team already knows JavaScript, so this can be a great first step into developing for the metaverse.

There are some useful frameworks and platforms that make working with WebXR more convenient:

  • A-Frame: A web framework for building 3D experiences.
  • React 360: A framework for the creation of interactive 360-degree experiences that run in the web browser.
  • Amazon Sumerian: A managed service that lets you create and run 3D, AR and VR applications. Since it’s integrated into the AWS ecosystem, it’s also possible to add AI-enabled elements into your generated world.

Develop Your Content

No one wants to read long blocks of text in 3D. Since we’re talking about visual experiences, it’s logical that the emphasis should be on creating content that is pleasing to the eye and interesting to look at. What works on a normal website probably isn’t going to feel natural in a 3D environment, so you need to decide what visuals you should create to suit the format.

What high-resolution images and assets do you need? Can you add videos? How about 360-degree videos? Will customers just be looking at something, or will they be able to interact with it?

You also can’t forget about sound because it’s a critical part of immersive experiences. What music and sounds should you create to make the content come alive?

Fine-Tune Your Content

Not everyone is going to have the latest and greatest device or 5G coverage. The requirements for bandwidth and transmission quality are much higher with 3D content. A few milliseconds of latency can go unnoticed on a typical website, but in a VR/AR setting, it can make the experience “laggy” or unusable.

Try to optimize your content to be the highest quality it can be within a reasonable file size. If the experience starts to suffer from too many assets downloading at the same time, it’s better to create a more streamlined experience that maintains a high performance rate.

It’s important to consider your hosting infrastructure, as well. This shouldn’t be a big problem, but it is worth mentioning that you need to add new content types to your configurations, and your CDN needs to support these new types too.

Publish Omnichannel Content

When we’re talking about getting ready for immersive experiences, we’re not just talking about having people scroll through your regular website in VR. That isn’t compelling for your customers. 

The idea is to take some content that’s already on your website and separate it from the presentation layer so you can use it in a 3D environment or any other platform that you want — apps, in-store screen displays, etc. Classic content management takes place in silos, which means you cannot easily reuse the content from your website.

This separation can be achieved by using a classic database, but if you want developers and content teams to collaborate, a headless CMS is front-end agnostic and more user-friendly. It provides one central shared content hub and can even offer a visual interface for editors and marketers.

Get Started Today

Building 3D ecommerce experiences may seem intimidating, but as we’ve seen, your team likely already has the skills necessary to get started and try out some different ideas. Your customers are ready to have a great experience and buy from you. What you build today will be the first of many 3D experiences that you build for the metaverse in the future.

Dominik Angerer is the Co-founder and CEO of Storyblok, a headless CMS that enables developers and marketers to deliver powerful content experiences on any digital platform.

Feature Your Byline

Submit an Executive ViewPoints.

Featured Event

Join the retail community as we come together for three days of strategic sessions, meaningful off-site networking events and interactive learning experiences.


Access The Media Kit


Access Our Editorial Calendar

If you are downloading this on behalf of a client, please provide the company name and website information below: