Assignments‎ > ‎

Type and Grid

Good designs are based on underlying grid systems that help to provide consistent locations for type and graphic elements, resulting in an ordered, legible design. In this assignment, students will demonstrate an understanding of the use of an underlying grid in a design layout by creating different designs using the same grid.  Students will complete this as an individual assignment.

Learning Goals
  • Develop proficiency with using a grid system to organize content for a
    screen or paper design
  • Understand how font choice and typesetting can affect legibility
  • Work iteratively through sketches and multiple layouts under different constraints
Materials
What to do
Create a document in InDesign or Adobe Illustrator. Your page size is 8 x 8 inches. Many visual design tools use picas and points as default units (1inch = 6 picas, 1 pica = 12 points; 1 inch = 72 points). You might need to change the default units to inches so you can specify the margins and gutters without having to convert.

Create a grid with ¼ inch margins all around, and four vertical columns with ¼ inch gutters. Use guidelines to divide the grid horizontally, resulting in a grid of 16 squares with ¼ inch gutters and margins.

Arrange the text supplied below on the grid. All of the text must be used in each design that you create.

Common Typographic Diseases
Various forms of dysfunction appear among populations exposed
to typography for long periods of time. Listed here are a number of
frequently observed afflictions.

Typophilia
An excessive attachment to and fascination with the shape of
letters, often to the exclusion of other interests and object choices.
Typophiliacs usually die penniless and alone.

Typophobia
The irrational dislike of letterforms, often marked by a preference
for icons, dingbats, and—in fatal cases—bullets and daggers.
The fears of the typophobe can often be quieted (but not cured) by
steady doses of Helvetica and Times Roman.

Typochondria
A persistent anxiety that one has selected the wrong typeface.
This condition is often paired with okd (optical kerning disorder), the
need to constantly adjust and readjust the spaces between letters.

Typothermia
The promiscuous refusal to make a lifelong commitment to a single
typeface—or even to five or six, as some doctors recommend.
The typothermiac is constantly tempted to test drive “hot” new
fonts, often without a proper license


Stages:
  1. Produce at least ten sketches of different designs using the grid. Sketching roughly on paper is the fastest way to look at a page layout holistically. Remember, the point of sketching is to explore alternatives quickly.
  2. Create two digital layouts that use one regular 10-point font, no bold, no italic, no color. Select one of these fonts for your work:
    • Baskerville
    • Caslon
    • Garamond
    • Georgia
    • Palatino
    • Helvetica
    • Franklin Gothic
    • Gill Sans
    • Verdana
    Bring printouts to class; cut the paper to 8x8 inches.
  3. Create two new digital layouts (should be a different configuration than those created for stage two) that use that same 10-point font again only this time, regular, bold and/or italic can all be used to emphasize different parts of the information. Bring print outs to class.
  4. Create two more new layouts. Select an additional typeface to use with your original font choice (two at most). Any font size, regular, bold, and italic can all be used to emphasize different parts of the information.  Bring printouts to class; cut the paper to 8x8 inches.
Deliverables

On the important links page, upload a single PDF (named A1-Lastname-Firstname.pdf; eg., A1-Dow-Steven.pdf) with the following content in this order:

  • Title page with your name, pID, date, and email
  • 10 sketches (can have multiple on one page)
  • Two designs done in ten-point type, no bold, no italic
  • Two designs done in ten-point type, with bold and/or italic
  • Two designs done with two fonts, multiple sizes, bold and/or italic

Grading Rubric

Grades will be based on the following:

  • Do the solutions conform to the rules?
  • Do the solutions clarify the content and make the information more accessible?
  • Is the type legible, and are the size choices appropriate for the format?
  • What is the visual appeal of the designs?