64
How is design for IoT different? October 2015 Designing Connected Products With thanks to Claire Rowland

Martin Charlier Screen Interaction Breakfast Stockholm

Embed Size (px)

Citation preview

Page 1: Martin Charlier Screen Interaction Breakfast Stockholm

How is design for IoT different?

October 2015

Designing Connected Products

With thanks to Claire Rowland

Page 2: Martin Charlier Screen Interaction Breakfast Stockholm

2

Hello

I’m a freelance designer,co-author and co-founder.

marcharlier ltd.

Page 3: Martin Charlier Screen Interaction Breakfast Stockholm

3

Connected products

Things we’ll see more of

Page 4: Martin Charlier Screen Interaction Breakfast Stockholm

4

Products with extended value proposition

Digital business models

Services going physical

Device ecosystem

Page 5: Martin Charlier Screen Interaction Breakfast Stockholm

5

Products with extended value proposition

Digital business models

Services going physical

Device ecosystem

Page 6: Martin Charlier Screen Interaction Breakfast Stockholm

6

Product evolution

Electricity as enhancement.

Page 7: Martin Charlier Screen Interaction Breakfast Stockholm

7

Product evolution

Connectedness as enhancement.

Page 8: Martin Charlier Screen Interaction Breakfast Stockholm

8

Product evolution

Connectedness as enhancement.

Page 9: Martin Charlier Screen Interaction Breakfast Stockholm

9

Products with extended value proposition

Digital business models

Services going physical

Device ecosystem

Page 10: Martin Charlier Screen Interaction Breakfast Stockholm

10

Freemium, advertising-funded, monetising user data

Advertising or data funded products.

Page 11: Martin Charlier Screen Interaction Breakfast Stockholm

11

Pay-per-use & Micropayments

1 LATTE (GR.) @ 3,60 3.60

1 SEAT OCCUPATION 42 MINS 0,50

Paying for actual use.

Page 12: Martin Charlier Screen Interaction Breakfast Stockholm

12

Pay-per-use & Micropayments

Paying for actual use.

Page 13: Martin Charlier Screen Interaction Breakfast Stockholm

13

Products with extended value proposition

Digital business models

Services going physical

Device ecosystem

Page 14: Martin Charlier Screen Interaction Breakfast Stockholm

14

onefinestay.com

Home rental site that develops a connected lock

Page 15: Martin Charlier Screen Interaction Breakfast Stockholm

15

Nespreso Zenius with cellular connectivity

Nespresso is a coffee service that happens to make devices.

Page 16: Martin Charlier Screen Interaction Breakfast Stockholm

16

New kinds of products

Amazon Echo

Physical context Entire home

Amazon Dash Amazon Dash Button

Kitchen Device

Conceptual context Anything Groceries & consumables Specific item

Page 17: Martin Charlier Screen Interaction Breakfast Stockholm

17

New user experience model

Smartphone model

1. Find device 2.Tap home button 3.Slide to unlock 4.Enter PIN 5.Find app 6.Tell it what product 7.Tap ‘Add to basket’

Connected product model

1. Pick up device 2.Tell it what product

2000s 2010s Next

Desktop model

1. Sit down at computer 2.Boot up computer 3.Wait 4.Open web browser 5.Navigate to website 6.Wait for website 7.Login 8.Find product 9.Click ‘Add to basket’

Page 18: Martin Charlier Screen Interaction Breakfast Stockholm

18

Products with extended value proposition

Digital business models

Services going physical

Device ecosystem

Page 19: Martin Charlier Screen Interaction Breakfast Stockholm

19

Device ecosystem plays

This is a way to make this better.

But it needs to stand on its own as well.

Page 20: Martin Charlier Screen Interaction Breakfast Stockholm

20

Device ecosystem plays

The battery as delivery mechanism

Page 21: Martin Charlier Screen Interaction Breakfast Stockholm

21

Design for IoT

What’s design for IoT all about?

Page 22: Martin Charlier Screen Interaction Breakfast Stockholm

