Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Tools, techniques, and innovation (in typographic design)

Gerry Leonidas
November 23, 2013

Tools, techniques, and innovation (in typographic design)

A lecture on the relationship of tools and technique in type- and typographic design.

Gerry Leonidas

November 23, 2013
Tweet

More Decks by Gerry Leonidas

Other Decks in Design

Transcript

  1. Tools, techniques, 

    and innovation 

    (in typographic design)
    !
    Gerry Leonidas

    View Slide

  2. What is easier to talk about, 

    or sounds more fascinating, 

    or appears obvious,
    may not be the most 

    useful thing to consider.

    View Slide

  3. “Doing design” is three discreet aspects:
    > how people think about stuff,
    > how they make decisions,
    > and how they make that stuff.

    View Slide

  4. Some ideas from yesterday’s talks:
    > loss of (or emphasis on) materiality 

    (via, not only, Richard Hollis’ “physicality 

    of graphic design”)
    > imposed frameworks of interpretation

    (via the tyranny of Excel’s matrix)

    View Slide

  5. > the “designers, learn to code” mantra
    > tension between form-making

    and encoding
    > the overlapping roles of people
    > design as a process to create meaning 

    and enable understanding

    View Slide

  6. These are all aspects of the same thing.
    !
    Like Berger’s “Ways of seeing”, 

    we want to make making visible.

    View Slide

  7. Four routes into this:
    1. effects of dematerialisation*
    2. language of describing and specifying
    3. tension between models and encodings
    and…
    * not “immaterial”, because the physical paradigms survive

    View Slide

  8. (the elephant in the room)
    4. the space for innovation and invention

    View Slide

  9. An example:

    View Slide

  10. Typecon 2013, Portland
    !
    Kevin Larson & Matthew Carter report 

    on reading tests comparing Sitka with
    Georgia, Swift, and Paperback

    View Slide

  11. Sitka looks like this
    Georgia looks like this
    Swift looks like this
    (Paperback does not look like this)

    View Slide

  12. “We were not able to find 

    any statistically significant 

    difference between them”
    !
    !
    Which means that…

    View Slide

  13. …at a line- and paragraph level,
    !
    Well-designed typefaces are not

    distinguished by performance


    View Slide

  14. !
    !
    but by identity and association, 

    which are extrinsic to the “visible”

    encoding of the design.

    View Slide

  15. Therefore, the key question is:
    !
    “Is this typeface well designed?”

    View Slide

  16. Or, better:
    !
    “How can we talk about the design of 

    typefaces in a way that helps people

    make more well-designed typefaces?”

    View Slide

  17. This is one of the key challenges 

    in teaching typeface design.
    !
    !
    !
    And most common in a type crit, like…

    View Slide

  18. type crit on the MATD wall, image by Ben Mitchell

    View Slide

  19. [the objective is:]
    to help the student become conscious

    of how they absorb influences and 

    make decisions, through the narrow 

    medium of typefaces

    View Slide

  20. This is more difficult when our ways 

    of talking about typefaces are unfamiliar 

    to the designers, like in the…

    View Slide

  21. Type crit in ATypI Amsterdam
    image from porchez.com

    View Slide

  22. Here, the objective is:
    To give feedback 

    > without imposing your style or taste,

    > equally across projects, and

    > consistently across sessions.

    View Slide

  23. !
    !
    !
    !
    So here are some pointers 

    for typeface reviews:

    View Slide

  24. Pointers for typeface reviews (1/3):
    > fit of typeset text within the brief
    > key dimensions within the body
    > stroke thickness range
    > balance of key strokes and space 

    within and between letters

    View Slide

  25. Pointers for typeface reviews (2/3):
    > stroke modulation
    > in/out stroke recipes
    > alignments in H and V axes
    > transitions between letter elements

    View Slide

  26. Pointers for typeface reviews (3/3):
    > relating of inner and outer strokes
    > letter shapes within key patterns
    > integration of exceptions

    View Slide

  27. !
    No part of this discussion needs 

    to rely on language derived from

    the technology of type-making.

    View Slide

  28. Ways of looking at typographic design:
    1. objectives
    2. tools
    3. language
    4. evidence

    View Slide

  29. !
    1. through the way a brief are expressed
    2. through the means of realising the brief
    3. through our discussions with peers
    4. through the records that connect the

    results to other acts of designing

    View Slide

  30. 1. objectives
    !

    View Slide

  31. [an axiom:]
    Each new technology answers the 

    problems of the one it replaces

    View Slide

  32. !
    Each new technology answers the 

    problems of the one it replaces
    so, what we want is expressed in the 

    parameters of the older environment

    View Slide

  33. The initial brief here is:
    “make me something that looks close 

    enough to a book on a small screen”
    (and not: “what is the act of reading 

    on a portable digital device?” )
    [next slide]

    View Slide

  34. View Slide

  35. The initial brief here is:
    “make me something that looks close 

    enough to a desktop pasteboard”
    (and not: “what decisions does the act 

    of document composition involve?” )
    [next slide]

    View Slide

  36. View Slide

  37. The initial brief here is:
    “make me something that looks close 

    enough to a familiar word processor”
    (and not: “how do we enable text 

    composition for an online platform?” )
    [next slide]

    View Slide

  38. View Slide

  39. !
    How many user-cycles does it take 

    for new uses to be imagined?
    !
    and the use of a technology to 

    migrate to native paradigms?

    View Slide

  40. [next slide example]
    Typecast makes text hierarchies

    visible during authoring

    View Slide

  41. View Slide

  42. [next slide example]
    Kindle’s X-Ray indexes and 

    cross-references the text you 

    are reading

    View Slide

  43. View Slide

  44. [next slide example]
    Readmill shows shared highlights 

    and enables local comments

    View Slide

  45. View Slide

  46. [next slide example]
    Medium, Quartz, and the Guardian 

    allow comments at a paragraph level

    View Slide

  47. View Slide

  48. View Slide

  49. 2. tools
    !

    View Slide

  50. !
    What is the impact of type-making 

    and typesetting technologies on

    decisions about typography and 

    the forms of letters?

    View Slide

  51. [next slide example: on our way of 

    thinking about things]
    Ikarus, FontStudio, Fontographer, 

    Glyphs, Robofont, FontForge: 

    what is the best way to represent

    a character complement?

    View Slide

  52. View Slide

  53. [next slide comment]
    Given how many of these glyphs are 

    derivatives (components or automatically

    generated), does this arrangement mislead 

    as to the design problems in the typeface?

    View Slide

  54. View Slide

  55. Which design decisions (or the setup 

    to make decisions) can be automated?

    View Slide

  56. In other words: 

    To what degree, if at all, are meaningful 

    decisions (the ones that matter for users) 

    possible to systematise?

    View Slide

  57. [next slide example]
    Accents that are consistent within 

    a typeface may take very different forms

    across typefaces.
    What is topologically “correct”

    View Slide

  58. across letters, within a typeface, and
    across typefaces within a letter:
    àààà áááá ââââ åååå
    èèèè éééé êêêê ěěěě

    View Slide

  59. [previous slide example]
    What is topologically “correct” and 

    well-encoded in its outlines, may be 

    stylistically inappropriate, or even 

    culturally wrong.

    View Slide

  60. !
    Decisions on shapes and space 

    can always be “well-formed” technically.


    View Slide

  61. !
    Decisions on shapes and space 

    can always be “well-formed” technically.


    They are good or bad, appropriate or not, 

    for a specific context only.

    View Slide

  62. 3. language
    !

    View Slide

  63. [next slide comment]
    A 1952 drawing for a Linotype Metro Black 

    letter: a snapshot at the end of a series of

    design decisions, that on its own tells us 

    little about the qualities of the design.

    View Slide

  64. View Slide

  65. !
    Is the definition of shapes and the
    specification of behaviour enough?

    View Slide

  66. [next slide comment]
    Here’s a proof of a –redacted– typeface, 

    with just one set of comments surrounding 

    the letters: We can learn more from these 

    comments than any “production-ready”
    encodings for making the typeface.

    View Slide

  67. View Slide

  68. [next slide comment]
    But how well does our “niche” language 

    support design decisions?
    Frank Chimero’s example from a recent 

    blog post is telling.

    View Slide

  69. Frank Chimero: 

    code as temporary substitute for language
    !
    frankchimero.com / what-screens-want

    View Slide

  70. View Slide

  71. View Slide

  72. [next slide comment]
    This reminded me of Ewan Clayton’s 

    descriptions of writing motions to the 

    MATD students, a couple of weeks

    earlier:

    View Slide

  73. Ewan Clayton
    !

    View Slide

  74. Ewan Clayton
    using 

    Rudolf Laban’s 

    dance notation

    View Slide

  75. [next slide comment]
    So, when we attempt to describe typefaces 

    as disparate as Formal, Fenland, and 

    Enquire, individual shapes may be 

    described with precision, but the style is 

    captured by metaphor and association.

    View Slide

  76. adhesion for rugby
    adhesions for rugby
    adhesions for rugby

    View Slide

  77. 4. evidence

    View Slide

  78. View Slide

  79. [previous slide comment]
    Going back to the comparison of foundry

    and screen type from earlier, we may ask:

    View Slide

  80. !
    Which decisions add value to the object?

    View Slide

  81. !
    How are people, places, and conditions

    of document-making captured?


    View Slide

  82. [next slide comment]
    And, a comment on the statement we 

    heard that “everything we need to learn 

    is on Google”. Data and some information, 

    yes; but rarely the tools to create knowledge 

    and understanding. For example:

    View Slide

  83. View Slide

  84. [previous slide comment]
    Monotype’s Drawing Office Image: raises 

    questions of traceability, collaboration, 

    institutional memory, industrial relations, 

    gender bias… None of these aspects are 

    embedded in the image itself.

    View Slide

  85. !
    Typography and typeface design
    are interesting because they reflect
    the tension between tradition 

    and modernity.

    View Slide

  86. [next slide comment]
    A spread from Octavo on its own does 

    not tell you much about technological 

    shifts, the typographic context within which 

    this was groundbreaking, why it generated

    discussion, or what the arguments were.

    View Slide

  87. View Slide

  88. [next slide comment]
    Today an equivalent discussion about 

    innovation is taking place in the rethinking 

    of typefaces, in width (character sets), in 

    depth (family variants) and in richness 

    (the relationship between styles).


    View Slide

  89. View Slide

  90. !
    !
    !
    !
    !
    [in conclusion:]

    View Slide

  91. Design matters because it forms
    the way we perceive and interact
    with our environment.

    View Slide

  92. And if we don’t consciously talk about

    design interpretations and decisions,
    then the most obvious substitute, 

    the narrower language of making 

    will define the range of our expression.

    View Slide

  93. !
    Thank you


    @gerryleonidas
    @typefacedesign

    View Slide