137
TINKER TAYLER SOLDER PI @stuarttayler1

Tinker Tayler Solder Pi – UX Scotland 2016

Embed Size (px)

Citation preview

Page 1: Tinker Tayler Solder Pi – UX Scotland 2016

T I N K E R TAY L E R SOLDER

PI

@stuarttayler1

Page 2: Tinker Tayler Solder Pi – UX Scotland 2016

T I N K E R TAY L E R SOLDER

PI

This talk is about a side-project, rather than a big commercial project. But I think there are some useful learnings.

Page 3: Tinker Tayler Solder Pi – UX Scotland 2016

T I N K E R TAY L E R SOLDER

PI

That’s me. I work for cxpartners as a user experience consultant (which explains thepost-its).

Page 4: Tinker Tayler Solder Pi – UX Scotland 2016

T I N K E R TAY L E R SOLDER

PI

A soldering iron…

Page 5: Tinker Tayler Solder Pi – UX Scotland 2016

T I N K E R TAY L E R SOLDER

PI

And a Raspberry Pi.

Page 6: Tinker Tayler Solder Pi – UX Scotland 2016

1. PROJECT 2. PROCESS 3. IoT & SERVICE DESIGN

Page 7: Tinker Tayler Solder Pi – UX Scotland 2016

1. PROJECT 2. PROCESS 3. IoT & SERVICE DESIGN

Page 8: Tinker Tayler Solder Pi – UX Scotland 2016

THE USER NEED

Even though this was a side project, I still started with a user need.

Page 9: Tinker Tayler Solder Pi – UX Scotland 2016

THE (NICHE) USER NEED

When my son was born,my wife was at home more and wanted music around the flat.

Page 10: Tinker Tayler Solder Pi – UX Scotland 2016

We bought a small Bluetooth speaker.

Page 11: Tinker Tayler Solder Pi – UX Scotland 2016

PLAYING MUSIC

MY WIFE:1. Make sure speaker is on2. Click button on speaker to make it discoverable3. Go to home screen 4. Find and open Settings5. Click on Bluetooth6. Click on ‘Bose Mini Soundlink’ in ‘My Devices’7. Wait for Bluetooth to pair8. Open Spotify9. Find some music10. Play music

However, my wife needed to perform a complex sequence of interactions with the speaker’s buttons and the phone’s settings to connect over Bluetooth.

Page 12: Tinker Tayler Solder Pi – UX Scotland 2016

OPPORTUNITY

AN EASY WAY TO SEND MUSIC TO MY FAMILY

Page 13: Tinker Tayler Solder Pi – UX Scotland 2016

OPPORTUNITY

A ‘FRICTIONLESS’ WAY TO PLAY MUSIC AT HOME

Page 14: Tinker Tayler Solder Pi – UX Scotland 2016

MUSIC MAIL

Page 15: Tinker Tayler Solder Pi – UX Scotland 2016

See this video at: https://vimeo.com/132147559

Page 16: Tinker Tayler Solder Pi – UX Scotland 2016

HOW IT WORKS

Page 17: Tinker Tayler Solder Pi – UX Scotland 2016

RASPBERRY PI

At the core of the device is a Raspberry Pi — a credit-card sized computer.

Page 18: Tinker Tayler Solder Pi – UX Scotland 2016

HOW IT WORKS

Page 19: Tinker Tayler Solder Pi – UX Scotland 2016

1. PROJECT 2. PROCESS 3. IoT & SERVICE DESIGN

Page 20: Tinker Tayler Solder Pi – UX Scotland 2016

DURRELL BISHOP – MARBLE ANSWER MACHINE

Design inspiration.

Page 21: Tinker Tayler Solder Pi – UX Scotland 2016

My initial idea.

Page 22: Tinker Tayler Solder Pi – UX Scotland 2016

Sketches for simplifying the device.

Page 23: Tinker Tayler Solder Pi – UX Scotland 2016

BUILDING THE PROTOTYPE

Page 24: Tinker Tayler Solder Pi – UX Scotland 2016

The first big step was getting a simple buttonto work.

Page 25: Tinker Tayler Solder Pi – UX Scotland 2016

The code was writtenin Javascript using Node.js.

Page 26: Tinker Tayler Solder Pi – UX Scotland 2016

