Design on the web is constantly shifting. From boxy, grey buttons to parallax scrolling, we’ve seen a number of different trends come and go - often leaving their best bits to inspire the next design movement.
One particular style which is beginning to gain traction on the web is VR (Virtual Reality).
In the web’s very recent history, VR websites have begun to take off. Initially, we had the WebVR APIs which allowed developers and designers to create seamless immersive realities in the browser. Even more recently the industry has shifted again - this time to WebXR. In a fairly fragmented context of web development, WebXR looks to buck the trend by actually including more functionality - AR (Augmented Reality) - into the framework, allowing more possibilities with a single tool.
While these innovations may seem fairly bland to the average person, this is the core, fundamental work which will allow entirely new, gripping experiences to be built for the web. These are the types of strides in the field that would allow virtual worlds to come into being. Akin to Wade Watts in Ready Player One, you might soon be jumping into your own virtual Oasis.
To inspire you for your next project and map out what’s already being done in the field, we’ve scoured the internet to find the best VR websites online.
Best VR websites
Hubs by Mozilla
I promised the Oasis and so it’s only right I begin with a social, virtual world. Courtesy of Mozilla - who also make your friendly fox-based browser - comes ‘Hubs’.
If you pictured a dystopian reality where you could be indestructible, steal cars and drive to Mars, Hubs isn’t that. In truth, it feels like a proof-of-concept which exemplifies the possibilities of the technology very well. Imagine if Zoom and Minecraft had a baby. You can set up a floating robot avatar which you will control during the experience, and perform actions like speaking, moving around the virtual maps, painting in 3D or watching videos.
It is remarkable that something like this could be built for the browser, and also work seamlessly across VR products. Hubs is certainly a trailblazer, demonstrating that this type of product is possible right now on the web. We can only expect these types of virtual worlds to get better.
Showroom by Little Workshop
As well as transporting us to whole other digital habitats, VR is also being integrated for our physical world. Here’s one incredible example, courtesy of France-based creative agency Little Workshop.
The team has built a demonstration of how an interior design website could utilise VR technologies to help sell products for the home. This solves an interesting problem when shopping online: judging size and matching styles.
Purchasing the right furniture for your home is tricky, especially if you haven’t got much room or you’re trying to match a certain theme. A lot of intricate measuring is involved, and often the actual product will have some quirk you didn’t notice online which will be an issue when it gets to your doorstep.
However, Little Workshop’s idea might save us from some of those frustrations in the future. They allow you to pan around a virtual showroom, exploring the furniture on show. The UI for focusing on an item is nice and clear, and the product specifications are clearly presented - alongside an awesome material-picker that updates the 3D product live on screen, making this one of the best VR websites out there.
I can definitely see my future Ikea shop consisting of me zooming down their virtual aisles and mock-rooms, hovering over their 3D displays and dragging a chair into my digital bag.
Bear 71 by Jam3 and National Film Board of Canada
Bear 71 is the Planet Earth of the future. It’s a nature documentary blended with a VR experience that looks great in a headset or a browser. You follow along with the story while watching abstract shapes (representing different animals) traverse the 3D terrain. The documentary highlights how our world is under supervision, not only in nature but in our modern society too - as we listen to the main protagonist (Bear #71) explain how her landscape is changing.
Taking a step back and purely assessing the aesthetics of the experience, it really sets a standard for VR documentaries to come and is a solid benchmark for the future. Interactions are smooth, and there is a unique challenge in trying to catch faster-moving animals as they travel across the grid.
Dance Tonite by Google
On a more lighthearted note comes Dance Tonite, which is a VR website based on how we experience music.
You have two options: let the dot (your camera) move through the boxy rooms and enjoy dancing with 3D geometrical shapes that represent human dancers, or add your own dance to the mix.
When enjoying the experience, you can either watch from a corner-angle or hold down the dot in the middle of the screen to get a first-person point-of-view of the action as you glide through the rooms.
To create your own dance, you have to own a room-scale VR device and a WebVR enabled browser, making it not that accessible to the masses - yet.
It is a beautiful interface though - it blends the lines between something you’d expect from an abstract art agency and a Calvin Harris musical extravaganza. Not only are the transitions smooth, but the typography and use of colour are also expertly done.
Another of the best VR websites comes from creative agency, Zoo. Continuing on the topic of abstract, this is probably one of the most outlandish VR websites on the internet. Essentially, Zoo has created an art installation in digital form. You take the form of a visitor at their gallery observing their work - or their leftover ramen.
As for aesthetics, it’s as if you’re in a gallery inside a solid white cube. It’s immersive and fun to explore, while also giving you the opportunity to dive in and learn more about their work.
Zoo sets the bar pretty high on what creative agencies could be implementing for their marketing pages.
360 Image Gallery by A-Frame
You may be thinking ‘I like the VR look for displaying my work, but I have no idea how to create something like Zoo’. Don’t worry, I’m thinking the exact same thing.
However, you could try something like this 360 image gallery by A-Frame. In the preview, you can drag your view around to move the pointer, and then hover and click on an image to change your environment.
It provides a unique and alternative way to showcase media and could pave the way for the VR equivalent of Instagram in the future.