Learn to create WebXR, VR and AR, experiences using Three.JS

Learn to create WebXR, VR and AR, experiences using Three.JS, available at $64.99, has an average rating of 4.65, with 53 lectures, 9 quizzes, based on 527 reviews, and has 5969 subscribers.

You will learn about How to easily create VR and AR apps that work in the browser How to use the ThreeJS library to create these apps How to handle controllers How to replace the controllers with custom models How to create architectural walk-throughs, games and training apps. How to add an in world UI Developing AR apps that support real world hit testing Learn game VR techniques such as teleporting and interacting with models in the scene using controllers. This course is ideal for individuals who are Anyone interested in harnessing the latest WebXR API, to create VR and AR experiences that work in the browser without additional installation requirements. It is particularly useful for Anyone interested in harnessing the latest WebXR API, to create VR and AR experiences that work in the browser without additional installation requirements.

Enroll now: Learn to create WebXR, VR and AR, experiences using Three.JS

Summary

Title: Learn to create WebXR, VR and AR, experiences using Three.JS

Price: $64.99

Average Rating: 4.65

Number of Lectures: 53

Number of Quizzes: 9

Number of Published Lectures: 53

Number of Published Quizzes: 9

Number of Curriculum Items: 62

Number of Published Curriculum Objects: 62

Original Price: $69.99

Quality Status: approved

Status: Live

What You Will Learn

How to easily create VR and AR apps that work in the browser

How to use the ThreeJS library to create these apps

How to handle controllers

How to replace the controllers with custom models

How to create architectural walk-throughs, games and training apps.

How to add an in world UI

Developing AR apps that support real world hit testing

Learn game VR techniques such as teleporting and interacting with models in the scene using controllers.

Who Should Attend

Anyone interested in harnessing the latest WebXR API, to create VR and AR experiences that work in the browser without additional installation requirements.

Target Audiences

Anyone interested in harnessing the latest WebXR API, to create VR and AR experiences that work in the browser without additional installation requirements.

WebXRbrings both VR and AR to the browser. The API has the massive forces of Google and Amazon behind it so it looks like immersive experiences, using only a browser, are going to make a huge impact in the near future. WebXR works great with Oculus headsets, including the Oculus Quest 2 and the Chrome Android browser is already supporting the API for both AR, Augmented Reality, and VR, Virtual Reality, experiences. But WebXR only harnesses the sensors on a mobile device and creates an agreed definition of how to use this data. To actually visualise 3D content you need a WebGL library and there is no better one to use than Three.JS. This mature Open Source library has many users around the globe and is supported by many developers. Three.JS is at version 118 at the time of writing and is a robust, production readylibrary. Recently WebXR support was added to the library. Making it easy for developers to create immersive experiences.

In this course you’ll learn how easy it is, using Three.JS, to create VR and AR experiences. To get the best from the course you will need to be comfortable with JavaScript coding. No other prerequisites are required.

The course is split into 10 sections.

1. Introduction– I introduce the history of WebXR, give you a basic primer for those of you new to 3D concepts and show you the Three.JS website and the WebXR examples.

2. A Three.JS Primer –  is for Three.JS novices to bring you up to speed on the library.

3. An introduction to WebXR using Three.JS – we look in earnest at your development environment and create our first WebXR examples.

4. Using complex assets with Three.JS – most things you create for immersive experiences will need complex assets and sourcing, editing, loading and working with them is the subject of section 4.

5. The WebXR API– gives a review of the WebXR API.

6. Creating an Architectural Walk-Through – in section 6 we start to create real world examples of immersive content with an architectural walk-through.

7. Placing a Product in a Room – WebXR lends itself to showing real products in a person’s home and that is the topic for section 7.

8. Using WebXR for games – VR is perfect for games and we look at the basic ingredients of a game using WebXR in this section.

9. Using WebXR for training – covers the important topic of using VR for training.

10. Conclusion – we look at some WebXR examples to inspire you and review what you’ve learnt.

The only tools you’ll need are a code editor, in the course I use Brackets, freely available online. The course includes comprehensive resources and code examples. Each code example comes with two versions, one for you to code along with and another that is complete in case you hit a problem. I show you how to use GitHub to host your development work on a secure server so you can easily test your work on a headset, such as an Oculus Quest

