SM2222: Information Design and Visualization
This presentation is the property of its rightful owner.
Sponsored Links
1 / 78

SM2222: Information Design and Visualization Session 3: Typography 23 September 2005 PowerPoint PPT Presentation


  • 85 Views
  • Uploaded on
  • Presentation posted in: General

SM2222: Information Design and Visualization Session 3: Typography 23 September 2005. what is typography?. the Greek words - typos = “form” , grapho = “write”

Download Presentation

SM2222: Information Design and Visualization Session 3: Typography 23 September 2005

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Sm2222 information design and visualization session 3 typography 23 september 2005

SM2222: Information Design and Visualization

Session 3: Typography

23 September 2005


What is typography

what is typography?

  • the Greek words - typos = “form” , grapho = “write”

  • the art and technique of selecting and arranging type styles, point sizes, line lengths, line leading, character spacing, and word spacing for typeset applications.

  • the presentation of text in a manner that is not only easy to read but also visually engaging


Johannes gutenberg 1398 1468

Johannes Gutenberg (1398 –1468)

  • German metal-worker

  • inventor of movable type


Sm2222 information design and visualization session 3 typography 23 september 2005

Gutenberg Bibles. February 23, 1455


Classifications of type

classifications of type

  • Black Letter

  • Roman

  • Old Style

  • Transitional

  • Modern

  • Egyptian

  • Sans Serif


Classifications of type black letter

classifications of type – black letter


Classifications of type roman

classifications of type - roman


Classifications of type old style

classifications of Type – old style

  • a style of Roman letter

  • less thick and thin contrast

  • typefaces: Garamond (1530), Caslon (1734), Palatino (1948)


Classifications of type transitional

classifications of Type – transitional

  • new letterform was developed in 1702 – 1737

  • intermediate between Old Style and Modern

  • greater contrast between capital and lowercase letters

  • typefaces: Baskerville, Century Schoolbook


Classifications of type modern

classifications of Type – modern

  • it was introduced in France in 1784

  • extreme thick and thin contrast, no bracketed serifs

  • typefaces: Bondoni (1787)


Classifications of type egyptian slab serif

classifications of Type – egyptian/slab serif

  • squared-off serifs were introduced

  • reflected the rigidness of ancient Egyptian hieroglyphics

  • typefaces: Rockwell (1933), Geometric Slabserif


Classifications of type sans serif

classifications of Type – sans serif

  • without the thick and thin line variations

  • without ornamentation

  • extreme thick and thin contrast, no bracketed serifs

  • typefaces: Futura (1927), Helvetica (1957), Univers


Timeline

Timeline


A period of bauhaus 1919 1933

a period of bauhaus (1919 – 1933)

  • established in German in 1919

  • WWI 1914 - 1918

  • founded by Walter Gropius

  • form follows function

  • to unify art, craft, and technology

  • architecture, furniture design,

    typography, graphic design


Laszlo moholy nagy 1895 1946

Laszlo Moholy-Nagy (1895 – 1946)

“Typography is a tool of communication. It must be communication in its most intense form. The emphasis must be on absolute clarity...Legibility – communication must never be impaired by an a priori esthetics. Letters must never be forced into a preconceived framework…We want to create a new language of typography whose elasticity, variability and freshness of typographical composition”


Herbert bayer 1900 1985

Herbert Bayer (1900-1985)

  • omitted capital letters in 1925

  • experimented with flush-left, ragged-right

  • design universal type to maximize legibility

  • extreme contrasts of type size and weight

  • bars, rules, points and squares were used


Jan tschichold 1902 1974

Jan Tschichold (1902–1974)

  • issued 24-page of “elementare typographie” in 1925

  • demonstrated asymmetrical typography

  • the aim of typographic work delivers a message in the shortest and most efficient manner

  • type should be placed in motion rather than at rest

  • type should be elementary in pure form w/o ornament (such as Sans Serif)


Eric gill 1882 1940

Eric Gill (1882–1940)

  • Gill Sans designer

  • inspired by Edward Johnston’s alphabet

  • typefaces designed in 1928 - 1930


Paul renner 1878 1956

Paul Renner (1878-1956)

  • Futura designer

  • inspired by Bayer’s universal alphabet

  • typefaces designed in 1927


Sm2222 information design and visualization session 3 typography 23 september 2005

Union Pacific Railroad


Herb lubalin 1918 1981

Herb Lubalin (1918 - 1981)

  • space and surface

  • characters as both visual form and message communication

  • letterforms became images, images became letterforms

  • making type talk

  • phototypography


The anatomy of type

the anatomy of type


Sm2222 information design and visualization session 3 typography 23 september 2005

  • Upper & Lower case

  • Numbers : 0 – 9

  • Punctuation marks

  • Special Characters: $,…


Sm2222 information design and visualization session 3 typography 23 september 2005

  • Ascender

  • Descender

  • X – height

  • Baseline

  • Serif

  • Stem

  • Counter


Sm2222 information design and visualization session 3 typography 23 september 2005

  • Point and Pica

  • 6 picas = 1 inch

  • 12 points = 1 pica

  • 72 points = 1 inch


Sm2222 information design and visualization session 3 typography 23 september 2005

leading


Sm2222 information design and visualization session 3 typography 23 september 2005

kerning


Sm2222 information design and visualization session 3 typography 23 september 2005

alignment


Sm2222 information design and visualization session 3 typography 23 september 2005

emphasis: a block of text


Sm2222 information design and visualization session 3 typography 23 september 2005

hierarchy


Sm2222 information design and visualization session 3 typography 23 september 2005

horizontal & vertical scaling


Type and visual

type and visual


Sm2222 information design and visualization session 3 typography 23 september 2005

david carson


  • Login