Animating 3D objects

Preview unavailable

You must log in or sign up to view this lesson.

LoginSign up

Intro to AR on the Web

Buy nowLearn more
  • Course description
  • Code and sample apps

Introduction to WebXR

  • Intro to the course2
  • Your first experience with web AR on mobile iOS2
  • Your first experience with web AR on mobile Android1
  • Your first experience with web AR on desktop

The WebXR API

  • What is the WebXR API?
  • What are the benefits of AR on the web?
  • How does WebXR work?
  • What is Three.js?
  • WebXR application lifecycle

Coding Your First WebXR AR App

  • Setting up the developer environment and code examples
  • Creating a basic Three.js scene
  • Adding a camera to the scene
  • Adding a renderer to the scene
  • Adding a cube to the scene
  • Creating an animation loop2
  • Three.js coordinate system
  • Adding a light to the scene2
  • Adding a more complex shape to the scene
  • Converting the scene to AR using WebXR

3D Models in AR

  • Adding 3D objects to the scene
  • Animating 3D objects
  • Adding a 3D model to the scene
  • Animating a 3D model

Interactions in AR

  • Adding touch gestures
  • Hit testing part 1 - Setup
  • Hit testing part 2 - Hit test source and reference spaces
  • Hit testing part 3 - Placing a reticle on a surface
  • Hit testing part 4 - Placing virtual objects on surfaces