Home Schedule Grading Policy Academic Policy

COMP 193 Ray Tracing with WebGPU (3 Credits)

a.k.a. Computer Graphics Wizard Academy

Computer Graphics (CG) techniques produce visual content, such as images, movies, animations, and augmented visuals, from digital models (e.g., JPEG, OBJ, PLY). In short, CG is the study of computational methods for generating images by manipulating visual and geometric information.

This course takes a top-down approach using WebGPU to introduce you to the core computational techniques, mathematical foundations, principles, and practical skills of computer graphics. It is a programming oriented course, and you are expected to actively participate in class activities and complete programming assignments to master the basics of CG.

Note that this course focuses on implementing and learning CG techniques directly using WebGPU. It does not use any game engine. If you are primarily interested in learning a game engine such as Unreal Engine, Unity 3D, or Godot, this may not be the right course for you. However, you will learn how certain game-engine features work, and after completing this course, you should be able to implement your own computer-graphics techniques or even build the foundations of a simple game engine.

In the first ten weeks, we will cover topics including (but not limited to) primitives, buffer objects, the WebGPU Shading Language (WGSL), rasterization, model transformations, shading and lighting models, texture mapping, scene graphs, and user interaction. During the last four weeks of the semester, you will choose a specialization track and work on a final project to deepen and demonstrate the skills you have acquired. This semester's tracks include: 1) Geometry Processing, 2) Animation, 3) Rendering, 4) Interactive Graphics, 5) Game Development, and 6) Visual Effects.

Prerequisites: COMP 053 or equivalent or instructor's approval

Recommended: MATH 075 or equivalent

Instructor: Dr. SingChun Lee

Office Hours: Walk-in (TBD) or by appointment

Meetings: Mondays, Wednesdays, 09:30-10:50am at Weber Hall 103

Help Section: TBD

Expected Course Workload: 7-9 non-class hours per week

Discussion Platform: Piazza

Recommended Textbook (not required): The WebGPU Sourcebook, Matthew Scarpino, CRC Press, ISBN-13 978-1032726670

Recommended Textbook (not required): Introduction to Computer Graphics and Ray-Tracing Using the WebGPU API, Benjamin Kenwright, SIGGRAPH Asia 2022 Course Notes

