Introduction to Computer Graphics

Jump to Today

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.

Lectures

TuTh 1:30-3:05pm 
https://ucsc.zoom.us/j/823133073

Webcast from W20 class:
U: cse-160-1-w20-1 P: cse160  https://webcast.ucsc.edu/

Recordings from S20 class:
Stored in Google Drive (needs @ucsc.edu login)

Labs

Labs will be Zoom calls for the TA to introduce the programming assignments and give opportunity for students to ask questions before they start coding.  All labs will be recorded, so you can watch it later if you missed it. 

Tu 5:00-7:00pm 
https://ucsc.zoom.us/j/763985120

FAQ

  • I need a permission code
    • I dont get these until week 2 or 3 of the qtr. Before the add deadline, but not in the first week. Just come to class.
  • I am on the waitlist. I wish I was on the waitlist.
    • CSE160L is required to CSE160, so CSE160L serves as the waitlist. It has always cleared. Come to class, do the first assignment, and then by week 3 we have space to get everyone in who wants it. In fact due to the online nature this term, I am 100% sure we can get everyone in, unlike a physical classroom.

(The rest of this webpage is copied from W20, and in the process of being edited. However I need students to be able to find that Zoom link above. There will be a correct syllabus by the first day of class)

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, Gigi Bachtel, Kody Fong, Oleksiy Omelchenko, Kevin Pinney

Office Hours

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. 

Youtube Channel

This is new this qtr, so I dont know exactly what will be here. There will be playlists for different topics. e.g. Assignment1 playlist has videos to walk you through the "lab" assignment.

https://www.youtube.com/channel/UCSynd9Z5RdIpKfvTCITV_8A/playlists

Schedule

Raw lecture recordings (unedited, needs a @ucsc.edu login)

  • Lecture 1 (Mar 31): Introduction to Class
  • Lecture 2 (Apr 2): Linear Algebra Review,  Intro to Shaders

Reading:

Due: Lab 0, HW1, Quiz 1 (Linear Algebra)

Reading:

  • Matsuda Ch 2, Ch03 (67-91). 

Due: Lab 1 - Paint Program

Reading:

  • Shirley Ch 6 p135-158 - Transformation Matrices.
  • Matsuda  Chap 3(91-113)

Due: HW 2, Quiz 2 (ObjectModeling, Transforms)
  • Lecture 7 (Apr 21):  Colors.
  • Lecture 8 (): Discuss quiz2, Non-triangle Modeling mini-lecture. Example research video.

Reading:

  • Matsuda/Lea  Ch 4

Due Lab 2 - Blocky Animal
  • Lecture 9 (Apr 28): Blocky Animal Contest! Texture Mapping.
  • Lecture 10 (): Live: Finish Texture Mapping. Online:Watch the Youtube for Asg3

Reading:

  • Shirley - Ch 3.3 p54-56 - RGB Color
  • Matsuda - Chap 5   

Due HW 3, Quiz 3 (Color, Texture)
  • Lecture 11 (May 5): Projection.
  • Lecture 12 (): Visibility.

Reading:

  • Matsuda Ch7 (About cameras and keyboard events
  • (optional: pg 276-289 about drawElements())

Due: Lab 3 - Blocky World
  • Lecture 13 (May 12): Shading/Lighting.
  • Lecture 14 (): No class. Online: Watch YouTube A4.

Reading:

  • Shirley - Ch 9 p191-200 (Shading), Ch 7 p 159-174 (Viewing)
  • Matsuda Ch8

Due: HW 4, Quiz 4 (Viewing, Projection, Lighting)
  • Lecture 15 (May 19): Displays. 
  • Lecture 16: Sampling Theory

Reading:

  • (Chp 6 and Appendix B are GLSL reference)

Due: Lab 4 - Lighting

Reading: (None)

Due: Quiz 5 (Cumulative)
  • Lecture 19 (Jun 2): No class. Take Q5.
  • Lecture 20 (): Demo Day 
 Due:  Lab assignment 5 - Group project - make something cool (art, game, etc)

Grading

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

  • Exams (Quizzes): 40%
  • Programming assignments: 45%
  • Participation/Attendance: 5%
  • Written HW: 10%

Your grade for CMPS-160L is simply your grade for CMPS160. There is no curving, and no rounding up. 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 5 programming assignments in Javascript and WebGL due on Mondays at 11:59pm:

  • 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

- Submissions

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

- Late Policy

Late submissions of assignments will be penalized 20% off per week and will be accepted no more than 2 weeks late.  No assignments will be accepted after the Friday before finals week.

Participation/Attendance

Attendance in the Zoom class is "required" There will be Google Polls referenced in class lectures. These will be used for participation points. 

If you know you will need to watch recordings later, drop me an email to let me know thats your plan at the start of the quarter.

If necessary to encourage participation, I'll make up something else as we go. 

Written HW

You'll need to do some sample problems related to the quizzes and coding assignments. And you'll need to write down a quick outline of what is in the readings you were supposed to do. These are graded on a participation basis. They are meant to make you look at the readings and sample problems. Actually testing your knowledge is in the quizzes and code assignments. 

Exams

There will be four quizzes (perhaps 5), to test your understanding of the material. Prior to the quiz/exam, sample problems similar to the ones that will appear on the quiz/exam will be distributed. The quizzes themselves are multiple choice and administered in Canvas. 

The first quiz comes almost immediately, and is a review of your knowledge of basic linear algebra.

  1. Linear Algebra Quiz - Reading: Shirley - Fundamentals of Computer Graphics - Ch 2.4-2.4.4, Ch 5.2-5.2.2

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.

Contest/Demo Day

The last day of class will be a contest / demo day. You have 10 days after your last individual assignment to form a team and do something interesting with your skills. You are of course welcome to form teams earlier in the qtr, and spend the whole qtr making something awesome. We'll vote on the best creation. 

Course Summary:

Date Details Due