Computer Graphics

DTU 02561 · the real-time rasterization pipeline built from scratch in WebGPU. Each week's exercises run live in the browser — pick one below.

Interactive exercises render with WebGPU; open them in Chrome or Edge (or Safari 18+). Several are interactive — click to draw (Week 2), drag to orbit (Weeks 6–7, 10), and use the on-screen buttons and sliders.

Week 1 — WebGPU basics

1 · Clear the canvas
2 · Points
3 · Interpolated-colour triangle
4 · Rotating quad
5 · Bouncing circle

Week 2 — Interactive 2D drawing

1 · Click to add points
2 · Coloured points
3 · Points & triangles
4 · Points, triangles & circles

Week 3 — Transformations & projection

1 · Isometric wireframe cube
2 · Three perspective views
3 · Transformation matrices document

Week 4 — Lighting & shading

1 · Subdivided sphere
2 · Position-coloured sphere
3 · Gouraud shading
4 · Phong shading
5 · Phong shading (per fragment)
6 · Lighting & shading questions document

Week 5 — Triangle meshes (OBJ)

3 · Teapot OBJ loading
4 · Teapot — Phong shading

Week 6 — Texture mapping

1 · Checkerboard quad
2 · Mipmap & filtering controls
3 · Textured Earth sphere

Week 7 — Environment & bump mapping

1 · Cube-map sphere
2 · Environment background
3 · Reflective sphere
4 · Bump-mapped reflective sphere

Week 8 — Projection shadows

1 · Scene (ground + quads)
2 · Projection shadows
3 · Shadow culling (depth test)
4 · Semi-transparent shadows

Week 9 — Shadow mapping

1 · Jumping teapot scene
2 · Projection shadows (reference)
3 · Shadow mapping (Parts 3–4)
5 · Projection vs shadow mapping document

Week 10 — Virtual trackball

1 · Simple orbiting (Euler angles)
2 · Quaternion trackball
3 · Orbit, dolly, pan
4 · Trackball with spinning