visual communication
Typography 1

 

  syllabus :: project 1 :: project 2 :: project 3 :: project 4 ::

.................................................................
Professor: Andrea Herstowski
Office: 317 Marvin Hall
Office hours: by appointment
email: herstow@ku.edu

Professor: Alex Anderson
Office: 353 Marvin Hall
Office hours: by appointment
email: alexandersoncreative@gmail.com

.................................................................:: Airport Codes

.................................................................

 

 

..........



 

 


 


 

 

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
VISC 202
Project One: Logotype

The objective
Create a compelling recognizable logotype for an airport using only the three letter airport code.

A logotype refers to words or the name of a business that is designed in a special way. Examples include Pinterest, eBay, Yahoo, Coca-Cola or Google. A logomark is an identifying mark or symbol that doesn’t contain the business name. Think of the Nike ‘tick’, Shell, WWF, Mercedes or Adidas for examples. You are creating a logotype not a logomark.

The Problem
How you do create a compelling recognizable logotype for an airport? A logotype must be easily recognizable and work at multiple sizes. The design should promote the following words: Professional, friendly, timely, competitive, ... (three more of yours).

Your task is to find interesting ways to combine three letters—into one (memorable) typographic mark/logotype. The solution should rely exclusively on typography -- no icons or symbols of the city, planes or travel –- only the 3 letters can be used. Here's a growing set of comparables, vintage logos *be careful not to be overly inspired by any of the things you see on-line, in books, in the world...

Pick your airport code International Air Transport Association airport codes. Please make sure it truly is an Airport Paris (PAR) is not an Airport neither is NYC or RIO and many others. Those are cities you need to pick an airport in the city! Please be careful when picking from the list. Also you can't have the same code as someone else in the class. Be prepared, when it is your turn to pick you need to have a few backup choices. Know the Airport Code and the Name of the Airport.

example:
MCI
Kansas City International Airport

Project Learning Objectives
_ understand the anatomy of letterforms
_ explore the potential of letterform combinations to create symbols
_ recognize and identify type classifications
_ understand primary and secondary font combinations
_ understand and create a clear hierarchy
_ becoming comfortable with Adobe Illustrator

Project Deliverables (details listed below)
brand board
business card for a employee
one swag application
animated gif
behance page
process book


- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Monday, August 21
_ Class Syllabus
_ Eclipse Party 12:30pm

HOMEWORK and BRING
_ Read:
Letter Fountain pages 40-41, 90-98 (take notes)
_ Tracing paper:
you will need tracing paper for the next class.
* you can share a pack pf tracing paper with a person or purchase a roll. You will need at least 10 sheets.
_ Pencil, pens (black thick and thin), scissors, transparent tape... iphone or android camera

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Wednesday, August 23
_ History of Typography by Ben Barrett-Forrest.
_ Lecture: Parts of the Letter (take notes)
_ Anatomy of Type.pdf
_ Start to fill out FontSheet info
_ Introduction to Project 1: Airport Code

_ Pick airport code, Research city list at least 10 attributes of the city.
_ Stranger Things
_ Figure Ground.pdf
_ Closure.pdf
_ Modular.pdf
_ Sign up for dropbox (basic free version)
_ Download Fonts and add to FontBook


The airport code typographic marks are to be made by combining three letters into one logotype/ wordmark. The airport code must be recognizable and read in the correct order MCI must read M, C, I.

Using your printed out typefaces as inspiration, freely combine, join and/or arrange as you see fit. Sketch, cut and paste, use grid paper, use tracing paper. You may use only type no images, lines, shapes...just type. Working in b&w (no gray).

INCLASS:
_ research your city and create a word list at least 25 words describing the city (20 min)
_ create solutions for prompt 1 (15 minutes). Thoughful solutions you just need to understand each prompt
_ create solutions for prompt 2 (30 min).
_ create solutions for prompt 3 (30 min).
_ create solutions for prompt 4 (30 min).

HOMEWORK
If you haven't read the Letter Fountain Reading read it and take notes: pages 40-41, 90-98

Finish what you started in class. Make sure you have 25 words to that decribe your city. And you are expected to create 60 analog (hand drawn/traced) typographic marks. No computer (for this round).

Create at least 15 solutions for each prompt listed below (60 sketches total). Try at least 2 - 4 studies in each prompt before you leave class so that you understand your homework. Work at least 1 - 3 inches tall. Have your 60 sketches organized, easy to read (not in pencil, no outlines, should be solid black), labeled and clear for crit on MONDAY. Pin up your sketches when you get to class (bring pins).

For this homework you are only using the computer to printing out different fonts. Use different fonts for your exploration not the same ones over and over and over). You may change the letter forms to be more the same or you can change them to be more different from one another. All sketches are by hand.

