Questions and Answers

Robert
Senior

What Are the 10 Rules of Good UI Design?

share the question
No items found.
Design Glossary
Text Button
is a clickable text, placed outside the main text container. From the text the users learn what happens after the button is pressed. The text should be clear and laconic. Text buttons are used for secondary actions in system dialogs and content cards.
Read more

Quick Navigation

Catchy UI design serves to carry multiple business challenges: from getting quality traffic and holding the audience's attention to reducing bounce rate and influence the conversion of each page. To create an efficient and relevant language for the website in 2021, you need to follow certain rules and algorithms. FlowMapp is going to help you with that!

Rule 1: Make UI Understandable for Everyone

This is a golden rule of UI design – you have to make it user-friendly and enjoyable both for digitally native users and the casual ones. Add some explanations on how to use your product and don't overload it with graphics – it will make your brand more accessible!

Designed by Outcrowd

Rule 2: Create Consistent Journey

To make your design accomplish the needs of one's business, the user flow of the UI design has to be predictable. Use the metaphors from the real world for the signs, do not reinvent symbols, and make the style uniform.

Designed by Tubik

Rule 3: Take Care of the Users With Disabilities

Almost 8% of the Internet users have blurred vision, and even more – dyslexic. Make a version of your design with the colors that will be comfortably read by everyone, and for a better understanding try to organize the information into blocks.

Designed by DStudio

Rule 4: Let the Users Undo Their Actions

Sometimes we unintentionally click on the button we don't want to and fall to the pages we don't want to explore. Make the actions reversible – it will help users learn the product faster without fear.

Add & Cancel button by Salman Shah

Rule 5: Shorten the Messages

Now users do not actually read text while visiting a website, they scan it. Make the shortcuts, use the bullets to clarify the message. Take FlowMapp blog UI design as an example!

Rule 6: Reduce Memory Load

Place the information which helps a user complete the action on the same screen. Don't make them memorize the information to fulfill the task. The more people load their minds, the fewer conversions the website gets!

Designed by Vadim Drut

Rule 7: Check the Buttons Placement

The time of red action buttons on each screen or the landing page is over. To increase the efficiency of the pages you work on, place the buttons alternating with info or picture blocks.

Designed by Denys Boldyriev

Rule 8: Do an A/B Testing

When creating UI design for any product, as a designer, you have to be sure that the design you work on is nearly perfect. To confirm this, create some more versions of it and do the A/B testing.

2beb67595039b3515e8862958f2d6c63
3 versions of the app design by Cristian Ramon

Rule 9: Think Of the Colors

Before using any color, make research on the connection between the color and its influence on the brain. Choose the combination, depending on the goals of your page! For example, green color is associated with ecology and innovation, and if you are making UI for a start-up, try this one!

Designed by Sèrgi Mi

Rule 10: Avoid Visual Complexity

Don't place a lot of types of content on each screen of the website: GIFs, bright colors, multiple fonts, and buttons might confuse users and make them leave the page. Make it simple and clear.

Designed by Clay

Where to Begin?

Knowing the rules is not enough: you might need an algorithm to start:

  1. Figure out the goals of the website;
  2. Make research of the target audience;
  3. Develop a visual language: colors, fonts, gamification;
  4. Create trial versions of the UI;
  5. Test them!

See, it's easier to start designing now with FlowMapp: use our tips, and if you have any more questions on UX/UI or trends, visit our Q&A!

No items found.
No items found.
No items found.

FAQs