VR and AR Solutions for E-Commerce

Porn leverages new technologies the fastest and can easy bury outdated ones. But don’t forget that e-commerce is the second and final frontier for technology to prove that it isn’t just immersed and exciting but also can really bring extra value. I didn’t hear a lot about AR projects in porn, but there are already a few studios that focused only on VR content. That means that it’s time to have the first acid test of VR and AR in the e-commerce field.

It isn’t secret that to developing high-quality VR, or AR experience needs a lot of resources. There are some tech giants like Google, Apple or Mozilla that are doing huge leaps in utilizing those platforms. But from the e-commerce field, I cant point only on IKEA. They released the first 3d planner four years ago. They released IKEA VR Experience on Steam one day before official release HTC VIVE headset. Also, they showed the demo of AR application before official release ARKit.

But what to do for people who aren’t able to have huge R&D teams?

Luckily there are guys like Mozzila team, that make our lives and development process simpler. Here are a few options that require a different level of code knowledge.

Solutions for Virtual Reality

Sketchfab

This is the simplest solution. Practically Sketchfab is like youtube for 3d models. So it allows you to upload your model and embed it on your website. And of course, it supports VR mode on the mobile device.

Cons here are that user can get an idea of how a model looks in volume but can’t interact with it. But it’s definitely the simplest way, for now, to show a 3d model in VR.

‍

‍

Cost: 100% Free

Result: Embeddable VR player

‍

A frame

In short, A-Frame is the initiative by Mozilla VR team to bring VR to a browser. It makes experiences shareable and accessible to everyone.

The best thing that it’s web-based, which means that your customer doesn’t need to install any applications. Just old good URL that you can open on any VR device. With a basic understanding of HTML, you can easily create different animations and interactions.

‍

‍

Cost: 100% Free
Result: Direct URL or embeddable experience

‍

Playcanvas

Playcanvas is originally the tool for building 3D browser games. And it’s suitable for our case because it can support VR mode. But it has design editor, that allows you to create a scene and add interactions without code. Also, it has the option to export it to for using on WEB, desktop or app. Honestly, I haven’t tried to export it, so can’t say about performance and other drawbacks. If you had a chance to play with it, please describe your experience in comments.

‍

‍

Cost: Have a free plan

Result: Link to experience

‍

360 content

This is the wide topic, but common here is that it’s not a 3d scene. It’s a simple panoramic picture that allows you to look around and get understanding or environment. So for creating 360° content, you can use 360° cameras, set up of cameras that take 360° photos, single-camera + software or just panoramic renders. You can even draw 360° experience on paper (Check this tutorial).

Except for Youtube VR videos, and panoramas on Facebook, there are a lot of different applications. That services allow you to create, host, and share panoramas and tours. Last year I found around 20 of different tools for creating 360 tours. For now, I use only VR view by Google and Roundme for building tours. Feel free to google any other service and leave a comment with your experience.

‍

‍

Cost: There are free and paid services

Result: Direct URL or embeddable experience

‍

Unity + Plugins

Unity is one of two of the most popular game engines. Few plugins make a building of experience not painful. For example, VRTK will help quickly set up any natural interactions without code, and Steam VR plugin will help create room-scale VR experience for VIVE. Good is that from Unity, you can export experience to any platform. Unfortunately except web, what makes your app not easy shareable and embeddable.

‍

‍

Cost: Free version available
Result: Application for Android, iOS, Gear VR, Google Cardboard, Google Daydream, HTC Vive, Oculus Rift, or PlayStation VR

‍

Unreal

As it’s second most popular game engine, I had to mention it here. But it’s more enhanced and complicated as Unity. I wouldn’t recommend using it if you’re not making game AAA class.

‍

‍

Cost: Free version available
Result: Application for Android, iOS, Gear VR, Google Cardboard, Google Daydream, HTC Vive, Oculus Rift, or PlayStation VR

‍

Solutions for Augmented Reality

‍

Sketchfab

For AR as well as for VR Sketchfab is in favourites. You can’t embed AR view on your website and unfortunately can’t open your model from your app. But Sketchfab made already the first step by allowing to open models from its iOS app. At least you can host your model on its servers.

‍

‍

Cost: 100% Free
Result: Link to your model in Sketchfab iOS app

‍

ARKit ARCore

‍ARkit and ARCore are two platforms for iOS and Android, respectively. They help place objects on any flat surface and interact with them.
It’s not so easy to make native applications.

‍

‍

Cost: Free to try
Result: Native iOS or Android application

‍

Unity + ARKit ARCore

And again before mentioned game engine Unity. It can be leveraged to create scenes for ARKit and ARCore. Without knowing a code, you can build an app for iOS or Android and show how your product can look in real life.

‍

‍

Cost: Free version available

Result: iOS or Android app

‍

Unity + Vuforia

Vuforia help create different AR experiences. With Unity, it allows you to connect the scene to any in advance defined marker. For example, 3d model that appears on a photo of your product.

My concept of promo site made using Vuforia

‍

‍

Cost: Free version available

Result: iOS, Android or Microsoft HoloLens app

‍

AR.js

This is a library by Jerome Etienne. It built on top of A-frame, mentioned before. So if you figured out how to play with A-frame. You’ll easily create a scene using AR.js. The best thing is that it’s web-based. So you can share just direct link that can be opened on almost any modern device. Unfortunately, it uses a marker to place your model in the real world. For some cases, it’s an advantage. For example, for learncalligraphy.today I used it to place art on paper and allow user to draw on it without distracting trackable area. This is practically un-possible with ARKit. But there is light at the end of the tunnel. Jerome Etienne just posted first successful markerless test of AR.js with ARCore.

My test of a restaurant menu with augmented food

‍

‍

Cost: 100% Free

Result: Direct URL

‍

‍

Web-based markerless

This is a set of technologies that leverage ARCore, ARKit, three.js and modern browsers to get an augmented scene. As for me, it’s the best state of AR. There are already a few successful examples. But for now, there isn’t any builder that allows you to create a scene without having solid code experience.

‍

‍

Cost: 100% Free
Result: Direct URL

‍

Thank you that you finished reading this article. Message me if you need advice or any help.