The document discusses several common user experience (UX) archetypes and patterns for mobile interfaces. It describes archetypes such as application-centric, activity-centric, timeline-centric, location-centric, and people/identity-centric UX. It also outlines common patterns like nested doll, hub and spoke, filtered view, bento box, and multi-device patterns including coherence, synchronization, screen sharing, device shifting, complementary, and simultaneity.

1. UX ARCHETYPES
SECONDARY
RESEARCH

2. UX ARCHETYPES
APPLICATION CENTRIC
The applications make the interaction experience. The archetype is a visual buffet of
the ‘apps’ or functions that the system can run and manage. The interaction can be
likened to a Swiss Army Knife.
APPLE IPHONE GOOGLE ANDROID MICROSOFT SURFACE
The central or home experience of While Android adds widget Microsoft surface simplifies the desktop
the iPhone is the rows of apps and functionality, an app-centric experience into a handful of apps.
the persistent dock illustrates its archetype is at its core.
emphasis on interaction based on
apps.

3. UX ARCHETYPES
ACTIVITY CENTRIC
The activities make the interaction experience and focus shifts from apps to the
activities that users intend to perform on the device. This archetype represents these
activities visually and typically places them in an easily accessible sequence.
WINDOWS PHONE 7 IPOD ZUNE
Windows Phone 7 prioritizes the The original iPod navigation reflects Zune organizes around a central set
activities most important to the user, its focus on a handful of music and of media activities.
with a secondary emphasis on apps. video activities.

4. UX ARCHETYPES
TIMELINE CENTRIC
The timeline centric archetype focuses on time as a material. Users manipulate,
tweak, drag and experience data with time as a prime focus.
MICROSOFT KIN PATH APP NIKE+ STATS
The scrubbable timeline of the LOOP functionality on the The Path app features a timeline of the Nike+ displays stats by day and allows users to dive into
KIN allows users to move back and forth in time to see images of friends and prominently shows more detail information of individual days.
social network updates. when different photos were added through
the use of a clock following the scroll bar.

5. UX ARCHETYPES
LOCATION CENTRIC
Location is the centerpiece that drives discovery and activities. GPS and social
networking often play key roles in this archetype.
LAYAR FOURSQUARE SCVNGR
The augmented reality app layar Zune organizes around a central set SCVNGR encourages players of the
displays information about local of media activities. game to travel to different locations
venues and attractions based on the to earn points and discover the
location and camera view. unfamiliar.

6. UX ARCHETYPES
PEOPLE/IDENTITY CENTRIC
The identities of social contacts are the primary focus of the archetype. This archetype
is typically centered around ‘status updates’ of some kind, leading to a stream of news
from and about different individuals.
FACEBOOK TWITTER LINKEDIN
The facebook experience revolves Twitter shows a constant stream of LinkedIn focuses news and updates
around status updates, messages, the tweets of those you follow. on professional connections.
and invites from friends.

7. MOBILE UX PATTERNS

8. UX PATTERNS
iPhone Email App,
NESTED DOLL PATTERN
BravoTV App, Netflix
Mobile experiences that employ the nesting doll pattern are all about funneling users to
detailed content. This pattern allows users to toggle easily between an overview screen App
displaying many pieces of content, to a detail-level view of a specific piece of content.
It's a pattern has a strong sense of forward/ back movement.
IPHONE NATIVE EMAIL APP
The iPhone's email application employs the nested
doll pattern. The user is gradually funneled to a
detailed view of an individual email

9. UX PATTERNS
Flipboard, Pulse,
HUB AND SPOKE PATTERN
Facebook app,
Mobile experiences with a hub and spoke pattern have a strong central anchor point
from which users can navigate. Users interacting may bypass the hub but they often Foursquare app
traverse through it several times while engaging with the experience. This pattern
works best for experience with large quantities of content or with a several disparate
functionalities.
FLIPBOARD
Flipboard employs the hub and spoke unfolding
pattern. The "contents" page is the hub, with the
various content sources creating the spokes of the
experience.

10. UX PATTERNS
Music app on the iPad or
FILTERED VIEW PATTERN
Just like the optical refractor used in an optometrist's office, the filtered view pattern iPhone, CoolIris App,
allows navigation of the same data using different views. It's especially useful for most Calendar apps
navigating large sets of similar digital media such as music, photos, video, or movies.
MUSIC APP ON IPAD
The iPod application for the iPad employs the filtered
view pattern and allows users to navigate the same
set of content using different views.

11. UX PATTERNS
Kayak,
BENTO BOX PATTERN
TridAdvisor
This pattern segments the display into small compartments, each portion contributing
to the overall experience, similar to a bento box from a Japanese restaurant. good way
to express sets of information that are strongly related to each other and is more
commonly used on tablets than smartphone experiences.
KAYAK APP
The Kayak application for the iPad uses the bento
box pattern. Small pieces of tightly related
information are displayed on the screen at one time,
allowing the user to see the interrelationships of
information easily.

12. MULTI-DEVICE USE CASES

13. Experiences can now move fluidly through and across multiple devices
Cross-device platforms and the increasing number of data-connected devices allow people to shift from device to device within the
same app or function. Examples: Netflix app across devices, browser tabs syncing, email across desktop, mobile, tablet.

14. There are patterns for how fluid experiences work across devices
Six patterns can help us understand technological possibilities and people’s mental models for how devices work together.
1 COHERENCE 2 SYNCHRONIZATION 3 SCREEN SHARING
4 DEVICE SHIFTING 5 COMPLEMENTARY 6 SIMULTANEITY

15. MULTI-DEVICE PATTERNS
An app or digital product works and looks coherently
1
across devices. Features are optimized for specific
device characteristics and context of use.
COHERENCE
EVERNOTE
The digital notebook app Evernote is available across
devices. The mobile apps are optimized for photo and
and audio input.

16. MULTI-DEVICE PATTERNS
Content on devices is always in sync. Apps intelligently
2
remember information about where and which state the
user left off and seamlessly picks up from there when
they switch to another device. SYNCHRONIZATION
KINDLE
The Kindle app syncs bookmarks and notes across
devices so that if you begin reading on one device
and switch to another, you’ll always be in the right
place.

17. MULTI-DEVICE PATTERNS
Multiple screens sharing a single source so that
3
functions and attention can be segmented to the
users preference.
SCREEN SHARING
AIR DISPLAY APP
The Air Display app allows users to extend their
computer desktop onto their iPad or iPhone.

18. MULTI-DEVICE PATTERNS
Fluidly shifting content from one device to another.
4 DEVICE SHIFTING
ALLSHARE
Allshare enables video to be shifted from smartphone
to TV.

19. MULTI-DEVICE PATTERNS
Devices and content complement and augment each
5
other.
COMPLEMENTARY
SCRABBLE APP
The iPad serves as a Scrabble board while iPhones or
iPods serve as the letter tile trays.

20. MULTI-DEVICE PATTERNS
Devices being used simultaneously to consumer the
6
same or related content.
SIMULTANEITY
HEINEKEN CHAMPIONS LEAGUE APP
Heineken developed an interactive game that allowed
fans to use their mobile phone to play along with
soccer games by predicting what was going to
happen.