Press enter to see results or esc to cancel.

HTML say hello to Virtual Reality

A-FRAME is a web framework which gives you the possibility to integrate VR into your website! The possibilities are endless. As of this moment, it works on Vive, Rift, desktop and mobile platforms.

It is a three.js framework that brings the entity-component-system pattern to the DOM. Quite simply, it allows you to create VR websites through which you can take a walk!

You are only a couple of steps away from integrating VR into your website. Alright, fork it! Or simply download the zipped source files.

Now go ahead and include the Javascript build:

<!-- Production Version, Minified -->
<script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
<!-- Development Version, Uncompressed with Source Maps -->
<script src="https://aframe.io/releases/0.5.0/aframe.js"></script>
Or if you prefer NPM:
# Latest stable version (https://www.npmjs.com/package/aframe)
$ npm install aframe
# Bleeding-edge version (https://github.com/aframevr/aframe)
$ npm install aframevr/aframe

Now you just need to require it!

require('aframe');
And you are all set!

To see some already made examples/demos, head over to A-FRAME’s website and grab your daily dose of inspiration.

Web VR can be used in many ways and as it’s still fresh, you have a clear headstart since you’ve just read this article! In my opinion, the biggest use could be for marketing due to the ability of being able to represent almost any product in a rather fun and interactive way. You may even create a virtual tour of your store with interactive objects.

Check out this example and simply replace the three images with interactive products, giving the user a rather new and unique experience.

This is just one example which was thought of in the blink of an eye, there’s many more possibilities to it so let your imagination go crazy.