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

Master (mind)ing the Process

Master (mind)ing the Process

I presented this on Wednesday, November 6, 2013 at the HOW Interactive Design Conference in Chicago.

33f63ca160270827b1ecb780434dca9e?s=128

Christopher Butler

November 06, 2013
Tweet

Transcript

  1. Christopher Butler Newfangled.com @chrbutler Master (mind)ing the Process

  2. None
  3. Understanding how design functions in interactive projects 1. Knowing Design

    2. Showing Design How we demonstrate our expertise before we get paid for it 3. Distributing Design Creating a holistic, design-centric workflow 4. Amending Design Making changes and preserving sanity 10 min
  4. Understanding how design functions in interactive projects 1. Knowing Design

    2. Showing Design How we demonstrate our expertise before we get paid for it 3. Distributing Design Creating a holistic, design-centric workflow 4. Amending Design Making changes and preserving sanity 10 min 5 min
  5. Understanding how design functions in interactive projects 1. Knowing Design

    2. Showing Design How we demonstrate our expertise before we get paid for it 3. Distributing Design Creating a holistic, design-centric workflow 4. Amending Design Making changes and preserving sanity 10 min 5 min 25 min
  6. Understanding how design functions in interactive projects 1. Knowing Design

    2. Showing Design How we demonstrate our expertise before we get paid for it 3. Distributing Design Creating a holistic, design-centric workflow 4. Amending Design Making changes and preserving sanity 10 min 5 min 25 min 15 min
  7. Design is not a “thing.” But without it, there are

    no things. @chrbutler #HIDC
  8. Design is not a “thing.” But without it, there are

    no things. @chrbutler #HIDC
  9. None
  10. Website design is not container design. @chrbutler #HIDC

  11. Not This

  12. Not This This

  13. None
  14. None
  15. None
  16. Book design reflects content. Web design anticipates it. @chrbutler #HIDC

  17. None
  18. Web conversions are the result of engagement, not seduction. @chrbutler

    #HIDC
  19. None
  20. Visual clutter is the evidence of a failed search for

    clarity. @chrbutler #HIDC
  21. None
  22. Could I see some examples of your work? @chrbutler #HIDC

  23. Showing outcomes is not showing design. @chrbutler #HIDC

  24. None
  25. Design is a custom application of your expertise. @chrbutler #HIDC

  26. None
  27. There is no such thing as a design phase. @chrbutler

    #HIDC
  28. Keep the magic to a minimum. @chrbutler #HIDC

  29. None
  30. Isolating design isolates expertise. @chrbutler #HIDC

  31. Every decision is a design decision. @chrbutler #HIDC

  32. Can I get an amen? @chrbutler #HIDC

  33. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Composition Commitment to Representation of All Decisions Made So Far Production Commitment to Building What is Specified by Prototype and Composition QA Post-Production Launch Project Timeline @chrbutler #HIDC
  34. Project Timeline Mission Statement Commitment to Purpose Project Timeline @chrbutler

    #HIDC
  35. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Project Timeline @chrbutler #HIDC
  36. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Project Timeline @chrbutler #HIDC
  37. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Project Timeline @chrbutler #HIDC
  38. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Project Timeline Sketches Ideation @chrbutler #HIDC
  39. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Project Timeline Sketches Ideation @chrbutler #HIDC
  40. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Project Timeline Sketches Ideation @chrbutler #HIDC
  41. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Project Timeline @chrbutler #HIDC
  42. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Project Timeline @chrbutler #HIDC
  43. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Project Timeline Prototype Logic & Page- level Info @chrbutler #HIDC
  44. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Project Timeline @chrbutler #HIDC
  45. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Project Timeline @chrbutler #HIDC
  46. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Project Timeline @chrbutler #HIDC
  47. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Project Timeline @chrbutler #HIDC
  48. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Composition Commitment to Representation of All Decisions Made So Far Project Timeline @chrbutler #HIDC
  49. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Composition Commitment to Representation of All Decisions Made So Far Project Timeline @chrbutler #HIDC
  50. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Composition Commitment to Representation of All Decisions Made So Far Production Commitment to Building What is Specified by Prototype and Composition Project Timeline @chrbutler #HIDC
  51. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Composition Commitment to Representation of All Decisions Made So Far Production Commitment to Building What is Specified by Prototype and Composition QA Project Timeline @chrbutler #HIDC
  52. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Composition Commitment to Representation of All Decisions Made So Far Production Commitment to Building What is Specified by Prototype and Composition QA Post-Production Project Timeline @chrbutler #HIDC
  53. Project Timeline Mission Statement Commitment to Purpose Strategy Commitment to

    Audience, Content, and Marketing Plan Discovery Commitment to Scope Information Architecture Sketches Ideation Wireframes Flow Prototype Logic & Page- level Info Mood Boards Commitment to Look and Feel Composition Commitment to Representation of All Decisions Made So Far Production Commitment to Building What is Specified by Prototype and Composition QA Post-Production Launch Project Timeline @chrbutler #HIDC
  54. plan → design → code @chrbutler #HIDC

  55. re-plan → re-design → re-code @chrbutler #HIDC

  56. There are no tweaks. There are only bugs or change

    orders. @chrbutler #HIDC
  57. Production QA Post-Production Project Timeline @chrbutler #HIDC

  58. Production QA Post-Production QA Project Timeline @chrbutler #HIDC

  59. Production QA Post-Production QA Project Timeline Post-Prod. @chrbutler #HIDC

  60. Production QA Post-Production QA Project Timeline Post-Prod. @chrbutler #HIDC

  61. Production QA Post-Production QA Project Timeline Post-Prod. @chrbutler #HIDC

  62. Production QA Post-Production QA Project Timeline Post-Prod. @chrbutler #HIDC

  63. Production QA Post-Production QA Project Timeline Post-Prod. @chrbutler #HIDC

  64. Planning, design, and implementation are the building blocks of interactive

    design. @chrbutler #HIDC
  65. None
  66. Understanding how design functions in interactive projects 1. Knowing Design

    2. Showing Design How we demonstrate our expertise before we get paid for it 3. Distributing Design Creating a holistic, design-centric workflow 4. Amending Design Making changes and preserving sanity @chrbutler #HIDC
  67. Thanks for listening! Keep in touch: chris@newfangled.com @chrbutler