Details

Title: WebGL & Three.js advanced
Duration: 16 hours (2 days)
Number of trainees: from 3 to 8
Meal: breakfast, coffee and tea included, lunch not included
Price per person: $2000 if 4 people or less, $1700 otherwise

Material

The trainee should bring:

  • a laptop with WiFi connectivity,
  • the screen resolution should be at least 1366*768 pixels,
  •  a web browser compatible with WebGL should be installed. This 3D car demo should run smoothly.

The trainer needs:

  • a paperboard/velleda board/green board with different color pens or chalks,
  • a HDMI video projector with a minimum resolution of 1366*768 pixels,
  • a wifi Internet access.

Pre-requisites

This training session is for web developers. An intermediate level in JavaScript (ES5) is required.

The basics concepts of WebGL and Three.js should be assimilated. Ideally, the trainees should did the course WebGL & Three.js basics before.

However, you can still attend this course if you have learnt the basics by yourself and if you want to become a 3D web ninja.

Objectives

After the training session, the trainees will be able to:

  • rendering to a texture, which is required for multipass rendering algorithms,
  • apply advanced lighting techniques (shadow mapping, ambient occlusion, physically based rendering),
  • animate meshes with keyframes or skeleton animations,
  • compute collisions between basic primitives and complex meshes using octrees,
  • pick an object behind a pixel.

Course outlines

  • rendering to texture
  • drawing shadows with shadow mapping
  • improving shadow mapping with PCF and VSM
  • controlling light with Physically based rendering
  • computing the ambient occlusion
  • collision between basic primitives
  • using octree to solve complexe collisions
  • understanding a physics engine
  • grasping an object behind a pixel
  • mesh animation
  • WebGL2
  • conclusion: Where is WebGL going?