THE VALUE OF PROTOTYPING

At this point, it would be good to talk a little aboutthe nature of prototyping and why we do it.

Page 27: Tinker Tayler Solder Pi – UX Scotland 2016
Page 28: Tinker Tayler Solder Pi – UX Scotland 2016

GILL WILDMAN & NICK DURRANT

1. BACKTALK2. FEEDBACK3. TANGIBLE STRATEGY

Gill Wildman and Nick Durrant describe three forms of value obtained through prototyping.

Page 29: Tinker Tayler Solder Pi – UX Scotland 2016

GILL WILDMAN & NICK DURRANT

1. BACKTALK 2. FEEDBACK 3. TANGIBLE STRATEGY

I’m interested in the first one. It’s where you’re building in order to learn.

Page 30: Tinker Tayler Solder Pi – UX Scotland 2016

DESIGN DECISIONS BECOME CLEARER.

THINGS GET RESOLVED IN REAL TIME.

Page 31: Tinker Tayler Solder Pi – UX Scotland 2016

Huarache Lights by Hot Chip

The Salmon Dance by The Chemical Brothers

Mountains by Prince

Monkey Man by The Maytals

Hold On! I’m A Comin’ by Sam & Dave

Rock the Casbah by The Clash

For example, when you add new tracks to a Spotify playlist they are added at the end.

Page 32: Tinker Tayler Solder Pi – UX Scotland 2016

Huarache Lights by Hot Chip

The Salmon Dance by The Chemical Brothers

Mountains by Prince

Monkey Man by The Maytals

Hold On! I’m A Comin’ by Sam & Dave

Rock the Casbah by The Clash

But I had to make a decision – should it be chronological or reverse chronological (like Instagram)?

Page 33: Tinker Tayler Solder Pi – UX Scotland 2016

NOTIFICATIONS

Another example. If multiple new tracks are added, do the lights go out as soon as the first new track is played? or after they have all been played?

Page 34: Tinker Tayler Solder Pi – UX Scotland 2016

BUILD TO LEARN

These are design decisions that aren’t easy to foresee by just thinking about the problem. But when you’re making a prototype, they become patently obvious.

Page 35: Tinker Tayler Solder Pi – UX Scotland 2016

Carrying on with the process… The working device before building a housing.

Page 36: Tinker Tayler Solder Pi – UX Scotland 2016

Designing the housingin SketchUp.

Page 37: Tinker Tayler Solder Pi – UX Scotland 2016
Page 38: Tinker Tayler Solder Pi – UX Scotland 2016
Page 39: Tinker Tayler Solder Pi – UX Scotland 2016

Exploding the model onto a 2D plane so that it could be sent to get laser cut.

Page 40: Tinker Tayler Solder Pi – UX Scotland 2016

Building the buttons by glueing layers of plywood.

Page 41: Tinker Tayler Solder Pi – UX Scotland 2016
Page 42: Tinker Tayler Solder Pi – UX Scotland 2016

The first layer inside the box – the Raspberry Pi.

Page 43: Tinker Tayler Solder Pi – UX Scotland 2016

The proto-board with components soldered to it.

Page 44: Tinker Tayler Solder Pi – UX Scotland 2016

The amplifier and speakers.

Page 45: Tinker Tayler Solder Pi – UX Scotland 2016
Page 46: Tinker Tayler Solder Pi – UX Scotland 2016
Page 47: Tinker Tayler Solder Pi – UX Scotland 2016

The finished box.

Page 48: Tinker Tayler Solder Pi – UX Scotland 2016

Once I got the device playing music, it occurred to me that it would be interesting if I could receive some feedback at work, showing me what was playing. I built the email notification and website, again using Node.js.

Page 49: Tinker Tayler Solder Pi – UX Scotland 2016

PROTOTYPE RESEARCH

Page 50: Tinker Tayler Solder Pi – UX Scotland 2016

When the device was ready, I took it home so that my family could start using it.

Page 51: Tinker Tayler Solder Pi – UX Scotland 2016
Page 52: Tinker Tayler Solder Pi – UX Scotland 2016

I left a stack of post-its ready for my wife to take notes about what she did and didn’t like. Unfortunately child care got in the way of taking notes.

Page 53: Tinker Tayler Solder Pi – UX Scotland 2016