For each prompt explore

_ How are each of your letters constructed? De-construct them
_ What attributes / characteristics are the same?
_ What attributes s / characteristics are different? _ Crop the letters.
_ How much do we need to see of a letter to recognize it?
_ What parts do the letters share a baseline, cross bar... (redraw them)
_ How can you combine the letters
_ How can you customize the logotype
_ How far can you push legibility? is it OK if you can't read your letter forms clearly?
_ Try to make your round letter forms more square or rectilinear
_ Try to make your square/rectangle letter forms more round
*work quickly, but cleanly / craft should be considered.

prompt 1)
use a the lasercut geometric pieces (square, line, circle, half and quarter circles) to create your letterforms. Creating an airport code logotype of the 3 letterforms. You can use as many parts as you want. But you can only use the given shapes. 15 different approaches). Capture them on your phone and print them out or draw aroudn the shapes and fill them in.

*When was the McIntosh (Apple) first introduced to the world? What is a bitmapped font? Why is it important to the history of typography? Who is Zuzana Licko. Who are Emigre Why are they important to Design History? What is a modular font?

prompt 2) use parts of the letter to create part of the next letter or make the round letters more square and/or the square parts more round. Use a part of one letter to recreate the next letter. Please use only one font (you can different styles in the same font family) to create an airport code logotype of the 3 letter forms. Each study has to remain in one font family (reg, light, bold, italic...) (15 different approaches).

prompt 3) use the gestalt principle of closure or form and counterform/ negative space to work out your solution. You can use 2 or 3 different fonts (you can use different styles light reg bold italic) to create your 3 letterforms. You can draw your own letterforms...Also you don't have to use the full letter maybe through "closure" we see the part of the letter without it being there. These are not easy they will take time you have lots of ways to get there. (15 different approaches).

prompt 4) using the given fonts(the ones you have downloaded and added to your FontBook. Create 10 different approaches using the fonts / font families of your choosing. But please only pick from the fonts given to you for this project!. Do this on a school machine. Choose a few fonts, choose different styles. Print them out and sketch your 15 designs by hand. You are only going to the computer to get fonts and styles you want to use.

There are no wrong answers here. The only wrong is if you don't finish and/or if all of your solutions look the same. You are trying to come up with 60 different solutions. Explore. Take risks. Don't be afraid. Don't wait until Monday mourning to do this. You will fail. Have your 60 sketches organized and clear for crit on MONDAY.

Word List: printed out 25 words describing your city

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Monday, August 28
_ Overview Letter Fountain pages 40-41, 90-98
_ Illustration tips: turn on fonts, outline stroke, pathfinder tool (cut, merge, overlap), altering characters without stretching, multiple art boards
_ Discuss word list
_ Review logotype studies

HOMEWORK
_ Read: Letter Fountain the rest of the chapter
_ Design: Based on the class crit take “the best” 5 marks and put them onto illustrator.
Create 4 iterations of each of the 5. How can you make them better? If you used fonts you can explore different fonts.
Include the full name of the airport on each sheet.

Total of 20 digital marks you are makeing ITERATIONS of 4 different marks. (minimum)
Work large—somewhere between 5 inches wide (2 - 4 per page)
Black and White. Print everythingB/W for class.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Wednesday, August 30
_ review Letter Fountain: the rest of the chapter
_ review 20 logo designs
_ introduce how to use a secondary font.
_ introduce buisness card, size, rules, format, type alignments

HOMEWORK
Find the answers... type them up. hand them in. Find them in LetterFountain or Meet your Type, by Font Shop or Google.
What is another name for Uppercase Letters? What is another word for Lowercase Letters? What is the difference between Font and Typeface? Where do we see the first example of Roman Captitals? What are the 14 Square shaped letters in our alphabet? What is the difference between italic and oblique (give and show examples) What is a type family, give examples. What letters are drawn to be optically corrected and why are they corrected optically? What are the first 6 - 9 letters drawn when creating a typeface and why are they first? What word do type designers use to test a typeface they are drawing/creating? Why are those letters used? Explain the history of measuring type. What are points and picas? How many points are in an inch? How many picas? What is an em? What is an en? Define wordspace, kerning, and leading. Name at least 6 pairs of letters that need to be kerned and why. What is a ligature? What are the 3 kinds of type alignment? What do we "hang" in typography? What are lining figures? Show an example. When do you always want to use aligning figures (numbers). What are old style / non-aligning figures? Name a few fonts with non-aligning figures. When do you use non-aligning figures? Lastly know your parts of the letter.

DO in this order...
-- Create a Color Palette: create a color palette for your "brand". 2-3 colors + black and tints.

-- Refine Mark: “the best” digital mark.
Refine your mark at least 5-10 times. Looking at the letterforms, how can you customize the logo type? Make it better.
Print out all your refinements so we can see what you changed and see whicho ne is really the best. Can print B/W

-- Explore 5-10 ways on how to lock-up the secondary font. .... Use same font different members of the family. Explore where to lock-up the font. Top, bottom, side, asymmetrical....
-- Show your logotype alone 3 inches tall or wide in B/W
-- Show your logotype locked-up with the correct name of your airport 3 inches tall or wide in in color
-- Show your logotype alone 1 inches tall or wide in B/W
-- Show your logotype locked-up 1 inches tall or wide in in color
--(*each piece of paper needs to have everything listed.

-- Design and print 15 different business cards. 2 x 3.5 inches (make sure you have everything that needs to be on a card). You can put multiple on a page. No need to trim them out. Remember you could have a color in the background of your card.

*when designing the cards look for ways to create clear hierarchy, you can use your logo alone or locked-up with the name. if you use the logo without the name you have to add the name of the airport somewhere on the card. align things vertically and horizontally, type on a b-card can be small 7-8pt, some could even be 5pt. You can use the front and the back. You can have a solid color in the background. BUT...Absolutely NO centered type. None. Nope. Never. Everything right or left aligned.

Timothy Schapp
Director of Operations
601 Brasilia Avenue
Kansas City, MO 64153
office: 913 555 5656
mobile: 913 757 8266
web: flykci.com
email: tschapp@flykci.com

(YOU SHOULD CHANGE OUT THE INFO ABOVE TO YOUR AIRPORT. LEAVE THE NAME, TITLE, PHONE NUMBERS THE SAME)

Print all of this out. You will need it all in color. Your pages should look professional. Also don't forget to answer the paragraph of questions asked at the top of this homework!


- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
MONDAY SEPT 4 is LABOR DAY: NO CLASS (but you do have homework - don't wait.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Wednesday, September 6
_ review the questions
_ review logos and type studies, bcards
_ picking swag and using templates
_ what are pms colors and cmyk?
_ how to print in the epsons

HOMEWORK
Refine the best mark, business card and swag and see below on how you should present it for the final on Monday.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
DUE MONDAY, Sept 11
crit

Brand Board:
see example, USE EXAMPLE
_Your Name
_Airport Name
_Logotype B/W 3in tall or wide
_Logotype Color 3in tall or wide
_Color Palette 3 colors + black
_3 - 5 Key Words
_Business Card Front

HOMEWORK
Design BrandBoard print out on 11x17 color laser printer (it will shink a bit the final on Wed will be 13x19 on the Epson)
3 refined buisness cards printed in color on the laser printer and trimmed out (do not glue them together
Refined mark and secondary font b/w at least 3 inches tall

in class on Monday we will crit, go over readings and print demo on the Epsons

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
DUE Wed, Sept 13
class crit + and Quiz
how to upload to behance. sign up Behance.net follow www.behance.net/kudesign

Brand Board: print out one 13 x 19 on the Epson printer with all the following organized on the 13 x 19 sheet
_Your Name
_Airport Name
_Logotype B/W 3in tall or wide
_Logotype Color 3in tall or wide
_Color Palette 3 colors + black
_3 - 5 Key Words
_Business Card Front

** Mount your 13 x 19 Epson print onto 13 x 19 foam core.
*** do not spray mount inside or right outside the building, Use Studio Tac or Double Tac
****no that is not double sided tape -- do not use double sided tape it will look BAD.
Craft 10% of your grade, clean straight edges, not mangled, securely attached to the board, and CLEAN

Black and White PRINT of your Brand Board
please print your brand board black and white, scale to fit on a 11 x 17 so when we are grading we can make comments on that and leave your beautiful 13 x 19 board clean and not marked up. *this has been added since class.

Process Book: spiral bind (jayhawk ink, office depot, fedex,...)
_ Title page: your name, name of the project
_ Project Description
_ ALL of your process
..
this means all process is 50% of your grade. (all of it neatly organized in chronological order best if you label each step of your process) you may need to copy or scan in your tracing papers and irregular papers onto 8.5 x 11 sheets.
_ Project Reflection
reflect on

Post to Behance.net (free online portfolio site)
Post your Airport Code project onto Behance and email your prof the link.
Tips for Behance. Save your parts at RGB jpgs. The width is 1400px if you want something to bleed off the edges make it 1400 wide can however long you need it. Needs to be RBG. Write a project description.
Tags: your name, airport code, KU Design, ...

peers to follow
https://www.behance.net/b204s24666e0
https://www.behance.net/skylerbaked424
https://www.behance.net/lhakmiller07c4
https://www.behance.net/molliehans150c
https://www.behance.net/maggiew6994
https://www.behance.net/SamBillman

more KU portfolio links here