WebGL course

This is a course to teach JavaScript 3D graphics ("WebGL") programming on Ancient Brain.

It is based on the WebGL video series by Daniel Shiffman at The Coding Train. The Shiffman code has been ported (with permission under MIT licence) to Ancient Brain "Worlds" that can be run and edited on Ancient Brain in the browser.

When you are finished this course, you will be able to make Worlds like the following. Click to run them.

Tutorial 18.8
94 runs ♦ 0 likes
By "Coding Train" p...  
Created: 9 Sep 2018
Modified: 17 Sep 2023
3D Custom Shapes
Tutorial 18.3
67 runs ♦ 0 likes
By "Coding Train" p...  
Created: 9 Sep 2018
Modified: 17 Sep 2023
Light and Material
Tutorial 18.7
422 runs ♦ 0 likes
By "Coding Train" p...  
Created: 9 Sep 2018
Modified: 17 Sep 2023
Tutorial 18.7 with full canvas, resized model, sound. Texture on box is image from another user.
Tutorial 18.5
96 runs ♦ 0 likes
By "Coding Train" p...  
Created: 9 Sep 2018
Modified: 17 Sep 2023
Camera and Perspective


Pre-requisite: Familiarity with coding on Ancient Brain


Contents

  1. Introduction to WebGL in p5.js
  2. 3D Geometries
  3. Light and Material
  4. Texture
  5. Camera and Perspective
  6. createGraphics() as WebGL Texture
  7. Loading OBJ Model
  8. 3D Custom Shapes


Notes


Get started:

Step 1 of 8