The first day I left the box at home and went to work was our wedding anniversary. I sent our first-dance song. When I got the email saying she was playing it, there was a strong emotive feeling of being connected.

Page 54: Tinker Tayler Solder Pi – UX Scotland 2016

Whenever I received an email, I knew that my wife or son had started to interact with the device. I could look on the website too to see what was happening. It also meant I knew when it wasn’t being used, so I could then explore why:

Page 55: Tinker Tayler Solder Pi – UX Scotland 2016

2 USERS

Page 56: Tinker Tayler Solder Pi – UX Scotland 2016

HARRIET• Enjoys someone else choosing music.• Radio does a similar job, but this is more tailored.• Eliminates faffing.• It’s nice to say ”new music from daddy”.• Mental model understood.• Wants to delete some songs.

Page 57: Tinker Tayler Solder Pi – UX Scotland 2016

FERGUS• Plays music independently.• Changes mood.• Too short to see light!• Confused by button functions…

Page 58: Tinker Tayler Solder Pi – UX Scotland 2016

PLAYS MUSIC PLAYS MUSIC

There was some confusion between the two buttons – although they had different functions, they bothplayed music.

Page 59: Tinker Tayler Solder Pi – UX Scotland 2016

FIXES AND UPDATES

Through the realtime updates, I discovered and fixed a number of bugs. I also made some bigger updates, a few of which I’d like to talk about.

Page 60: Tinker Tayler Solder Pi – UX Scotland 2016

TRACK CONTROL

The blue wheel that controls tracks was too sensitive — it skipped through multiple tracks unless you were careful enough to move it in small increments. Once I discovered this, I updated the code so that no matter how much you moved the wheel it would only skip one track, making it much more usable.

Page 61: Tinker Tayler Solder Pi – UX Scotland 2016

PAUSE LAG

The lag that happened when pressing pause meant you would end up pressing it twice. I hacked it by cutting the volume as soon as the button was pressed to make it feel more responsive.

Page 62: Tinker Tayler Solder Pi – UX Scotland 2016

CONTROL THE CODE TO CONTROL THE INTERACTIONS

This wasn’t bug-fixing. It was changing the behaviour of the device, the ‘feel’ of it. But there were no hardware changes, it was achieved just by updating the code. The behaviour was crafted by being in control of the code.

Page 63: Tinker Tayler Solder Pi – UX Scotland 2016

CHANGES OVER TIME

A particularly interesting thing that I observed was how behaviours change over time.

Page 64: Tinker Tayler Solder Pi – UX Scotland 2016

At the beginning changing tracks was a novelty, but this wore off.

Page 65: Tinker Tayler Solder Pi – UX Scotland 2016

EARLIER • Wanted to find a specific song.

LATER • Wanted tracks to be shuffled.

EVEN LATER • Linear playing is ok, if regularly updated

Behaviours and needs changed over time.

Page 66: Tinker Tayler Solder Pi – UX Scotland 2016

NEXT STEPS

Page 67: Tinker Tayler Solder Pi – UX Scotland 2016

A toy my son has. It has a button you press to start playing a song. You press the same button to play a new song. A very simple interaction.

Page 68: Tinker Tayler Solder Pi – UX Scotland 2016

PAUSE / OFF

VOLUME

Short press: PLAY / PLAY NEW / SKIP NEXT

Long press SHUFFLE

This is how I thought I might update the device, using that same interaction.

Page 69: Tinker Tayler Solder Pi – UX Scotland 2016

HARD TO

UPDATE

TO

UPDATE

EASY-ISH

Before redesigning the housing, I thought it might be a good idea to update a few things first.

Page 70: Tinker Tayler Solder Pi – UX Scotland 2016

I added a shuffle mode. It works really well - you get to hear older songs. However there is no indication of state.

Page 71: Tinker Tayler Solder Pi – UX Scotland 2016

You need some visibility of whether shuffle is on or off.

Page 72: Tinker Tayler Solder Pi – UX Scotland 2016

UPDATE CODE TO HELP YOU MAKE HARDWARE DECISIONS

I wouldn’t have learned about the hardware changes needed, without updating the software first.

Page 73: Tinker Tayler Solder Pi – UX Scotland 2016

1. PROJECT 2. PROCESS 3. IoT & SERVICE DESIGN

