\( \def\sc#1{\dosc#1\csod} \def\dosc#1#2\csod{{\rm #1{\small #2}}} \newcommand{\dee}{\mathrm{d}} \newcommand{\Dee}{\mathrm{D}} \newcommand{\In}{\mathrm{in}} \newcommand{\Out}{\mathrm{out}} \newcommand{\pdf}{\mathrm{pdf}} \newcommand{\Cov}{\mathrm{Cov}} \newcommand{\Var}{\mathrm{Var}} \newcommand{\ve}[1]{\mathbf{#1}} \newcommand{\mrm}[1]{\mathrm{#1}} \newcommand{\ves}[1]{\boldsymbol{#1}} \newcommand{\etal}{{et~al.}} \newcommand{\sphere}{\mathbb{S}^2} \newcommand{\modeint}{\mathcal{M}} \newcommand{\azimint}{\mathcal{N}} \newcommand{\ra}{\rightarrow} \newcommand{\mcal}[1]{\mathcal{#1}} \newcommand{\X}{\mathcal{X}} \newcommand{\Y}{\mathcal{Y}} \newcommand{\Z}{\mathcal{Z}} \newcommand{\x}{\mathbf{x}} \newcommand{\y}{\mathbf{y}} \newcommand{\z}{\mathbf{z}} \newcommand{\tr}{\mathrm{tr}} \newcommand{\sgn}{\mathrm{sgn}} \newcommand{\diag}{\mathrm{diag}} \newcommand{\Real}{\mathbb{R}} \newcommand{\sseq}{\subseteq} \newcommand{\ov}[1]{\overline{#1}} \DeclareMathOperator*{\argmax}{arg\,max} \DeclareMathOperator*{\argmin}{arg\,min} \)

1   Introduction


Computer graphics is the body of knowledge on how to use computers to create visual media. These include images, videos, and computer applications that show such media to users. By this definition, you already benefit from computer graphics technology when you read an email from your computer's monitor or play a video game on your mobile phone. It thus goes without saying that computer graphics is a very importance piece of technology that shapes our modern lives.

This book focuses on a part of computer graphics called 3D computer graphics (3DCG). Its goal is to create images that look three-dimensional. In general, the process is pretty much like photography. We use a computer to create virtual 3D objects that only live in computers and combine them to form a virtual scene. We then use the computer as a virtual camera to take pictures of the scene to create our images. To do so, we must be able to solve three fundamental problems.

  1. Modeling. A model is a piece of computer data is that used to represent something else. Because our goal is to generate images of 3D objects, we must create models for their shapes (are they round or rectangular?) and appearances (what color do they have?). The modeling problem deals with how to use data to represent such properties.

  2. Rendering. Once we have models of all the objects we are interested in, our next step is to create images from them. The rendering problem deals specially with this process. To solve it, we need to figure out exactly what our virtual camera is and how it would take pictures of our models.

  3. Animation. In many cases, we might want to create moving images. The animation problem deals with how to specify movement of virtual 3D objects through time so that we can take multiple pictures to create a movie.

1.1   Applications of 3D computer graphics

The rewards of being able to solve the above problems are tremendous.

1.2   An overview of the book's content

I hope that I have convinced you that 3D computer graphics is a discipline that has many interesting applications and, therefore, is worthy of study in itself. Nevertheless, 3DCG's body of knowledge is vast, and it is impossible to cover it all in one book. I thus want to discuss the types of 3DCG knowledge the rest of this book will try to impart.

The book has two overarching goals:

  1. To give the reader enough programming knowledge so that the reader can write simple interactive computer graphics applications on their own.

  2. To give the reader enough theoretical knowledge on computer graphics to understand the programs they write.

A more concrete version of the first goal is to teach the reader so that they can write computer programs that can display 3D character models in real-time. I think the ability to do so is exciting because it is fundamental to creating 3D games and other interactive applications. Through further study and practice, the reader might be able to create games on their own and have a lot of fun while doing it.

Of course, I choose what to cover based on whether it serves the goals or not.

1.2.1   Content on computer graphics

I will only cover particular solutions to the three fundamental problems of 3DCG that directly serve the goals and not others.

1.2.2   Content on programming

To write a program means to commit to a programming language and also a set of libraries. For the programming language, I choose Javascript because (1) it can be used to create real-time computer graphics applications, and (2) it is available without having to do any installation on any computers that can run modern web browsers such as Chrome, Firefox, and Edge. Note, however, that this book is not about Javascript programming, so I assume that the reader would already have some experience with web programming.

As mentioned earlier, we will use the graphics pipeline, running it on a GPU, to do real-time computer graphics. However, because implementing the algorithm on a GPU can be very complicated, we will rely on a well-known graphics pipeline library called WebGL 2.0 instead. According to icanuse.com, WebGL 2.0 is available to at least 92.54% of web users. The reader should be able to run examples programs as long as their computer has a GPU, and they use an up-to-date web browser. I assume that the reader has had no experience with WebGL, and, there are chapters (7? to 11?, 15? to 17?, 19? to 21?, and 24?) that cover how to use WebGL commands in details.

All knowledge on computer graphics and programming would come together and culminate in Chapter 31?, where I will discuss a program that displays animatable character models.

1.2.3   Content on Mathematics

3DCG makes heavy uses of mathematics, and one must understand the relavent mathematics to understand the programs that one writes.

1.2.4   What this book will not cover

If you are a beginner in 3DCG, the topics mentioned in the last couple of sections might just be meaningless word soups to you. My hope is, of course, that you would read the book and become more familiar with them. However, as you read the book, please keep in mind that the topics were chosen because they are necessary to understand real-time computer graphics programs for character animation. They are only a small part of all the 3DCG knowledge. There are ways to model shapes other than triangle meshes. There are rendering algorithms other than the graphics pipeline. There are ways to animating things other than the one covered in this book. In Chapter 32?, I will discuss in more details what this book does not cover and suggest resources for further study.

Now that the content of the book has been outlined, let us start our study of 3D computer graphics. The first thing to understand is images, the output of all computer graphics systems, and it is the subject of the next chapter.


  1. Battlezone, released in 1980, was the first commercially successful 3D video game according to this TechRadar article.


Contents >>