Due: October 7
Synopsis:
This week, we’ll begin to learn how to program the graphics hardware so we can draw quickly. You need to read 2 things – one about shader programming, and one about “GL” programming.
Evaluation: Check/No Check (based on passing the Quiz). The Quiz will be a little different this time. Rather than multiple choice, it will be short answer questions – less as a test and more to make you think. You’ll pass with any reasonable answer (that convinces the grader that you’ve read). No evaluation this week – you’ll know you understand it when you use the content for your programs
Handin: Quiz on Canvas No Quiz for this week.
Description
We’ve learned about how the graphics hardware works in class. Now we need to learn how to program it and use it efficiently.
At one level, this means learning about a specific graphics library (and shading language) that we can use. At another level, this is about learning what the programmatic interfaces are really like and why they work the way they do.
Unfortunately, the readings tend to focus on the specific graphics library / shading language. Which is OK: this will help you write programs, and writing programs will help you really learn the concepts.
The graphics library we will learn about is “GL”. There are a few variants: OpenGL (which is the main one) is probably the most common. The one we will use is “WebGL” which is a version of OpenGL – the difference being it is adapted to JavaScript, and some of the features are removed so it can be made to work in web browsers and on phones. The concepts are the same, the syntax of the language might be a little different.
You need to read about 2 different things:
- About how GL works in general – enough that you can see a how a whole program gets put together.
- About the shading language – so you know how to write shaders.
It is challenging to pick readings for this. There are lots of tutorials out on the web. Many of them are good technically, but not pedagogically (they show examples without really explaining well). Others start out too complex.
Some web ones I recommend:
- LearningWebGL.org – pretty comprehensive, definitely in the “work through examples” style
- The Book Of Shaders – focuses on fragment shaders, shows lots of things you can do with it (some of which you can use other things for)
- Official Mozilla Tutorial
- I didn’t write a WebGL tutorial, but I did start to write one by making the minimum programs. You can see those (and some outdated links) here.
These are useful once you get started:
- Best Practices from Mozilla (useful tips)
- Handy reference card
If you find any others that are particularly good, let us know (post on Piazza!)
Required Readings
Two choices:
- Look at the tutorials, get the basic ideas, then skim through a WebGL chapter and a Shaders chapter to get more details. (you don’t need the esoteric details from the shaders chapter – just get the basic ideas and a sense of what is there when you need to go back and look again).
- Read a “opengl basics” chapter and a “glsl shading” chapter. Then you might want to look at a tutorial (or some real code) to make sure you got something from it.
The “standard” (required) readings are from the book “The WebGL Programming Guide”.
A bit of warning on this book: the old OpenGL programming guide (a.k.a. the red book) was the go-to resource for learning graphics. (see my discussion). The new version is hard to learn from (although, it does discuss “modern” OpenGL). I was assuming the “WebGL Programming Guide” would be like the red book. It’s not. It’s a not-so-great tutorial/textbook. But I haven’t found anything better yet.
- For GL Basics: Chapter 2 of “The WebGL Programmer’s Guide” (link) – this chapter has a bit too much about JavaScript programming and dealing with Canvas and the web browser. But that can be review. You might also want to read Chapter 1 (link) which will give you a historical sense, and Chapter 3 (which will talk about how we send triangles to WebGL) (link).
- For Shaders: Chapter 6 of “The WebGL Programmer’s Guide” (link)
We were going to require/recommend reading from the OpenGL Programmers Guide (the new red book), but the new version (that talks about “modern” GL) is hard to read, spends too much time on details that aren’t relevant to us right now, and has code examples that are overly complex (since they use the C OpenGL API which make everything hard). If you want to look at this, we’ll make the chapters available to you. The first two chapters (which parallel the readings above) aren’t so bad… they just have C examples (Chapter 1 – Overview (link), Chapter 2 – Shaders (link)). They have a bit more detail than the WebGL book.