Page 74: Tinker Tayler Solder Pi – UX Scotland 2016

In my last job, I worked on the website for Turkcell (Turkey’s leading mobile operator).

Page 75: Tinker Tayler Solder Pi – UX Scotland 2016

I also worked on a Connected Home project for them.

Page 76: Tinker Tayler Solder Pi – UX Scotland 2016

ISTANBUL, 2013.

When we speaker to customers, they didn’t care about the ‘tech’ of connected homes. Butthey were interested in looking after their family and property.

Page 77: Tinker Tayler Solder Pi – UX Scotland 2016

So the service we created was centred around a security system that linked all the sensors together.

Page 78: Tinker Tayler Solder Pi – UX Scotland 2016

We also created a bunch of preset ‘rules’ that linked the devices. These were grouped under categories like ‘keep my environment safe’ or ‘keep things secure’. It was the service, rather than the devices that provided most of the value.

Page 79: Tinker Tayler Solder Pi – UX Scotland 2016

The same is true for Music Mail. The emotional connection created isn’t really due to the physical device, it’s a result of the messaging and feedback service behind it.

Page 80: Tinker Tayler Solder Pi – UX Scotland 2016

THE SERVICE MAKES THE DIFFERENCE

These examples showed that the Internet of Things isn’t about the things, it’s about the underlying service.

Page 81: Tinker Tayler Solder Pi – UX Scotland 2016

Paul Weichselbaum Havard Business Review

“Our interaction with devices is profoundly changing – they are becoming more like interconnected services than products.”

I saw this same idea expressed in other places.

Page 82: Tinker Tayler Solder Pi – UX Scotland 2016

It’s most clearly articulated in this book.

Page 83: Tinker Tayler Solder Pi – UX Scotland 2016

SERVICE AVATARS

In it, Mike Kuniavsky introduces the idea of Service Avatars.

Page 84: Tinker Tayler Solder Pi – UX Scotland 2016

MIKE KUNIAVSKY:

“When information produces most of the value for users, the hardware and software […] takes a secondary role.

The tool becomes an avatar of the service.”

Page 85: Tinker Tayler Solder Pi – UX Scotland 2016

The classic example of a Service Avatar he gives is an iPod with iTunes as the service behind it.

Page 86: Tinker Tayler Solder Pi – UX Scotland 2016

Another, more extreme, example is Amazon’s Dash Button. It’s the thinnest slice of their service that you can probably imagine.

Page 87: Tinker Tayler Solder Pi – UX Scotland 2016

WHAT CAN WE LEARN FROM SERVICE DESIGN?

So if Service Design and IoT are related, what can we learn?

Page 88: Tinker Tayler Solder Pi – UX Scotland 2016

CONSIDER HOW THE SERVICE CAN CREATE VALUE

The first thing is simply considering the service.

Page 89: Tinker Tayler Solder Pi – UX Scotland 2016

TOM ARMITAGE:

“What are the things that are only possible when the service, and the object, and the data, and the network are joined together?”

Tom Armitage (who has also written about Service Avatars) poses an excellent question.

Page 90: Tinker Tayler Solder Pi – UX Scotland 2016

LISTEN ALONG

So what would I change about Music Mail in order to focus on the service? A progress bar? A listen along button to feel more connected to my family.

Page 91: Tinker Tayler Solder Pi – UX Scotland 2016

A physical ‘like’ button? The ability to send a voice message back?

Page 92: Tinker Tayler Solder Pi – UX Scotland 2016

A physical ‘like’ button? The ability to send a voice message back?

Page 93: Tinker Tayler Solder Pi – UX Scotland 2016

This reminds me of…

The ability to send a voice message to my family?

Page 94: Tinker Tayler Solder Pi – UX Scotland 2016

I’d like to apply this to another project I’ve been working on. An internet-connected piggy bank.

Page 95: Tinker Tayler Solder Pi – UX Scotland 2016

This is how the idea would work: A parent and child would go and open a children's savings account.

Page 96: Tinker Tayler Solder Pi – UX Scotland 2016

CHILD SAVINGS ACCOUNT 19122010

CHILD SAVINGS ACCOUNT 19122010

This account essentially lives in the cloud. It’s intangible. The pig provides an interface with the account. It looks like a Service Avatar!

