Assignments


Assignment 1. Jump Page


Due on Wednesday, January 20

Create a jump page that allows the instructor to access all of the assignments you produce in the course. The jump page should include the following:
  • Your name
  • The school’s name
  • Course name, section, number and academic term
  • Instructor’s name
  • Link to each assignment labeled with the assignment number, name, and due date
  • All content should fit in a maximized browser window at 1024 x 768 on Mac or PC in major browsers with no horizontal or vertical scrolling
  • Launch assignments in a new browser window
  • Visual design style or concept of your choice
  • Include the disclaimer in the footer of the page*
  • Use Web Standards when building your page (validate XHTML 1.0 Transitional, validate CSS)

  • Disclaimer: This interactive media project was created by students for educational purposes at The Art Institute of Charleston and is in no way intended for commercial gain or as a source of public information.

Marking Criteria

Total Points: 50
o Class jump page (50)
  • Design: type, color, layout (30)
  • Coding (10)
  • Requirements (10)




Assignment 2. Thumbnail Compositions


Due and present on Wednesday, January 27

Create 4 thumbnail compositions representing 5 different concepts (total of 20 thumbnails, 4 for each word) using only black shapes on a white background (no type, photos, or color). Your shapes should remain simple rather than pictorial.

Present your thumbnail designs as Gif images on an HTML page, separating each grouping with ample vertical space. Give the page a logical heading, and include a simple bookmark link navigation to jump to each set of designs. Do not reveal the concept illustrated, however for the purpose of critique. Instead, place the concept word in the title attribute of the image as seen below:

<ing src=”images/tension.gif” title=” Tension” alt=”Tension” />

Marking Criteria

Total Points: 150
  • Assignment requirements
  • Effective communication of concept
  • Creative delivery




Assignment 3. Grayscale Layout


Due and present on Wednesday, February 3

Photos you may use - if color, make black and white:

Giuseppe Volpi photo http://it.wikipedia.org/wiki/File:Conte_Giuseppe_Volpi.jpg
Graphic on Wikipedia http://en.wikipedia.org/wiki/File:65th_venice_film_festival.jpg
Golden Lion photo http://it.wikipedia.org/wiki/File:Lion_of_Venice.jpg
Excelsior Hotel http://it.wikipedia.org/wiki/File:Mostra_Venezia_Excelsior.jpg
Palazzo Ducale 1947 (festival) http://it.wikipedia.org/wiki/File:Mostra_di_Venezia_al_Palazzo_Ducale_1947.jpg
Ingmar Bergman receiving Golden Lion in 1983 http://it.wikipedia.org/wiki/File:Ingmar_Bergman.jpg


Using the content provided to you, create a one-page layout using XHTML and CSS that effectively presents the content in a usable, attractive layout following web standards. Your design should make use of only black, white, and tones of gray. Create a logo that communicates the concept of the page using shapes and typefaces of your choosing that relate to the content. Your layout should effectively deal with all of the following issues:

  • Line length
  • Leading
  • Copy margins
  • Contrast
  • Information hierarchy (Dominant heading, subdominant heading, etc.)
  • Content grouping
  • Grid alignment
  • Balance
  • Appropriate content entry points
  • Facilitate quick reading
  • Engaging design
  • Usability

You will need to read the copy provided to decide where the logical breaks are in the narrative to begin new paragraphs, and introduce new heading or subheadings. Use runarounds and at least 1 pull quote in your layout. You may use an image for the logo (presented in grayscale) and for headings (use off-left or other image replacement technique). Do not use photographs.


Choose typefaces that are appropriate for the content and are legible for your readers.

After you have your grayscale design, you may create a copy using color but make sure you use your grayscale stylesheet for print.

Marking Criteria

Total Points: 150
  • Assignment requirements
  • Creative approach
  • Effective use of design principles
  • Effective use of typography and type setting
  • Usable design




Assignment 4. Research Presentation


Present on Wednesday, February 10

Create a 5 - 10 minute presentation to be given to the class on one of the designers/topics listed below. Your presentation should be presented in PowerPoint, Keynote, or using Eric Meyer’s S5 (preferred: http://www.meyerweb.com/eric/tools/s5/). Be sure to include footnotes on each slide where you quote or reference a source (see http://studentabc.com for examples of how to use MLA style citation). Include a bibliography slide at the end with all sources plus recommended information sources. Format the presentations slides so they are easy to read from the back of a classroom, and visually relate to the subject. The presentation style should relate to the designer’s work you are presenting. Include screen shots and visual examples where appropriate.

  • Walter Gropius
  • Joseph Albers
  • Shaun Inman
  • Joshua Davis
  • Jeffrey Zeldman
  • Douglas Bowman
  • Todd Dominey
  • Jason Santa Maria
  • Dan Cederholm
  • John Hicks
  • Cameron Moll
  • Milton Glaser
  • David Carson
  • Paula Scher
  • Stefan Sagmier
  • Herbert Bayer
  • Nicholas Jenson
  • Johannas Itten and color theory
  • Brief history of Bauhaus at Weimar
  • Brief history of modern type faces
  • Interview with a designer (speak with instructor)

Marking Criteria

Total Points: 150
  • Assignment requirements
  • Quality of research
  • Presentation design
  • Citation of sources



Assignment 5. Usability Analysis


Present on Wednesday, February 17

Create a 5 - 10 minute presentation to be given to the class on a usability analysis of a web site of your choice. Your presentation should be presented in PowerPoint, Keynote, or using Eric Meyer’s S5 (preferred: http://www.meyerweb.com/eric/tools/s5/). Be sure to include footnotes on each slide where you quote or reference a source (see http://studentabc.com for examples of how to use MLA style citation). Include a bibliography slide at the end with all sources plus recommended information sources. Format the presentations slides so they are easy to read from the back of a classroom, and visually relate to the subject. Include screen shots and visual examples where appropriate.

Marking Criteria

Total Points: 150
  • Assignment requirements
  • Quality of research
  • Presentation design
  • Citation of sources



Assignment 6. Site Redesign


In class wireframe sketches and feedback exercise on Wednesday, February 24
Present iteration 1 on Wednesday, March 3
Present iteration 2 on Wednesday, March 10
Due and present final design on Wednesday, March 17

For a website of your choice (get the instructor’s okay before proceeding), create a basic creative brief to define the goals, objectives and target audience. Your design can and should be as creative, cutting edge, and technically savvy as possible. Your job as the designer is come up with a unique concept and design. You will not be doing the technical build out so shoot for the stars with your ideas. Consider the needs of the primary target audiences.

The design process will be iterative, allowing for group critique, and refinement of your ideas. You will prevent your first iteration of your designs in class. Based on class feedback, refine your designs and present them again. Make final revisions based on class discussion and present them in the last class. Below is a listing of what you will be presenting for each of the design iterations:


  1. Wireframe Sketches: executed in class showing home, any secondary navigation page, any tertiary navigation page
  2. Iteration 1: Illustrator or Photoshop comps showing 3 unique designs for home and any interior page
  3. Iteration 2: Illustrator or Photoshop comps showing 1 design for home, any secondary navigation page, any tertiary navigation page
  4. Final Design: Fully refined Illustrator or Photoshop comps showing 1 design for home, any secondary navigation page, any tertiary navigation page

Make your design modular, flexible, scalable, and practical.

Marking Criteria

Total Points: 350
  • Iteration 1 (100)
  • Iteration 2 (100)
  • Final Design (150)

.