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

Designing on Purpose - GiantConf 2014

Designing on Purpose - GiantConf 2014

In a multi-device world, the design process can feel overwhelming. There are so many variables to account for, so many in betweens, and so much to do. Designers are working frantically to keep all the balls in the air. Clients are wanting a window into the designer’s work and the ability to review and approve as projects move along. Many designers don’t know what the deliverables should be anymore, and neither do their clients. In this session, you’ll learn a simple process you can walk your client or team through that will help ensure valuable deliverables, clear goals, and happy clients. This session will touch on a lot of topics, but it will be very practical with specific takeaways you can begin using right away to help organize and guide your next project. The process outlined will not lock designers into specific tools that defy their personal preferences, but rather provide a framework for understanding why and when to do what within the design process. We’ll cover everything from project kick-offs to content strategy within the design process all the way to visual style application.

Jared Ponchot

June 12, 2014
Tweet

More Decks by Jared Ponchot

Other Decks in Design

Transcript

  1. Jared Ponchot // @jponch // GiantConf 2014
    Design Process & Deliverables in the Responsive Age
    DESIGNING ON PURPOSE

    View full-size slide

  2. MO’ DEVICES
    MO’ PROBLEMS
    Photo wallpaper of Notorious BIG from alphacoders.com

    View full-size slide

  3. PURPOSE, NOT PREFERENCE
    PRIORITY, NOT PLACEMENT
    SYSTEMS, NOT PAGES

    View full-size slide


  4. — Victor Papanek
    DESIGN IS THE CONSCIOUS EFFORT
    TO IMPOSE A MEANINGFUL ORDER

    View full-size slide

  5. Audi A7 Sportback plans from the-blueprints.com

    View full-size slide

  6. Audi A7 Sportback plans from the-blueprints.com

    REQUREMENTS GATHERING

    CONCEPT DESIGN

    MARKET RESEARCH

    TEST CAR

    FINAL DESIGN

    View full-size slide

  7. Audi A7 Sportback plans from the-blueprints.com

    REQUREMENTS GATHERING

    CONCEPT DESIGN

    MARKET RESEARCH

    TEST CAR

    FINAL DESIGN

    View full-size slide

  8. Audi A7 Sportback plans from the-blueprints.com

    REQUREMENTS GATHERING

    CONCEPT DESIGN

    MARKET RESEARCH

    TEST CAR

    FINAL DESIGN

    View full-size slide

  9. Audi A7 Sportback plans from the-blueprints.com

    REQUREMENTS GATHERING

    CONCEPT DESIGN

    MARKET RESEARCH

    TEST CAR

    FINAL DESIGN

    View full-size slide

  10. Audi A7 Sportback plans from the-blueprints.com

    REQUREMENTS GATHERING

    CONCEPT DESIGN

    MARKET RESEARCH

    TEST CAR

    FINAL DESIGN

    View full-size slide

  11. DISCOVER

    strategists
    !
    DESIGN

    designers
    !
    DEVELOP

    developers
    !
    DEPLOY

    client & users
    SOUND FAMILIAR?

    View full-size slide

  12. Audio A7 Sportback photo from exclusivecardesign.blogspot.com

    View full-size slide

  13. Audio A7 Sportback photo from exclusivecardesign.blogspot.com

    View full-size slide

  14. Audio A7 Sportback photo from exclusivecardesign.blogspot.com

    View full-size slide

  15. DISCOVER

    strategists
    !
    DESIGN

    designers
    !
    DEVELOP

    developers
    !
    DEPLOY

    client & users
    FAMILIAR PROCESS

    View full-size slide

  16. WHISPER DOWN THE
    LANE DESIGN
    Photo from http://failblog.cheezburger.com

    View full-size slide

  17. WHY HAVE WE
    DONE IT THIS WAY?

    View full-size slide

  18. ALLITERATION is

    ALMOST
    ALWAYS
    AWESOME

    View full-size slide

  19. FAMILIARITY IS
    FANTASTIC

    View full-size slide


  20. — Paul Rand
    THE PUBLIC IS MORE FAMILIAR WITH BAD
    DESIGN THAN GOOD DESIGN. IT IS, IN EFFECT,
    CONDITIONED TO PREFER BAD DESIGN, BECAUSE
    THAT IS WHAT IT LIVES WITH. THE NEW BECOMES
    THREATENING, THE OLD REASSURING.

    View full-size slide

  21. DIVISION OF LABOR

    View full-size slide

  22. STRATEGISTS UX/DESIGNERS FRONTEND DEVS BACKEND DEVS
    DIVISION OF LABOR

    View full-size slide

  23. STRATEGISTS UX/DESIGNERS FRONTEND DEVS BACKEND DEVS
    DIVISION OF LABOR: RESPONSIVE DESIGN

    View full-size slide


  24. — Fred Brooks
    9 WOMEN CAN’T MAKE
    A BABY IN 1 MONTH!

    View full-size slide

  25. KEEP EVERYONE FOCUSED
    ON PURPOSE & CONTENT
    not process or deliverables

    View full-size slide

  26. CREATE LIGHTER WEIGHT,
    LIVING COMMUNICATION TOOLS
    not deliverables

    View full-size slide

  27. THE BIG
    REVEAL

    View full-size slide

  28. DISCOVER

    strategists
    !
    DESIGN

    designers
    !
    DEVELOP

    developers
    !
    DEPLOY

    client & users
    INSTEAD OF THIS ...

    View full-size slide

  29. PURPOSE CONTENT
    STYLE
    STRATEGY

    DESIGN

    DEVELOPMENT

    View full-size slide

  30. FOCUS ON

    OUR REAL VALUE

    View full-size slide

  31. PURPOSE
    CONTENT
    STYLE

    View full-size slide

  32. DESIGN IS PROBLEM DISCOVERY
    & problem Solving

    View full-size slide


  33. — Albert Einstein
    IF I HAD AN HOUR TO SOLVE A PROBLEM AND MY LIFE
    DEPENDED ON THE SOLUTION, I WOULD SPEND THE FIRST
    55 MINUTES DETERMINING THE PROPER QUESTION TO
    ASK, FOR ONCE I KNOW THE PROPER QUESTION, I COULD
    SOLVE THE PROBLEM IN LESS THAN 5 MINUTES.

    View full-size slide

  34. http://www.youtube.com/watch?v=SnXtuktNdlM

    View full-size slide

  35. WHAT IMPACT WILL THAT HAVE?

    View full-size slide

  36. WHAT WILL THAT GET YOU?

    View full-size slide

  37. THE RIGHT QUESTIONS CAN
    HELP THE CLIENT DO THEIR JOB,
    & SET YOU UP TO DO YOURS

    View full-size slide


  38. — Andy Rutledge
    YOU MAY BE SURPRISED, BUT I
    NEVER ASK DESIGN-RELATED
    QUESTIONS IN DESIGN PROJECT
    DISCOVERY MEETINGS.

    View full-size slide


  39. — Andy Rutledge
    THE REASON I DON’T ASK DESIGN
    QUESTIONS OF THE CLIENT IS THE SAME
    REASON AN ARCHITECT DOESN’T ASK
    THE CLIENT WHAT PSI THE BUILDING’S
    LOAD-BEARING FOUNDATIONAL
    STRUCTURES WILL NEED TO ENDURE.

    View full-size slide

  40. WE CAN’T SOLVE PROBLEMS FOR
    OUR CLIENTS BASED ON THEIR
    PERSONAL PREFERENCES IN
    COLOR, TYPOGRAPHY & TEXTURE!

    View full-size slide

  41. Photo from http://www.deceptology.com/2010/04/upside-down-world-map-shows-north-is-up.html

    View full-size slide

  42. Tesco Subway Store in South Korea image from littledoremi.com

    View full-size slide

  43. from evigo.com

    View full-size slide

  44. from jcdecaux-oneworld.com

    View full-size slide

  45. Tesco Subway Store in South Korea image from littledoremi.com

    View full-size slide

  46. photo from theofficedealer.com

    View full-size slide

  47. REFRAMING THE PROBLEM

    View full-size slide


  48. — Harry West, Contimuum
    I WANTED TO LOOK AT THE PROBLEM
    AS THOUGH I’D JUST STEPPED OFF A
    SPACESHIP FROM MARS.

    View full-size slide

  49. Photo from http://optigarden.com/tag/coffee-grounds/

    View full-size slide

  50. Swiffer photo from ivillage.com

    View full-size slide

  51. CONTEXT &
    RELATIONSHIP

    View full-size slide

  52. photo from washingtoncitypaper.com

    View full-size slide

  53. Washington Post: Stop & Hear the Music http://www.youtube.com/watch?v=hnOPu0_YWhw

    View full-size slide

  54. WHERE & WHEN YOU ASK
    REALLY MATTERS!

    View full-size slide

  55. http://bit.ly/187yUef

    View full-size slide

  56. photo from extremetech.com

    View full-size slide

  57. CREATE WONDER

    View full-size slide

  58. WHY?
    instead of “What?” or “How?”

    View full-size slide

  59. WHY A PURPOSE STATEMENT?

    View full-size slide

  60. KEEPS THINGS ON TRACK

    View full-size slide

  61. GENERATES BIG IDEAS

    View full-size slide

  62. SIMPLIFIES COMPLEXITY

    View full-size slide

  63. FACILITATES & COMMUNICATES
    ORGANIZATIONAL CHANGE

    View full-size slide

  64. HAVE A STAR TO SAIL
    YOUR SHIP BY

    View full-size slide

  65. PURPOSE
    CONTENT
    STYLE

    View full-size slide

  66. FOCUS ON PRIORITY,
    NOT POSITION!

    View full-size slide

  67. DESIGNING WITH
    CONTENT & HIERARCHY
    ‣ Content Model
    ‣ Presentation Model

    View full-size slide

  68. THE CONTENT MODEL
    Documents ...
    ‣ the types of content your project needs
    ‣ the discrete attributes that make up each content type
    ‣ the relationships between them

    View full-size slide

  69. http://bit.ly/13FTHlG

    View full-size slide

  70. THE PRESENTATION MODEL
    Documents...
    ‣ the types of pages your project needs
    ‣ the discrete components that make up each page type
    ‣ the hierarchy of those components

    View full-size slide

  71. THE PRESENTATION MODEL
    ‣ Content Asset Types (e.g. article, recipe, episode, etc.)
    ‣ Listings (e.g. blog, search results, etc.)
    ‣ Top Level Pages (e.g. homepage, category pages, section pages, etc.)

    View full-size slide

  72. HIERARCHY

    HIERARCHY
    HIERARCHY

    View full-size slide

  73. INTENT MAPPING

    View full-size slide

  74. PERSONA
    PAGE TYPE / COMPONENT A
    PAGE TYPE / COMPONENT B
    PAGE TYPE / COMPONENT C
    SCENARIO A

    View full-size slide

  75. PURPOSE
    CONTENT
    STYLE

    View full-size slide

  76. STYLE IS POWERFUL!

    View full-size slide

  77. AVOIDING THE WHIM WINDS

    View full-size slide

  78. PURPOSE COMES FIRST

    View full-size slide

  79. SEEK EVALUATION,
    NOT CREATION

    View full-size slide

  80. UNDERSTAND

    BRAND PERSONALITY,
    CHARACTERISTICS & VOICE
    not a desired look and feel

    View full-size slide

  81. EMBRACE METAPHOR

    View full-size slide

  82. Each of these celebrities embody
    personality traits and characteristics like
    intelligent, accessible, and classic.

    View full-size slide

  83. Each of these car brands embody ideals like simple,
    dependable, useful, quality, tried-and-true.

    View full-size slide

  84. VERBAL LANGUAGE,
    THEN VISUAL LANGUAGE

    View full-size slide

  85. PURPOSE, NOT PREFERENCE
    PRIORITY, NOT PLACEMENT
    SYSTEMS, NOT PAGES

    View full-size slide


  86. — Jared Spool
    WE NEED TO LOOK AT OUR DESIGN
    PROCESS AS A WAY TO COME TO A SINGLE
    INTENTION AS MUCH AS IT IS TO MAKE
    THAT INTENTION REAL IN THE WORLD.

    View full-size slide

  87. THANKS!
    Jared Ponchot // @jponch // GiantConf 2014

    View full-size slide