blueprints
TRANSCRIPT
US
AG
E
}Most common area for accidental touches; if the user would lose any information by clicking here, move the function elsewhere.
}Least common area for accidental touches; placeread-only or rarely usedfunctions here.
Further away = greater effort required to activate
} Main content area
Natural holding location
One-handedhold; less stable
stretching required
no stretching required
Two-handed hold; more stable.
Higher chance of accidental touches overall.Easier to complete fast & multi-touch interactions.Commonly used in mobile games and gallery apps.
Ideal for tasks/functions with higher complexity that require greater amounts of time.
US
AG
E
LAYO
UTS
LAYO
UTS
MEN
US
Main >
First option
Second option
Third option v
Sub item 1
Sub item 2
Fourth option
MEN
US
Preferred for infrequentlyused functions
Preferred for frequentlyused functions
infrequentlyused functions
frequentlyused functions
current
prev
next
nextprev current
Main >
First option
Second option
Third option v
Sub item 1
Sub item 2
Fourth option
swip
e
swipe
swipe
swip
e
swipe
swip
e
TitleArticle text goes here, could be a recipe, movie description, book review, etc.
TitleArticle text goes here, could be a recipe, movie description, book review, etc.
Like Share Broadcast
CO
NTEN
T
Like Share Broadcast
TitleArticle text goes here, could be a recipe, movie description, book review, etc.
Like Share Broadcast
TitleArticle text goes here, could be a recipe, movie description, book review, etc.
TitleArticle text goes here, could be a recipe, movie description, book review, etc.
Like Share Broadcast
CO
NTEN
T
Like Share Broadcast
TitleArticle text goes here, could be a recipe, movie description, book review, etc.
Like Share Broadcast
swip
e
swip
e
swip
e
swip
e
swipeswipe
Maximum8 objectsvisible.
Primary Focus(typically a picture)
Secondary Focus
Primary Focus
Primary Focus
Primary Focus
Secondary Focus
TIP
S
• For an English-speaking audience,avoid aligning text to the right. Put the most important items above less important items.
• Don’t replicate the grid. If your layoutlooks like bubble wrap or a crossword puzzle, vary the sizes and/or change the shapes being used
• Sans-serif fonts are easier to read on mobile devicesthan serif fonts.
• Keep It Simple! Always ask,“Is this needed now?”
