The principles of good UI design

Getting Started

Before you start designing any user interface, make sure you take a look at the principles of good UI design. These principles will help you to stick to the goal of UI design, which is to create an easy-to-navigate environment for users so that they can achieve their goals. 

Overall, the difference between a good and not-so-good UI design is the right combination of good usability and visual appeal. 

10 most important UI design principles

The UI design principles to consider for designing good user interfaces are as follows:

1. Clarity: Help users understand what needs their attention and make it actionable.

2. Simplicity: Keep the UI simple. Do not add even a single element that might not be required. Do not increase the cognitive load on the user.

3. Consistency: Keep the UIs consistent using patterns and components, so users can quickly understand what each part of the UI does. Also keep consistency in visual design with the usage of colors, typography, and graphic style. Have consistency in tone and communication through content on the UIs.

4. Familiarity: Use familiar visual elements and interaction patterns. This helps your users to use your UI with minimum to no learning required. If any behaviors are familiar to the users from other products, replicate the same on your UI.

5. Visibility: Emphasize what needs to be highlighted or acted upon. Group large information into small usable information chunks. Clearly differentiate primary and secondary actions on the UI.

6. Flexibility: Let users complete the tasks in multiple ways at their convenience. Users should be able to do the most important tasks in different ways and start from different points in the flow and with different UI elements. Adapt to users’ mental models rather than expecting them to change their behavior. 

7. Feedback: Keep users updated on the current status at any point while using the UI. Users should be able to understand where they are in the flow and what they need to do next. 

8. Scalability: Reuse interaction patterns so that users don’t have to think about how it works and they easily proceed with completing their tasks.

9. Tolerance: If a user arrives at an error state for any reason, give them a quick path to recover and resume what they were doing.

10. Accessibility: Ensure that all users feel comfortable using the product. This should include people with impairments in their motor skills, cognitive abilities, or vision. Making UIs accessible is a discipline in itself but it works on having supporting text for all UI elements and appropriate usage of colors.
    
    

Gestalt Principles

Apart from the above-mentioned principles, Gestalt principles are also very important to consider when designing user interfaces. 

As defined by IxDF 

“Gestalt Principles are principles of perception that describe how humans group similar elements, recognize patterns, and simplify complex images when we perceive objects.“

What makes these principles important? 

People build a perception of a UI by ‘seeing’ it before they read and actively understand it. That is where Gestalt principles work. These principles make a UI understandable at a glance. 

The most used Gestalt Principles are as follows:

1. Proximity: Objects that are visually closer to each other are perceived as grouped together.

2. Similarity: People tend to relate similar-looking objects intuitively. Similarity can be in terms of shapes, colors, and sizes.

3. Continuity: People naturally see visuals in continuation with continuous lines and curves as opposed to seeing separate objects. 

4. Closure: Any gaps in shapes and forms are perceived as complete as our eyes fill these gaps and complete the shapes.

5. Connectedness: Connectedness is the ability to see relationships between unrelated objects. An example is that you can see the image on a connect-the-dots picture before you actually connect the dots.
   
   

Dieter Ram’s 10 Principles of Good Design 

UI design has derived a lot of inspiration from Industrial design. It is well known that a lot of digital products and designers have modeled after Dieter Rams’ 10 Principles of Good Design. 

Dieter Rams in order to answer the question “Is my design a good design?”, had developed 10 principles of good design.

According to Dieter Rams, good design:

1. is innovative

2. makes a product useful

3. is aesthetic

4. makes a product understandable

5. is unobtrusive

6. is honest

7. is long-lasting

8. is thorough down to the last detail

9. is environmentally friendly

10. involves as little design as possible

These principles are still relevant today, despite having been defined sometime in the 1970s.

Do’s & Don'ts

Suggested Tools 

• Figma

• Sketch

• Adobe XD
  
  

References 

• Principles of user interface design from Wikipedia

• Principles Design from Design Principles

• UI Design Principles from Maze

• Gestalt Principles from IxDF

• Laws of UX from Jon Yablonski

Other Related Best Practices

• Prototyping Basics

• Wireframing

• Basics of Visual Design