It’s going to be fun.

You get a 30 day money back guarantee, so you’re nothing to lose, go virtual today.

Reviews

“This is by far the best guide to Three JS, nothing but funand clearly explains the parts needed for a 3D app. Thanks Nik for taking the time on this! Can’t wait to see where this course take me!”

“Thanks for creating the course” – Mr Doob, the creator of Three.JS

“We all Nik fanswere waiting for this one when he previously announced it in the Facebook group. And he didn’t disappoint us.“

“Best Intro/History Video Ever”

“Love it so far! The lessons are concise and to the point. The videos’ length seems quite optimized, meaning they are not terribly long yet are filled with just enough information about what’s going on. The supplied course project files constitute a valuable facilitation on the way through the course.”

“It starts with the basics and then progress to advanced topics. I like the pace and the explanations. Great course!”

“Great course, love the well-chosen examples, just what I needed!“

“Excellent course, it took me by surprise how well documented and the high quality content from Nicholas , highly recommended. Cheers!”

“I haven’t heared before so simple yet pleasant narration of threejs app development now I realize how talented the author is.”

Course Curriculum

Chapter 1: Introduction

Lecture 1: Welcome to the course

Lecture 2: Free e-book

Lecture 3: Another FREE e-book

Lecture 4: Setting up a secure web server

Lecture 5: The history of WebXR

Lecture 6: A 3D Primer

Lecture 7: The THREE.js Examples

Chapter 2: A THREE.js Primer

Lecture 1: Setting up a simple THREE.js page using modules

Lecture 2: Creating a rotating Cube

Lecture 3: The THREE.js editor

Lecture 4: Geometries

Lecture 5: Materials

Lecture 6: Loaders

Chapter 3: Introducing WebXR with THREE.js

Lecture 1: Converting a standard THREE.js web app to use WebXR

Lecture 2: Customising the VRButton

Lecture 3: Adding user interaction with a controller device

Lecture 4: Adding a button press event to the controller

Lecture 5: Creating a custom controller

Lecture 6: Accessing the gamepad

Lecture 7: Moving around a VR world

Lecture 8: Physics in your VR world

Lecture 9: Creating an AR experience

Lecture 10: Controllers in an AR app

Lecture 11: Touch gestures in an AR app

Lecture 12: Hit testing in AR

Lecture 13: Hand-tracking on the Oculus Quest

Chapter 4: Using complex assets with THREE.js

Lecture 1: Finding assets online

Lecture 2: Using Mixamo to setup character animations

Lecture 3: Using Blender to export assets

Lecture 4: Using the THREE.js animation system

Chapter 5: The WebXR API

Lecture 1: XRSystem and XRSession

Lecture 2: XRFrame and XRSpace

Lecture 3: XRInputSource

Chapter 6: Creating an architectural walk-through

Lecture 1: Moving around an environment

Lecture 2: Interacting with objects in the scene

Lecture 3: Using a GazeController

Lecture 4: Making the app functional on a none XR device

Chapter 7: Fun with AR

Lecture 1: Using AR to create a tape measure

Lecture 2: Adding dynamic animation to a product

Lecture 3: An AR online shop example

Lecture 4: WebXR AR on an iPhone!

Chapter 8: A VR Game

Lecture 1: Movement by teleporting

Lecture 2: Interacting with meshes

Lecture 3: Using a controller as a weapon

Chapter 9: VR for training

Lecture 1: CanvasUI – part 1

Lecture 2: CanvasUI – part 2

Lecture 3: Using CanvasUI for training

Chapter 10: Progressive Web Apps (PWA)

Lecture 1: Getting Started with PWAs

Lecture 2: Packaging and deploying your PWA

Lecture 3: A WebXR PWA

Chapter 11: Conclusion

Lecture 1: WebXR examples, articles, videos and repos to inspire and inform you

Lecture 2: Three.JS with NPM and vite

Lecture 3: Bonus Lecture

Instructors

Nicholas Lever
Game developer

Rating Distribution

1 stars: 11 votes

2 stars: 9 votes

3 stars: 50 votes

4 stars: 151 votes

5 stars: 306 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!