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

Visual Design. It isn’t (just) about making things look pretty.

juliajamieson
November 22, 2014

Visual Design. It isn’t (just) about making things look pretty.

juliajamieson

November 22, 2014
Tweet

More Decks by juliajamieson

Other Decks in Design

Transcript

  1. Visual Design. It isn’t (just) about
    making things look pretty.
    Julia Jamieson
    ATOMIC
    CON

    View full-size slide

  2. Make this pretty.
    W H AT W E H E A R

    View full-size slide

  3. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Increase credibility

    Effectively communicate features

    Demonstrate “taste”

    Increase usability
    VISUAL DESIGN & YOUR CUSTOMER
    Strong visual design can:

    View full-size slide

  4. MORE USERS +
    SATISFIED CUSTOMERS
    = BETTER BUSINESS

    View full-size slide

  5. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Not about trendy fonts or swashes

    Not about decorating or making things look better

    Not about likes or dislikes
    WHAT VISUAL DESIGN IS NOT
    The ranty part of this talk

    View full-size slide

  6. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY

    View full-size slide

  7. Defending aesthetics is not just about
    the value of buttons or visual
    treatments. But rather, how people
    respond emotionally.
    I N D E F E N S E O F A E S T H E T I C S

    View full-size slide

  8. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    f o r h i g h u t i l i t a r i a n s a n d h i g h a e s t h e t i c s !
    T H E
    R E S E A R C H

    View full-size slide

  9. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    1 DO ATTRACTIVE THINGS WORK BETTER?
    An Exploration of Search Tool Visualisations
    A study on the role of aesthetics concludes that, though
    attractive things may not score higher in performance,
    people perceive attractive things as more usable.

    View full-size slide

  10. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    2 STANFORD CREDIBILITY PROJECT
    How users perceive credibility
    Stanford University conducted a study with 2500+
    participants on how people assess the credibility of a
    website.

    View full-size slide

  11. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    3 CONSUMER REPORTS
    According to this 2002 study, the “appeal of the overall
    visual design of a site, including layout, typography, font
    size, and color schemes,” is the number one factor we use to
    evaluate a website’s credibility.

    View full-size slide

  12. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    4 ATMS IN JAPAN
    Two machines, same functionality, different layout
    Researchers in Japan setup two ATMs, identical in function,
    the number of buttons, and how they worked.

    Researchers observed that subjects encountered fewer
    difficulties with the more attractive machine.

    View full-size slide

  13. Why is visual design important, and
    more than just making things pretty?
    T H I S C H A N G E S O U R Q U E S T I O N F R O M

    View full-size slide

  14. How does visual design influence
    behavior and emotion?
    T O :

    View full-size slide

  15. “Good design is aesthetic—The aesthetic
    quality of a product is integral to its
    usefulness because products we use every
    day affect our person and our well-being.
    But only well-executed objects can be
    beautiful.”
    Dieter Rams

    View full-size slide

  16. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    t o o l s t o c r e a t e v i s u a l l y
    S O , W H AT
    N O W ?

    View full-size slide

  17. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Have a clear typographic and visual hierarchy

    Follow consistent patterns

    Solve problems with the simplest solution possible

    Communicate a brand personality
    FOCUS ON CREATING PRODUCTS THAT
    From a high level:

    View full-size slide

  18. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    LEARNING TO
    SEE
    SIMPLICITY BE THE BORING
    DESIGNER
    Three Concepts
    1 2 3

    View full-size slide

  19. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    L E A R N I N G
    T O S E E

    View full-size slide

  20. “Learning to design is, first of all, learning to see.
    Designers see more, and more precisely.”
    Oliver Reichenstein, Information Architects

    View full-size slide

  21. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Seek out examples of design & study them

    Mimic great designs to understand them better
    LEARNING TO SEE

    View full-size slide

  22. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Atomic Con
    Yarrow Golf Resort
    November 20-22, 2014
    A time for all the Atoms in the molecule to enjoy
    some covalent bonding.

    View full-size slide

  23. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Atomic Con
    Yarrow Golf Resort
    November 20-22, 2014
    A time for all the Atoms in the molecule to enjoy some
    covalent bonding.

    View full-size slide

  24. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Atomic Con
    Yarrow Golf Resort
    November 20-22, 2014
    A time for all the Atoms in the molecule to enjoy some
    covalent bonding.

    View full-size slide

  25. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Atomic Con
    Yarrow Golf Resort
    November 20-22, 2014
    A time for all the Atoms in the molecule to enjoy
    some covalent bonding.

    View full-size slide

  26. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Atomic Con
    November 20-22, 2014 | Yarrow Golf Resort
    A time for all the Atoms in the
    molecule to enjoy some covalent
    bonding.

    View full-size slide

  27. “To clarify, add detail.”
    Edward Tufte

    View full-size slide

  28. “Good design is thorough down to the last
    detail—Nothing must be arbitrary or left to
    chance. Care and accuracy in the design
    process show respect towards the user.”

    Dieter Rams

    View full-size slide

  29. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    S I M P L I C I T Y

    View full-size slide

  30. “Less, but better”
    Dieter Rams

    View full-size slide

  31. L E S S B U T B E T T E R

    View full-size slide

  32. “Good design is as little design as possible
    —Less, but better— because it concentrates
    on the essential aspects, and the products
    are not burdened with non-essentials. Back
    to purity, back to simplicity.”
    Dieter Rams

    View full-size slide

  33. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    T H E B O R I N G
    D E S I G N E R
    b l o g . c a p w a t k i n s . c o m / t h e - b o r i n g - d e s i g n e r

    View full-size slide

  34. “If designers get too adventurous with usability, the result is
    generally a mishmash of quirky and hidden functions. When I
    say that good design is invisible, obviously I don’t mean
    obfuscating the use of a product by hiding the interface.”
    Oliver Reichenstein, Information Architects

    View full-size slide

  35. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Boring designers always choose consistency

    He or she will choose obvious over clever

    They are practical
    THE BORING DESIGNER
    Article by Cap Watkins | blog.capwatkins.com/the-boring-designer

    View full-size slide

  36. ATOMIC
    CON VISUAL DESIGN ISN'T (JUST) ABOUT MAKING THINGS LOOK PRETTY
    Start with a type system (Sketch Wireframes)

    Keep track of common rules of thumb

    Recycle ideas when you can
    TOOLS TO START BEING BORING
    To ensure client adoration

    View full-size slide

  37. Form follows function.
    1 9 0 0 ’ S

    View full-size slide

  38. Form and function should be one,
    joined in spiritual union.
    F R A N K L L O Y D W R I G H T

    View full-size slide

  39. http://uxmyths.com/post/1161244116/myth-25-aesthetics-are-not-important-if-you-have-good-us
    http://uxmag.com/articles/eye-candy-vs-bare-bones-in-ui-design
    http://conversionxl.com/first-impressions-matter-the-importance-of-great-visual-design/#.

    http://alistapart.com/article/indefenseofeyecandy
    http://www-users.cs.york.ac.uk/~pcairns/papers/ChawdaCraftCairns.pdf
    https://ia.net/blog/learning-to-see/
    http://blog.capwatkins.com/the-boring-designer
    S O U R C E S

    View full-size slide