Using Autolab

This semester, you will use two different software systems for submitting your work.

1. Technical Assignments (“Assignments“) are submitted privately through Autolab. (Be sure to sign in by clicking Sign in with your CMU account, not the big red sign-in button! The only people who will see this work are you, the professor, and the course teaching assistants. Instructions for using Autolab are below.

2. Open-Ended Creative Assignments (“Projects“) and “Looking Outwards” reports are submitted publicly, through this WordPress website. Instructions for submitting assignments in this way, using this WordPress site, are here.

Instructions for Using Autolab.

  1. If you need to submit any work electronically, create a zip file of the file(s) you wish to submit. Please be sure to create a .zip file and not a .gzip, .tar or .rar file. See below for instructions on creating a zip file.
  2. Go to the Autolab website ( . You must log in (authenticate) using your CMU Andrew ID and password. If you are registered for this course, you should be able to log in and see that you are registered in 15-104 (Fall 2020) in Autolab. IF YOU ARE REGISTERED BUT DO NOT SEE THIS COURSE, THEN EMAIL YOUR PROFESSOR IMMEDIATELY.
  3. You should see links for currently active assignment(s) that you can hand in. There may be a few instances where more than one assignment is open at the same time, so be careful to select the correct one.
  4. Once you click on an assignment, you will see an Options menu. From here, you can download the assignment handout (i.e. starter code, if any), handin your .zip file, view your handin history or view the assignment/lab writeup instructions. To hand in, select “Handin your work”.
  5. You will see a text field to enter the filename you wish to submit. You can use the browse button to find the .zip file you want to submit (see below). Once you select the correct file, click the Handin button to submit your work. You may submit as many times as you wish up until the deadline. WE WILL ONLY GRADE YOUR LAST SUBMISSION THAT IS SUBMITTED.


Creating a zip file.

A zip file is a single file that contains copies of a collection of files in a compressed format. Since assignments often contain multiple files, a zip file is a way to transfer not just the content but the organization of the collection of files needed to run your programs. You can make zip files using command line tools or graphical desktop tools.

Note that in all cases, you should name or select the containing folder for all your project files rather than selecting individual files!

In general, you will hand in multiple assignments and projects for the week in a single zip file. The organization of your work is important. The directory/folder hierarchy should look like this:

Checklist for submission directory:

  1. The top-level directory/folder name (handin-02) is not critical. This is the all-encompassing directory/folder you will “zip” into a submission file. It will help to be consistent in  your naming so you don’t get confused with all of the files on your computer.
  2. In this example, there are two technical assignments. Name these according to instructions – typically the form is AndrewID-WeekNumber-AorBorCetc. This example is for Week 2 and the user ID is acarnegie.
  3. Clean out extraneous files before you submit your work. Making backup versions and tests is great for development, but do not confuse your grader by submitting unnecessary files. SUBMIT ONLY WHAT IS NECESSARY FOR GRADING PURPOSES.
  4. Normally, you will provide additional information (your name, section, goals, how to run your code, features) in comments. In this case, student acarnegie provided extra information for Assignment-02-B in README.txt.
  5. Before you create a zip file of the assignment directory/folder, look at the folder and its contents to make sure your organization is correct.

Mac Finder and Windows Explorer (probably)

Using the Mac Finder or Windows Explorer (the graphical desktop tool that lets you navigate through your files), first locate the directory you wish to put into a zip file:


Next, hold down the right mouse button (or on a Mac hold down the Control key, then use the mouse or trackpad button) to get a menu:


Select the “Compress” menu item (Mac) or “Send To.. Compressed (zipped) folder” (Windows) to make a zip file. You should see the newly created zip file in the same parent directory (folder):


Note that on Windows, if you “open” the zip file, Windows will “look inside” the zip file as if it is an ordinary directory, but on Mac OS X, if you “open” the zip file, it will be decompressed and expanded back into a regular directory.

Mac command-line instructions

On a Mac, open a Terminal application. Here are some commands that you would type in shown in red with annotations (do not type the orange colored annotations) to guide you, assuming you have a Documents folder with a class folder inside of that with a 15104-f20 folder inside of that and a p5js folder inside of that:


— initially you are prompted for commands (the $ means the computer is waiting)
— the computer starts you in your home directory represented by the tilde (~) 

~$ cd Documents/class/15104-f20/p5js/

— cd means change directory; change to the directory with your project
— note that the computer always tells you what subdirectory you’re in (shown in green here)

~/Documents/class/15104-f20/p5js$ ls

— ls means list directory; see what’s in your directory
spiral template

— I have these two sub-directories representing two assignments in my p5js directory. I want just the spiral directory in a zip file.
~/Documents/class/15104-f20/p5js$ zip -r spiral
— this command zips everything inside spiral to the zip file named
— output from zip showing what it is copying:

adding: spiral/ (stored 0%)
adding: spiral/.DS_Store (deflated 96%)
adding: spiral/index.html (deflated 57%)
adding: spiral/libraries/ (stored 0%)
adding: spiral/libraries/p5.dom.js (deflated 77%)
adding: spiral/libraries/p5.js (deflated 77%)
adding: spiral/libraries/p5.sound.js (deflated 78%)
adding: spiral/sketch.js (deflated 44%)

— now list what’s here; see if created
spiral template

— has been added
— now let’s unzip the file and make sure it’s all OK (you won’t have to do this later on once you get comfortable with this process, but it doesn’t hurt)

~/Documents/class/15104-f20/p5js$ mkdir tmp

— make a directory named tmp in the current directory shown
~/Documents/class/15104-f20/p5js$ ls
— list to see what’s in your main project directory
spiral template tmp
— the tmp directory has been added 

~/Documents/class/15104-f20/p5js$ cd tmp

— change current directory to tmp
~/Documents/class/15104-f20/p5js/tmp$ unzip ../

— unzip the file. “../” means look in the parent directory (“..”) for, the file to unzip. The unzip utility tells us what it copies out of
Archive: ../
creating: spiral/
inflating: spiral/.DS_Store
inflating: spiral/index.html
creating: spiral/libraries/
inflating: spiral/libraries/p5.dom.js
inflating: spiral/libraries/p5.js
inflating: spiral/libraries/p5.sound.js

inflating: spiral/sketch.js

— list the tmp directory

— good, we confirmed that spiral is in the zip file
~/Documents/class/15104-f20/p5js/tmp$ ls spiral

— what is in spiral; did we get everything?
index.html libraries sketch.js

— contents of the spiral directory

Windows 7-Zip Utility

There are many programs for Windows that work with zip files, but none are built-in. A simple-to-use program is 7-zip, which you can download from

The 7-zip screen looks like this:

Navigate in the window to find your project directory, and select it:

Click on the “Add” button to create a zip file:

A dialog box will appear. Just click “OK”:

Your new zip file will appear in the 7-Zip window. (Your zip file will probably have a different icon.) The location of zip file will be the same location as your project directory: