visual communication
Project 4

 

:::: 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

 

   

::::



 

 


 


 

 

 

TEACH US THE CHARATERISTICS OF YOUR FONT

Teaching someone about a specific typeface. Who designed it, when, its character, how to identify it... You will become the resident expert of your font.

This project focuses on learning to identify fonts, font characteristics and type classifications. Graphic design professionals are expected to recognize an almost infinite number of typefaces; it is essential, therefore, that students begin by learning the parts of the letter (terms), characteristics and to classify typefaces into these major historical, categories (type classifications): Old Style, Transitional, Modern, Slab Serif, Sans Serif.

During this project you will become the resident expert of a given font. You learn everything there is to know about that font including: its classification, characteristic details, who designed it, when it was designed,...And then visually teach what you know to us in a series of typographic posters.

The Final Artifacts: Poster Series, Animated Gif, Behance page with process and final

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Monday, November 13
_ Introduction to the project (samples)
_ Assign fonts
_ Arial vs Helvetica

HOMEWORK
Use FONT BOOK to turn on your font (you will need to be on a school computer)
_ Read: Font Classification
_ Re-read: Parts of the letter
_ I love Typography: History in 5 parts (READ IT) part 1 | part 2 | part 3 | part 4 | part 5

Create three 11x17 b/w printouts: You will need to print out 1 sheet with all caps, 1 sheet of all lowercase, 1 sheet of punctuation and numbers. Make the characters as large as you can at least 72 point.

Identify the following information
_ Sans Serif or Serif
_ Name of the Designer
_ Date it was designed
_ Classification
_ List its family members: Roman, Italic, Bold...(small caps)

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Wednesday, November 15
In small groups: define the following font classifications. Write down at least 3 characteristics for each of the following the classifications and at least 5 fonts that fit under each classification. Add this information to process book.
_ Arial vs Helvetica
_ Read and use inclass
_ Old Style
_ Transitional
_ Modern
_ Slab Serif
_ New Transitional
_ Sans Serif: grotesque
_ Sans Serif: geometric
_ Sans Serif: humanist

In class: examining your font
you are to become an expert of your font...

Identify these characteristics you can about your font...
Baseline, Cap height, x-height, serif style, stroke width, apex, final/terminal, barb, spur, ear, loop, link, a and g one story or two story, tail, apex, leg

How can you teach us (the viewer) about your font. How can we tell your font apart from another? What is distinctive?

HOMEWORK
Research everything you can find about your font and the designer. Put into a PROCESS BOOK:
History of the font. Research and write at least 1000 words about the origins of your font. Can be specifically about your font, or about the classification or both.

History of the world. What was happening in the world the year/decade your font was designed, is it at all a reflection of the times? (no word min or max, not included in 1000 words or 500 words, is its own thing)

Biography of your font designer: 500 words about the font designer. Include when and where they were born, died, list other fonts they designed

Bibliography: must included a bibliography, use at least 4 resources and only 2 of those can be online.

Design on a 8.5 x 11 sheet in illustrator. You can have 2 explorations per page. Pick 3 different characteristics you want to show case -- what are the 3 most important ones that define your font? How would you verbally explain them? Now explore how you would VISUALLY explain them. Explore 20 different ideas on how you can "diagrammatically" show us your fonts characteristics. AT least 20 different ways to visually and verbally you have to use both verbal and visual/. You are exploring the different ways you can dissect, examine, explain both visually and verbally show the 3 characteristic. Use the computer. You can put 2 ideas per 8.5x11 sheet of paper. HINT: Diagram, scientific, technical, mechanical, compare, compare/contrast. These are rough quick ideas. Not flushed out posters.

Print in color you can have 4 ideas per printed page.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Monday, November 20
_ Present 20 ways to diagrammatically show your font's characteristics

HOMEWORK
The poster MUST include the following...
_ diagrammatically show at least 12 characteristics of your font
_ include the entire alphabet, punctuation, numbers (show it other than abcdefg...)
_ your font's classification
*name of the classification and description
as in Modern and define the Modern Classification

*nowhere does it say tell us the name of the font -- so do not use the name of the font anywhere on the poster. Don't do it. I may kick you out of class if you do it :) Not kidding. You will be so tempted so NO! Just no. Not interesting. Do you actually think you are the first student to think about using the name of the font big you are the 20,000th student to think that thought so nope! Use the CHARACTERISTICS of your poster as the HERO. Also remember we will be looking at the posters from far away and close up so your small text can be as small as 7pt!

Steps... Using your diagrams what worked best? Sketch 15 - 20 poster ideas. Take 10 to the computer and make them quickly. Pick your favorite 5 and spend more time on them. You will show all your sketches and print the 10 (and 5 of those 10 have to be great)

For this project use Adobe Illustrator.
Poster size is 22 x 34inchs (tall). Use the provided ai file.

Limit your color palette to 3 - 5 colors + black/white. Use kuler.adobe.com or colourlovers.com

Secondary font: you may use a secondary font (a different classifcation than your font)

REMEMBER: scale, color, size relationships, how to make it look "technical", mechanical, informational. Big's BIG smalls small. Smallest size can be 5pt. No limit on LARGE.

Print your 10 posters on the color laser: shrink to fit onto 11 x 17. Print Trim and tape together 1 poster at full size b/w is fine. You just need to see how big this poster is.

*yep homework over thanksgving. fun homework. eat. visit. work. nap. repeat...

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Wednesday, November 22 NO CLASS THANKSGIVING

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Monday, November 27
_ Crit posters
_ Lecture paragraph breaks

HOMEWORK
Create on the computer at least 10 Content poster compositions. Explore variations different ways the poster can look, do not make iterations, explore how these can look, feel, communicate.

The "Content" poster must include the following...
_ 1000 words (you can shorten your text to 1000 word min)
_ title (come up with a title)
_ name of the designer
_ birth/death
_ one quote (about your font or designer)

No type on curves
No type in shapes
No type fitted curved around letters
No drop shadows
No stacked type (that includes the alphabet.

Use your paragraph explorations as structure for this poster. Use the "structure" to define where your additional text should go. The grid and/or internal paragraph structure determines the alignments.

Use the provided grid: 22 x 34 page (tall, no horizontal format)

Limit your color palette to 3 - 5 colors + black/white. Use kuler.adobe.com or colourlovers.com

Secondary font: you may use a secondary font (opposite to yours)

REMEMBER: scale, color, size relationships, how to make it look "technical", mechanical, informational. Big's BIG smalls small. Smallest size can be 5pt. No limit on LARGE.

PRINT all 10 on 11 x 17 full color. Bring your characteristics posters in again! Don't forget them you will need them in class.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Wednesday, November 29
_ crit content posters
_ bring in characteristic posters
_ Which posters will you further explore and create as a set?

HOMEWORK
Taking from what you have done so far you need to design/refine the explore the 4 different posters sets (series) 1) characteristic poster and 2) "content" poster into a set/series. A series means they work together, share the same feeling, color palette (you should consider the use different proportions of the colors but the same palette.) How can the visual language be shared between the 2 posters. EXPLORE.

_ Grid: use the provided grid. Lock all elements to a corner of a module.
_ Poster size: 22 x 34 page (tall no horizontal posters),
_ Color: Limit your color palette to 3 - 5 colors + black/white. *use the same color palette on your final posters in the series.

Print all out in color on 11 x 17. Print one set in color or b/w full size so you have context of how large or small everything is.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Poster 1. Characteristics
The poster must include the following...
_ diagrammatically show at least 12 characteristics of your font
_ the entire alphabet, punctuation, numbers
_ classification
_ classification description

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Poster 2. Content: Information about the designer
The poster must include the following...
_ 1000 words (you can shorten your text to 1000 word min)
_ title (come up with a title)
_ name of the designer
_ birth/death
_ one quote (about your font or designer)
_ pull quote
_ (you may use content from poster 1)

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Monday, December 4
_ crit content posters
_ bring in characteristic posters
_ Which posters will you further explore and create as a set?
_ Animated Gif (photoshop animation)

