Ingredients of Awesome app

Good to Great to Awesome

GOOD GREAT AWESOME

Stable

Uses Best Practices

User-tested

Runs 4.0 and above

Provides solid experience

Guenther Beyer

http://bit.ly/androiddesigngtg

Revise everything

Branding and Consistency

Variation

Polish

AWESOME

Supports user goals with frustration-free experiences

Provides customer delight

Provides sufficient help for potential blockers

Empower the users and build positive relationship

Make them feel magical

Animations/Transitions1

Animations/Transitions1

WHY

Provide continuity experience

Capture and focus attention

Provide feedback for interactions

Give information - Spatial Relationship, Functionality

Help user in perceiving the changes without heavy processing

Animations/Transitions1

RULES

Purposeful and Informative

Subtle yet noticeable

Buttery smooth (60fps)

Proper motion speed

Don’t overdo it

Feedback2

Feedback2

WHY

Interactions happens on/in the glass surface – no physical feedback

To communicate hidden rules

To let the user know the system is working on your request

To provide seamless experience

Feedback2

RULES

Feedback must be informative

Feedback must have proper number

Feedback must be planned and prioritized

Feedback must be immediate

Feedback can be visual, acoustic, tactile

Microinteractions – Dan Saffer

TRIGGER RULES FEEDBACK LOOPS & MODES

Example: Overscroll Edge Effect

TRIGGER RULES FEEDBACK LOOPS & MODES

Interaction feedback is very important to give the touch confidence.

And always care about the touch area.

Dialog is a very direct way of giving information or capture attention. But it can be annoying.

Minimize the usage and use it wisely.

And don’t confuse the user.

Error Message tells the user why something isn’t work – but don’t just tell them why it doesn’t work, if it’s possible, give them the solution/possible action as well.

Better yet, try not to allow them to execute the error.

Loading indicator tells the user something is working at the background based on the request – but do give them options or inform them if it’s taking too long.

Also try to mask the time-wasting loading into a delightful experience.

Better yet, try to avoid loading by eg. Preload.

Empty state must be handled properly so the user knows what is needed to be done next. Give them that action(s).

It’s not the job of the user to figure out why it is empty.

Acoustic and tactile feedback is equally important to give high quality feedback.

Help3

Help3

WHY

Users are lazy and don’t like to think

Users require waypoint

Users curious about the value

Users need help to operate professional application

Users always rely on default settings

Help3

RULES

Help must be genuine

Help must be planned and timed well

Help must be simple and efficient

Help must be user-oriented

Quick Tutorial gives brief introduction of the value of the app to the user (read: not on how to use the app).

And do allow the user to skip it.

Users sometimes regret for their action, so if it’s possible, allow them to Undo – For less critical stuffs, it can be as forgivable as possible.

And make it easy to undo.

Confirmation is a must if the action is a critical one eg. Delete.

Do not ask for every actions though.

Help section always helps - even if it’s just 0.1% of the users will be using it.

And make it available offline.

Cares about the default settings that you are putting in. 95% of the users rely on the default settings.

Touch Gestures4

Touch Gestures4

WHY

Empower the user

Enhance interactivity

Natural manipulation

Potentially quicker interaction

Touch Gestures4

RULES

Gestures must coupled with great corresponding animations

Gestures should not be the only interaction for a certain task

Gestures must not have conflicts

Gestures must be discoverable

Always explore simple yet efficient gestures that enhance interactivity. Touch screen isn’t just meant for tap.

Chrome is a great example.

Sensitive for gesture trend that enhance interaction experience.

Eg. Swipe to dismiss/delete is almost like a must-have gesture for item manipulation.

Avoid gesture conflict at all cost!

Bad example: In Rdio, full screen swipe calls Navigation Drawer, and it conflict with the progress slider.

Don’t be afraid to explore and integrate gestures to enhance usability!

Example: Double swipe is currently at system level only, but it can be very well integrated in app interaction as well!

Carbon for Twitter

Polish³5

From the moment the user launches the app…

…to a button, a line of text, a picture…

…until the user quit the app.

Everything counts.

1

5

4

3

2

Animations/Transitions

Feedback

Help

Touch Gestures

Polish, polish, polish

Perfection is not attainable, but if we chase perfection we can catch excellence.

Vince Lombardi

Taylor LingAndroidUIUX.com