24 Inspirational Blogs, Books and Articles on User Interface Patterns
I was going through my bookmarks looking for a problemsolver I needed for my latest webdesign project and I found myself doing exactly the same thing of which I warned you all before, badly tagging in delicious. Don’t make the same mistake as I did.
Instead of bookmarking all these sources seperately, you can just bookmark this resource list of inspirational blogs, books and articles on user interface patterns. I’ll keep on updating it with new sources. Suggestions are as always very welcome.
1. UI Patterns
is a “collection of User Interface Design Principles and User Interface Usability Patterns present on web applications and sites today”. This collection includes many useful and very specific categories such as 404-pages, navigation, search suggestions, …
2. Pattern Tap
Similar to UI patterns but the screenshots are divided into more categories, making it easier to find a specific interface pattern solution such as pagination or forms.
3. UI Scraps
A blog by Jason Robb, who publishes interesting design solutions to everyday design problems. This is not a collection of patterns as we know it (such as the ones I previously mentioned), but rather Jason’s personal view on interface design.
Janne Lammi, Matti Varjokallio and Johannes Hocksell describe Patternry as a UI Design Pattern Library and is, as you expected, a collection of web design patterns. They take interface patterns from all sorts of websites and share their opinion on how it was used, which problem it has solved, … Soon it will also be a community where everyone can share, create and collaborate on design patterns but for now they’re still in beta.
5. Yahoo! Design Pattern Library
Yet another pattern library, maintained by Yahoo!. At the moment the collection contains 59 patterns divided into 5 main categories: layout, navigation, selection, rich interaction and social. By joining the community you can read and comment on the blog and join the discussion in the many forums.
6. Boxes and Arrows
B&A does not confine themselves merelly to user interface design (so no collections of screenshots here), but discuss more general topics including graphic design, interaction design, information architecture and the design of business.
Nevertheless, B&A is a great resource and if you haven’t got them bookmarked yet, you should do it right now.
7. Open Source Design Pattern Library
The OSDPL has sorted their pattern library into five categories and is accompanied by a disciption explaining the design problem at hand. The collection isn’t all that big, but that doesn’t make it less useful. Also, OSDPL is a Fluid Project which is a open-source software community.
A big collection of patterns in interaction design. As Martijn van Welie stated on the website, he tried to group them meaningfully and I think he succeeded just wonderfully in doing so. The categories are well chosen, making the entire operation of finding the desired pattern so much easier. Each pattern comes with multiple examples of websites or applications.
10. Open Design Patterns
Open Design Patterns is a wiki page which contains a small amount of patterns (feel free to add your own content) and discusses the problem, usage, solution and the accessibility thereof. Some examples are in a video format, making it easier to understand a pattern when it needs user interaction.
A big collection of e-commerce interface and design elements with a clear focus on the individual elements that make up online stores, all categorized per design element and retailer.
12. Quince : UX Design Patterns
Quince is a community driven UX design pattern explorer and has a wide collection of patterns, all neatly organized and browsable. You could give the Silverlight version a try, giving you the option to explore patterns by tasks, tags and typical UI placement, but I personally prefer the normal HTML version.
13. Dezining Interactions
The blog of Erin Malone, a user experience designer, public speaker and co-author of “Designing Social Interfaces”, who shares her thoughts about design, patterns and code.
Codepen displays screen shots of interface design patterns, including the HTML, CSS and JS to code it on your page. It is a great resource for anyone who wants to quickly browse for inspiration on a specific design element.
15. Endeca User Interface Design Pattern Library
The EUIDL describes principled ways to solve common user interface design problems related to search, faceted navigation, and discovery. The library includes both specific UI design patterns as well as topics – groups of patterns related to significant aspects of search and discovery such as: search, faceted navigation, promotional spotlighting and results manipulation.
16. Search Patterns
Peter Morville, founder of Semantic Studios and author of the book “Search Patterns: Design for Discovery” grouped his findings into a pattern library which is dedicated to search and navigation.
17. Design Patterns
A huge collection of user interface patterns by Brian Christiansen, Director of Digital Media at User Interface Engineering. If you need anything, you’ll probably find it here.
18. [Design Solutions]
Similar to the Design Patterns Flickr group but adds more general design lay-outs to the collection, such as about pages, infographics and RSS-feed icons.
19. “Interface 101 – Part One: Basic Interfaces” by Fuel Your Interface
The first article is maybe the most important one because it explains in several parts what interfaces are all about. A must-read!
20. “Design Patterns: Introduction” by LukeW
5 interaction designers answering two questions: “What Do We Mean by Design Patterns?” and “What’s the Best Way to Communicate Patterns?”
21. “User interface design” by Wikipedia
I couldn’t miss out on this one. No additional information is needed.
22. “Human Interface Design Principles” by Apple
This article is a small part of the Apple Human Interface Guidelines and a must-read!
23. “Designing Web Interfaces: Principles and Patters for Rich Interactions” by Bill Scott and Theresa Neil
What can I tell you, I just love to read about web design. Because I could spend a small fortune on books, I find it very useful and wise to read a few reviews before I actually buy a book. Instead of spending my time looking for the next purchase, I thought I’d write a review for a change. Read the full review now!
Designing Web Interfaces: Principles and Patterns for Rich Interactions – by Bill Scott and Theresa Neil
A great book that explores all kind of interface patterns into detail. Really usable material for interaction designers. I even wrote a little review of Designing Web Interfaces a while ago because I think it’s really worth reading!
24. “Designing Interfaces: Patterns for Effective Interaction Design” by Jenifer Tidwell
Last but not least, a great book filled with best practices on interface patterns and practical advice for easy implementation. An absolute must-read!
Subscribe to the UX newsletter
Get the best UX newsletter, full of handpicked articles, resources and ideas delivered right to your inbox every second week.