shopping apps - 5 rules of a perfect user experience

Post on 05-Dec-2014

927 Views

Category:

Design

0 Downloads

Preview:

Click to see full reader

DESCRIPTION

5 golden rules how to create a perfect mobile shopping interface, that is fun to use on a mobile display. What are the basic mobile usability and design principles that lead into the mobile future?

TRANSCRIPT

Shopping Apps-5 rules of a perfect user experienceHamburg, 17. May 2011

Dienstag, 17. Mai 2011

By 2014 12%of all e-commercetransactions willbe made with asmartphone*

* Gartner study

Dienstag, 17. Mai 2011

This is great...

Dienstag, 17. Mai 2011

But here is the shocking reality of mobile commerce

Dienstag, 17. Mai 2011

I gave my girlfriend my phone and asked her to buy a classical star trek DVD

Dienstag, 17. Mai 2011

Dienstag, 17. Mai 2011

„Oh, this is the wrong product“

Dienstag, 17. Mai 2011

„Hm, we don‘t have a blue ray player!“

Dienstag, 17. Mai 2011

„I need a login. Oh I have to search again“

Dienstag, 17. Mai 2011

„Finally we got it“

Dienstag, 17. Mai 2011

Dienstag, 17. Mai 2011

>30KlicksDienstag, 17. Mai 2011

„Preparation“

„Searching for the right produkt“

„Purchase“

Dienstag, 17. Mai 2011

Less screen space - less space for information

> -80%

Dienstag, 17. Mai 2011

So, mobile shopping is not that easy.

Dienstag, 17. Mai 2011

Maybe some guidelines could be useful.

Dienstag, 17. Mai 2011

Dienstag, 17. Mai 2011

Reduce to the essence

Dienstag, 17. Mai 2011

Slide 18

What is of relevance to the user on the go?

Dienstag, 17. Mai 2011

Slide 19

Should a shopping app give access to all products...

Dienstag, 17. Mai 2011

Slide 20

or only to some o≠ers?

Dienstag, 17. Mai 2011

Combine relevant o≠ers and full access to all your products.

Dienstag, 17. Mai 2011

Slide 22

Target app: Nice integration of o≠ers...

Swipe

Dienstag, 17. Mai 2011

Slide 22

Target app: Nice integration of o≠ers...

Swipe

Dienstag, 17. Mai 2011

Slide 22

Target app: Nice integration of o≠ers...

Swipe

Dienstag, 17. Mai 2011

Slide 23

But also easy navigation to find a certain product

Search

Dienstag, 17. Mai 2011

Slide 24

And easy Navigation to find a certain product

Voice input

Dienstag, 17. Mai 2011

Slide 25

And easy Navigation to find a certain product

Bar code scanner

Dienstag, 17. Mai 2011

Slide 26

And easy Navigation to find a certain product

Overview with list of categories

Dienstag, 17. Mai 2011

Another possibility: Di≠erent apps for di≠erent tasks

Dienstag, 17. Mai 2011

The „general“ app where you can buy everything

Dienstag, 17. Mai 2011

Apps for a more focused usage

Dienstag, 17. Mai 2011

The icons should be easy to di≠erentiate!

Dienstag, 17. Mai 2011

Or just reduce to a relevant use case in just one focussed app

Dienstag, 17. Mai 2011

Slide 32

Dienstag, 17. Mai 2011

Dienstag, 17. Mai 2011

Make the design simple, interruptible and finger friendly

Dienstag, 17. Mai 2011

Simplicity is King: If you aren’t making something easier, then it’s best to leave it out.

Dienstag, 17. Mai 2011

Lets have a look at 3 di≠erent checkout screens:

Dienstag, 17. Mai 2011

good

Reed AppLike a task list

Dienstag, 17. Mai 2011

good

Reed AppLike a task list

better

Guilt AppOnly one screen

Dienstag, 17. Mai 2011

good

Reed AppLike a task list

better

Guilt AppOnly one screen

best

Amazon App, 1-Clickno typing in at all

Dienstag, 17. Mai 2011

Mobile design should be interruptiple design.

Dienstag, 17. Mai 2011

Slide 39

The Kayak App, it saves every user input

Dienstag, 17. Mai 2011

Slide 40

Mobile there is nothing more precious than the information you hardly typed in

Dienstag, 17. Mai 2011

Finger friendlyness, touch targets should be big enough

Dienstag, 17. Mai 2011

13 Pixel

Dienstag, 17. Mai 2011

Dienstag, 17. Mai 2011

Create a clear mobile interaction design

Dienstag, 17. Mai 2011

Don‘t try to be smarter than everybody else - use the phones standards

Dienstag, 17. Mai 2011

Slide 46

Use the phones interface standards

Back- Button

Content

Tab Bar

Navigation Bar

Dienstag, 17. Mai 2011

Make it very clear which element ist clickable.

Dienstag, 17. Mai 2011

Slide 48

Use color the guide your user

Dienstag, 17. Mai 2011

Create a good flow!

Dienstag, 17. Mai 2011

Wireframes and scribbles are helping a lot to create an easy user flow!

Dienstag, 17. Mai 2011

Dienstag, 17. Mai 2011

Take advantage of the phones features

Dienstag, 17. Mai 2011

Do things, you only can do with a smartphone

Dienstag, 17. Mai 2011

Slide 54

Kayak App: Useful integration of localization feature

Dienstag, 17. Mai 2011

Slide 55

Bolia App: Nice example to use the camera of the phone

Dienstag, 17. Mai 2011

Dienstag, 17. Mai 2011

Create lovely, useful Details

Dienstag, 17. Mai 2011

The standard timer app, how to improve that?

Dienstag, 17. Mai 2011

Pronto Timer App

Dienstag, 17. Mai 2011

Summary:

1. Reduce to the essence

Dienstag, 17. Mai 2011

Summary:

1. Reduce to the essence

2. Make the design simple, interruptible and finger friendly

Dienstag, 17. Mai 2011

Summary:

1. Reduce to the essence

2. Make the design simple, interruptible and finger friendly

3. Create a clear mobile interaction design

Dienstag, 17. Mai 2011

Summary:

1. Reduce to the essence

2. Make the design simple, interruptible and finger friendly

3. Create a clear mobile interaction design

4. Take advantage of the phones features

Dienstag, 17. Mai 2011

Summary:

1. Reduce to the essence

2. Make the design simple, interruptible and finger friendly

3. Create a clear mobile interaction design

4. Take advantage of the phones features

5. Create lovely, useful details

Dienstag, 17. Mai 2011

And don‘t forget this last number...

Dienstag, 17. Mai 2011

26% *Percentage of apps that where only used once.

Dienstag, 17. Mai 2011

Thank you.

Dienstag, 17. Mai 2011

SinnerSchrader Deutschland GmbHVölckersstraße 3822765 Hamburg

T 040.398855-0F 040.398855-55

www.sinnerschrader.deinfo@sinnerschrader.de

Dienstag, 17. Mai 2011

Dienstag, 17. Mai 2011

Flow

Nutzerführung

Usability

Umsetzungsqualität

Interfacedesign

Markenführung

Dienstag, 17. Mai 2011

top related