22

Design for IoT has many facets

It’s no longer just UX and industrial design.

Page 23: Martin Charlier Screen Interaction Breakfast Stockholm

23

Designing Connected Products

What’s different about UX for IoT?

Technology of connectivity

Product & service definition & strategy

Design methods for connected products

Industrial design & Interface types

Prototyping

Cross-device interactions

Responsible IoT design

Designing with data

Page 24: Martin Charlier Screen Interaction Breakfast Stockholm

Value proposition

Conceptual model

Interaction model

24

From value prop to interaction model

What does it do? How does it work? How do I use it?

Images: Instructables, How It Works Daily

Page 25: Martin Charlier Screen Interaction Breakfast Stockholm

25

Productisation

What does it do?

Why would I want it?

Page 26: Martin Charlier Screen Interaction Breakfast Stockholm

26

A products solves a specific problem.

Nest don’t talk about connectivity, just about how it is a better smoke alarm.

Page 27: Martin Charlier Screen Interaction Breakfast Stockholm

27

A tool puts the onus on the user

A connected socket requires the user to solve their own problem.

Page 28: Martin Charlier Screen Interaction Breakfast Stockholm

28

A niche example from Belkin Wemo

This is a product.

- Clear benefit - Focussed context

Page 29: Martin Charlier Screen Interaction Breakfast Stockholm

29

Mass market consumers want products, not tools.

Product Tool

Page 30: Martin Charlier Screen Interaction Breakfast Stockholm

30

Design methods

Design can help develop and focus the value proposition early on.

Page 31: Martin Charlier Screen Interaction Breakfast Stockholm

31

Newspaper article

Credit: Dan Hill

Press release Sketch-the-box / sketch an advert

• Can this service, idea or product be plausibly conveyed?

• Are we able to convey the idea in simple terms?

• Forces you to clearly and simply convey the value and why anyone should care.

• Can be iterated quickly.

• Why should people care? • How do you persuade them? • How can you proof your

claims?

Page 32: Martin Charlier Screen Interaction Breakfast Stockholm

32

Conceptual model

How does it work?

Page 33: Martin Charlier Screen Interaction Breakfast Stockholm

33

Non-connected products are conceptually quite simple.

Page 34: Martin Charlier Screen Interaction Breakfast Stockholm

34

Connected products are more complex.

Page 35: Martin Charlier Screen Interaction Breakfast Stockholm

35

Connected products are more complex.

Connectedness means users have to think about system models.

Page 36: Martin Charlier Screen Interaction Breakfast Stockholm

36

Extra stuff to think about

Connects via your WiFi No hub

Connects via ZigBee Comes with a hub

Connects via ZigBee Requires a hub, but

doesn’t come with one

Page 37: Martin Charlier Screen Interaction Breakfast Stockholm

37

Explaining the system model

Images: Lowes, Apple

You might need to explain your system model.

Page 38: Martin Charlier Screen Interaction Breakfast Stockholm

38

Explaining the system model

Or develop a really good way to simplify it.

Page 39: Martin Charlier Screen Interaction Breakfast Stockholm

39

Interaction model

How do I use it?

Page 40: Martin Charlier Screen Interaction Breakfast Stockholm

40

Interusability

Cross-Platform Service User Experience: A Field Study and an Initial Framework. Minna Wäljas, Katarina Segerståhl, Kaisa Väänänen-Vainio-Mattila, Harri Oinas-Kukkonen MobileHCI’10: http://bugi.oulu.fi/~ksegerst/publications/p219-waljas.pdf

Page 41: Martin Charlier Screen Interaction Breakfast Stockholm

41

Interusability

Composition

Consistency

Continuity

Page 42: Martin Charlier Screen Interaction Breakfast Stockholm

42

A tale of two thermostats…

Images: Tado, British Gas

Subset of functions on device, full set in app. Mirrored functions across device & app.

Page 43: Martin Charlier Screen Interaction Breakfast Stockholm

43

A tale of two thermostats…