Page 97: Tinker Tayler Solder Pi – UX Scotland 2016

The pig stays in the child’s bedroom.

Page 98: Tinker Tayler Solder Pi – UX Scotland 2016

Parents can then send pocket money to children using a dedicated service.

Page 99: Tinker Tayler Solder Pi – UX Scotland 2016

When they do, the pigs ears spin around. See this video at: https://vimeo.com/170875909

Page 100: Tinker Tayler Solder Pi – UX Scotland 2016

This acts as a notification.

Page 101: Tinker Tayler Solder Pi – UX Scotland 2016
Page 102: Tinker Tayler Solder Pi – UX Scotland 2016

You earned 50p!

When the child shakes the pig, the pig says how much money has been earned and how much their savings are worth.

Page 103: Tinker Tayler Solder Pi – UX Scotland 2016

Happy Birthday! love Granny

But what’s only possible when the service, object, data, and the network are joined? Maybe the child could exchange messages with Grandparents.

Page 104: Tinker Tayler Solder Pi – UX Scotland 2016

Thank you Granny!

But what’s only possible when the service, object, data, and the network are joined? Maybe the child could exchange messages with Grandparents.

Page 105: Tinker Tayler Solder Pi – UX Scotland 2016

How much have I saved this month?

Maybe the child can speak to the pig and ask it questions?

Page 106: Tinker Tayler Solder Pi – UX Scotland 2016

How much more do I need to save for a remote controlled car?

Maybe the child can speak to the pig and ask it questions?

Page 107: Tinker Tayler Solder Pi – UX Scotland 2016

IT’S ABOUT TIME

The second thing we can learn from Service Design is the importance oftime-based interactions.

Page 108: Tinker Tayler Solder Pi – UX Scotland 2016

This is highlighted in Lucy Kimbell’s book.

Page 109: Tinker Tayler Solder Pi – UX Scotland 2016

LUCY KIMBELL:

“SERVICE RESTS ON THE IDEA OF VALUE-IN-USE OVER TIME, NOT VALUE-IN-EXCHANGE IN A TRANSACTION”

Page 110: Tinker Tayler Solder Pi – UX Scotland 2016

LUCY KIMBELL:

“SERVICE RESTS ON THE IDEA OF VALUE-IN-USE OVER TIME, NOT VALUE-IN-EXCHANGE IN A TRANSACTION”

Page 111: Tinker Tayler Solder Pi – UX Scotland 2016

Time is also discussed in a book by my old bosses.

Page 112: Tinker Tayler Solder Pi – UX Scotland 2016

POLAINE, REASON & LØVLIE:

“FOR SERVICE DESIGNERS, THE OBJECTS OF DESIGN ARE EXPERIENCES OVER TIME.”

Here, they are discussing the difference between Service and UX design.

Page 113: Tinker Tayler Solder Pi – UX Scotland 2016

HOW DO YOU ENSURE PEOPLE WILL GET VALUE-IN-USE OVER TIME?

So how do you designfor time?

Page 114: Tinker Tayler Solder Pi – UX Scotland 2016

EXPERIENCE PROTOTYPING

I believe one answer isby using Experience Prototyping.

Page 115: Tinker Tayler Solder Pi – UX Scotland 2016

MAYPOLE PROJECT

This was a project by Ideo and Nokia. They wanted to explore picture messaging (back in the 90s). The prototype required a power pack and transceiver unit that children had to carry around in a backpack, yet the experience was so compelling that they forgot about that inconvenience.

Page 116: Tinker Tayler Solder Pi – UX Scotland 2016

Marion Buchenau, Jane Fulton Suri

By the term “Experience Prototype” we mean to emphasize the experiential aspect of whatever representations are needed to successfully (re)liveor convey an experience with a product, spaceor system.

Page 117: Tinker Tayler Solder Pi – UX Scotland 2016

MUSIC MAIL

Music Mail could be considered an experience prototype.

Page 118: Tinker Tayler Solder Pi – UX Scotland 2016

CAN WE TURN THIS INTO AN EXPERIENCE PROTOTYPE?

What about the pig? At the moment I’ve really just been prototyping the interfaces and interactions - the web UI, the notification mechanism, interactions with the device. HOWEVER, it’s not a prototype of the actual experience of saving real money or even spending money. For that you’d need to link the pig to an real account.

