50

SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Embed Size (px)

Citation preview

Page 1: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 2: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 3: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 4: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 5: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

INTERACTIONSMICRO

Page 6: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Gatherers

Page 7: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Hunters

Page 8: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

mobimoni #UXPoland2015

People reach their smartphones to get stuff done.

Page 9: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

CHECKY

mobimoni #UXPoland2015

Page 10: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

“Micromoments are brief interactions where apps can capture the attention of a user

and anticipate their needs in 5-10 second interactions (several times a day).”

mobimoni #UXPoland2015

Page 11: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

“Even though we’re surrounded by microinteractions every day, we don’t usually notice them

until something goes horribly wrong.”

Dan Saffer

odannyboy

Page 12: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 13: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

mobimoni

Page 14: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

mobimoni

Page 15: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

ALLEGRO

What’s missing over here?

Page 16: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 17: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

The mobile mind shift is the expectation that I can get what I want in my immediate context

and moments of need.

Mobile has reprogrammed your customers’ brains.

mobimoni #UXPoland2015

Page 18: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

mobimoni #UXPoland2015

Micromoment is a moment of doing one thing. And doing it good.

Page 19: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 20: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Umbrella

Page 21: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Google Now

Page 22: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Micromoments of technology are the emotional connections with their users.

mobimoni #UXPoland2015

Page 23: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

So… why we wanted to give more love to SkyCash?

Page 24: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

SkyCash

The most popular app of this kind in Poland

170 000 MAU

400 000 transactions monthly

Page 25: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Problem no. 1

illogical information architecture

Page 26: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Problem no. 2

confusing navigation patterns

Page 27: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Problem no. 3

too long completion of simple tasks

Page 28: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Users’ observation

Page 29: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 30: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Data analysis

Page 31: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

We have taken a dig in SkyCash’s stats…

TOP 5 operations1. Parking 2. Bus tickets 3. Rail tickets 4. Cinema tickets 5. Phone top ups

Average usage:~4 minutes!

Only 20% usersuse a card

68% users make5+ transactions

Page 32: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Sketching

Page 33: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 34: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Mock ups

Page 35: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 36: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 37: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 38: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

GUI design

Page 39: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?
Page 40: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

We have introduced menu bar

3 main tabs for tickets, parking and other services

Page 41: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

We have introduced menu bar

3 main tabs for tickets, parking and other services

Page 42: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

We have simplified the options

Buying parking time

Page 43: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Easier access to active tickets

Page 44: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Easier city change

Page 45: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

BJ Fogg

“Making a behavior harder to do makes it less likely to occur.”

Number of taps matters!

bjfogg

Page 46: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

The more the better. The faster the better.

mobimoni #UXPoland2015

Page 47: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

1. If you care about mobile UX, you should care about micromoments.

2. Do the little things well. Details are the essentials. They make the product. User satisfaction is in the details!

3. Great design should be experienced and not seen. The better the design, the more invisible it becomes.

4. Design is measurable on a scale from frustration to delight.

TAKE OUTS

mobimoni #UXPoland2015

Page 48: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

“The goal of a successful app is to become one of the micromoments

of a persons day to day activities.”

mobimoni #UXPoland2015

Page 49: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

Good luck!

Page 50: SkyCash mobile app redesign. Why microinteractions are important in mobile UX?

We are mobee dick. Monika Mikowska

[email protected]

mobimoniMOBILE UX DESIGN STUDIO

mobeedick.com