Emphasis: Universal Design Principles

We continue with the universal design principles, essential for a successful result of your designs. Today we will review emphasis, a powerful way to control the user experience (UX) with your design, making elements stand out when necessary. As well as how to use emphasis to create focus and establish hierarchy within your design. Emphasis, Universal Design Principles, web design,

Emphasis on user interface design

In user interface (UI) design, the fewer elements you have on a page, the easier it will be for the user to understand the purpose you intend to communicate.

However, as you add more elements to your design, it can become difficult to tell what to focus on first, and consequently lose the hierarchy, which is the roadmap to navigate through your design.

The elements have roughly the same emphasis ratio. And consequently, as you can see, it is not easy to immediately distinguish the action that you are supposed to invite the user to perform. The brain takes longer to process and understand the design, resulting in a poor user experience (UX) .

The user interface (UI) requires you to add and remove elements until the design is harmonized. Therefore, it is necessary to re-evaluate whether each element has the correct ratio of emphasis to create a proper hierarchy.

Hierarchy Assessment

Continuing with the same example, let's evaluate where you could apply or reduce the emphasis to improve this example.

We have identified the items from most important to least important, ordered accordingly :

The call to action will be "Choose appropriately", making it clear from the beginning what we will try to do that the user should do.
The action button (CTA) will be the "No, here" button. You should design this second more emphasized element so that the user can have confidence that it is the "correct choice".
The secondary button will be the "Click here" button. This button will have less emphasis to make it clear that it is not as important as the main button.
Next, you must ensure that the user understands that "There is only one correct option" by giving it more emphasis than the remaining text.
The remaining text can be provided simply to add more context, although it is not as important as the previous elements.
Finally, the hand icon is the least important element. In any case, it only serves to help communicate the welcome message “Hello!”. Therefore, it does not add value, you can simply remove it or dim the icon in the background.

Ideally, this is the order in which we will help the user to get into context and make it easier for the user to navigate:

Conclusion

Emphasis is a powerful universal design principle that helps you establish focus and create a sense of hierarchy, controlling the user experience (UX) of your design and making elements stand out when necessary.