Images: Tado, British Gas

Subset of functions on device, full set in app. Mirrored functions across device & app.

Hardware Simpler & cheaper to design & make. More expensive due to UI.

Iteration & updates

Quick and easy to iterate the product,app stores, developer community.

Can be tricky. Firmware updates, physical controls.

User identity Smartphone can act as proxy for user identification - analytics.

Everyone can use the thermostat, but less easy to learn about users.

Smartphone Requires charged & connected smartphone.

Works independent from smartphone.

Page 44: Martin Charlier Screen Interaction Breakfast Stockholm

44

Interusability

Composition

Consistency

Continuity

Page 45: Martin Charlier Screen Interaction Breakfast Stockholm

45

Consistency is a two-way street.

One one hand: Platform conventions

On the other:Consistency within your touch points

Android: Contextual menu

iOS: Separate screen

Page 46: Martin Charlier Screen Interaction Breakfast Stockholm

46

Top priority: terminology

However different the UIs, identical functions or settings must have the same name.

Consistent use of terminology

Page 47: Martin Charlier Screen Interaction Breakfast Stockholm

47

Consistency

Secondary colour

Typeface, terminology, accent colour Accent colour

CMF

Paper insert as a means to delay decision making.

This is hard across physical/digital development timelines.

Page 48: Martin Charlier Screen Interaction Breakfast Stockholm

48

Consistency is a two-way street.

Platform conventions vs. System consistency

Rotate bezelTap up/down arrows

“Click”

Page 49: Martin Charlier Screen Interaction Breakfast Stockholm

49

Interusability

Composition

Consistency

Continuity

Page 50: Martin Charlier Screen Interaction Breakfast Stockholm

Image: Kei Noguchi via CC licence 50

Continuity

Coherent flow of interactions and data across devices.

Page 51: Martin Charlier Screen Interaction Breakfast Stockholm

51

Hard because:

1. Latency and reliability of the network.

2. Battery powered devices that only connect intermittently.

Page 52: Martin Charlier Screen Interaction Breakfast Stockholm

52

Has my action been executed?

Delays & interruptions mean there is a third state between on and off.

Page 53: Martin Charlier Screen Interaction Breakfast Stockholm

53

Option 1

A little white lie to make it feel smooth. Showing the action as executed before it really has.

Page 54: Martin Charlier Screen Interaction Breakfast Stockholm

54

Option 2

Transparency at the expense of a more complex UI flow. Communicating what is actually happening.

On

In progress

Off

Page 55: Martin Charlier Screen Interaction Breakfast Stockholm

55

Option 2

Transparency at the expense of a more complex UI flow. Communicating what is actually happening.

Connected

In progress

Done

Page 56: Martin Charlier Screen Interaction Breakfast Stockholm

56

Intermittent connectivity

19

2 min delay21

UIs might need timestamped data because they may be out-of-sync.

Page 57: Martin Charlier Screen Interaction Breakfast Stockholm

57

A word of caution

Page 58: Martin Charlier Screen Interaction Breakfast Stockholm

58

Error proof power tools

Page 59: Martin Charlier Screen Interaction Breakfast Stockholm

59

“Guided cooking for guaranteed success”

Page 60: Martin Charlier Screen Interaction Breakfast Stockholm

60

Reducing “time to destination”

Page 61: Martin Charlier Screen Interaction Breakfast Stockholm

61

Smart vending machine

Page 62: Martin Charlier Screen Interaction Breakfast Stockholm

62

Design responsibility

Connected products will reach far deeper into our everyday lives than anything before.

We should be careful what values drive them.

Page 63: Martin Charlier Screen Interaction Breakfast Stockholm

63

Design for IoT has many facets

These were just a few of the areas your design needs to address…

Page 64: Martin Charlier Screen Interaction Breakfast Stockholm

64

Thank you!

@marcharlier [email protected]

www.designingconnectedproducts.com

Use code AUTHD for 50% off ebook/ 40% off print at shop.oreilly.com