Progressive Disclosure

Progressive disclosure defers advanced or rarely used features to a secondary screen, making applications easier to learn and less error-prone. -Jakob Nielsen

Note: This page is a work-in-progress. Feedback and suggested improvements are welcome. Please join the discussion on moodle.org or use the page comments.

I am especially interested in comments about the readability, accessibility and brevity of the document. (UI consistency guidelines project)

What?

Progressive disclosure is a technique used in user-interface design to alleviate clutter that often misleads users, especially inexperienced ones.

When to use?

When you know most users will want to take a simple route and just get a job done, but some users will want to do something more advanced.

What you need first: know the users of the app/module in question, and their goals.

How to do it?

Take advanced controls out of the way of the users who do not need them. Place them on an alternate, less prominent route that users with more experience can take to learn about advanced features.

One typical way to do this is to have an "advanced" button, which leads to further configuration options. They should all have reasonable defaults so that the application does the Right Thing even if the user does not.

In depth

Identify the key workflow: what users actually do most of the time. If there are further controls or alternative workflows that are really needed by some of the key users sometimes, but would distract the most common, basic workflow (especially when used by the users who are just learning the basic workflow) create an alternate route.

Why do it?

Progressive disclosure the benefit of letting the less-experienced users know what they can safely ignore: when a button is labeled "advanced", they will know that the program is designed to work just fine without seeing what is behind that button.

(They may be curious and take a peek, but they still so it in the safety of knowing they still don't have to do anything more.)

Common mistakes

There are no such things in reality as a novice user, intermediate user or an advanced user. Different personas have various dimensions of know-how in terms of computer literacy. A common mistake is making users choose what their skill level is, and based on that show more or fewer controls.

Please see the talk page for further caveats. To use progressive disclosure, you need to know the circumstances of different personas: since it typically hides features, it needs to be made sure progressive disclosure does not unreasonably slow down experienced users.

Examples

Simple progressive disclosure in a form

This will store the information in a session, about in which state the form was left, so if you press the 'Show advanced' button once, you will see the advanced controls shown anytime you come back to the form.

the form after pressing the "show advanced" button

the form after pressing the "show advanced" button

For information about how to implement this, see Progressive Disclosure Implementation

Further information / Sources

• Jakob Nielsen's Alertbox: Progressive Disclosure
• Wikipedia: Progressive disclosure

(TODO: search progressive disclosure for examples and add some here)