Tentative Schedule and Course Materials (You'll need Google Login to access the materials.) Quest demos can be found here.

Week # Mons Weds TBD Weekly Quests
01 Scroll 1 (pdf) Scroll 2 (pdf)
Help 1 (pdf)
Git & GitHub Foundamentals
A 2D Static Scene (pdf, starter)
Sample Trial Questions
02 MLK Day Scroll 3 (pdf)
Help 2 (pdf)
An Animated 2D Scene (pdf, starter)
Sample Trial Questions
03 Scroll 4 (pdf)
Scroll 5 (pdf)
Help 3 (pdf)
An Interactive 2D Scene (pdf, starter)
Sample Trial Questions
04 Scroll 6 (pdf)
Scroll 7 (pdf)
Help 4 (pdf)
A 2D Particle-based Simulation (pdf, starter)
Sample Trial Questions
05 Scroll 8 (pdf)
Scroll 9 (pdf)
Help 5 (pdf)
A 2D Deformation Simulation (pdf, starter)
Sample Trial Questions
06 President's Day SIGCSE 2026 Travel
Scroll 10 (pdf)
A 3D Object Scene (pdf, starter)
Sample Trial Questions
06~07 Proficiency Trial (2D)
07 Scroll 11 (pdf)
Scroll 12 (pdf)
Help 6 (pdf)
A 3D Volume Rendering Scene (pdf, starter)
Sample Trial Questions
08 Scroll 13 (pdf)
Scroll 14 (pdf)
Help 7 (pdf)
A 3D Ray Tracing Scene (Shading and Texture) (pdf, starter)
Sample Trial Questions
-- Spring Break
09 Scroll 15 (pdf)
Scroll 16 (pdf)
Help 8 (pdf)
A 3D Ray Tracing Scene (Shadow and Transparency) (pdf, starter)
Sample Trial Questions
10 Scroll 17 (pdf)
Scroll 18 (pdf)
Help 9 (pdf)
An Interactive 3D Scene (pdf, starter)
Sample Trial Questions
10~11 Proficiency Trial (3D)
11 The Grand Enchantment (pdf): Drafting Your Masterpiece in Computer Graphics
12 The Grand Enchantment: Crafting Your Masterpiece in Computer Graphics
13 The Grand Enchantment: Refining Your Masterpiece in Computer Graphics
14 The Grand Enchantment: Perfecting Your Masterpiece in Computer Graphics
15 Archmage's Challenge

Course Outcomes: This course contributes to the following ABET outcomes. Students will be able to
  1. explain and use fundamental CG techniques. (EAC 1, 6) (CAC 1)
  2. design, implement, and evaluate CG programs. (EAC 1, 6) (CAC 2)
  3. work effectively in a project team. (EAC 5) (CAC 5)
  4. apply CG techniques toward the design, implementation, and delivery of a final product of their choices. (EAC 1, 2, 4, 7) (CAC 1, 2, 4)
  5. orally present and demonstrate their final project. (EAC 3) (CAC 3)

Grading Policy: At the end of the semester, your letter grade will be determined by the weighted average of the assignments and projects, according to the typical scale: 93-100 A, 90-92 A-, 87-89 B+, 83- 86 B, 80-82 B-, 77-79 C+, 73-76 C, 70-72 C-, 60-69 D, 0-59 F. The weighted average is computed as below:

Item Weight
Scrolls 20%
Quests 30%
Proficiency Trials 20%
The Grand Enchantment 30%

Scrolls, a.k.a. In-class Activities/Worksheets (20%): I will create a class post on Piazza at the beginning of each class. On Piazza, you can ask and answer questions anonymously while allowing me to monitor your learning progress and provide immediate feedback. You are expected to actively participate in the in-class scroll activities by asking and answering questions on the Piazza post and by writing an exit ticket. To earn a scroll point, you need to participate and demonstrate engagement during class. To do this, you should attend class, respond to polls, answer questions (from me or your classmates) on Piazza, and submit a reflective or follow-up exit ticket that tells me what you learned, what you want to learn more about, or what could be improved in class that day. If you genuinely reflect on the class activities, you should have no difficulty earning points. This is a subjective assessment; your goal is to convince me that you practiced the scroll together with me during class. We will have 18 scrolls in the first ten weeks where you can earn points. You will need 15 points to receive full credit for this grading category. If you actively participate, you should have no trouble earning a full score. Please contact me if you experience an emergency that significantly affects your participation.

Quests, a.k.a. Your GitHub Page (30%): In the first class, you will create your own GitHub page for this course. You will update it throughout the semester to show that you have completed quests. Your GitHub page is a public portfolio showcasing your implementations of the computer graphics techniques and features you have learned. Each technique/feature is worth 1 point. To receive full credit, you must complete at least 60 of them. Refer to the weekly quests for more details. Each weekly quest is due the following Monday at 9 a.m. Completing the quest on time earns full points. Late completion is allowed with a 50% focus reduction—that is, each late feature is worth 0.5 points. Each quest has a maximum possible point value. However, you may exceed this maximum by completing additional features. Let n be the number of extra features you completed in a given quest. The extra points e you earn are: e=k+n+1-2k2k if 2kn+12k+1k=012, ...

Proficiency Trials (20%): There are two short-question proficiency trials (see the schedule above for dates). Each trial contains 20 short questions covering the content from the first ten weeks. The first trial focuses on 2D graphics, and the second on 3D graphics. The trials emphasize conceptual understanding—you will not need to write code or perform calculations. You are expected to recall and understand the computer graphics concepts you have learned. Sample trial questions will be provided to help you become familiar with the format.

The Grand Enchantment (30%): Toward the end of the semester, you will form a team of three or four to create a Masterpiece on a computer graphics topic chosen from the provided list or one your team proposes. Solo projects are permitted, but collaboration is strongly encouraged. You will implement your chosen topic using WebGPU, and you are welcome to reuse any code you developed for quests. For some topics, code stems may be provided. At the end of the semester, your team will participate in the Archmage's Challenge (held during the last class) to showcase your Masterpiece to your peers. You must also document your Masterpiece on a GitHub page or a personal/team webpage and create a video presentation. These materials are due at the end of the scheduled final exam time. The following section details the grade breakdown for the Grand Enchantment.

Item Description Weight
Technical Implementations Correctly implement and demonstrate proficiency in the topic your team selected. 10%
Functionality Masterpiece features, particularly interactiveness. How does the user interact with the provided visual? 3%
Creativity The Masterpiece showcases original ideas and creative solutions and demonstrates an innovative way of using computer graphics techniques. 3%
Teamwork Demonstration of collective teamwork. If solo, this 3% will be evenly distrubuted to other items. i.e., 0.5% to each other item. 3%
Archmage's Challenge Well-prepared showcase during the challenge that highlights the key features and functionalities of the Masterpiece. 3%
Showcase Well-documented Masterpiece GitHub page or any personal webpage that showcases the key features and functionalities of the Masterpiece. 4%
Video Presentation Professional video presentation that illustrates the key features and functionalities of the Masterpiece. 4%
Winner of the Archmage Challenge You fellow will vote who they like the most. You cannot vote for your own team. The winning team will receive bonus points.
Furthermore, the winner can decide take the points or distribute/share them to/with others.
3%

Appropriate Internet Use and Collaboration
  • You may use online resources to help you better understand the topics in this course.
  • Any online sources you consult while completing assigned work must be cited appropriately as comments in your code.
  • You must not search the Internet or use an AI chatbot for specific code or solutions to your assigned problems. Do not rely on AI to complete your work - this would essentially deprive you of meaningful learning.
  • You may ask AI chatbots or the broader internet general “How do I...?” questions.
    • Examples of acceptable questions:
      • How do I compute the cross product of a light direction l and the normal n in JavaScript?
      • How do I transfer data to the GPU using buffer objects in WebGPU?
    • Examples of what you should not do/ask:
      • Copy a portion of your problem or answer and ask an AI bot to continue or provide a solution.
      • Use AI-generated output in your solution if it contains functions or programming features never learned, discussed, or used in this course.
    • Whatever you ask the Internet or an AI chatbot, you must cite the specific website you used or include your prompt and the AI's response in comments.
  • You are encouraged to talk with classmates about approaches to a problem and the resources they used to help them solve it.
  • You must not show another student your code for individual assignments. (For the team project, do not show it to another team!) You may not give, show, email, text, print, borrow, or otherwise share your code with others.
  • Likewise, you must write the code for your own assignments. You are not allowed to have other students, friends, TAs, etc., write code for you. You must contribute to writing the entire codebase for the final group project. You must not divide the final project as “I do part 1, you do part 2.” You must understand and be prepared to explain (if asked) all the work you submit for credit.
  • You MUST use GitHub to maintain your source code and your GitHub page. Your source code will be public. I strongly discourage you from viewing a classmate's source code. If you do view it, you MUST cite their GitHub repository. The world can see your work! If you copy someone else's code without proper acknowledgment, everyone will know.
  • You should minify and obfuscate your JavaScript code when publishing it to your GitHub page while keeping the readable code private.

University of the Pacific Honor Code

The Honor Code at the University of the Pacific calls upon each student to exhibit a high degree of maturity, responsibility, and personal integrity. Students are expected to:
  1. Act honestly in all matters;
  2. Actively encourage academic integrity;
  3. Discourage any form of cheating or dishonesty by others; and
  4. Inform the instructor and appropriate University administrator if a student has a reasonable and good faith belief and substantial evidence that a violation of the Honor Code has occurred.
Violations will be referred to and investigated by the Office of Student Conduct and Community Standards. If a student is found responsible, it will be documented as part of their permanent academic record. A student may receive a range of penalties, including failure of an assignment, failure of the course, suspension, or dismissal from the University. The Honor Code is located in Tiger Lore Student Handbook. Under no circumstance should any students submit work that is not of their authorship. If a deadline is tight or impossible, talk to your instructor before getting desperate. It is better to be late than dishonest. Remember that your instructor’s main goal is to give you the best learning opportunities.

Your instructor will explain in detail the collaboration policy for each specific assignment. Before you start your work, read and understand this policy. Should any questions arise, contact your instructor immediately to have them clarified.

Recordings

All live class presentations and discussions during this course may be recorded. As a student in this class, please note that your participation in live class discussions may therefore also be recorded. By participating in a live class discussion you are giving your consent to this recording. Access to these recordings will be limited to faculty and students enrolled in the class, to assist those who cannot attend the live session, and also will be a resource for those who would like to review content that was presented.

Pronouns

Knowing and applying the names and pronouns that students use is a crucial part of developing a productive learning environment that fosters safety, inclusion, personal dignity, and a sense of belonging across campus. Please let me know your preferred name and pronoun anytime throughout the semester.

Accommodations for Students with Disabilities

If you are a student with a disability who requires accommodations, please visit pacific.edu/disabilities to contact the Office of Services for Students with Disabilities (SSD) for information on how to request accommodations while at Pacific.
  • Students who have not previously registered for accommodations can request services by visiting pacific.edu/disabilities and selecting New Students Apply Here. Once registered, students will be asked to provide documentation of their disability, and meet with the accommodation specialists to determine reasonable accommodations.
  • Students who have previously been approved for services with SSD can requests accommodation(s) letters each semester by selecting the Returning Students Login Here link located on pacific.edu/disabilities
The Office of Services for Students with Disabilities is located in the McCaffrey Center, Second Floor. Phone: 209-946-3221. Email: ssd@pacific.edu. Online pacific.edu/disabilities.