shopping apps - 5 rules of a perfect user experience

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


This is great...


But here is the shocking reality of mobile commerce


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


„Oh, this is the wrong product“


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


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


„Finally we got it“


>30KlicksDienstag, 17. Mai 2011

„Preparation“

„Searching for the right produkt“

„Purchase“


Less screen space - less space for information

> -80%


So, mobile shopping is not that easy.


Maybe some guidelines could be useful.


Reduce to the essence


What is of relevance to the user on the go?


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


or only to some o≠ers?


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


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

Swipe


But also easy navigation to find a certain product

Search


And easy Navigation to find a certain product

Voice input



Bar code scanner



Overview with list of categories


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


The „general“ app where you can buy everything


Apps for a more focused usage


The icons should be easy to di≠erentiate!


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


Make the design simple, interruptible and finger friendly


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


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


good

Reed AppLike a task list


good


better

Guilt AppOnly one screen


good


better

Guilt AppOnly one screen

best

Amazon App, 1-Clickno typing in at all


Mobile design should be interruptiple design.


The Kayak App, it saves every user input


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


Finger friendlyness, touch targets should be big enough


13 Pixel


Create a clear mobile interaction design


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


Use the phones interface standards

Back- Button

Content

Tab Bar

Navigation Bar


Make it very clear which element ist clickable.


Use color the guide your user


Create a good flow!


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


Take advantage of the phones features


Do things, you only can do with a smartphone


Kayak App: Useful integration of localization feature


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


Create lovely, useful Details


The standard timer app, how to improve that?


Pronto Timer App


Summary:

1. Reduce to the essence


Summary:


2. Make the design simple, interruptible and finger friendly


Summary:



3. Create a clear mobile interaction design


Summary:




4. Take advantage of the phones features


Summary:




4. Take advantage of the phones features

5. Create lovely, useful details


And don‘t forget this last number...


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


Thank you.


SinnerSchrader Deutschland GmbHVölckersstraße 3822765 Hamburg

T 040.398855-0F 040.398855-55

[email protected]


Flow

Nutzerführung

Usability

Umsetzungsqualität

Interfacedesign

Markenführung


shopping apps - 5 rules of a perfect user experience

Design