Making it Visual

Practice One:

Using illustrator type in the numbers 1-10.  With the pencil or paintbrush tool draw a symbol for each number.  What color is each number?

Practice Two:

Watch the action presented in the video.  Using illustrator draw the pathway or shape that you see.  What color is each action?

Practice Three:




Symmetrical, Asymmetrical and Contrasting Typography Approach

There are 4 ways to contrast typography:

  1. Strength
  2. Size

  3. Shape
  4. Color

There are 2 ways to organize text:

  • Symmetrical
  • Asymmetrical


book cover short story day2 book covers 2 Capa-de-livro-12 Martin-Amis-book-covers-001 TBCE05

Why Typography Matters


Look through these movie posters without text.  Choose one and Copy it to your desktop and then bring it into Photoshop.

Add the title of the movie using symmetry with some type of contrast (size, strength, shape, or color).

Choose another poster and add the title using asymmetry with some type of contrast (size, strength shape, or color).



Visible and Invisible Typography

  • Does the text read as part of the image (visible) or is it’s task simply to relay a message without the reader noticing the actual design of the font (invisible).

Poet's Tree

Romans and Sans Serifs

  • Romans have thick and fine strokes.  The ends have serifs (heels or feet).
  • Sans serifs have an even design and straight ends.



When using either a flush left

or flush right indent.

It’s important to look at the negative space opposite the indent.

When centering a text look at the negative space on both sides.

For all formatting look at the overall shape of how the text is displaying.  If needed you can press the return key to customize the line lengths.

Font Personalities

  • Look at a variety of fonts and explain what kind of personality they have.


Using Adobe illustrator create the following.

  1. 4-year-old birthday party invitation using invisible text.  Indent flush right.  Choose a font to fit the client.
  2. The company “Tree Antiques” is looking for a new logo.  Using visible text create the image using this phrase: “Trees are your best antiques”.  Choose a font to fit the client.

An Extra Look

Google changes its logo

Dramatic, Non-dramatic and Interactive


  • Look at any last remaining blogs

Dramatic Storytelling

Who is the victim?

Who is the hero?

Who is the prosecutor?


Non-Dramatic storytelling

 What did you see?

How did it make you feel when you watched it?

What was the goal of the video?

What was the message?

What was the context?

Interactive Storytelling

Children’s books:

Press Here


Pat the Bunny


Video Games:

King’s Quest

For Next time:

Reading 2:

Provide examples from your experiences of a dramatic storytelling, a non-dramatic storytelling, and an interactive storytelling.  When telling a story what part do you prefer to play?  The messenger, the supplier or the client? Why?

This should be answered in a blog post with the link submitted.

Project 1: The Blog Reviews

Project 1A Due Today
(Don’t forget to submit to Moodle with the link AND screen shot)

3 Posts: Classroom assignment 1, Reading 1 and Sharing 1
3 Pages: About this blog, Book cover and Opening Movie Title

Hints on Giving feedback:

  • state observations about the blog:
    “there is a lot of the color black”
    “the font is large”
    “there is more text than visual images”
    “the image in the background is static”
  • blogger asks questions to the class
    “does the photo in the background take away from the text in the front?”
    “how can I organize my blog better?”
    “what would help my blog be more accessible?”
  • state any last options
    “the theme is terrible and doesn’t represent you well”
    “the formatting of your photos in the text could be organize better”

Due Next Time:
Project 1C: The Revised Blog

After listening to the feedback from the instructor and peers make changes to the blog.  Re-submit the link to the blog along with text about what you changed.  No screen shots needed for this revision