CMSI 3710
Computer Graphics
Spring 2023
- Note
- This page is maintained as an archival record of the course shown above, and as such, some links on this page may no longer be valid nor accessible. They are kept here as a record of the resources that were available at the time of the course offering.
- Brightspace: Where you can access private content and check your grades
- We will use GitHub Classroom to manage and submit assignments
-
Every now and then we may use
Socrative
to ask or answer questions as a class—my Socrative room is
DONDILMU - We continue to live in very fluid and dynamic circumstances—make sure to follow the university’s pandemic portal for the latest news, updates, and policies—to which this class must, of course, adhere
Assignments
-
Assignment 0208
Fun with their 3D library
Setup
- Their library is three.js
- Acquire your own React-wrapped three.js playground for personal experimentation and exploration
-
Assignment 0222
Pixel-level primitives and filters
Setup
- Color Science from Khan Academy’s Pixar in a Box: Pay particular attention to the RGB color model module and its accompanying practice exercise
- Color practice: What the Hex
-
Assignment 0329a
Static scene based on our polygon mesh library
- Need some inspiration? Check out some of Ed Catmull and Fred Parke’s early work from the University of Utah, 1972 (h/t Megan Reyes!)
- The bare-bones WebGL starter code is available as a separate “assignment” repository for individual experimentation and exploration, just like the three.js playground from earlier
- Assignment 0329b Our own matrix library
- Assignment 0412 extended to 0419 Our lights, our camera…
- Assignment 0503 …Your action!
Course Content
-
The
three.js manual: A thorough walkthrough of three.js (and general 3D graphics) concepts,
with code you can run live. Here are some highlights:
- Starting lesson
-
“Responsive design”—but really about how the camera’s aspect ratio, viewport dimensions,
and web
canvasdimensions interact - (3D, not pixel-level) Primitives—a.k.a. Geometries
- Scenegraph—a.k.a. Scenes, the top-level three.js data structure
- Materials
- Textures
- Lights
- Cameras
-
Readings on easing and tweening
- Robert Penner’s book chapter Motion, Tweening, and Easing
- Gilmore Davidson’s presentation Ease Yourself into Animation
- 3D Object Modeling
- Graphics = Light = Color = Memory
- Hello GL!
- The Math of Space
- Transforms: More Than Meets the Eye
- Projection
- Look At
- Modeling Light
- Clipping, Hidden Surface Removal