This week, we'll move on to making the objects that we see in 3D worlds. We'll learn about how we group triangles into meshes and use texturing to give them more interesting colors.
This workbook is due Friday, April 5th, with no assignments accepted after Monday, April 8th.
By now, you probably have the basics of THREE down. But the "discover threejs tutorial" is a good way to review primitives, hierarchies and other basics. I didn't know about it before. Unfortunately, its one of a very few chapters of the book that has been written.
We'll discuss the basic concepts in class, which will be sufficient for what you need to know. Section 12.1 of Fundamentals of Computer Graphics FCG4_Ch12.pdf covers this, and then some. Sections 12, 12.1 and 12.2 cover the material for class. Section 12.1.3 covers strips and fans (which we will touch on in class, but won't use much). Section 12.1.4 discusses the fancy data structures used for representing meshes when they need to be manipulated - this is beyond what we will do in class - read this section to get a taste of a more advanced topic. Chapter 4 of The Big Fun Graphics Book (Hart04-jan19.pdf) covers much of the same material.
The THREE data structure we will use is the
Geometry which is documented here. This also links to the
Face3 class (documentation). These data structures are poorly documented, and there aren't many good examples. (Most examples use the
BufferGeometry class that we will learn about later). Use the examples in this workbook (read the documents and the code). The design isn't what you might guess, but once you understand what they've done it makes sense.
Texturing is a big topic. We'll cover the basic concepts now, and return to see a lot more of the details later. Again, everything you need will be discussed in class, read a book chapter to get more details or see it explained another way. Fundamentals of Computer Graphics Chapter 11 (FCG4_Ch11.pdf) covers texturing, describing it in a very general way. Section 11.1 gives the main ideas, and 11.2 gives many different types of texture - we'll focus on what's described in 12.2.2. Sections 11.2.4 (perspective correct interpolation) and 11.3 (pixel lookups) are topics we will come back to. The Big Fun Book of Computer Graphics also covers this material but focuses on parts that we aren't doing now.
The implementation of texturing we'll use is built into the various
Materials in THREE. The description of how a texture is stored is discussed with the
Texture class. We'll discuss the main ideas in class, and the examples in this workbook will help you out. There are many examples of using textures with THREE around the web, however, many of them use old versions of THREE. The new versions are much more convenient (especially the
TextureLoader). If you're looking for things to read, this Discover ThreeJS tutorial shows some of the basics, but goes off into tangents about details we probably won't care about (like color spaces and anisotropic filtering). This "ThreeJS Baby Steps" posting shows how you can do it all yourself - don't worry, you don't have to.
Pages 1 and 4 have sample code on them. You don't have to do anything with them, but you probably want to understand the simple examples.
Pages 2, 5, 6 and 7 all have exercises on them that require you to create new object types within the CS559 Framework code.
All of the exercises have the opportunity for bonus points for making objects that are more interesting than what is required. These are generally "artistic merit" bonus points. If you feel that your creations are worthy of bonus points, be sure to say so in your README.
You will score points for (with the page they are on):
That's .5 points for Page 2, 1 point for Page 5, 1.25 points for Page 6, and .75 points for page 7. You will be able to re-use your work on Pages 6 and 7 in future assignments.
Everything else is for bonus points.
Everything begins on page one.