Progressive Disclosure: Looking for the Simple inside the Complex

In 2010, the designer John Maeda wrote the book The Laws of Simplicity, a compilation of basic principles to raise awareness of the importance of applying simplicity in everything we do. Of all the laws, he highlights the 10th known as the ONLY one that manages to gather all the others in a single principle:

“Law 10: Simplicity is about subtracting the obvious and adding the meaningful “.

The Laws of Simplicity (John Maeda)

We all know how difficult it is to look for simplicity, because for this to exist we have to be surrounded by complexity, it is only when we really detect what we perceive as simple. For example, the beauty of minimalism can be found also in the previous exercise to dispense with the unnecessary.

If we transfer this to the world of user experience, there is an interaction technique that allows us to escape complexity, leaving only the specific, what is necessary for users at all times. This technique is known as progressive disclosure.

What is Progressive Disclosure?

It is an interaction technique that delays the appearance of advanced or little used options to reduce the number of errors and facilitate user learning.

The main objective is not to overwhelm the user with all the available options, for this we relegate the less frequent or more complex tasks to later steps.

By removing all distractions, we facilitate the user to complete the task successfully and reduce the likelihood of error.

Examples of Progressive Disclosure

If we look closely, we live surrounded by examples where the designers have applied techniques of progressive disclosure in some way.

When we use an ATM, for example, the first options that appear on the screen are the most common (withdraw money, enter money, check balance, etc …) But imagine that what we want is to change the PIN number of the card, being an unusual option, we will surely have to access secondary screens until we find the right option.

progressive-Disclosure-complex

Although it has been a technique widely used in software applications (surely we all remember the progressive access via submenus to apply a plugin in Adobe Photoshop,) nowadays both on the web and in mobile applications it is essential to use this kind of techniques.

photoshop-progressive-Disclosure

But if there is a clear example of progressive disclosure, that is undoubtedly the typical link Read more that we can find in blogs and that allows access to the complete content of an article, such as those found in the web of loleta.

loleta-progressive-Disclosure

Another case of use is found in mobile applications, its limited screen space forces us to show only the necessary information at each moment of the interaction and to reveal the most advanced options as the user interacts with them.

abanca.progressive-disclosure-complex
In the end it tries to hide some less popular options and leave only those that we consider that users will use more regularly.

In the web version of Gmail, the main menu is contextual to the section where we are. If we access the main page and do not have any messages selected, the available options are limited to filter messages, Update and More hide a submenu with a secondary option to mark all messages as read.

gmail-disclosure-progressive

When we have a message selected or we are inside it, the menu includes a greater number of options (File, Mark as Spam, Delete, etc.) and also a More option that hides a submenu, in this case with secondary options related to the message in which we are like Mark as read, Highlight or Silence.

gmail-disclosure-progressive-complex

Leaving less frequent or more advanced tasks in secondary screens will keep the user’s attention without distracting him.

How to apply the “Progressive Disclosure” in our designs

Hiding the advanced functionality and leaving it for later stages of the process increase its success and conversion.

To begin with, we must do an honesty exercise in order to correctly differentiate the necessary options from those secondary ones.

Investigating and observing how users act is fundamental when it comes to understanding well this behavior and being able to be effective. The challenge is to find the prioritization assigned by the users and the appropriate sequence of steps among all the options.

Making an error in this selection can means that some users have to repeat tasks over and over again that lead to recurring options for them. The investigation is once again a great ally to detect these cases as soon as possible and to check if those tasks or actions should go to a first level.

The challenge is almost always to convince the people involved in the project to lose the fear of removing some options from the first level. They tend to offer some resistance, arguing that this increases the number of clicks to the target, but you just have to make them see that users who are looking for advanced options are willing to pay that price.

In the end, the key must always be to find the perfect balance between the number of available options and detailed information.

Conclusion

Applying progressive disclosure techniques we will achieve to:

  • Increase efficiency and ease of use.
  • Design for broader audiences (beginner and advanced users.)
  • Eliminate clutter and confusion.
  • Reduce cognitive effort.

Leave a Reply

Your email address will not be published. Required fields are marked *