Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Fontdeck: Realign not Redesign
Search
Paul Robert Lloyd
February 12, 2011
Design
82
5.2k
Fontdeck: Realign not Redesign
Presentation for Multipack Presents: Show & Tell.
Paul Robert Lloyd
February 12, 2011
Tweet
Share
More Decks by Paul Robert Lloyd
See All by Paul Robert Lloyd
Designing Systems (Smashing Conference)
paulrobertlloyd
2
1.6k
Designing Systems (Design Exchange Nottingham)
paulrobertlloyd
6
860
Responsive Principles (WebExpo)
paulrobertlloyd
4
840
Responsive Principles (Front-end London, May 2015)
paulrobertlloyd
12
4.8k
This is for Everyone (LDNIA #4)
paulrobertlloyd
0
870
This is for Everyone (Speak the Web)
paulrobertlloyd
7
7.1k
The Edge of the Web (Async)
paulrobertlloyd
0
830
This is for Everyone (Port 80)
paulrobertlloyd
5
870
The Edge of the Web (Redux)
paulrobertlloyd
3
710
Other Decks in Design
See All in Design
デザインシステム構築の進め方 基本から実践まで、具体的な手順を徹底解説
ncdc
1
190
急成長中のWINTICKETにおける ちいさくはじめるライティング改善 / winticket-writing
cyberagentdevelopers
PRO
1
150
Карта процесса-опыта. Презентация метода
ashapiro
0
320
Managing Design Systems (Antwerp 2024)
nathanacurtis
1
290
Картирование процесса фасилитация стратсессий с Картой гипотез при помощи Карты процесса-опыта
ashapiro
0
400
アクセシビリティのはじめかた デザイナー編
tokimari
3
1.4k
デザインからアプリ実装まで一貫したデザインシステムを構築するベストプラクティス
shuzo
13
6k
拡大するマルチプロダクトSaaSの顧客理解にデザイン組織はどう取り組んでいるか / RAKUSTechCon2024_Design
rakus_dev
0
2.1k
デザインスプリントを活かすチームの在り方
mixi_design
PRO
2
780
Fleet Gas Station
joshtang
0
140
Карта реализации историй — убийца USM
ashapiro
0
200
Dreamia
elsh
0
160
Featured
See All Featured
The Art of Programming - Codeland 2020
erikaheidi
52
13k
Facilitating Awesome Meetings
lara
50
6.1k
It's Worth the Effort
3n
183
27k
The Pragmatic Product Professional
lauravandoore
31
6.3k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Imperfection Machines: The Place of Print at Facebook
scottboms
264
13k
Building Better People: How to give real-time feedback that sticks.
wjessup
364
19k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Testing 201, or: Great Expectations
jmmastey
38
7.1k
Fireside Chat
paigeccino
33
3k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
43
6.8k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5k
Transcript
Fontdeck Realign, not redesign Paul Lloyd, User Experience Designer Multipack
Presents: Show and Tell Saturday 12 February 2011
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.
‣ 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?
A difficult birth
Homepage
Huh? — Potential Customers Why is Fontdeck different? How much
does it cost?
“Purveyors of the finest webfonts” Fontdeck is the professional webfont
solution; easy to use yet flexible enough to meet the real needs of designers.
Revised homepage based on the work of our hackday
“Low hanging fruit” “Quick wins” These don’t exist!
The challenge Provide an holistic design direction that could be
implemented in stages.
The Realignment
Goal Communicate professionalism of the service and the quality of
our library.
PRIMARY COLOURS FONT CATEGORIES Links Slab Serif Sans Serif Serif
Non Latin Display Script SECONDARY COLOURS
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
Typeface (before)
Font specimen (before)
Font specimen (after)
Typeface (after)
Goal Better communicate how the service works and how much
it costs to use.
About Fontdeck (before)
About Fontdeck (after)
Pricing page
Homepage
Goal Greater prominence for foundries and type designers.
Designs (before)
Designers (after)
Something magical happened! We got excited about our product again.
Refining the homepage
James’ original homepage design from the hackday
Iteration 1
Iteration 2
Iteration 3
Iteration 4
Iteration 5
Iteration 6
Iteration 7
Iteration 8
Did we realign… or redesign? You decide!
‣ fontdeck.com / @fontdeck ‣ paulrobertlloyd.com / @paulrobertlloyd Thank you!