Cover image for Mobile Design Pattern Gallery, 2nd Edition

Book description

When you’re under pressure to produce a well-designed, easy-to-navigate mobile app, there’s no time to reinvent the wheel—and no need to. This handy reference provides more than 90 mobile app design patterns, illustrated by 1,000 screenshots from current Android, iOS, and Windows Phone apps.

Table of Contents

  1. Special Upgrade Offer
  2. Foreword
  3. Preface
    1. Intended Audience for This Book
    2. Safari
    3. How to Contact Us
    4. Acknowledgments
  4. 1. Navigation
    1. Primary Navigation Patterns, Persistent
      1. Springboard
      2. Cards
      3. List Menu
      4. Dashboard
      5. Gallery
      6. Tab Menu
        1. iOS
        2. Android
        3. Windows Phone
        4. Emerging Patterns
      7. Skeuomorphic
    2. Primary Navigation Patterns, Transient
      1. Side Drawer
        1. Emerging Pattern
      2. Toggle Menu
      3. Pie Menu
    3. Secondary Navigation Patterns
      1. Page Swiping
      2. Scrolling Tabs
        1. Accordion
  5. 2. Forms
    1. Sign In
    2. Registration
    3. Registration with Personalization
    4. Multi-Step
    5. Checkout
      1. Tip #1: Include Sign In, Register, and Guest Options
      2. Tip #2: Streamline the Flow
      3. Tip #3: Provide Time-Saving Shortcuts
      4. Tip #4: Offer Express Checkout
      5. Tip #5: Forget the Web
    6. Calculator Forms
    7. Search Forms
    8. Long Forms
  6. 3. Tables
    1. Basic Table
    2. Headerless Table
    3. Fixed Column
    4. Overview plus Data
    5. Grouped Rows
    6. Table with Visual Indicators
    7. Editable Table
  7. 4. Search, Sort, and Filter
    1. Search Patterns
      1. Implicit Search
      2. Explicit Search
      3. Search with Auto-Complete
      4. Dynamic Search
      5. Scoped Search
      6. Saved, Recent, and Popular Search
      7. Search Form
      8. Search Results/View Results
    2. Sort Patterns
      1. Onscreen Sort
      2. Sort Overlay
      3. Sort Form
    3. Filter Patterns
      1. Onscreen Filter
      2. Filter Overlay
      3. Filter Form
      4. Filter Drawer
      5. Gesture-Based Filtering
  8. 5. Tools
    1. Toolbar
      1. iOS
      2. Android
      3. Windows Phone
      4. OS-Neutral Pattern: Contextual Toolbar
    2. Toolbox
    3. Call to Action Button
    4. Inline Actions
    5. Multi-State Button
    6. Contextual Tools
    7. Bulk Actions
    8. Lock Screen Controls
  9. 6. Charts
    1. Chart with Filters
    2. Interactive Timeline
    3. Data Point Details
    4. Drill Down
    5. Overview plus Data
    6. Interactive Preview
    7. Dashboard
    8. Zoom
    9. Sparklines
    10. Integrated Legend
    11. Thresholds
    12. Pivot Table
    13. Pulling It All Together
  10. 7. Tutorials and Invitations
    1. Tutorial Rules
    2. Rule #1: Use Less Text
      1. Ness Compared to Foodspotting
      2. Boomerang Compared to Mailbox
      3. DigiCal Compared to Fantastical
      4. Catch Compared to Clear
      5. SlideStory Compared to Vine
    3. Rule #2: No Frontloading
      1. Phoster Compared to Creative Studio
      2. Dooo Compared to Todoist
      3. Buy Me a Pie! Compared to OneNote
      4. Clipchat Compared to Kik
    4. Rule #3: Make It Rewarding
      1. NBC News Compared to Flipboard
      2. Noom Compared to DailyBurn Tracker
    5. Rule #4: Reinforce Learning Through Use
    6. Rule #5: Listen to Your Users
    7. Invitation Patterns
      1. Tips
      2. Persistent Invitations
      3. Discoverable Invitations
    8. Chapter Extra: Invitations—Rolling Out the Welcome Mat
      1. Iterating on the Welcome Experience
        1. Concept #1: Direct Immersion
        2. Concept #2: Tour
        3. Concept #3: Multi-Step Transparency
        4. Concept #4: Single-Step Transparency
        5. Concept #5: Tip
      2. Summary
  11. 8. Social Patterns
    1. Social Registration
      1. MapMyFitness Compared to We Heart It
    2. Connecting
    3. Following
    4. Profiles
    5. Groups
    6. Gamification
  12. 9. Feedback and Affordance
    1. Feedback Patterns
      1. Error Messages
      2. Confirmation
      3. System Status
    2. Affordance
      1. Tap
      2. Swipe/Flick
      3. Drag
  13. 10. Help
    1. How-Tos
    2. User Guide/Help System
    3. FAQs
    4. Feature Tours
    5. Tutorials
    6. Contextual Help
    7. Capture Feedback
  14. 11. Anti-Patterns
    1. Novel Notions
    2. Needless Complexity
    3. Metaphor Mismatch
      1. Control Mismatch
      2. Icon Mismatch
      3. Gesture Mismatch
      4. Mental Model Mismatch
    4. Idiot Boxes
    5. Chart Junk
    6. Oceans of Buttons
    7. Square Peg, Round Hole
    8. Chapter Extra: Let Them Pee—Avoiding the Sign-Up/Sign-In Mobile Anti-Pattern
  15. A. Additional Resources
  16. Index
  17. About the Author
  18. Special Upgrade Offer
  19. Copyright