A Philosophy of Restraint

C9b18d9dff88a9dd2393364c2b3b21bd?s=47 Simon Collison
September 10, 2012

A Philosophy of Restraint

Variant of a talk given at An Event Apart (Seattle), ESAD (Porto), Webshaped (Helsinki), Refresh (Edinburgh), and Reasons Festival (Brighton) during 2012. Some slides of work in progress removed.

With a wealth of ideas and tools at our disposal, we often muddle our messages and complicate our code.

We appreciate that less is usually more, yet stuff our sites to bursting point, failing to be economical with what we have.

We must know when to stop, and when to throw things out. We should embrace simplicity and subtlety, and exploit the invisible.

Through timeless lessons and practical examples, learn how reduction and restraint can improve communication, emotion, and experience in our designs, with a philosophy applicable to every aspect of the systems we produce.

C9b18d9dff88a9dd2393364c2b3b21bd?s=128

Simon Collison

September 10, 2012
Tweet

Transcript

  1. Simon Collison Refresh Edinburgh | July 2012 A philosophy of

    restraint
  2. None
  3. Why call it a philosophy?

  4. Design is messy

  5. We design to communicate, and we seek emotive responses.

  6. None
  7. None
  8. To delight someone is to give them a small lesson

    in seeing the world as something good. Frank Chimero, designer
  9. None
  10. A design aesthetic?

  11. Minimal, lots of white space... and clean. Right?

  12. www.foodsense.is

  13. www.guardian.co.uk

  14. www.webdesignerwall.com

  15. Systems

  16. We don’t design web pages. We design systems.

  17. None
  18. www.bbc.co.uk/gel

  19. www.bbc.co.uk/gel

  20. None
  21. None
  22. • Build a foundation for complexity • Devise a holistic

    approach for all projects • Devise a detailed project-specific system • Invest time in flexible pa ern libraries • Prepare for all eventualities
  23. Embrace constraints

  24. Having complete freedom is possibly the worst way to start

    any project.
  25. None
  26. Constraint is key to understanding complexity. Increase constraint and you

    create an ordered system; do that inappropriately and you create the conditions for catastrophic failure; remove constraint and the system is chaotic. Dave Snowden, The 5 C’s of Complexity
  27. • Make sense of the constraints you’re given • Look

    for constraints you yourself can apply • Make constraints a feature or selling point
  28. Exercising restraint

  29. Responding to the problem in the simplest way possible.

  30. None
  31. None
  32. None
  33. • Immerse yourself in the subject • Design responses first,

    not a website • Discover what can be put to one side • Avoid misplaced vernacular and cliché
  34. Simplicity and complexity

  35. Less is more. Simple is be er. Right?

  36. None
  37. None
  38. None
  39. None
  40. None
  41. None
  42. None
  43. None
  44. None
  45. None
  46. None
  47. Unleash complexity in orchestrated phases, and increase power gradually.

  48. • Good systems bear the weight of complexity • Embrace

    new methods for organising data • Find simplicity in the data flows • Don’t be afraid of obvious approaches • Release power gradually
  49. Between the lines

  50. Don’t underestimate humans. They can fill in the blanks.

  51. Environment Experience Others Me Instruction Interaction

  52. The Arrival, by Shaun Tan

  53. None
  54. None
  55. • Anticipate mental models • Reveal only what is necessary

    • Let users find their own stories • Embrace serendipity • Trust users to make sense of things
  56. Affordance & typography

  57. An affordance is a quality of an object, or an

    environment, that allows an individual to perform an action.
  58. www.flightcardapp.com/

  59. www.typekit.com

  60. é é www.secondandpark.com/

  61. • Understand the power of a ractiveness • Create obvious

    opportunities for interaction • Avoid unnecessary fakery and over-texturing • Don’t “iCal” the skeuomorphics • Use web type responsibly
  62. Distraction

  63. www.bbc.co.uk

  64. www.icelandair.com/

  65. None
  66. www.jetblue.com/

  67. None
  68. None
  69. None
  70. None
  71. None
  72. None
  73. None
  74. • Use a clear hierarchy • Look for obvious clashes

    or fussy extras • Remove or lessen the impact of distractions • Avoid dozens of competing pa erns • Don’t disguise calls to action
  75. Focus & context

  76. Put the extraneous to one side. Focus on the task

    in hand, or add greater emphasis to stories.
  77. None
  78. None
  79. None
  80. www.thebolditalic.com/ www.gregorywood.co.uk /

  81. None
  82. None
  83. None
  84. • Design with context and tell the story • Allow

    users to focus • Split complex tasks into manageable chunks • Don’t compromise primary areas • Remove distractions at key times • Forms can always be simplified
  85. Audit

  86. A timely audit can prevent catastrophic failures, and shine new

    light on what you’ve learned.
  87. None
  88. None
  89. None
  90. None
  91. • Add breathing space to your schedule • Make regular

    audits a part of your process • Be honest about shortcomings or failures • Never be afraid to rethink and rework
  92. A final pause

  93. Don’t launch. Instead, sit with your work, think about it.

    Sieve it down and give it space.
  94. None
  95. None
  96. None
  97. None
  98. www.colly.com/

  99. None
  100. • Sit with your ‘finished’ work for some time •

    Stand back from it, find new perspectives • Seek valued opinion and feedback • Find things to throw away or reduce • Launch only when you are ready
  101. This is my philosophy

  102. delight / emotion / surprise systems / constraint / restraint

    simplicity / complexity / focus context / reduction
  103. Thanks Simon Collison @colly