61
Invisible UI Screen Interaction Anders Jacobsson, Robert Holma 30 sep 2013

Invisible User Interface

Embed Size (px)

DESCRIPTION

Slides from our breakfast seminar about Invisible UI.

Citation preview

Page 1: Invisible User Interface

Invisible UIScreen Interaction

Anders Jacobsson, Robert Holma 30 sep 2013

Page 2: Invisible User Interface

08:0008:1508:4509:00

BreakfastSeminarQuestionsHang around

Practical

Page 4: Invisible User Interface

01020304

Who are we?What do we mean by Invisible UI?Why is it interesting?How do you design for it?

Contents

Page 5: Invisible User Interface

Who are we?01

Page 6: Invisible User Interface

We are a design innovation agency working with leading global companies to create compelling experiences that bridge digital and physical domains.

Page 7: Invisible User Interface

Our vision is to improve the quality of life for people around the world through the digital services they use.

Page 8: Invisible User Interface

Our team consists of passionateand experienced designers who understands the complexity of bringing usability, design and technology together.

Page 9: Invisible User Interface

What is Invisible UI?

02

Page 10: Invisible User Interface

We are here to talk about experiences with products and services where all or part of the user interface is invisible.

Page 11: Invisible User Interface

Naturally we want to make theseexperiences better.

Page 12: Invisible User Interface

Let’s start with an example.

Did you take the elevator up herethis morning?

Page 13: Invisible User Interface

Think about the experience

Page 14: Invisible User Interface

What if the elevator had an invisible User Interface?

Page 16: Invisible User Interface

How was the user experience with this elevator?

Page 17: Invisible User Interface

How was the user experience with this elevator?

Page 18: Invisible User Interface

Did it fit a need?

Page 19: Invisible User Interface

Was it easy to use?

Page 20: Invisible User Interface

Was it appealing?

Page 21: Invisible User Interface

Did it meet brand expectations?

Page 22: Invisible User Interface

We think this was kinda terrible.

Page 23: Invisible User Interface

How could we improve on the elevator experience?

Page 24: Invisible User Interface

Well, as I work at Screen InteractionI almost always go to the 29th floor.

What if the Elevator recognizes me and knows my destination so I don’t have to push the buttons?

Sweet!

Page 25: Invisible User Interface

Of course, sometimes I want to go to the Skybar at floor 33 so I need an overrule.

Page 26: Invisible User Interface

We have an office demo that does something similar to this.

Page 27: Invisible User Interface

NFC tags for• conference rooms• phone settings, as mute

App to• integrate with calendar • change phone settings

Context aware NFC tags

Page 28: Invisible User Interface

What’s interesting with this is that you have to know about it.

You don’t have expectations for something to happen.

A challenge is how to get the interaction started.

Page 29: Invisible User Interface
Page 30: Invisible User Interface
Page 31: Invisible User Interface

Actually when I left the hotel room I locked the key card inside.

Luckily they could reprogram it.

But why do we even have keys?There are better ways.

Page 32: Invisible User Interface

TITLE OF PROJECT

Professionally cultivate one-to-one customer service with robust ideas.

ClientASSA ABLOYPowering the worlds first mobile access control system on NFC mobile devices.

Mobile keys / SEOS

Page 34: Invisible User Interface

Assa AbloySEOS Mobile KeysProductivity Application For Enterprise

CommitmentConcept Development, UI Design & Application Development.

PlatformiOS, Android & BlackBerry.

ResultsThe world's first commercial ecosystem for managing digital keys on a mobile phone.

Page 35: Invisible User Interface

Actually, why should I even have to bring the phone out? It should juststay in my pocket.

Page 36: Invisible User Interface

That is cool because then theservice will be totally invisible...

Page 37: Invisible User Interface

Guess what?This is in the next version.

Page 38: Invisible User Interface

To summarize:

• The service has to give a Better experience

• The service has to know my Context

• It has to be able to be Overruled

• The service has to be Discoverable

Page 39: Invisible User Interface

A tip:

Scott Jenson has a lot of good pointsabout discoverability in his talk that he gave here at Screen interation, it’s on our News section. Watch it, it’s good!

Page 40: Invisible User Interface

Why is all this interesting?

03

Page 41: Invisible User Interface

There is a fundamental shift happening. Our personal devices become aware about their surroundings and a larger context.

The user is in the center. But with a whole eco-system around him.

Page 42: Invisible User Interface

Here’s an example of this new kind of service based on a wearable device and aneco-system around the person:

Page 44: Invisible User Interface

ABI Research projects that the sports and health wearables market alone will see 170 million devices in 2017.

170Million

Page 45: Invisible User Interface

But that is just an example of the fact that more and more devices become connected to the internet.

Page 46: Invisible User Interface

Billion

The Connected Life by 2020

9 Billion

50 Billion $2.5Trillion

Total connected devices

Total connected devices

12 Billion

6 Billion

2011

2020

Total Revenue Opportunity in 2020

Mobile connected devices

Mobile connected devices

2011

2020

Source: GSMA / Machina research

Page 47: Invisible User Interface

Billion

Source: GSMA / Machina research

$97 BillionHealth $36

Billion

Utilities

$202 BillionAutomotive

$445 BillionConsumer electronics

Revenue opportunity for connected devices in vertical sectors

Page 48: Invisible User Interface

These new markets need new materials and products. Here another example - interactive glass.

Page 49: Invisible User Interface
Page 50: Invisible User Interface

How do you design for Invisible UI?

04

Page 51: Invisible User Interface

Conclusion

• Find the users context

• Work with prototypes

• Define principles

Page 52: Invisible User Interface

05

Bonus material

Page 53: Invisible User Interface

Wireless charging table demo

Page 54: Invisible User Interface

Wireless charging - Konstfack

Page 55: Invisible User Interface

Wireless charging - Konstfack

Page 56: Invisible User Interface

Welcome screen

Page 57: Invisible User Interface

Clear Channel

Big interactive screens in public places adapting information depending on context.

Explore Stockholm

Page 58: Invisible User Interface

SCREEN INTERACTION

DETAILSEXPLORE STOCKHOLM

58

Page 59: Invisible User Interface

Ninja blocks ♥ Hue lights

Page 60: Invisible User Interface

Thank You!