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

Fontdeck: Realign not Redesign

Avatar for Paul Robert Lloyd Paul Robert Lloyd
February 12, 2011
Design
84
5.5k

Fontdeck: Realign not Redesign

Presentation for Multipack Presents: Show & Tell.
Avatar for Paul Robert Lloyd

Paul Robert Lloyd

February 12, 2011
Tweet

More Decks by Paul Robert Lloyd

See All by Paul Robert Lloyd
Designing Systems (Smashing Conference)
Avatar for Paul Robert Lloyd paulrobertlloyd
2
1.7k
Designing Systems (Design Exchange Nottingham)
Avatar for Paul Robert Lloyd paulrobertlloyd
6
940
Responsive Principles (WebExpo)
Avatar for Paul Robert Lloyd paulrobertlloyd
4
920
Responsive Principles (Front-end London, May 2015)
Avatar for Paul Robert Lloyd paulrobertlloyd
12
4.9k
This is for Everyone (LDNIA #4)
Avatar for Paul Robert Lloyd paulrobertlloyd
0
940
This is for Everyone (Speak the Web)
Avatar for Paul Robert Lloyd paulrobertlloyd
7
7.2k
The Edge of the Web (Async)
Avatar for Paul Robert Lloyd paulrobertlloyd
0
930
This is for Everyone (Port 80)
Avatar for Paul Robert Lloyd paulrobertlloyd
5
980
The Edge of the Web (Redux)
Avatar for Paul Robert Lloyd paulrobertlloyd
3
770

Other Decks in Design

See All in Design
株式会社デイトラ様│コーポレートサイト│コンセプトシート
Avatar for Haruka_CAPEO haruka_capeo
0
1.6k
241214_StackNagoya_プレイングマネージャーのプレイングの時間の使い方
Avatar for YurufuwaKiyoshi kiyoshifuwa
0
280
Flow, Not Stock 知識触媒としてのIA
Avatar for Takehisa Gokaichi 5kaichi
1
250
Les petites aventures de CSS, saison 2025
Avatar for Raphael Goetter goetter
3
4k
aya_murakami_portfolio
Avatar for aya ayakaimi1101
0
1.6k
生成AIを活用した組み込みSW設計書検索システム開発
Avatar for mtsukada licux
7
510
富山デザイン勉強会_デザイントレンド2025.pdf
Avatar for keita keita_yoshikawa
0
270
アップロード-職業訓練_ワンランク上に見せるデザインのコツ.pdf
Avatar for keita keita_yoshikawa
0
110
なぜプレイドにデザインエンジニアが必要だったのか？
Avatar for t32k t32k
0
250
苦労が多かった多言語対応をFigmaで楽にした話
Avatar for Pioneer pioneer_devrel
PRO
0
200
sachi_y_portfolio
Avatar for Sachi sachi337
0
140
新年あけおめWSの実施スキルをみんなで振り返りタイムのススメ
Avatar for sugiyama sugiyama_sukedachi
0
110

Featured

See All Featured
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
159
23k
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
35
2.7k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
523
40k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
52
7.6k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
223
9.6k
GitHub's CSS Performance
Avatar for Jon Rohan jonrohan
1031
460k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
32
2.3k
Navigating Team Friction
Avatar for Lara Hogan lara
185
15k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.3k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
172
14k
Designing for humans not robots
Avatar for Tammie Lister tammielis
253
25k
Unsuck your backbone
Avatar for Amy Palamountain ammeep
671
58k

Transcript

  1. Fontdeck Realign, not redesign Paul Lloyd, User Experience Designer Multipack

    Presents: Show and Tell Saturday 12 February 2011

  2. Who? ‣ Announced: May 2009 ‣ Private Beta: January 2010

    ‣ Launched: June 2010 Idea conceived by Richard Rutter (Clearleft) and Jon Tan (OmniTI) at SXSW in March 2009.

  3. ‣ 550+ typefaces and counting… ‣ 26 foundries—some exclusive to

    Fontdeck ‣ Prices start at $2.99/year. Average price ~$7.50/year ‣Try any font for free for an unlimited time What?

  4. A difficult birth

  5. Homepage

  6. Huh? — Potential Customers Why is Fontdeck different? How much

    does it cost?

  7. “Purveyors of the finest webfonts” Fontdeck is the professional webfont

    solution; easy to use yet flexible enough to meet the real needs of designers.

  8. Revised homepage based on the work of our hackday

  9. “Low hanging fruit” “Quick wins” These don’t exist!

  10. The challenge Provide an holistic design direction that could be

    implemented in stages.

  11. The Realignment

  12. Goal Communicate professionalism of the service and the quality of

    our library.

  13. PRIMARY COLOURS FONT CATEGORIES Links Slab Serif Sans Serif Serif

    Non Latin Display Script SECONDARY COLOURS

  14. Ag Adelle Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 Adelle Light ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz

    0123456789 Ag PT Sans Bold ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 PT Sans Regular ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 Georgia ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 Lucida Grande ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 0123456789 HEADINGS BODY COPY

  15. Typeface (before)

  16. Font specimen (before)

  17. Font specimen (after)

  18. Typeface (after)

  19. Goal Better communicate how the service works and how much

    it costs to use.

  20. About Fontdeck (before)

  21. About Fontdeck (after)

  22. Pricing page

  23. Homepage

  24. Goal Greater prominence for foundries and type designers.

  25. Designs (before)

  26. Designers (after)

  27. Something magical happened! We got excited about our product again.

  28. Refining the homepage

  29. James’ original homepage design from the hackday

  30. Iteration 1

  31. Iteration 2

  32. Iteration 3

  33. Iteration 4

  34. Iteration 5

  35. Iteration 6

  36. Iteration 7

  37. Iteration 8

  38. Did we realign… or redesign? You decide!

  39. ‣ fontdeck.com / @fontdeck ‣ paulrobertlloyd.com / @paulrobertlloyd Thank you!