Page 119: Tinker Tayler Solder Pi – UX Scotland 2016

PRETENDACCOUNT

(Database)

API

The way I built the pig was to build a fake bank account using a database. So that the pig could ‘speak’ to that fake account, I created an API.

Page 120: Tinker Tayler Solder Pi – UX Scotland 2016

A few weeks ago I got a Mondo card. The great thing about it is it has an API of it’s own. This meant I could link my API to it’s API. Suddenly the pig is linked to a real account!

Page 121: Tinker Tayler Solder Pi – UX Scotland 2016

A few weeks ago I got a Mondo card. The great thing about it is it has an API of it’s own. This meant I could link my API to it’s API. Suddenly the pig is linked to a real account!

Page 122: Tinker Tayler Solder Pi – UX Scotland 2016

RESEARCHING TIME-BASED EXPERIENCES

So that’s prototyping time-based experiences, what about researching them?

Page 123: Tinker Tayler Solder Pi – UX Scotland 2016

DIARY STUDIES

Traditionally, diary studies are used for longitudinal studies. At cxpartners,we use an app calledNative Eye. However, diary studies usually rely on recall.

Page 124: Tinker Tayler Solder Pi – UX Scotland 2016

PREDICTIONACTUAL

EXPERIENCE RECALL

IN-THE-MOMENT RESEARCH

Studies have shown how emotions about an experience vary depending on when you speak to them about it. Humans have exceptionally weak skills on predicting feelings about future experiences. Other studies talk about the ‘rosy retrospection effect’. As my colleague James Lang says, you need to get as close to the ‘moment-of-truth’ – the actual experience – as possible.

Page 125: Tinker Tayler Solder Pi – UX Scotland 2016

When I was getting feedback from Music Mail and then following up with SMS, I was doing ‘in-the-moment’ research. This actually has a name: ‘Experience Sampling’. It’s the technique Mihaly Csikszentmihalyi used when doing research for ‘Flow’, except he used a pager.

Page 126: Tinker Tayler Solder Pi – UX Scotland 2016

EXPERIENCE SAMPLING

When I was getting feedback from Music Mail and then following up with SMS, I was doing ‘in-the-moment’ research. This actually has a name: ‘Experience Sampling’. It’s the technique Mihaly Csikszentmihalyi used when doing research for ‘Flow’, except he used a pager.

Page 127: Tinker Tayler Solder Pi – UX Scotland 2016

But what about the piggy bank? If This Then That is a service that allows you to connect other services together.

Page 128: Tinker Tayler Solder Pi – UX Scotland 2016

I can use IFTTT to connect my API with Slack so that I can record events, like a new pocket money donation. This then allows you to do experience sampling, by following up with a text, call, etc.

Page 129: Tinker Tayler Solder Pi – UX Scotland 2016

DESIGN IN FEEDBACK SO YOU CAN SAMPLE EXPERIENCES CLOSER TO THE ‘MOMENTS OF TRUTH’

APIs are really helpful for doing this kind of research. It’s worth understanding how they work.

Page 130: Tinker Tayler Solder Pi – UX Scotland 2016

THINGS I’VE LEARNT:

In conclusion…

Page 131: Tinker Tayler Solder Pi – UX Scotland 2016

BUILD TO LEARN

Page 132: Tinker Tayler Solder Pi – UX Scotland 2016

CONTROL INTERACTIONS THROUGH CODE

Page 133: Tinker Tayler Solder Pi – UX Scotland 2016

CONSIDER HOW THE SERVICE CAN ADD VALUE

Page 134: Tinker Tayler Solder Pi – UX Scotland 2016

USE EXPERIENCE PROTOTYPING TO HELP YOU CREATE VALUE-IN-USE OVER TIME

Page 135: Tinker Tayler Solder Pi – UX Scotland 2016

DESIGN IN FEEDBACK TO CAPTURE MOMENTS OF TRUTH

Page 136: Tinker Tayler Solder Pi – UX Scotland 2016

DESIGN PROTOTYPES FOR ITERATIONS AND CONTINUOUS IMPROVEMENT

Page 137: Tinker Tayler Solder Pi – UX Scotland 2016

THANKS! FEEDBACK WELCOME: [email protected] @stuarttayler1