By Theresa Neil O’Reilly Media, March 2012 Chapter 1: Navigation Patterns Take a look at the images from the book +70 new examples Get Started Get Started www.MobileDesignPatternGallery.com Follow me on Twitter @mobilepatterns
Jan 27, 2015
By Theresa NeilO’Reilly Media, March 2012
Chapter 1:
Navigation PatternsTake a look at the images from the book +70 new examples
Get StartedGet Started
www.MobileDesignPatternGallery.com Follow me on Twitter @mobilepatterns
Primary Navigation Patterns
Springboard List Menu Tab Menu Gallery
Dashboard Metaphor Mega Menu
Navigation: Springboard from the book
irregular layout
Facebook Ovi Maps Norton Masters
Navigation: Springboard from the book
w/ multiple pages
Trulia LinkedIn NewsRoom Yahoo!Mobile
Navigation: Springboard from the book
Personalized Springboards
PayPal Gowalla
Navigation: Springboard updates & extras
also uses a mega menu
Evernote Hello Flipboard Net-A-Porter WorldMate
Navigation: Springboard updates & extras
with summary data with drill downcircular
Craiglist Evernote Google Plus Pages
Navigation: Springboard updates & extras
personalized
SCVNGR mobli Google Docs rdio
Navigation: Springboard updates & extras
circular
New York Times- The Scoop Outdoor Navigation MultiTexter
Navigation: List Menu from the book
Valspar Paint Kayak BlackBoard Mobile Learn Zoho CRM
enhanced list
Navigation: List Menu from the book
RadioTime Cozi Amazon MP3 Stratus
Navigation: List Menu updates & extras
tap to reveal menu
Navigation: List Menu updates & extras
Path
pan to reveal menu
Navigation: List Menu updates & extras
Android Photo Editor Slacker RadioShows
Navigation: List Menu updates & extras
Lapse It Any.DOReeder
Navigation: Tab Menu from the book
scrolling bottom tabsbottom tabs
Jamie Oliver’s Recipe Library Molome Starbucks BlueMobile
Navigation: Tab Menu from the book
top tabsscrolling top tabs
Harvest TimeTractor Fring foursquare HitPost
Navigation: Tab Menu updates & extras
tab menus with command buttons
overloaded
Pintrest Pose Instagram Zaarly
Navigation: Tab Menu updates & extras
top tabs
Steam MagicHour Screencast Recorder
Navigation: Gallery from the book
BBCNews pulse PictureIt
Navigation: Gallery from the book
dwell flickr
Navigation: Gallery updates & extras
also uses mega menu
Gowalla Evernote Meals LinkedIn
Navigation: Gallery updates & extras
Distill QuickPic
itookapicture
Navigation: Dashboard from the book
Mint ego Flex 4.5 Showcase
Navigation: Dashboard updates & extras
Gaug.es baconreader PageOnce
Navigation: Dashboard updates & extras
daily burn Windows Mobile FedEx
Navigation: Metaphor from the book
Awesome Note Aidiko Reader
Navigation: Metaphor from the book
DoItTomorrow TripJournal
Cellar
Navigation: Metaphor updates & extras
DJ iPhone Beats by Bjango
Navigation: Metaphor updates & extras
Tap’n’Scratch Apple Cards
Navigation: Metaphor updates & extras
Out of Milk iBook Square
Navigation: Mega Menu from the book
Facebook Walmart
Navigation: Mega Menu updates & extras
drill down in the mega menu
Navigation: Mega Menu updates & extras
Google Maps News360
Navigation: Mega Menu updates & extras
Secondary Navigation Patterns
Secondary Navigation from the book
tabs + springboard tabs + list
all of the primary patterns can be used in combination w/each otherANZ Jamie Oliver’s Recipes- Android
Secondary Navigation from the book
tabs + dashboard tabs + tabs
all of the primary patterns can be used in combination w/each otherBills Jamie Oliver’s Recipes- iOS
Secondary Navigation updates + extras
scrolling top tabs + dashboard
tabs + dashboard
all of the primary patterns can be used in combination w/each otherruntastic BodyMedia
Secondary Navigation updates + extras
tabs + gallery tabs + metaphor
all of the primary patterns can be used in combination w/each other
Etsy Liquor Cabinet
custom tabs + personalized sprinboard
streamzoo
Navigation: Page Carousel from the book
Nigella Zappos Yahoo finance
using paging indicators (little dots)
Navigation: Page Carousel from the book
iMobile Excellent Analytics
too many pages
Navigation: Image Carousel from the book
IMDb Flex 4.5 Showcase App
flick to see more images/content
Navigation: Image Carousel from the book
Scrap n’ Tap
Photo Cookbook
carousel style coverflow style
Navigation: Image Carousel from the book
demos nice, but gets tedious
ANZ
Navigation: Image Carousel extras
Adobe Carousel
Google Music
same issues as ANZ- offer an alternate option for navigating
content
Navigation: Inline Expand from the book
Android Call Log
Navigation: Inline Expand from the book
Gap Mobile Web Example
Navigation: Inline Expand updates & extras
Android Downloads
Next Chapters
2 Forms
3 Tables
4 Search, Sort & Filter
5 Tools
6 Charts
7 Invitations
8 Feedback & Affordance
9 Help
10 Anti-Patterns
sample chapter on UXBooth
sample chapter on Smashing (coming soon)
Mobile Design Pattern GalleryUI Patterns for Mobile Apps
Buy NowBuy Now
The eBook is Only $10
with coupon code AUTHD
www.MobileDesignPatternGallery.com Follow me on Twitter @mobilepatterns