2. Main Principles
1. Enchant me
Just like a well-made tool, your app should strive to
combine beauty, simplicity and purpose to create a
magical experience that is effortless and powerful
2. Simplify my life
– Easy to understand
– When people use your app for the first time, they should
intuitively grasp the most important features
– Simple tasks never require complex procedure
– Never overwhelmed by too many choices or irrelevant
flash
3. Make me amazing
– Empower people to try new things and to use apps in
inventive new ways
– Feel personal, giving people access to superb technology
with clarity and grace
3. Beauty is more than skin deep. Mobile apps should be sleek and
aesthetically pleasing on multiple levels. Transitions are fast and
clear; layout and typography are crisp and meaningful. App icons
are works of art in their own right. Just like a well-made tool, your
app should strive to combine beauty, simplicity and purpose to
create a magical experience that is effortless and powerful.
ENCHANT ME
4. Delight
Delight me in surprising
ways
A beautiful surface, a
carefully-placed
animation, or a well-timed
sound effect is a joy to
experience.
Subtle effects contribute
to a feeling of
effortlessness and a
sense that a powerful
force is at hand.
5. Real Object
Real objects are more fun
than buttons and menus
Allow people to directly
touch and manipulate
objects in your app. It
reduces the cognitive
effort needed to perform
a task while making it
more emotionally
satisfying.
6. Personal
Let me make it mine
People love to add
personal touches
because it helps them
feel at home and in
control. Provide
sensible, beautiful
defaults, but also
consider fun, optional
customizations that don't
hinder primary tasks.
7. Learn Preference
Get to know me
Learn peoples'
preferences over time.
Rather than asking them
to make the same
choices over and over,
place previous choices
within easy reach.
8. Mobile apps make life easier and are easy to understand. When
people use your app for the first time, they should intuitively grasp
the most important features. The design work doesn't stop at the
first use, though. Mobile apps remove ongoing chores like file
management and syncing. Simple tasks never require complex
procedures, and complex tasks are tailored to the human hand and
mind. People of all ages and cultures feel firmly in control, and are
never overwhelmed by too many choices or irrelevant flash.
SIMPLIFY MY LIFE
9. Short Text
Keep it brief
Use short phrases with
simple words. People are
likely to skip sentences if
they're long.
10. Picture
Pictures are faster than
words
Consider using pictures
to explain ideas. They get
people's attention and
can be much more
efficient than words.
11. Predict & Confirm
Decide for me but let me
have the final say
Take your best guess and
act rather than asking
first. Too many choices
and decisions make
people unhappy. Just in
case you get it wrong,
allow for 'undo‘.
12. Display Few
Only show what I need when
I need it
People get overwhelmed
when they see too much
at once. Break tasks and
information into small,
digestible chunks.
Hide options that aren't
essential at the moment,
and teach people as they
go.
13. Navigation
I should always know where
I am
Give people confidence
that they know their way
around.
Make places in your app
look distinct and use
transitions to show
relationships among
screens.
Provide feedback on
tasks in progress.
14. Save Works
Never lose my stuff
Save what people took
time to create and let
them access it from
anywhere.
Remember
settings, personal
touches, and creations
across
phones, tablets, and
computers. It makes
upgrading the easiest
thing in the world.
15. Look Same
If it looks the same, it should
act the same
Help people discern
functional differences by
making them visually
distinct rather than subtle.
Avoid modes, which are
places that look similar
but act differently on the
same input
16. Interrupt Only If Important
Only interrupt me if it's
important
Like a good personal
assistant, shield people
from unimportant
minutiae. People want to
stay focused, and unless
it's critical and time-
sensitive, an interruption
can be taxing and
frustrating
17. It's not enough to make an app that is easy to use. Good mobile
apps empower people to try new things and to use apps in
inventive new ways. Smartphones lets people combine applications
into new workflows through multitasking, notifications, and sharing
across apps. At the same time, your app should feel
personal, giving people access to superb technology with clarity
and grace.
MAKE ME AMAZING
18. Tricks
Give me tricks that work
everywhere
People feel great when
they figure things out for
themselves. Make your
app easier to learn by
leveraging visual patterns
and muscle memory from
other mobile apps. For
example, the swipe
gesture may be a good
navigational shortcut
19. Gentle Error
It's not my fault
Be gentle in how you
prompt people to make
corrections. They want to
feel smart when they use
your app.
If something goes
wrong, give clear recovery
instructions but spare them
the technical details.
If you can fix it behind the
scenes, even better
20. Sprinkle
Sprinkle encouragement
Break complex tasks into
smaller steps that can be
easily accomplished.
Give feedback on actions,
even if it's just a subtle
glow.
Drag & drop is a good
practice
21. Heavy Lifting
Do the heavy lifting for me
Make novices feel like
experts by enabling them
to do things they never
thought they could.
For example, shortcuts
that combine multiple
photo effects can make
amateur photographs
look amazing in only a
few steps
22. Make Important Fast
Make important things
fast
Not all actions are equal.
Decide what's most
important in your app and
make it easy to find and
fast to use, like the
shutter button in a
camera, or the pause
button in a music player.
24. 48 px Rhythm
• 48 pixels for touchable UI components
• Why 48 px?
– On average, 48 px translate to a physical size of
about 9mm (with some variability). This is comfortably
in the range of recommended target sizes (7-10 mm)
for touch screen objects and users will be able to
reliably and accurately target them with their fingers.
– If you design your elements to be at least 48 px high
and wide you can guarantee that:
1. your targets will never be smaller than the minimum
recommended target size of 7mm regardless of what
screen they are displayed on.
2. you strike a good compromise between overall information
density on the one hand, and targetability of UI elements
on the other.
25. 48 px Rhythm
Mind the gaps
• Spacing between each UI element is 8dp.
27. Color
• Use color primarily for emphasis. Choose
colors that fit with your brand and provide
good contrast between visual components.
• Red and green may be indistinguishable to
color-blind users.
28. Color for Contextual Icon
• Use non-neutral colors
sparingly and with
purpose.
• For example, Gmail
uses yellow in the star
icon to indicate a
bookmarked message.
If an icon is actionable,
choose a color that
contrasts well with the
background.
29. 1. Find ways to display useful content on your start screen.
2. Use action bars to provide consistent navigation.
3. Keep your hierarchies shallow by using horizontal navigation
and shortcuts.
4. Use multi-select to allow the user to act on collections of data.
5. Allow for quick navigation between detail items with swipe
views.
APP STRUCTURE CHECKLIST
35. 1. Brief
2. Simple
3. Friendly
4. Most Important First
5. Only The Necessary
6. Avoid Repetition
WRITING STYLE
36. Keep it brief
Be concise, simple and precise. Start with a 30
character limit (including spaces), and don't use
more unless absolutely necessary.
37. Keep it simple
Pretend you're speaking to someone who's
smart and competent, but doesn't know
technical jargon and may not speak English very
well. Use short words, active verbs, and
common nouns.
38. Be friendly
• Use contractions.
• Talk directly to the reader using second person
("you").
• If your text doesn't read the way you'd say it in casual
conversation, it's probably not the way you should
write it.
• Don't be abrupt, make the user feel safe, happy and
energized.
39. Put the most important thing first
The first two words (around 11 characters,
including spaces) should include at least a taste
of the most important information in the string. If
they don't, start over.
40. Only The Necessary
Describe only what's necessary and no more.
Don't try to explain subtle differences. They will
be lost on most users.
41. Avoid repetition
If a significant term
gets repeated within a
screen or block of
text, find a way to use
it just once