HOMEWORK
Explore your ONE chosen direction with 3 variations.
You are exploring how you can make the posters more dynamic, more informational, more compelling, so VARIETY of exploration is key here. Not small movements. Big Changes. So on Wed you know what you have to refine and make perfect for the final.

Print one set full size tiled in color and the other 2 sets full size tiled in color or b/w.

Use this website to learn: will use it for the next quiz

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Poster 1. Characteristics
The poster must include the following...
_ diagrammatically show at least 12 characteristics of your font
_ the entire alphabet, punctuation, numbers
_ classification
_ classification description
_ name of the font
(you may use content from poster 2)

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Poster 2. Content: Information about the designer
The poster must include the following...
_ 1000 words (you can shorten your text to 1000 word min)
_ title (come up with a title)
_ name of the designer
_ birth/death
_ one quote (about your font or designer)
_ pull quote
_ (you may use content from poster 1)

The content outline listed above is a suggestion you have to use all the content listed above but if you think something makes more sense on the front then put it on the other poster. You have to use all the content but which side is ultimately up to you.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Wednesday, December 6
_ crit posters

_ Animated Gif (photoshop animation)
_ Test Print Tutorial
_ Sizing images down in photoshop
_ Embedding Aftereffects

Creating an animated gif in photoshop.
1) open Photoshop file size 1400 x 400 (or 200) pixels, 72 dpi
2) create your final layout with each element being a different layer (photoshop will animate based on what is turned on in a layer)
3) window: animation
4) use frames not timeline
5) in frame one turn on what you want the viewer to see (change time to .1 sec)
6) duplicate frame and turn next thing on. (repeat 5 and 6 until you are done)
7) add transitions
8) add more time where you want a pause
9) file save for web devices (will create a .gif)
10) test in a browser then upload to behance.
completely lost? google it how to create an animated gif in photoshop: link

HOMEWORK
Based on the class crit, refine the final direction and prepare to hand the following in on Monday.

We are happy to answer questions or look at your work one more time -- happy to do it.
BUT you only get 1 email. No back and forth emails.

Printed
_ 2 posters printed on the epson matte and trimmed (you are going to have to scale your posters down to print side by side on the 42 inch wide paper)

Posted on your behance.net page
examples: Megan | Lauren M | Brittney | Maggie
_ project description
_ 1 animated gif (at least your fonts name and classification or 1 characteristic)
_ 2 posters (side by side so we can see they are a series)*
_ 2 posters as single jpgs*
_ Aftereffects from Jeremy's class (upload to Vimeo and embed the code in Behance -- like you did with ISSUU -- look at the "options" before you get the code.
_ Process: at least 6 - 10 posters showing your process (you can remove these later but this is your process grade so make sure you show a nice range of process. You can show them small. Concider them as part of the design of the page -- treat them nicely.

*images that you are posting on behance should be 72 dpi, RGB (not cmyk) and 1400px wide x 800px tall.

Put your 2 final posters on the server as a pdf by 11:30 on Dec 14. ANY files not on the server by your class time, the project will be counted LATE which drops your letter grade by a full grade.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
THURSDAY, December 14: 11:30
FINALS WEEK
_ 2 posters printed on the epson matte and trimmed (you are going to have to scale your posters down to print side by side on the 42 inch wide paper)

Posted on your behance.net page (on-time!)
_ project description
_ 1 animated gif (at least your fonts name and 1 characteristic)
_ 2 posters (side by side), 1400px X 800px* tall
_ 2 posters as single 1400px X 800px* tall
_ Aftereffects from Jeremy's class
_ Process: at least 6 - 10 posters showing your process (you can remove these later but this is your process grade so make sure you show a nice range of process. You can show them small. Concider them as part of the design of the page -- treat them nicely.