A philosophy of restraint

A presentation at Refresh Edinburgh in July 2012 in Edinburgh, UK by Simon Collison

Slide 1

Slide 1

A philosophy of

Simon Collison Refresh Edinburgh | July 2012

restraint

Slide 2

Slide 2

Slide 3

Slide 3

Why call it a philosophy?

Slide 4

Slide 4

Design is messy

Slide 5

Slide 5

We design to communicate, and we seek emotive responses.

Slide 6

Slide 6

Slide 7

Slide 7

Slide 8

Slide 8

To delight someone is to give them a small lesson in seeing the world as something good. Frank Chimero, designer

Slide 9

Slide 9

Slide 10

Slide 10

A design aesthetic?

Slide 11

Slide 11

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

Slide 12

Slide 12

www.foodsense.is

Slide 13

Slide 13

www.guardian.co.uk

Slide 14

Slide 14

www.webdesignerwall.com

Slide 15

Slide 15

Systems

Slide 16

Slide 16

We don’t design web pages. We design system s.

Slide 17

Slide 17

Slide 18

Slide 18

www.bbc.co.uk/gel

Slide 19

Slide 19

www.bbc.co.uk/gel

Slide 20

Slide 20

Slide 21

Slide 21

Slide 22

Slide 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

Slide 23

Slide 23

Embrace constraints

Slide 24

Slide 24

Having complete freedom is possibly the worst way to start any project.

Slide 25

Slide 25

Slide 26

Slide 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

Slide 27

Slide 27

• Make sense of the constraints you’re given • Look for constraints you yourself can apply • Make constraints a feature or selling point

Slide 28

Slide 28

Exercising restraint

Slide 29

Slide 29

Responding to the problem in the simplest way possible.

Slide 30

Slide 30

Slide 31

Slide 31

Slide 32

Slide 32

Slide 33

Slide 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é

Slide 34

Slide 34

Simplicity and complexity

Slide 35

Slide 35

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

Slide 36

Slide 36

Slide 37

Slide 37

Slide 38

Slide 38

Slide 39

Slide 39

Slide 40

Slide 40

Slide 41

Slide 41

Slide 42

Slide 42

Slide 43

Slide 43

Slide 44

Slide 44

Slide 45

Slide 45

Slide 46

Slide 46

Slide 47

Slide 47

Unleash complexity in orchestrated phases, and increase power gradually.

Slide 48

Slide 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

Slide 49

Slide 49

Between the lines

Slide 50

Slide 50

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

Slide 51

Slide 51

Environment Experience Environment Others Me Instruction Interaction

Slide 52

Slide 52

The Arrival, by Shaun Tan

Slide 53

Slide 53

Slide 54

Slide 54

Slide 55

Slide 55

• Anticipate mental models • Reveal only what is necessary • Let users find their own stories • Embrace serendipity • Trust users to make sense of things

Slide 56

Slide 56

Affordance & typography

Slide 57

Slide 57

An affordance is a quality of an object, or an environment, that allows an individual to perform an action.

Slide 58

Slide 58

www.flightcardapp.com/

Slide 59

Slide 59

www.typekit.com

Slide 60

Slide 60

é é www.secondandpark.com/

Slide 61

Slide 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

Slide 62

Slide 62

Distraction

Slide 63

Slide 63

www.bbc.co.uk

Slide 64

Slide 64

www.icelandair.com/

Slide 65

Slide 65

Slide 66

Slide 66

www.jetblue.com/

Slide 67

Slide 67

Slide 68

Slide 68

Slide 69

Slide 69

Slide 70

Slide 70

Slide 71

Slide 71

Slide 72

Slide 72

Slide 73

Slide 73

Slide 74

Slide 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

Slide 75

Slide 75

Focus & context

Slide 76

Slide 76

Put the extraneous to one side. Focus on the task in hand, or add greater emphasis to stories.

Slide 77

Slide 77

Slide 78

Slide 78

Slide 79

Slide 79

Slide 80

Slide 80

www.thebolditalic.com/

www.gregorywood.co.uk /

Slide 81

Slide 81

Slide 82

Slide 82

Slide 83

Slide 83

Slide 84

Slide 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

Slide 85

Slide 85

Audit

Slide 86

Slide 86

A timely audit can prevent catastrophic failures, and shine new light on what you’ve learned.

Slide 87

Slide 87

Slide 88

Slide 88

Slide 89

Slide 89

Slide 90

Slide 90

Slide 91

Slide 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

Slide 92

Slide 92

A final pause

Slide 93

Slide 93

Don’t launch. Instead, sit with your work, think about it. Sieve it down and give it space.

Slide 94

Slide 94

Slide 95

Slide 95

Slide 96

Slide 96

Slide 97

Slide 97

Slide 98

Slide 98

www.colly.com/

Slide 99

Slide 99

Slide 100

Slide 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

Slide 101

Slide 101

This is my philosophy

Slide 102

Slide 102

delight / emotion / surprise systems / constraint / restraint simplicity / complexity / focus context / reduction

Slide 103

Slide 103

Thanks Simon Collison @colly