UI Design Guidelines
How to arrange your components on the screen
What problem does this component/pattern
When should this component/pattern be used?
Why should this component/pattern be used?
Plan Discover Organize Analyze
Launch Communicate Teach Adopt
Consult Versions Adapt
Style the UI toolkit the same way that you would style the real
If you have more than 20 patterns, make sure they are searchable.!
Add the ability to show dates of recent updates, recent changes, or
archived patterns that have been replaced with new ones.!
Add the option to link related patterns!
Design patterns and modular components are effective techniques for
designing and building long-lasting, consistent experiences!
You need a deadline!
Few More Things
Search Patterns: Design for
Peter Morville, Jeffery Callender
The Design of Sites: Patterns
for Creating Winning Web Sites
Douglas K. van Duyne, James A.
Modular Web Design: Creating
Reusable Components for User
Experience Design and
Designing Web Interfaces:
Principles and Patterns for Rich
Bill Scott, Theresa Neil
Designing Social Interfaces:
Principles, Patterns, and
Practices for Improving the
Christian Crumlish, Erin Malone!