Here you will find all information relevant to assignments. Each assignment will be posted up the day it is assigned (or possibly sooner) and is due at 11:59pm on its Due Date. Each assignment has a collection of provided files that include both the assignment specification and code templates to make it easier to get started.
As I have mentioned before, I am still trying to figure out the pacing of this class. Because of that, the time frames for the different assignments may shift over the course of the semester. Whatever is listed on this page should be considered the definitive version of when things are due. If the currently allotted time frame for an assignment seems too short for most students I will consider adjusting it.
Assignment turn in will be handled through email. On or before the day an assignment is due you should zip all of your project files together in to a single package and send them in an email attachment to my address: eharpste@cs.cmu.edu. Please use the following subject line when turning in assignments: "GUI Lab - {Your Last Name} - Project {#}" (e.g. "GUI Lab - Harpstead - Project 1a"). This is mainly to ensure that I can get grades back to you in a timely manner.
I will be including a survey at the end of each assignment. These surveys are for me to get a read on how the class is feeling about the pace and difficulty of each assignment to help me better prepare in the future. I will not share the raw survey data with anyone outside of the course teaching staff (me and Anind). I might use the data to create aggregate plots or summary stats to show in lecture.
| # | Date Assigned | Date Due | Name | Description | Files | Answer Key | Survey |
| 1a | Hello {name} |
In this project you will build a basic web form to respond to user input with JavaScript. |
Spec HTML CSS JS Zip |
Demo Video Answer Key |
Post Assignment Survey | ||
| 2 | My Paint - Brush Selector |
In this project you will create the basis for the toolbar that will be used in the future painting assignments. |
Spec HTML CSS JS Zip |
Demo Video Answer Key Alternate Answer Key |
Post Assignment Survey | ||
| 3 | My Paint - Painting on the Canvas |
In this project you will learn how to use the canvas tag to paint shapes based on user input. |
Spec | Demo Videos Answer Key imageDataUtil.js | Post Assignment Survey | ||
| 4 | My Draw - Using a Display List |
In this project you will extend your previous painting program with a display list to allow for shapes to move around based on user input. |
Spec displaylist.js working-toolbar.zip |
Demo Video Answer Key displayList.ts | Post Assignment Survey | ||
| Final | Final Project Proposal |
You will get to define this project for yourself working with me to decide on a good set of requirements. If you do not want to invent your own project there are a set of options you can go for instead. |
Requirements | ||||
| Final | Product Fair |
We will be having an in-class product fair where you will present your project to your classmates. |
Sample Feedback Form | ||||
| Final | Final Deliverable |
Your final deliverable is due. |
TBA |