User interface design best practices
UI Design is the first impression of your product; make the best of it with these key takeaways.
I don’t think most people would deny it when I say UI design is what makes or breaks a digital product. Humans are simply too much of a visual creature to not let what they see affect how they perceive your product overall. There’s a thing called The Aesthetic-Usability Effect, where people tend to believe that things that look better will work better.
Whilst meeting business objectives are important, fulfilling the user’s needs for a pleasant experience held as much significance, if not more, according to the theory mentioned before. As a designer, you are responsible to balance those two together to create the best possible outcome. UI design is not the only thing that will contribute to your user’s experience, but it is the first thing they will see. So, let’s make the best of it.
In this article, I’m going to summarize the key takeaways I got from implementing best practices throughout my UI design learning journey. These are based on Jakob Nielsen’s 10 Usability Heuristics, Gestalt Principles, and Shneiderman’s Eight Golden Rules.
#1 Consistency is Key
Just like companies have a brand guideline, a digital product should also have a way to standardize its appearance across all platforms. I’m also talking about the tone of voice in the copies and how the product should behave. Once a user uses your product, they shouldn’t have to relearn many representations of it to achieve their goal.
Much like codes have conventions, designs also have guidelines. For example, Gojek has Asphalt and Google has Material Design.
#2 Use Patterns
In UI, a well-known solution to a pre-existing problem is called a pattern. Your navbar won’t fit into mobile screens? use hamburger menu. Need to delete something? find the red button or the trash icon. At this point, at least, going out of the box and doing your own thing instead of adhering to common patterns might not be the right choice. Jacob’s Law states that if users spend most of their time on other sites, it means that users prefer your site to work like those they already know. That’s how powerful familiar patterns are.
#3 Apply Visual Hierarchy
Using visual hierarchy in your design will help users understand the flow of the story you wanted to tell. Whether in an app or website, users scroll from top to bottom. This means that you should put design elements ranked more important at the top section of the page. You could apply a clear hierarchy system to your design through placement, colors, and typography. Fitt’s Law gives a perspective that large targets should be made for Important functions.
#4 Don’t Leave the User Hanging
Users need to have a sense of control while going through the motions of your product. It wouldn’t leave a good taste if a user is ordering food, but they couldn’t know whether their food is already on the way or not. Give informative feedback on each of the user’s actions and let them backtrack whenever they made a mistake. A good user interface should be forgiving. One good example is the login error message in a website my team is developing, it gives the user a heads-up to fix their mistake before going forward.
#5 Plus One Design
The idea of plus one design is to always provide alternatives to design elements you’re trying to make. Doing this will enable people with different abilities to also use your product. For example, giving text descriptions to icons will help not so digitally literate users to navigate your website. Making your website responsive is also a form of plus one design because then users who can only access the internet by their phones could access your website comfortably.
Conclusion
Keeping these key takeaways in mind has helped me tremendously in maintaining quality UI design. Bear in mind that there are no fixed design principles you have to follow. Just remember that UI design should strive to be enjoyable, useful, dan usable for your users.
You probably noticed that UI design needs to be agile according to end-users needs, as much as your team needs to be agile according to product requirements. Learn what it takes to be agile and how to maximize it from my previous article!
