Syllabus for Introduction to Computer Graphics
Course Syllabus
Spring 2025 Class
In this course, students will be introduced to the basics of computer graphics, including how to define objects with vertices and meshes, how to write basic shaders, lighting and shading, projections, transformations in 3D, and texture mapping. Assignments will be done using Javascript. and WebGL and will build on each other.
Learning Outcomes
Primary goals
G1: You can create a web page with 3D computer graphics content using WebGL
G2: You understand the underlying mathematics and programming for graphics
Secondary goals
G3: You can transfer your knowledge to use an alternate graphics library that wasn't the specific one we studied, to quickly recreate the quarter's work (we will use three.js).
G4: You increase your skill working with large software systems with lots of lines of code and libraries that are too big to fully understand. (Lots of upper-division classes contribute to this goal, but the practice is intentionally part of this class).
G5: You increase your skills at learning new coding concepts when all the precise details are not given. (Your job will require you to learn new languages and libraries as you go. This class scaffolds that learning, but also asks you to practice reading the manual for the details)
Prerequisites
CSE101, MATH21 or AMS10.
This course is a 7-unit course with the lab (It used to be 5+2 with the lab in a separate course number). It involves significant programming, in 3 different languages: HTML 5%, javascript. 80%, GLSL 15%. Learning to program takes more than we explicitly teach in the prerequisites, it takes practice. If you haven't had at least 4 courses already that involved programming (CSE 20, 30, 101, and one other upper-division course) the instructors suggest you get some more experience before taking this course. That is, if you are fresh out of CSE101, I suggest waiting if your schedule will allow it (but I don't require it).
Grading
Your grade for CSE160 is broken down as follows:
Programming assignments: 40%
Lab Section programming activities: 7.5%
Participation/Attendance: 5%
Written HW: 7.5%
Exams (Quizzes): 40%
There is no curving, and no rounding up. You can check your grade at any time in Canvas.
The grade breakdown is as follows:
A+ = 100-97.00%
A = 96.99-93%
A- = 92.99-90%
B+ = 89.99-87%
B = 86.99-83%
B- = 82.99-80%
C+ = 79.99-77%
C = 76.99-70%
D = 69.99-60%
F = 59.99-0%
Programming Assignments
There will be 6 programming assignments in Javascript. and WebGL due on Sundays at 11:59pm. These are meant to ensure the learning outcome "G1: You can create a web page with 3D computer graphics content using WebGL". Programming assignments have clear rubrics, and your grade should never be a surprise to you.
Assignment 0: Vector Library - Ch1, Ch2 9-16
Assignment 1: Paint Program - Ch2, Ch3 67-91
Assignment 2: Block 3D Animal - Ch3 91-113, Ch4
Assignment 3: Virtual World - Ch5, Ch 7
Assignment 4: Lighting and GLSL Shaders - Ch6, Ch8
Assignment 5: Exploring a High-Level Graphics Library
- Submissions
Assignments will be submitted on Canvas as zipped project folders containing all of the necessary HTML/Javascript/Shader code. Assignments are also submitted with a link to a live working web page. Both are necessary.