designing connected products - web directions 2015 sydney
TRANSCRIPT
Designing Connected Products
With thanks to Claire Rowland
2
Hello
I’m a freelance designer,a co-author and a co-founder.
rain cloud
method.com raincloud.eu senseye.io iotacademy.org designingconnectedproducts.com
3
Connected products
Things we’ll see more of
4
Products with extended value proposition
Digital business models
Services going physical
Device ecosystem
5
Products with extended value proposition
Digital business models
Services going physical
Device ecosystem
6
Product evolution
Electricity as enhancement.
7
Product evolution
Connectedness as enhancement.
8
Product evolution
Connectedness as enhancement.
9
Products with extended value proposition
Digital business models
Services going physical
Device ecosystem
10
Freemium, advertising-funded, monetising user data
Advertising or data funded products.
11
Pay-per-use & Micropayments
1 LATTE (GR.) @ 3,60 3.60
1 SEAT OCCUPATION
42 MINS 0,50
Dynamic pricing
12
Pay-per-use & Micropayments
Dynamic pricing
13
Products with extended value proposition
Digital business models
Services going physical
Device ecosystem
15
Nespreso Zenius with cellular connectivity
Nespresso is a coffee service that happens to make devices.
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
Interface Voice Voice & physical Physical
17
New user experience model
Smartphone model
1. Find/pick up deviceStart the computer
2.Unlock & login 3.Launch app or browser
LoginNavigate bloated website
4.Tell it what product 5.Add to basket
Connected product model
1. Find/pick up deviceStart the computerUnlock & loginLaunch app or browserLoginNavigate bloated website
2.Tell it what productAdd to basket
2000s 2010s Next
Desktop model
1. Find/pick up device 2.Start the computer 3.Unlock & login 4.Launch app or browser 5.Login 6.Navigate bloated website 7.Tell it what product 8.Add to basket
18
New user experience model
Services and features will dissolve into the environment.
19
Products with extended value proposition
Digital business models
Services going physical
Device ecosystem
20
Device ecosystem plays
This is a way to make this better.
But it needs to stand on its own as well.
21
Device ecosystem plays
The battery as delivery mechanism
22
Design for IoT
What’s this to do with design?
23
It’s not just UX and industrial design.
24
Designing Connected Products
Technology of connectivity
Product & service definition & strategy
Design methods for connected products
Industrial design & Interface types
Prototyping methods
Cross-device interactions
Responsible IoT design
Designing with data
Value proposition
Conceptual model
Interaction model
25
Design is key in every aspect of connected products
What does it do? How does it work? How do I use it?
Images: Instructables, How It Works Daily
26
Productisation
What does it do?
Why would I want it?
27
A products solves a specific problem.
Nest don’t talk about connectivity, just about how it is a better smoke alarm.
28
Mass market consumers want products, not tools.
Product Tool
29
A tool puts the onus on the user
A connected socket requires the user to solve their own problem.
30
Design methods
Design can help develop and focus the value proposition early on.
31
Newspaper article
Image: Dan Hill
Press release Sketch the box / Sketch the 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?
32
Conceptual model
How does it work?
33
Non-connected products are conceptually quite simple.
34
Connected products are more complex.
35
Connected products are more complex.
Connectedness means users have to think about system models.
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
37
Explaining the system model
Images: Lowes, Apple
You might need to explain your system model.
38
Explaining the system model
Or develop a really good way to simplify it.
39
Amazon methodology
Press release FAQ
Amazon product development: http://www.quora.com/What-is-Amazons-approach-to-product-development-and-product-management/answer/Ian-McAllister More on Amazon: http://brendansterne.com/2013/11/21/amazon-product-management-working-backwards/
Development
40
Interaction model
How do I use it?
41
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
42
Interusability
Composition
Consistency
Continuity
43
A tale of two thermostats…
Images: Tado, British Gas
Subset of functions on device, full set in app. Mirrored functions across device & app.
44
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.
Smartphone Dependent on smartphone for full functionality.
Independent from smartphone.
45
Interusability
Composition
Consistency
Continuity
46
Consistency is a two-way street.
One one hand: Platform conventions
On the other:Consistency across your touch points
Android: Contextual menu
iOS: Separate screen
47
Consistency is a two-way street.
Platform conventions vs. System consistency
Rotate bezelTap up/down arrows
“Click”
48
Top priority: terminology
However different the UIs, identical functions or settings must have the same name.
Consistent use of terminology
49
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.
50
Interusability
Composition
Consistency
Continuity
Image: Kei Noguchi via CC licence 51
Continuity
Coherent flow of interactions and data across devices.
52
Hard because:
1. Latency and reliability of the network.
2. Battery powered devices that only connect intermittently.
53
Has my action been executed?
Delays & interruptions mean there is a third state between on and off.
54
Option 1
A little white lie to make it feel smooth. Showing the action as executed before it really has.
55
Option 2
Transparency at the expense of a more complex UI flow. Communicating what is actually happening.
Off
In progress
On
56
Intermittent connectivity
UIs might need timestamped data because they may be out-of-sync.
2 min delay
21
57
Conversational UI
An elegant solution: Conversational UIs.
58
Prototyping
Build the right product before you build the product right.
59
Experience prototyping
Video is a great tool to prototype and explore connected products.
Useful prototyping techniques:
Media from the future Storyboards
Physical props Wizard of Oz
Video prototyping
60
I don’t mean
this stuff
61
30 minute prototype for a connected herb garden sensor.
62
Sketch-A-Move: Slightly more elaborate. Both a demonstration and an exploration.
http://www.superflux.in/work/sketch-move
63
Sketch-A-Move: Behind the scenes
http://www.superflux.in/work/sketch-move
Capture imagination and inspire the team
Matthias Kranz, et. al http://www.eislab.fim.uni-passau.de/files/publications/2006/SketchAMove_preprint.pdf
64
Stills compositions with narration
More info: http://www.cooper.com/journal/2008/12/economizer
65
A storyboard or video prototype can guide the tech requirements
More info: http://www.cooper.com/journal/2008/12/economizer
Technology requirements
Technology requirements
Technology requirements
Technology requirements
66
A closing thought
Credit: Adam Crickett
67
Error proof power tools
68
“Guided cooking for guaranteed success”
69
Reducing “time to destination”
70
Smart vending machine
71
Design responsibility
The values that drive connected products will pervade our everyday:
Our power tools, our food processors, our elevators and our vending machines…
72
Design responsibility
We need to think about what these values are, and not forget about the whimsical, the inefficient, the serendipitous, the beautiful.
73
Thank you!
@marcharlier [email protected]
www.designingconnectedproducts.com
Use code AUTHD for 50% off ebook/ 40% off print at shop.oreilly.com