Mobile Design Pattern Gallery · UI Patterns for Smartphone Apps by Neil, Theresa -- Read -- Imperial Library of Trantor

Index

Mobile Design Pattern Gallery: UI Patterns for Smartphone Apps Foreword Preface

Intended Audience for This Book Safari® Books Online How to Contact Us Acknowledgments

1. Navigation

Primary Navigation Patterns, Persistent

Springboard Cards List Menu Dashboard Gallery Tab Menu

iOS Android Windows Phone Emerging Patterns

Skeuomorphic

Primary Navigation Patterns, Transient

Side Drawer

Emerging Pattern

Toggle Menu Pie Menu

Secondary Navigation Patterns

Page Swiping Scrolling Tabs

Accordion

2. Forms

Tip #1: Include Sign In, Register, and Guest Options Tip #2: Streamline the Flow Tip #3: Provide Time-Saving Shortcuts Tip #4: Offer Express Checkout Tip #5: Forget the Web

Calculator Forms Search Forms Long Forms

3. Tables

Basic Table Headerless Table Fixed Column Overview plus Data Grouped Rows Table with Visual Indicators Editable Table

4. Search, Sort, and Filter

Search Patterns

Implicit Search Explicit Search Search with Auto-Complete Dynamic Search Scoped Search Saved, Recent, and Popular Search Search Form Search Results/View Results

Sort Patterns

Onscreen Sort Sort Overlay Sort Form

Filter Patterns

Onscreen Filter Filter Overlay Filter Form Filter Drawer Gesture-Based Filtering

5. Tools

Toolbar

iOS Android Windows Phone OS-Neutral Pattern: Contextual Toolbar

Toolbox Call to Action Button Inline Actions Multi-State Button Contextual Tools Bulk Actions Lock Screen Controls

6. Charts

Chart with Filters Interactive Timeline Data Point Details Drill Down Overview plus Data Interactive Preview Dashboard Zoom Sparklines Integrated Legend Thresholds Pivot Table Pulling It All Together

7. Tutorials and Invitations

Tutorial Rules Rule #1: Use Less Text

Ness Compared to Foodspotting Boomerang Compared to Mailbox DigiCal Compared to Fantastical Catch Compared to Clear SlideStory Compared to Vine

Rule #2: No Frontloading

Phoster Compared to Creative Studio Dooo Compared to Todoist Buy Me a Pie! Compared to OneNote Clipchat Compared to Kik

Rule #3: Make It Rewarding

NBC News Compared to Flipboard Noom Compared to DailyBurn Tracker

Rule #4: Reinforce Learning Through Use Rule #5: Listen to Your Users Invitation Patterns

Tips Persistent Invitations Discoverable Invitations

Chapter Extra: Invitations—Rolling Out the Welcome Mat

Iterating on the Welcome Experience

Concept #1: Direct Immersion Concept #2: Tour Concept #3: Multi-Step Transparency Concept #4: Single-Step Transparency Concept #5: Tip

Summary

8. Social Patterns

Social Registration

MapMyFitness Compared to We Heart It

Connecting Following Profiles Groups Gamification

9. Feedback and Affordance

Feedback Patterns

Error Messages Confirmation System Status

Affordance

Tap Swipe/Flick Drag

10. Help

How-Tos User Guide/Help System FAQs Feature Tours Tutorials Contextual Help Capture Feedback

11. Anti-Patterns

Novel Notions Needless Complexity Metaphor Mismatch

Control Mismatch Icon Mismatch Gesture Mismatch Mental Model Mismatch

Idiot Boxes Chart Junk Oceans of Buttons Square Peg, Round Hole Chapter Extra: Let Them Pee—Avoiding the Sign-Up/Sign-In Mobile Anti-Pattern

A. Additional Resources Index About the Author Copyright

← Prev
Back
Next →

← Prev
Back
Next →