Jake Selvidio
Art & Design Instructor

gd260 « Web Design 1 » Assignments

Due date Assignment due
Week 2 / Jan 24 HTML Résumé
Mark up your completed résumé in HTML5. I'll be collecting your .html files at the beginning of class. Sample résumé we completed in class can be downloaded here.
Week 3 / Jan 31 Portfolio Site Map (flowchart)
Sitemaps must be created in Illustrator or Photoshop, not hand-drawn.
Included with your sitemap must me a typed list of your content. Itemize any and all work you have that can be included, as well as a rough draft of your artist statement (3-5 sentences only).
Layout Sketches
Provide a minimum of SIX hand-drawn layout sketches - three unique ideas for the homepage, and an idea for a gallery layout connected to each homepage sketch.
Visit these links for inspirational site designs:
AWWWARDS.com
Smashing Magazine
Week 4 / Feb 7 Sketches/Wireframes
Sketches AND wireframes for five different pages for your portfolio site.
Each page needs 4 thumbnail sketches plus one full-page wireframe. Use the 960grid sketch sheets from my pickup box or download them here.
For more information on the 960 grid system, or to see the grid samples, go to 960.gs
Week 5 / Feb 14 Mockups
5 mockup designs due at the beginning of next class. Mockups must include your font choices, color schemes, placeholder images, backgrounds, placeholder content, etc...
These designs must be created digitally using the Illustrator or Photoshop grid templates you can download here or at 960.gs
Week 6 / Feb 21 Revised Mockups
5 mockup designs due at the beginning of next class. Mockups must include your font choices, color schemes, placeholder images, backgrounds, placeholder content, etc...
These designs must be created digitally using the Illustrator or Photoshop grid templates you can download here or at 960.gs
Week 7 / Feb 28 Web Graphics
Use your mockups to generate web graphics for your layout.
Save image files as jpg, png, or gif.
Png and gif preserve transparency, jpgs do not.
You will need graphics for...
  • backgrounds with detail
  • photos/artwork
  • button appearances: both static and hover states
  • logos
You don't need graphics for...
  • text boxes
  • body text
  • image captions
  • solid color backgrounds
Week 8 / Mar 7 Web Graphics
Create original graphics for the image slider and additional content boxes on the home page. Graphics can be derived from photographic images, typography, or any combination thereof.

For the Slider
  • 5 images or graphics
    • 940px X 400px
    • 72dpi
For additional content boxes
  • 3 images or graphics
    • 300px wide
    • Any consistent height
    • 72dpi
Backgrounds
Visit SubtlePatterns.com and pick out three different background images to use in your layout.
Download the image files and bring them to class.
Week 9 / Mar 14 Galleries
Complete your gallery page.
Replace all images with placeholder images. Complete at least 3 rows of thumbnail images.
Next Week...
We will be installing the Lightbox 2 plugin.
→  Download Root Demo from week 8
Week 10 / Mar 21 Lightbox
  • Finish setting up your gallery page with Lightbox.
  • Every image should activate Lightbox.
  • Each thumbnail must be unique (no duplicates).
  • Each thumbnail must must link to a full size image.

S3 Slider
Finish setting up S3slider.
  • Replace all images with your own original images.
  • Update captions with your own text, or remove caption boxes.

→  Download Root Demo from week 9
Week 11 / Mar 28 Final project
A minimum of SIX working HTML pages for your site – the homepage plus at least five other sections. This must include two galleries with a minimum of twelve labeled images – title and year, for example – and a contact form, which we will be covering in class.

See course syllabus for more information.

Copyright © 2014 Jake Selvidio. All rights reserved.