Introduction to Computer Graphics

Jump to Today

Introduction

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.

Prerequisites

CMPS101, MATH21 or AMS10. Concurrent enrollment in CMPS160L lab section is required.

This course is a 7-unit course with the lab. It involves significant programming, in 3 different languages: HTML 5%, javascript 80%, GLSL 15%. If you haven't had at least 4 courses already that involved programming, the instructors suggest you get some more experience before taking this course.That is, if you are fresh out of CMPS101, I suggest waiting (but I dont require it).

Staff

Professor: James Davis (davis@cs.ucsc.edu)

TA: Lucas Ferreira (lferreira@ucsc.edu)

Tutors: Alfredo Rivero, Jacob Schwartz, Alfred Lam

Office Hours

James Davis: E2-363, 3:15-5:00pm Tuesdays and Thursdays (or by appointment).

Lucas Ferreira: E2-586, 6:00-8:00pm Thursdays (or by appointment).

Textbooks

WebGL programming guide: interactive 3D graphics programming with WebGL
Kouichi Matsuda and Rodger Lea

The assignments follow the flow of this book closely, and I assume you are reading the chapters. You'll want a copy. 

Lecture

TuTh 01:30PM-03:05PM Soc Sci 1 110

Lecture Schedule

Lecture 1 (Apr 2): Introduction to Class (Slides)
Lecture 2 (Apr 4): Linear Algebra Review, Assignment 1 Intro. (Reading: Shirley - Fundamentals of Computer Graphics - Ch 2.4-2.4.4, Ch 5.2-5.2.2)
Lecture 3 (Apr 9): Quiz 1 - Linear Algebra
Lecture 4 (Apr 11): Object Modeling, triangles and meshes. (Slides)
Lecture 5 (Apr 16): Transformations. (Slides) (JavaGame)
Lecture 6 (Apr 18): Colors. (Slides)
Lecture 7 (Apr 23):  Texture Mapping. (Slides)
Lecture 8 (Apr 25): Sample Questions and Research Videos
Lecture 9 (Apr 30): Review Sample Questions Midterm
Lecture 10 (May 2): Midterm - Covers (Linear Algebra, Modeling, Transformations, Color Models, Textures)
Lecture 11 (May 7): Projection. (Slides)
Lecture 12 (May 9): Visibility. (Slides)
Lecture 13 (May 14): Shading/Lighting. (Slides)
Lecture 14 (May 16): STRIKE
Lecture 15 (May 21): Displays.  (Slides)
Lecture 16 (May 23): Sampling Theory (Slides)
Lecture 17 (May 28): Ray Tracing. (Slides)
Lecture 18 (May 30): About grad school / How to improve class
Lecture 19 (Jun 4): Sample Problems for Final
Lecture 20 (Jun 6): Demo Day
Lecture 21 (Jun 12): Final

Labs

Mondays, 10:00AM-11:45AM, Crown Clrm 203 (Jakob Schwartz)

Tuesdays, 06:00PM-07:00PM, MingOng Cmp Lb 103 (Everyone)

Tuesdays, 07:00PM-08:00PM, MingOng Cmp Lb 103 (Everyone)

Wednesdays, 2:00-4:00PM, Crown Mac Lab 201 (Alfred Lam)

Fridays, 1:00-3:00PM, Soc Sci I Mac Lab 135 (Alfredo Rivero)

Lab attendance is required, as important content regarding the more technical aspects of the assignments will be gone over during the lab sections. Each week there are two lab sections, which will cover identical material. You are free to attend whichever one you like, however, if the room is full, priority is given to those actually enrolled in that section.

Grading

Your grade for CMPS-160 is broken down as follows:

  • Linear Algebra Quiz: 10% 
  • 2 Exams (Midterm/Final): 30%
  • 5 Programming assignments: 40%
  • Final Project: 20%

Your grade for CMPS-160L is simply your grade for CMPS160. The grade breakdown is as follows:

A+ = 100-97%
A = 96-93%
A- = 92-90%
B+ = 89-87% 
B = 86-83% 
B- = 82-80%
C+ = 79-77%
C = 76-70%  
D = 69-60%  
F = 59-0%

Assignments

There will be 5 programming assignments in Javascript and WebGL due weekly on Monday at 11:59pm:

Assignment 1: Painting Geometric Shapes - Ch1, Ch2, Ch3 67-91
Assignment 2: Transforming Geometric Objects - Ch3 91-113, Ch4
Assignment 3: Texturing and Coloring Geometric Objects - Ch5
Assignment 4: Creating a Virtual World - Ch7
Assignment 5: Lightening the Virtual World - Ch6


Each assignment builds on top of the previous ones. In technical terms, you will generally need features from previous assignment to properly do the next assignment.

- Submissions

Assignments will be submitted on Canvas as zipped project folders containing all of the necessary HTML/Javascript/Shader code. 

- Late Policy

Assignments are always turned in weekly. That is, each week only one submission will be checked for each student. Late submissions of assignments will be penalized 20% off per week and will be accepted no more than 2 weeks late. Resubmissions are not allowed after the due date. No assignments will be accepted after the Friday before finals week.

Final Project

The final project is intended for you to create an expressive and interactive experience with all the concepts learned during the course. You can work individually or in groups of max 3 people.  The project is due on Jun 3rd and it will be submitted the same way as assignments, but only one copy per group.

Best Project

Thanut (Art) Parkeenvincha, Terence So
Animal Crossing

Audience Favorite

Ryan Santiago

Mantis

 

Projects that demo'd in class

Quiz and Exams

There will be one quiz, one Midterm exam and one Final exam to test your understanding of the material. In the week leading up to the quiz/exam, sample problems similar to the ones that will appear on the quiz/exam will be distributed. 

  1. Linear Algebra Quiz

     Reading: Shirley - Fundamentals of Computer Graphics - Ch 2.4-2.4.4, Ch 5.2-5.2.2

  2. Midterm

  3. Final

Make-Up Policy: If you miss an exam/quiz without informing us beforehand, you can make it up within the following week (no later), however, your grade on the make-up is cut in half (contact one of the TAs or the professor to organize). That is, if you get an 80/100 on the make-up, your actual score will be 40. If you know you will need to miss a quiz you need to get in touch at least 48 hours in advance to make arrangements.

 

Course Summary:

Date Details Due