This post was originally published at How to make VR with the web, a new video series

Virtual reality (VR) seems complicated, but with a few JavaScript libraries and tools, and the power of WebGL, you can make very nice VR scenes that can be viewed and shared in a headset like an Oculus Go or HTC Vive, in a desktop web browser, or on your smartphone. Let me show you how:

In this new YouTube series, How to make a virtual reality project in your browser with three.js and WebVR, I’ll take you through building an interactive birthday card in seven short tutorials, complete with code and examples to get you started. The whole series clocks in under 60 minutes. We begin by getting a basic cube on the screen, add some nice 3D models, set up lights and navigation, then finally add music.

All you need are basic JavaScript skills and an internet connection.

Here’s the whole series. Come join me:

1: Learn how to build virtual reality scenes on the web with WebVR and JavaScript

2: Set up your WebVR workflow and code to build a virtual reality birthday card

3: Using a WebVR editor (Spoke) to create a fun 3D birthday card

4: How to create realistic lighting in a virtual reality scene

5: How to move around in virtual reality using teleportation to navigate your scene

6: Adding text and text effects to your WebVR scene with a few lines of code

7: How to add finishing touches like sound and sky to your WebVR scene

To learn how to make more cool stuff with web technologies, subscribe to Mozilla Hacks on YouTube. And if you want to get more involved in learning to create mixed reality experiences for the web, you can follow @MozillaReality on twitter for news, articles, and updates.

The post How to make VR with the web, a new video series appeared first on Mozilla Hacks – the Web developer blog.

This article: 

This post was originally published at How to make VR with the web, a new video series