Mobile Design Patterns and Galleries (Global Moxie)

Mobile Design Patterns and Galleries

Posted Mar 10, 2011

Sometimes the best way to solve a new design problem is to find out how others solved an old one. That's the whole idea of design patterns, which stake out familiar solutions to common problems. In recent days, several mobile design-pattern resources have passed through the series of tubes which criss-cross my desk. All are useful sites for reference or inspiration for mobile app designers:

Pttrns

Pttrns is a project of Robin Raszka and neatly categorizes screenshots of iOS apps according to functions like logins, searches, custom tab bars, and so on. Nice work, lots of great examples.

Mobile UI Patterns

This site from Mari Sheibley similarly clusters iOS screenshots by functional category. While a bit less comprehensive, it's a great companion to Pttrns.

Android Patterns

Unlike the other sites, this one doesn't show screenshots but instead uses wireframe sketches to show common solutions to frequent design problems. In the Dealing with Data category, for example, patterns are organized by the specific challenge: "How can I change view on a set of data?" "How can I let users know my app is loading data?" "How can I let users sort data?" etc. This wiki site is a project of UNITiD.

TappGala

This one's not really a design pattern collection, but it is a consistently good and useful gallery of pretty designs. A fine resource of inspiration and clever experiments. TappGala is a project of John Phillips and David Mulder.

Tags: android, design, iphone, mobile

Comments

4 comment(s) on this page. Add your own comment below.

Stewart Walker

Jun 8, 2011 1:51am [ 1 ]

I'm looking for a mobile design pattern for product comparison.

I need to produce a mobile version of the classic comparison table where the rows are the features and the columns are the products, and there are dots where a product has a certain feature.

Non-mobile example: http://myob.com.au/products/small-business/accounting-finance-1258090694805?productArea=Compare#winProds

Know of any patterns for helping people compare products on mobiles?

Chris

Aug 1, 2011 9:03am [ 2 ]

Hello! I've collected 23 mobile design pattern galleries http://mobilegui.net/inspiration/

Hope this inspires other designers!

Theresa Neil

Nov 14, 2011 5:43pm [ 3 ]

Hi, I have a new book coming out with O’Reilly Media this month showcasing 70 patterns and 400+ screenshots across all the major OSs. These are application (not site) patterns, but may be inspirational for all designers. Check out http://www.mobiledesignpatterngallery.com to win a copy of the book, subscribe to the blog and explore the Flickr photostream that now has more than 600 screenshots.

Mobile Design Pattern Gallery: UI Patterns for Mobile Applications Theresa

Sergey

Nov 28, 2011 10:56am [ 4 ]

Hi!

We've launched a service http://inspired-ui.com. A collection of mobile UI patterns. Can you add it also to this post? Thanks in advance.

Add a Comment

Don't be shy.

More from this section

Home > Blog

"Small Screens, Big Changes": Full-Day Mobile Workshops in Europe
Karen McGrane and I are teaching a full-day mobile workshop in Amsterdam, Hamburg, and Barcelona. It's a mobile knowledge explosion. 0 comment(s)

Mobile Isn't the Lite Version
Jakob Nielsen's dubious mobile website guidelines make the mistake of assuming that there's such a thing as "this is mobile content, and this is not." 1 comment(s)

Designing for “Context” Is Tricky Business
Designers often conflate device context with user context—or worse, with user intent. “This is mobile, so they’ll never want to do that.” ”This is mobile, so it’s aimed only at users on the go.” Friends, this is hooey. 0 comment(s)

“Buttons Were an Inspired UI Hack, but Now We’ve Got Better Options”
The good folks at O’Reilly interviewed me this week about how new technologies change how we should think about interface design as both consumers and designers. 0 comment(s)

3.1 Million Pixels Are Heavy
If you want to take advantage of the new iPad's gorgeous screen (and of course you do), every image you push down the wire is about to put on a ton of weight. That has implications in lots of places and for lots of people. 8 comment(s)

Workshops for Learning Mobile Design
Join Josh Clark for one of several workshops in cities around the world. 0 comment(s)

Roundup of Recent Appearances
Notes, video, podcasts, and presentation slides from Josh Clark's recent talks and appearances. 0 comment(s)

Farewell, Big Medium
Difficult news: development, support, and sales will no longer be offered for Big Medium. 0 comment(s)

Desknots
More and more, when we refer to mobile, what we really mean is “non-traditional computing devices and environments,” a stodgy mouthful that really boils down to not the desktop. We need a new term for our sprawling landscape of devices. 5 comment(s)