Assignment 02 | GD 220-01 | SPRING 2016 | 3 CREDITS

A Day in the Life

Adapted from an assignment by Mark Sanders

HTML / CSS webpage


Design and develop web pages for a collaborative / interactive storytelling project presenting a day in the life of a MICA Graphic Design student. Through typography, composition and images, enhance how someone visually experiences your day. Build a one-page web site based on your design.



March 1
Assign: Document your assigned day using a camera, write captions for each image and write 2 paragraphs for two entries.

March 8
Review work
In-class: Content organization & sketches
Assign: CSS styling;

March 15
No Class, Spring Break

March 22
Review work
Assign: CSS styling

March 29
Final Critique

April 5
Final Files Due

  1. Take a photo every hour (while you are awake) of your assigned day. This image should describe either where you are or what you are doing at this time. Write down a caption for each photo as you take them. Two or more of these hours must include at least two paragraphs each of detailed description about what you are doing the moment the photo was taken. Photos must be at least 1200 pixels wide (hopefully much larger).
  2. Organize your gathered content, focusing on how each hour is visually connected (or disconnected) to the next, as well as all the others. Crop photos or edit text as needed to clarify. Enhance hierarchy and communication through composition and typography.
  3. Sketch mock-ups of the overall structure of your timeline, as well as the individual hourly modules of time. What remains consistent? What changes? Why?
  4. Translate the overall structure of your timeline into HTML / CSS.
  5. Style type, images, backgrounds, textures, rules, etc. with CSS.
  6. Troubleshoot and refine your work as needed.


Download the project files HTML5 Boilerplate