What are User Interface Design Patterns? A pattern is a plan or model for making something. In software development, patterns provide solutions to specific design problems. Buttons tell people to do something. Download, Buy, Continue or Save.
When you design a website or web app, you’ll need a navigation bar, button, tabs, forms and more. Common design patterns help to make your design easy to use and user friendly.
What is a UI Pattern Library?
A UI Pattern Library is a collection of user interface components or patterns. It helps you to define how each component looks and works. Your pattern library helps to ensure a consistent look and feel across your products. You want to add solutions so you don’t have to solve the same design problem over and over again. Or search your app for the pattern that you need to use.
What goes in it?
You’ll want to define your user interface. How you create buttons, navigation bars, layouts, alerts and notifications. Include guidelines on how and when to use them. You may want to include code snippets so you don’t have to rebuild a component from scratch. Also include color palettes, typography and grid layouts.
Where to find Design Pattern Libraries and Resources?
- Design Systems: Useful Examples and Resources
- User Interface Design Patterns
- UI Garage
- Apple’s Human Interface Guidelines
- Mailchimp Pattern Library
- Styleguides.io Pattern Libraries
- Building Your Own Pattern Library for the Web
- Getting Started with a Design System
Build Your Own
When you build your own pattern library, get designers and developers involved. A pattern library is a collaborative project. Both your designers and developers must work together in creating and maintaining it.
- Decide on what to name things The team needs to decide what to call a component. A shared naming convention prevents communication problems.
- Use a ticket system to track updates Your design library has to be updated and maintained. A ticket system makes it easy to track changes. You can create an approval system for requests.
- Audit your library Your library can quickly become out of date. Remove old components, templates and no longer used patterns. Plan to audit your library at least once a year.