Angelo Pesce - c0de517e.blogspot.com - @kenpex
3D Computer Graphics
for Beginners
A selection of resources to learn and tinker with.
-----= WIP - OPEN FOR SUGGESTIONS! =-----
Guidelines for adding suggestions *use comments* :
* Tinkering & Practical > Theoretical & Boring :)
* Projects, books, videos, whatever…
* Quality > Quantity. Let’s try to find a minimal set :)
* The internet is -full- of information, in order to help one has to be concise, sift through the noise.
* Same for frameworks & programs. Lots of choice. Prefer things that come/have great projects a beginner can go through.
* Both Real-time and Offline Computer Graphics are covered.
* THANKS!
________________
Three “Tracks”:
* [OFF] “Offline” Rendering - What’s used in movies! Non-real-time, we have a lot of time to generate an image. Theory of lights, scattering, materials. Monte-carlo solutions of the rendering equation: Ray tracing, Path tracing.
* [RT] “Real-Time” Rendering - What’s used in videogames! Some of the same theory as offline, but the practical implementation has to deal with GPUs, rasterization, shaders… On this track, one can start from the “low level” and learn a 3D API, shaders etc, writing a renderer from scratch, or start from a 3D engine (e.g. Unity, Unreal…), learn higher level concepts and then graduate to understand how things work at a lower level.
* [ART] Fabrication, digital art and so on. Can use both real-time and off-line rendering, and other techniques for procedural generation of geometry, patterns etc...
Small projects: have fun & tinker.
Pick any of these as a starting point… then graduate to some reference materials, books… then keep yourself continuously learning via conferences, blogs, articles etc...
[OFF] Ray Tracing in one weekend. A fun and cheap booklet by Peter Shirley who authored many other (longer) books on computer graphics.
It guides through a weekend project, building a simple offline renderer.
There’s nothing like raytracing to get hooked on 3d graphics programming!
https://raytracing.github.io/
[RT] WebGl Fundamentals
Sadly, or perhaps not, WebGl is today one of the few more “beginner friendly” APIs that are not discontinued… This interactive web book provides a good introduction and all the code is tinkerable…
https://webgl2fundamentals.org/
Alternatives: http://learnwebgl.brown37.net/ https://www.amazon.com/WebGL-Programming-Guide-Interactive-Graphics/dp/0321902920
Related: PicoGL is even better, it’s truly a nice API to use, but to my knowledge there are no tutorials that use that wrapper https://tsherif.github.io/picogl.js/
[RT] Three.js If WebGL (and picoGL) is a great starting point to learn a GPU 3d graphics API today, three.js is a great first 3d engine to begin with. This means it’s more of a high-level introduction than working with a GPU api, directly working with scenes, objects, lights, textures etc… https://threejs.org/docs/#manual/en/introduction/Useful-links
After this, one can graduate to engines like Unity, Unreal or Godot, or learn a 3d API and write an engine from scratch...
[RT] Interactive 3D Graphics. An udacity course from Eric Haines, one of the co-authors of Real-Time Rendering.
It goes through the basics using WebGL and three.js (https://threejs.org/), which are an API and a framework both particularly well suited for beginners. The course is a bit lengthy https://www.udacity.com/course/interactive-3d-graphics--cs291
[RT] LearnOpenGL. OpenGL can be friendly as a beginner’s API. It also has a lot of legacy mixed with modern concepts. The legacy stuff is easier, the modern parts are better/faster, in general it’s a bit of a mess and it’s being phased out on some systems (e.g. Mac). That said, it’s still a great starting point. This website is quite good: https://learnopengl.com/
Related: https://antongerdelan.net/opengl/ https://paroj.github.io/gltut/ and http://nehe.gamedev.net/
[ART] Processing is a language developed by MIT’s Aesthetic and Computation Group to ease generative graphics programming.
While it won’t teach you much about the theory of computer graphics, it provides a fun and easy framework to play with - and it’s a great tool for generative art!
https://processing.org/ Good books on Processing are listed here: https://processing.org/books/ I would recommend “The Nature of Code”
https://p5js.org/ javascript version, has an online editor.
https://www.openprocessing.org/
An OSX-only, Python based alternative is DrawBot http://www.drawbot.com/
[RT/ART] The book of shaders. This is truly a marvel, an interactive online book going through the basics of pixel shaders and showing how to make art with them.
It’s not a full introduction to 3d real-time rendering as it only covers pixel shaders to directly generate images, no 3d geometry involved, but it’s a good read to familiarize with the shading language that is used for real-time rendering.
Once you’re done, you can graduate to ShaderToy (see below)!
http://thebookofshaders.com/
[RT/ART] ShaderToy is the best way to start tinkering with GPU programming. Made by Inigo Quilez and Pol Jeremias, masters of procedural 3d graphics, it quickly grew into a vibrant community of shader authors.
As for “the book of shaders” here shaders are directly used to generate procedural images, without 3d meshes (geometry). This is not how 3d real-time rendering usually works, but it is a great introduction to shader and GPU programming.
Not very beginner friendly per-se, but there are lots of good resources online:
https://gamedevelopment.tutsplus.com/tutorials/a-beginners-guide-to-coding-graphics-shaders--cms-23313
When you feel confident of the basics, Inigo’s website is a treasure trove of advanced procedural shader stuff! http://www.iquilezles.org/www/articles/raymarchingdf/raymarchingdf.htm
After ShaderToy, you might want later on to “graduate” to KodeLife, which allows to experiment with all kinds of shaders. https://hexler.net/software/kodelife
[OFF] SmallPT is a tiny program (99 lines of C++ code!) which generates photorealistic images. Another great way of getting started with offline rendering!
http://www.kevinbeason.com/smallpt/
In its “raw” form it’s not too easy to understand (but fun to tinker with), but on the homepage there is a slide deck by David Cline that does a great job at explaining each single line! Before “raytracing in one weekend” it was probably the best starting point to tinker with offline rendering.
https://drive.google.com/file/d/0B8g97JkuSSBwUENiWTJXeGtTOHFmSm51UC01YWtCZw/view
[OFF - mostly] Scratchapixel. Part beginner's textbook, part guide for practical exercises, Scratchapixel has some truly great content.
The downside of this website is that’s still work-in-progress, and certain chapters are not as good as others.
Focuses on offline rendering, but the theoretical basis are the same for real-time...
https://www.scratchapixel.com
[ART] 10 PRINT CHR$(205.5+RND(1));:GOTO 10. I haven’t read this book yet - so I can’t comment on it, but it looks interesting.
Best thing, there is a free version available online!
https://10print.org/
CToy - A fun, graphic-oriented, C99 live-coding framework. Not a project or tutorial per se, but it can be used to tinker with graphics “easily”
https://github.com/anael-seghezzi/CToy
Reading Material
[RT] GPU Architectures https://drive.google.com/file/d/12ahbqGXNfY3V-1Gj5cvne2AH4BFWZHGD/view and “a trip through the graphics pipeline” are a great read on how GPUs work https://fgiesen.wordpress.com/2011/07/09/a-trip-through-the-graphics-pipeline-2011-index/
[OFF] Pixar In a Box. A series of videos on Khan Academy illustrating various aspects of how Pixar makes movies. There is a section dedicated to rendering.
https://www.khanacademy.org/computing/pixar/rendering
Two minute papers. Explaining research papers simply. Both recent publications and some of the seminal works.
A lot of this is dedicated to computer graphics as the author is a researcher in the field. It won’t allow you, in most cases, to replicate results in practice, but it’s just nice to be exposed to the concepts.
The youtube channel also hosts the lectures for a offline graphics course: https://www.youtube.com/watch?v=pjc1QAI6zS0&list=PLujxSBD-JXgnGmsn7gEyN28P1DnRZG7qi
[RT] Real-Time Rendering. Probably the most well-known “encyclopedic” book for 3D real-time rendering.
It is theoretical, but not hard to read. It’s great both as a reference text and to read end-to-end.
It will not guide you through practical projects though, and it will not delve deeply into any subject, it’s meant to provide the necessary background to understand more advanced papers and presentations.
[RT, OFF] Graphics Codex. This is another great reference text, very well done. In contrast to Real-Time Rendering, this has an offline rendering slant, but lots of the underlying math and physics are relevant to real-time computer graphics as well.
The author keeps also a page of small projects and exercises on http://graphicscodex.com/projects/projects/
[OFF] Known as “PBRT”, this one is not about real-time rendering but offline path tracing.
Most of the theory applies to physically based shading in games as well, and the big perk of this book is that it’s written as “literate programming”, the book is itself the source-code of a raytracer.
It is not a quick read, but by the end of it you’ll have a nice photorealistic renderer!
[RT, OFF] Computer Graphics, Principles and Practice.
Another very notable “encyclopedic” book, tends to be a bit more theoretical than RTR, but it’s a great read...
Real-Time Collision Detection. This book, as the title implies