CPSC 424:
Computer GraphicsDepartment of Mathematics and Computer Science Hobart and William Smith Colleges Spring, 2012. Instructor: David J. Eck. Monday, Wednesday, Friday, 12:20 -- 1:15, Lansing 301 Lab: Thursday, 11:55 -- 1:30, Lansing 310
About This Course
Computer graphics is simply the art and science of producing and manipulating images on a computer. It is one of the most visible and exciting aspects of computer science. And unlike some fields of computer science, it has a rigorous foundation in theory and mathematics (some of which will be covered in the course).
As our programming platform for the course, we will use WebGL, an emerging technology that makes it possible to show hardware-accelerated three-dimensional graphics in a web browser. WebGL has just recently arrived at version 1.0, but it is still somewhat experimental. It is implemented in many modern browsers, including Chrome, Firefox, and Safari. (Note that to use WebGL in Safari, you have to enable it in the Developer menu.) Even in these browsers, it requires a compatible graphics card and driver. I am using WebGL partly because it is part of the emerging web platform that is usually referred to (not really correctly) as HTML 5. It seems to me that this will be one of the most important platforms for content delivery in the future.
WebGL is a version of OpenGL, a standard and widely supported low-level graphics API. In particular, it is based on OpenGL ES 2.0, a version of OpenGL designed to be small enough to run on small embedded systems such as smartphones. Using a stripped-down OpenGL has advantages and disadvantages. The main disadvantage is that it becomes harder to do certain things. But making it harder also forces you to do things right, that is, in the way that will maximize performance.
WebGL uses JavaScript as its main programming language. If you are not familiar with JavaScript, you will learn the basics as we work though examples in the first few weeks of the course. If necessary, we might have some extra evening sessions on JavaScript. In addition to JavaScript, WebGL uses the OpenGL Shader Language, GLSL, a language similar to C that is used to program certain parts of the graphics processing pipeline. We will cover GLSL as we need it.
There is no textbook for this course. In fact, there is currently no book on WebGL that I know about. There will be readings from the web, and I plan to post examples and lecture notes on-line.
Labs
We will meet for lab in the Math/CS computer lab, Lansing 310, every Thursday. Most of the labs will be about programming WebGL, but the very first lab will be on the GNU Image Processing program, Gimp, and there will be a series of three labs on the 3D modeling and animation program, Blender. Each lab will include an assignment of some sort that will be due one or two weeks after the lab. For some labs, you might be able to work with a partner. The labs and assignments will count for 28% of your grade for the course.
Web Portfolio
You are required to make a "web portfolio" of the work that you do for this course. To make your web portfolio, you need a directory named cs424 inside the www directory in your Linux account. The cs424 folder should contain a file named index.html that is the main page for your portfolio. All of your work should be accessible, directly or indirectly, through links on that page.
There is no required format for the web portfolio, except that it should be as complete as possible and should include some textual description of your work and how you did it. If you want some help getting started, you can copy the folder /classes/cs424/webstart into your www directory and rename the copy cs424. If you do this, you will add links to your work to the file named left.html. You will edit the file welcome.html to provide an introduction and overview of the site. And you will want to replace logo.jpg, the image that appears at the top of welcome.html, with your own image -- possibly the logo that you will create in Lab 1. The starter folder includes placeholders for your work for Lab 1 and Lab 2.
A lot of your work will be submitted by posting it to your web portfolio, and I will access it there for grading. In addition, 5% of your grade for the course will be based on an overall evaluation of your web portfolio at the end of the semester. Your web portfolio should be in final form and ready for grading by Sunday, May 6.
Graphics Research Report
Computer graphics is a huge field, and we will really only scratch the surface. To bring a few more topics into the course, each student will do some research and present a report on some aspect of computer graphics. You will select a topic, in consultation with me, by Tuesday, February 14, and the report is due on Friday, March 9. The report will be in HTML format and will be posted as part of your web portfolio. It should include a carefully written, well-organized essay, with bibliographic references for any material that you use. If appropriate, it can include some programming examples. Each student will also do a short presentation in class about his report. The report will count for 6% of your grade for the course.
The report is not meant to be very long or terribly original. However, you will have to spend some time learning about your topic and organizing a report about it. Your report should include links to additional material on the web.
Every student in the class must select a different topic. At least two and no more than three reports should be on higher-level frameworks for 3D graphics on the web. Possibilities along that line include: GLGE (www.glge.org), Three.js (github.com/mrdoob/three.js/), o3d (code.google.com/p/o3d), X3DOM (x3dom.org), and j3d (github.com/drojdjou/j3d). See www.khronos.org/webgl/wiki/User_Contributions for a longer list of resources.
Other possible topics include: Ray-tracing in general; Using the Pov-Ray ray-tracing program; SVG, the XML vector graphics file format; 3D graphics file formats in general; Binary Space Partition (BSP) Trees; Techniques for handling shadows; Color spaces; Blender character animation; Blender physics engine; Physics engines in general; Motion capture; AI techniques for computer graphics. You are not limited to choosing topics from this list.
Blender Project
WebGL is a low-level graphics API, and we will spend a lot of time on low-level programming. This is important for understanding computer graphics, but what we will be able to do on this level might be a little disappointing compared to the graphics that you see in games and movies. To make up for that to some extent, you will be doing some work with Blender, a very capable 3D modeling and animation program. Blender will be introduced in a series of three labs. You will then design and create a 3D animation using Blender. This Blender project is due on Friday, April 13 and will count for 8% of your grade for the course. I will show some examples in class of work that people have done with Blender in previous versions of this course. (When working on this project and evaluating your results, you should keep in mind that many, many hours of work can go into producing a few seconds of action in a game program or movie. You are not going to produce anything on that level.)
Final Programming Project
You will design and program a final project for the course, which will be due at the scheduled final exam period on May 6 and will count for 13% of your grade for the course. The project must be based on WebGL. It can, optionally, be based on a higher-level framework such as three.js or GLGE. The project must include a substantial amount of original code, but it can use some code from other sources, provided the sources are clearly identified. If the project is sufficiently ambitious, you can work with a partner -- or possibly even on a team of three people.
You should try to think up a project on your own. If you can't come up with anything, you can work on a 3D graph viewer. You should discuss your ideas with me and select a project by April 3.
Tests
There will be two in-class tests, which will be given on Wednesday, February 29 and on Monday, April 23.
There is no final exam. The scheduled final exam period for this course is Sunday, May 6, from 8:30 to 11:30. We will use part of this period, starting at 10:00, for a final class meeting in which students will present their final programming projects and exhibit their web portfolios. (Possibly, we will go out to lunch after that.)
Grading
Your numerical grade for the course will be computed as follows:
First Test: 20% Second Test: 20% Labs: 28% Research Report: 6% Blender Project: 8% Programming Project: 13% Web Portfolio: 5%I reserve the right to adjust your grade downwards if you miss more than one or two classes or labs without a good excuse.
Attendance Policy
Don't miss class.
Office Hours, E-mail, and Web
My office is room 313 in Lansing Hall. My office phone extension is 3398. I am on campus most days, and you are welcome to come in anytime you can find me there. I will announce regular office hours and post them on the course web page as soon as I know what my schedule will be.
Office hours are times when I promise to try my best to be in my office. I do not generally make appointments during my office hours, since they are times when I am available to students on a first-come, first-served basis. When necessary, I am happy to make appointments for meetings outside my scheduled office hours.
My e-mail address is eck@hws.edu. E-mail is good way to communicate with me, since I usually answer messages within a day of the time I receive them.
The Web page for this course is http://math.hws.edu/eck/cs424/index_s12.html.
Tentative Schedule
Here is a very tentative weekly schedule of topics and labs for the course. It will give you an idea of what we will cover, but -- aside from the dates for the tests and due dates for projects -- you shouldn't take the exact sequencing and timing too seriously. What we will do after Spring Break is especially up in the air.
Dates Topics to be covered Lab Jan. 18, 20 Introduction to Computer Graphics and WebGL GIMP Jan. 23, 25, 27 2D Graphics: Shaders and primitives Drawing in WebGL Jan. 30; Feb. 1, 3 2D Graphics: Transforms, Hierarchical Graphics Transforms Feb. 6, 8, 10 2D Graphics: Textures and Samplers Textures and
Point SpritesFeb. 13, 15, 17 Introduction to 3D Graphics;
Select topic for research report by Feb. 14Blender, Part 1 Feb. 20, 22, 24 3D with simple lighting and viewing A 3D Model Viewer Feb 27, 29; Mar. 2 Lighting and Materials;
Test on Wednesday, February 29Blender, Part 2 Mar. 5, 7, 9 More Lighting, Materials, and Textures;
Research report due on Friday, March 9Light, Material,
Image TexturesMar. 11, 14, 16 3D Transforms and Hierarchical Graphics Blender, Part 3 SPRING BREAK Mar. 26, 28, 30 Viewing and Projection; Environment Mapping Working with
Cameras in WebGLApr. 2, 4, 6 Scene graphs and higher-level frameworks;
Select programming project by April 3Creating a
Scene-graph APIApr. 9, 11, 13 Techniques such as Render-to-texture, Picking;
Blender project due, Friday, April 13Render-to-texture Apr. 16, 18, 20 Techniques such as Shadows, Transparency Shadow Mapping Apr. 23, 25, 27 Techniques such as Raytracing, Radiosity;
Test on Monday, April 23Work on projects
(or Pov-Ray?)April 30 END OF TERM: Wrap-up and review (no lab) Final meeting; programming projects and web portfolios due.
Sunday, May 6, 10:30. -- 11:30 AM