Here’s a curated list of learning resources I usually recommend for self-studying the domain of Computer Graphics.

Introduction

Learning graphics concepts isn’t the same as learning a rendering library; the latter is usually not very beneficial since a new library eventually replaces/takes over. Strive to learn the theory behind the domain, not the tools or their idiosyncrasies. Once you internalize the basic ideas, try doing some CG projects with increasing hardness.

Vulkan or Direct3D 12?

Khronos’ official Vulkan Programming Guide goes:

Vulkan is intended to be used as the interface between large, complex graphics and compute applications and graphics hardware. Many of the features and responsibilities previously assumed by drivers implementing APIs such as OpenGL now fall to the application. […] Vulkan is not well-suited to simple test applications; neither is it a suitable aid for teaching graphics concepts.

Starting with OpenGL, instead of Vulkan, is better to learn graphics programming. Another article also admonitions not to start with Vulkan or D3D 12 and instead go with OpenGL or D3D 11. Resources below are centred around OpenGL; other libraries aren’t cross-platform (e.g. D3D11), or are too low-level, requires intimate knowledge of hardware and low-level programming, it’s no longer just graphics programming.

Tutorials / eBooks

  • Learn OpenGL is a very clear and extensive OpenGL tutorial series on various topics ranging from basics to advanced levels. Its categorization and illustrations are very good too. Highly recommended for beginners.
  • Learning Modern 3D Graphics Programming is probably the most extensive free, well-maintained online/offline (download-able for desktop, tablet and even kindle) book on modern OpenGL programming.
  • OpenGL-Tutorial is also modern and good, but isn’t that extensive/detailed as compared to the former; although perspective projections are explained with diagrams extremely well here.
  • OGLdev has close to 40 tutorials on modern OpenGL with nice explanations and rendered outputs.
  • MBSoftworks tutorials covers a wide range of topics; interesting from a game development perspective too.
  • An Intro to Modern OpenGL is short and sweet; it’s good to understand the rendering pipeline more clearly; once again because it’s very illustrative. For more in-depth understanding, read A trip through the Graphics Pipeline.
  • OpenGL on WikiBooks has lot of hands-on tutorials which seem to be good too.
  • Lighthouse 3D has tutorials for most of CG ~ math, Open GL, GLSL, GLUT, writing your own light weight library for game development.

Math

To be proficient in computer graphics or even to understand the basics, a decent amount of mathematical concepts needs to be grasped; it requires one to be comfortable in using trigonometry and linear algebra. For this I recommend

3D Math Books

I’d recommend at least one book as tutorials just aren’t enough. To get intuition and comfortably work in abstract 3D these would help:

Out of these math books, the most intuitive is the first with lot of funny anecdotes in between, the last is for hard core math fanatics (if you’re afraid of symbol vomit, steer clear of it), although it’s a good book for experienced CG programmers who need a reference. The one in between is really good in that it details out somethings which the other two (or many books for that matter) omit, and in the spectrum of intuitiveness and hard core math it’s in between.

Shaders

  • The Book of Shaders is for those who want to write cool-looking pixel effects using fragment shaders.
  • Shader School is an introduction to GLSL shaders and graphics programming using WebGL; looks promising.

WebGL2 and friends

3D programming isn’t confined to native apps; web pages have 3D content. Facilitating that are a few API stacks:

APIDerived From
WebGLOpenGL ES 2
WebGL2OpenGL ES 3
WebGPUVulkan

WebGPU (like Vulkan) is more low-level; you’d end up tuning a lot of hardware knobs without knowing why. Mind you, WebGL2 (like OpenGL) is already low-level, WebGPU is even lower! To learn the basics of 3D graphics programming I’d recommend WebGL 2, similar to my recommendation of OpenGL over Vulkan. If you need something more high-level than WebGL2 I’d half-heartedly recommend three.js as it’d rob you off the basics. For instance, you can throw in an AmbientLight object without knowing how it’s implemented at the shader level.

WebGL2 is an attractive option to learn the basics of graphics programming since

  • Setup costs are lower1
  • Concepts learnt map 1:1 to other graphics programming libraries like D3D 11, OpenGL, etc.
  • Very little legacy cruft since WebGL 2 is based on OpenGL ES 3.0

However, I’ve seen library and tooling availability w.r.t. CG more in C and C++.

  • WebGL2 Fundamentals is a very good introduction to 2D and 3D computer graphics using WebGL2 by Gregg Tavares. He also has
  • WebGL Academy is the most interactive tutorial out there teaching 3D computer graphics with step by step code walk-through and showing what changed on screen. It starts with the basics and goes on to cover advanced topics like PCF, distance mapping, variance shadow mapping, deferred shading, etc.

Ray Tracing

Most aforementioned resources are for real-time or online rendering where 30 to 60 frames are pumped on screen every second by a rasterizer. Another branch of CG is offline rendering: every frame takes minutes (or sometimes hours!) to render on a single computer by a ray tracer. For these, per-frame render time isn’t a problem; they value visual quality. Once rendered, the output can be viewed at leisure, without any user input business.

  • Ray Tracing in One Weekend is a free book series by Peter Shirley; covers the ideas from ground-up
    1. In One Weekend
    2. The Next Week
    3. The Rest of Your Life
  • ScratchAPixel.com is an excellent resource for in-depth Computer Graphics theory partial to raytracing

Cheat Sheets

Online Courses

Physical Books

†: not an OpenGL book; teaches rudimentary CG concepts using OpenGL

Of these, my personal favourites are the last two. More practical and hence engrossing for the beginner; the explanations aren’t very cryptic, unlike the other, more academic books in the list.

Physically Based Rendering seems to be the book for designing and coding a physically-based ray tracer from scratch.

Low-level

Serious game development eventually leads to low-level optimisations. This list might help at that point:

  • You Don’t Have to Learn Assembly to Read Disassembly
  • Modern X86 Assembly, Daniel Kusswurm
  • Low-level C and C++ curriculum, Alex Darby
  • Assembly and the Art of Debugging, Mohit
  • Write Great Code: Volume 1, Randall Hyde
  • 3D Game Engine Programming ~ §Fast 3D Calculus, Stefan Oliver
  • Fundamentals of Software Engineering for Games ~ Chapter 3, Jason Gregory
  • Mathematics for Game Developers ~ Part V ~ Optimization, Christopher Tremblay
  • Vector Game Math Processors, James C. Leiterman
  • Real-Time Collision Detection ~ Chapter 13 Optimization, Christer Ericson
  • Instruction-level Parallelism, Wikipedia
  • GPGPU Programming for Games and Science ~ Chapter 3, David Eberly

See Also

  1. (Free) Computer Graphics Programming Resources

Reinventing the Wheel Often is natural when learning! I like this quote from Assembly Language Step by Step, by Jeff Duntemann:

“When somebody asks you, ‘Why would you want to do that?’ what it really means is this: ‘You’ve asked me how to do something that is either impossible using tools that I favor or completely outside my experience, but I don’t want to lose face by admitting it.’ […] The answer to the Infamous Question is always the same, and if the weasels ever ask it of you, snap back as quickly as possible, ‘Because I want to know how it works.’ That is a completely sufficient answer.”


  1. You just need a text editor and a browser (which also has a JS debugger) ↩︎