Save 37% off PRO during our Black Friday Sale! »

More Than Type

B3604665479456ed6fc1d7c5d932e03b?s=47 Sean McBride
April 12, 2013

More Than Type

The typographic landscape on the web today would have been unrecognizable to a designer in 2009. “Web-safe fonts” were the rule of the land, and web fonts were a technical eccentricity, hobbled by problems with licensing, availability, and technology. From that environment, Typekit set out to build a business bringing commercial type to the web, and in the four years since then, the industry has tackled those problems. But in the process, Typekit discovered that their customers needed more than just access to good type. Sean will tell the story of how Typekit has approached those broader customer needs, and the successes and mistakes made along the way. The impact touches every aspect of Typekit’s business, from the way they sell the product to how they do editorial and support. Type has finally arrived on the web; now we must give customers the confidence to use type well.

Presented at TYPO SF on April 12, 2013.

B3604665479456ed6fc1d7c5d932e03b?s=128

Sean McBride

April 12, 2013
Tweet

Transcript

  1. Type MORE THAN #typo13 #more @smcbride

  2. Sean McBride Engineer & Product Developer User Experience Web Developer

  3. ?

  4. #typo13 #more @smcbride

  5. Before The Web Untitled by neil conway on Flicker

  6. 600 Y E A R S O F T Y

    P O G R A P H Y
  7. Thousands of Fonts

  8. 1993 No fonts

  9. 2008 18 fonts

  10. None
  11. None
  12. None
  13. @font-face

  14. May 2009 Typekit

  15. None
  16. None
  17. None
  18. Browser compatibility Licensing concerns Building the font library Designer workflow

    Web font formats and protection Font rendering quality Basic functionality
  19. May 2010 Gallery

  20. None
  21. Amazement “Wow, I can actually use real fonts on my

    website!” Anticipation “Just think of all the great things I can do with these fonts!” Paralysis “Wait, I’ve only ever used Verdana and Georgia in my work!” More Than Type Inspiration Paralysis “Wait, I’ve only ever used Verdana and Georgia in my work!”
  22. Physiological Safety Love + belonging Esteem Self-actualization Food, water, shelter,

    clothing, sleep, comfort Personal and financial security, health, order, law Friendship, love, intimacy, family, community Achievement, status, confidence Peace, growth, knowledge
  23. Functionality Reliability Usability Proficiency Creativity Design works and meets basic

    functional needs Stable and consistent performance Forgiving and easy to use Empower users to do more + better Beauty, innovation http://www.smashingmagazine.com/2010/04/26/designing-for-a-hierarchy-of-needs/
  24. Functionality Reliability Usability Proficiency Creativity Design works and meets basic

    functional needs Stable and consistent performance Forgiving and easy to use Empower users to do more + better Beauty, innovation More Than Type
  25. Choosing fonts Browsing

  26. May 2009

  27. None
  28. June 2010

  29. Sorting options Different view options Change sample text Functionality Reliability

    Usability Proficiency Creativity Usability
  30. October 2011

  31. Understand categories and aspects of fonts How are fonts different

    from one another? Recommended uses Quickly narrow and expand set, encourage play Functionality Reliability Usability Proficiency Creativity Proficiency
  32. None
  33. Categories and properties are useful, but what about the fun

    and whimsy of tags?
  34. January 2012

  35. None
  36. None
  37. Explore related groups of typefaces Browse curated lists with editorial

    content Learn about when to use certain styles Understand how typefaces relate to each other Functionality Reliability Usability Proficiency Creativity Creativity Proficiency
  38. March 2012

  39. None
  40. Find a particular typeface Find similar typefaces through lists and

    posts Find inspiration for using a typeface from the blog Find typefaces that fit a theme Functionality Reliability Usability Proficiency Creativity Creativity Proficiency
  41. Surface content in multiple ways Structured metadata can teach Curated

    collections can teach and inspire Font Browsing
  42. Education and inspiration The Blog

  43. None
  44. February 2010 Tim Brown

  45. July 2010

  46. August 2010 Mandy Brown

  47. Blog Series Type Rendering

  48. October 2010

  49. October 2010

  50. November 2010

  51. December 2010

  52. December 2010

  53. December 2010

  54. Blog Series Type Studies

  55. January 2011

  56. None
  57. None
  58. March 2011

  59. None
  60. March 2011

  61. None
  62. None
  63. Blog Series About Face

  64. August 2011

  65. None
  66. None
  67. July 2012

  68. None
  69. None
  70. May 2012

  71. None
  72. None
  73. None
  74. None
  75. Eventually Hybrid Formats

  76. March 2012

  77. None
  78. May 2012

  79. None
  80. None
  81. July 2012 Functionality Reliability Usability Proficiency Creativity Creativity Proficiency Get

    inspired by typefaces in use Learn about techniques for using type better Find related typefaces that pair well together Learn how to analyze a typeface’s design
  82. Good content requires planning Get experts to write what they

    know Content can teach, inspire, and inform The Blog Give people ideas and the tools to try them
  83. Back to the Beginning

  84. At first, delivering fonts seemed like the challenge

  85. Once the fonts were available, other challenges presented themselves

  86. Web designers come from many backgrounds and they don’t all

    know how to use type
  87. Typography has never been so accessible

  88. Typography has never been so valuable

  89. In order to unlock the value of type, we had

    to provide more than type
  90. Knowledge about why type is important Frameworks for choosing and

    using type Inspiration for using type well Confidence to step outside the comfort zone
  91. These lessons are applicable to more than type

  92. Knowledge How does history relate? Frameworks What are the ways

    it can be used? Inspiration Who’s using it, and how? Confidence How can we lower barriers to entry?
  93. Functionality Reliability Usability Proficiency Creativity Design works and meets basic

    functional needs Stable and consistent performance Forgiving and easy to use Empower users to do more + better Beauty, innovation “More Than” UX More Than Type
  94. Thank you!

  95. Type MORE THAN #typo13 #more @smcbride