Fontdeck: Realign not Redesign

Presentation for Multipack Presents: Show & Tell.

Transcript

1. Fontdeck
   Realign, not redesign
   Paul Lloyd, User Experience Designer
   Multipack Presents: Show and Tell
   Saturday 12 February 2011
   

   View Slide

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.
   

   View Slide

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?
   

   View Slide

4. A difficult birth
   

   View Slide

5. Homepage
   

   View Slide

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

   View Slide

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.
   

   View Slide

8. Revised homepage based on
   the work of our hackday
   

   View Slide

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

   View Slide

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

    View Slide

11. The Realignment
    

    View Slide

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

    View Slide

13. PRIMARY COLOURS
    FONT CATEGORIES
    Links
    Slab Serif
    Sans Serif
    Serif Non Latin
    Display
    Script
    SECONDARY COLOURS
    

    View Slide

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
    

    View Slide

15. Typeface (before)
    

    View Slide

16. Font specimen (before)
    

    View Slide

17. Font specimen (after)
    

    View Slide

18. Typeface (after)
    

    View Slide

19. Goal
    Better communicate how the service
    works and how much it costs to use.
    

    View Slide

20. About Fontdeck (before)
    

    View Slide

21. About Fontdeck (after)
    

    View Slide

22. Pricing page
    

    View Slide

23. Homepage
    

    View Slide

24. Goal
    Greater prominence for foundries and
    type designers.
    

    View Slide

25. Designs (before)
    

    View Slide

26. Designers (after)
    

    View Slide

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

    View Slide

28. Refining the homepage
    

    View Slide

29. James’ original homepage
    design from the hackday
    

    View Slide

30. Iteration 1
    

    View Slide

31. Iteration 2
    

    View Slide

32. Iteration 3
    

    View Slide

33. Iteration 4
    

    View Slide

34. Iteration 5
    

    View Slide

35. Iteration 6
    

    View Slide

36. Iteration 7
    

    View Slide

37. Iteration 8
    

    View Slide

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

    View Slide

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

    View Slide