Slide 1

Slide 1 text

The Virtues of Low-fi Stephen Hay @ Catawiki UX Crawl • July 25, 2018

Slide 2

Slide 2 text

Hi! I’m Stephen.

Slide 3

Slide 3 text

Design/UX Deliverables

Slide 4

Slide 4 text

“The perfect is the enemy 
 of the good.” —Voltaire

Slide 5

Slide 5 text

Not the thing. Not the thing. The thing.

Slide 6

Slide 6 text

Design processes

Slide 7

Slide 7 text

Short low / long high Low-fi High-fi “I’ve been thinking about this for a whole hour, and I’ve got a great idea!”

Slide 8

Slide 8 text

Gradual low to high Low High Kinda high Kinda high Kinda high Kinda high Kinda high

Slide 9

Slide 9 text

Long low / short high Low-fi High-fi “I’m starting to understand the problem.”

Slide 10

Slide 10 text

The most important question:
 What’s most important?

Slide 11

Slide 11 text

The design funnel https://changethis.com/manifesto/show/48.04.DesignFunnel Many designers start here. Define Discover Generate Create Design Values & Goals Moods & Metaphors Ideas, Define a concept A Visual Language

Slide 12

Slide 12 text

Most of this can be low-fi

Slide 13

Slide 13 text

Fantasy-fi Usually needs high fidelity Interaction Sensory 
 Experience Content &
 structure “High” fidelity that 
 doesn’t offer much more than low fidelity, but requires High-fidelity effort. It’s the illusion of reality. Many “static” prototypes fall into this category. 
 High-fi wireframes also.

Slide 14

Slide 14 text

The virtues of low-fi

Slide 15

Slide 15 text

1. Iterations are 
 quick and cheap

Slide 16

Slide 16 text

2. Low-fi tooling is 
 minimal and flexible.

Slide 17

Slide 17 text

3. Low-fi answers 
 questions early. “Nice. What about (x)?” “Oh, shit.”

Slide 18

Slide 18 text

4. Low-fi encourages quantitative ideation.

Slide 19

Slide 19 text

5. Low-fi encourages 
 “most important” thinking. It’s a meeting between your brain and the problem, with few distractions from tooling and processes.

Slide 20

Slide 20 text

Things that can be low-fi: • Sketching • Storyboards • Diagrams • (Paper) prototypes (but be careful!) • Planning • etc. These are actually subsets of sketching

Slide 21

Slide 21 text

Sketching

Slide 22

Slide 22 text

Sketching is not art.

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

A simple sketching process for ideation…

Slide 25

Slide 25 text

Thumbnails

Slide 26

Slide 26 text

No detail As many as possible As quickly as possible variety

Slide 27

Slide 27 text

Roughs PHOTO: Mike Rohde. Visit his blog: http://rohdesign.com/weblog/

Slide 28

Slide 28 text

Only a few, max. Flesh out your best ideas Focus on more detail (but not too much) Annotate, Ask & Answer questions

Slide 29

Slide 29 text

Thumbnails -> selection -> Roughs -> selection -> Comp/Prototype

Slide 30

Slide 30 text

Exercise 1: Sketch some thumbnails 
 for your project. 1. No detail; just capture ideas! 2. Make as many as you can in 5 minutes. It’s a numbers game! 3. Don’t censor yourself; all ideas are relevant at this point.

Slide 31

Slide 31 text

Exercise 2: Make some rough sketches. 1. Flesh out your best thumbnail ideas to see if they hold up. 2. More detail, but not too much!

Slide 32

Slide 32 text

Sketching is one of your most important skills. It’s a translator between your brain and paper. It’s a note-taking tool. It’s a communication tool. It’s a thinking tool. It’s a filter. It’s a wayfinder. It’s the lowest of low-fi. Do it always.

Slide 33

Slide 33 text

Thank you! @stephenhay