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
80
5.1k
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
840
Responsive Principles (WebExpo)
paulrobertlloyd
4
800
Responsive Principles (Front-end London, May 2015)
paulrobertlloyd
12
4.7k
This is for Everyone (LDNIA #4)
paulrobertlloyd
0
850
This is for Everyone (Speak the Web)
paulrobertlloyd
7
7.1k
The Edge of the Web (Async)
paulrobertlloyd
0
790
This is for Everyone (Port 80)
paulrobertlloyd
5
840
The Edge of the Web (Redux)
paulrobertlloyd
3
680
Other Decks in Design
See All in Design
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
110
管理画面の全体UXは利用時品質モデルで考える
readymadegogo
1
1.6k
UXデザイナーが肩書きの私がいまUXデザインにそんなに興味がない理由 #uxd2024(字幕入り配布版)
versionfive
7
2.2k
新しいemoji😄のアイデアをUnicodeが募集中‼️🏃♀️💨💨💨傾向を学んでみんな提案しよう💪
oguemon
2
570
SpectrumTokyoMeetup12_自動貯金アプリ『finbee』での取り組みについて
shihorishimazu
2
340
Information Architects: The Missing Link in Design Systems
soysaucechin
0
250
Blender 4.1 で レッツ Vket Cloud!
kamera25
0
260
デザインレビューをできていなかったコムデチームが、 自分たちが続けられるレビューの仕組みをつくった話
tanasho
0
720
Baby Bear Genius
yvonnehsuanho
PRO
0
620
Making impact with your craft with sociotechnical design
xinyao
1
160
Les petites aventures de CSS, saison 2024
goetter
2
3.8k
雑誌『広告』をサイズ展開する
takuro_nakajima
PRO
0
1.9k
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1029
450k
How to Ace a Technical Interview
jacobian
275
23k
Six Lessons from altMBA
skipperchong
26
3.3k
Code Reviewing Like a Champion
maltzj
518
39k
Code Review Best Practice
trishagee
62
16k
RailsConf 2023
tenderlove
28
810
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
8.9k
Large-scale JavaScript Application Architecture
addyosmani
508
110k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
123
18k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
38
9.2k
Web development in the modern age
philhawksworth
204
10k
A Tale of Four Properties
chriscoyier
155
22k
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!