4 Best User Interface Design Pattern Libraries
by anthony on 09/13/10 at 2:45 pm
As designers, sometimes we need a little inspiration to get our creative juices flowing. Looking at examples of different user interface patterns could give us the ideas we need to design something amazing. That’s why I put together four of the best user interface design pattern libraries around the web. I have searched and looked at dozens. But these four, I believe, offer the best examples with the best navigations for browsing. The first two offer patterns only. The last two offer patterns with explanations on how to use each pattern.
Josh L
Sep 13th, 2010
My personal favorite is the Yahoo! Design Pattern Library:
http://developer.yahoo.com/ypatterns/
The explanations for each pattern are extremely detailed and often include examples of how Yahoo! uses these patterns in their own products.
anthony
Sep 13th, 2010
I like that one too, but I didn’t include it because it only provides one example for each pattern. The ones on the list provide several, so you get a better idea of the different variations.
Matt
Sep 14th, 2010
Nice round up, thanks for this! It’s good to see options besides yui.
WC
Sep 14th, 2010
Last link is relative and not absolute. It doesn’t go where you want it to.
J-P
Sep 14th, 2010
(Psst: your link for the UI patterns logo is bust – it goes to an internal uxmovement.com page rather than ui-patterns.com)
Steffen
Sep 14th, 2010
The UI-Patterns link is broken. Should be
http://ui-patterns.com/
Cristi
Sep 14th, 2010
Hey Anthony,
Just wanted to tell you that the link on UI Patterns logo is not correctly pointing to the site.
Other than that, kudos for your work on this site!
Moon
Sep 14th, 2010
Hey these are good resources for the designers/webmasters. Please look at our site and respond here, how does the web design looks?
here is it: http://www.reginout.com
Sarah E. Welch
Sep 14th, 2010
Any good design pattern sites for desktop applications?
anthony
Sep 16th, 2010
Hey Sarah. I posted a collection of UI Guidelines for Desktop and Mobile Applications. Check it out.
Quora
Sep 16th, 2010
What are the best books / textbooks for learning interaction design? …
Not a textbook, but this is a good link: http://uxmovement.com/resources/4-best-design-pattern-libraries…
Christian Watson
Sep 24th, 2010
Thanks for the mention! I created my site to fill a need when working with designers on my team — I could have something to refer to when I needed to provide direction or give feedback.
It also helps when I am wireframing a new website feature. In fact, most of the categories have come about because I knew that I was going to need reference material for something we were designing at work.
I’m glad others have found it useful. I also wanted to make it super easy to navigate, with a minimum of clicking.
anthony
Sep 25th, 2010
No problem. You have a good site on your hands. Thanks for contributing to the community.
Kwayzi
Sep 28th, 2010
What of Welie.com?
manu
Oct 4th, 2010
what of:
http://patterns.endeca.com
http://www.findability.org
http://www.designingsocialinterfaces.com
http://www.ecommr.com/
http://patternbrowser.org
anthony
Oct 4th, 2010
They aren’t as good.
Bruce
Oct 21st, 2010
Actually, Manu’s are good ones too, perhaps not as robust. I like the spirit of your research here. We all need to remember that patterns should be used in the right context of your work. Most work that we do (in my experience) actually produce custom patterns which combine several patterns or use a different method to address a specific biz/user need. I don’t know how many times I’ve seen a yahoo pattern thrown into a wireframe only to realize that the pattern doesn’t match the expectation of the users. Yahoo patterns are what Yahoo standardizes to. While they might work for “pagination” – it might not be the method that your users expect or require.
I use Pattern Tap to help inspire my designers to “think” – sometimes designers translate too literally from a wireframe and lose the creative details that wires might lack. Their alpha is especially nice- just wish they’d add some level of detail on how patterns [are meant to] address needs. Thanks for writing.
Daniel Rose
Nov 16th, 2010
For UI patterns (focused on desktop), I find Quince by Infragistics a great resource: http://quince.infragistics.com/
Praveesh
Nov 17th, 2011
Thanks a lot for sharing
Sergey Pakhandrin
Dec 3rd, 2011
I’ve started a new service http://inspired-ui.com. It’s a collection of great mobile UI patterns. Daily updates, daily inspiration! Check it out guys!