Interactive 3D Graphics

Contents

• Syllabus
• Materials and Bibliography
• Exam

The main goal of the course is to introduce concepts, algorithms and technologies in the field of interactive 3D graphics, with practical examples in WebGL / ThreeJS. By the end of the course, the student will be able to:

• understand the basic principles of computer graphics and interactive 3D graphics applications, such as videogames, data visualizations, and simulations;
• design and implement a 3D graphics application, based on WebGL, that runs in a Web browser ¹.

Syllabus

1. Introduction. The interactive 3D rendering cycle. The real-time rendering pipeline.
2. WebGL and three.js. Introduction to WebGL and three.js. Rendering a simple scene.
3. Geometry representation. Polygon meshes and their representation. Triangle representation and triangle meshes. Tessellation.
4. Transformations. Coordinate spaces used in 3D graphics. Affine transformations: rotations, scaling, translation. Transformations in 4D homogeneous coordinates.
5. The virtual camera. Representation of a virtual camera. Camera space, clip space and screen space. Orthographic and perspective projections. Clipping and screen mapping.
6. Rasterization and interpolation. Algorithms for rasterizing points, lines and polygons. Perspective interpolation of vertex data. Aliasing and screen-based anti-aliasing methods.
7. Buffer and fragment operations. Fragment operations: blending. Buffer operations: depth test. Algorithms for rendering semi-transparent surfaces.
8. Programmable shaders. Vertex and fragment shaders. The Glsl language.
9. Shading. Visual phenomena and their importance in shading. The Rendering Equation. Real-time shading equations and their implementation through shaders. BRDF: lambertian and microfacet. Implementation through shaders.
10. Using textures in shading. Material mapping, normal mapping, reflection mapping, refraction mapping, shadow mapping. Implementation through shaders.
11. Spatial data structures.  Bounding volumes, Bounding Volume Hierarchies, Binary Space Partitioning Trees. Culling algorithms: Hierarchical View Frustum Culling
12. Image-based rendering. Full screen effects. Using shaders to implement image processing algorithms: color filters, convolutions, edge detection.
13. Introduction to animations. Keyframe animations: interpolation through splines. Interpolation of rotations with quaternions. Particle Systems.
14. Controlling a virtual camera. Interactive, assisted and automatic methods. Reactive and declarative methods. Examples of state-of-the-art techniques for automatically controlling a virtual camera.

Materials and Bibliography

• Course slides available at elearning.uniud.it
• Code examples available at GitHub (how to run programs locally)

Reference textbooks:

• Real-Time Rendering, (2nd or 3rd edition), T. Akenine-Möller, E. Haines, and N. Hoffman.
• 3D Math Primer for Graphics and Game Development, F. Dunn e I. Parberry.
• Mathematics for 3D Game Programming and Computer Graphics, E. Lengyel.

Note: The course slides report, for each topic, references to specific chapters in the above books. At least one copy of each book is available at the University Library.

Books on WebGL and three.js (just for reference, slides and online docs are sufficient):

• WebGL: Up and Running, T. Parisi, O’Really.
• WebGL Beginner’s Guide, B. Jones and D. Cantor, Packt Publishing.

On the Web:

• Free Interactive 3D Graphics Online Course, taught by E. Eynes. Based on WebGL and three.js. It covers many arguments of our course. Recommended.
• Some useful articles about glsl programming.

Exam

• Written exam with open questions and exercises.
• Two practical projects, that are due before the written exam, and whose specific topics will be given during lectures and posted on the course web page.