In software Object Oriented Design (OOD), developers are encouraged to use and reuse software design patterns as solutions to recurring problems. This ensures you keep your software reusable, maintainable and groomed. But how does that really work when it comes to UI. Well, when it comes to UI, you may accept that. However, always keep in mind that a user will be interacting with your software, so here are 10 UI design patterns you should use every time you can.
In this first post I’ll give a brief introduction of each and then in future posts I’ll describe them more deeply.
1. Lazy Registration
Make users register only if it’s really necessary and late in the process of introducing them to the system.
2. Progressive Disclosure
This pattern is used to show only the information relevant to the user’s current activity and to delay other information until it is requested
3. Forgiving Format
Let users use any criteria and format they want when it comes to search and make your application intelligent enough to deal with this fact.
4. Clear Primary Actions
Highlight primary actions on your web forms so the user knows exactly what will the final action will be.
Breadcrumbs show the path from the front page of the site to the current location of the users in the website’s page hierarchy
6. Account Registration (that solves three related problems)
- Certain content is accessible only to registered users,
- Users need to re-enter their personal data often,
- Users need to be able to access personalized content on a system.
7. Required Field Marker
Making the user interface obvious is essential. This applies just as much to Web forms. One of the best ways to make the interface of Web forms obvious is by marking required fields.
8. Steps Left
This pattern is widely implemented when users have to fill in data in multiple steps.
9. Subscription plans
This pattern is suitable if the website offers one product or service that comes in different plans and requires regular payments, usually monthly payments.
10. Hover Controls
When a user interface has many elements in which the user can perform actions, the page can become cluttered and hard to scan. A good way to handle this is to hide each element and reveal it when the user hovers over that area.
As you can see, many of these patterns may be already being used by you but you may not know they exist as patterns.
In the upcoming entries, I’ll go deep in these to explain further and give reasons why you should use them in your software development every time you can.
Source: Based on 10 UI Design Patterns You Should Be Paying Attention To
By Janko Jovanovic from Smashing Magazine