Progressive disclosure is an interaction design technique that sequences information and actions across several screens in order to reduce feelings of overwhelm for the user (Spillers 2004).
Nielsen (2006) defines progressive disclosure as a technique that “defers advanced or rarely used features to a secondary screen, making applications easier to learn and less error-prone”.
By disclosing information progressively, interaction designers reveal only the essentials and help users manage the complexity of feature-rich sites or applications. Progressive disclosure follows the typical notion of moving from "abstract to specific"; including the sequencing of user behaviors or interactions not necessarily level of detail (information). In other words, progressive disclosure is not just about displaying abstract then specific information, but rather about 'ramping up' the user from simple to more complex actions or tasks.
In its most formal definition, progressive disclosure means "to move complex and less frequently used options out of the main user interface and into secondary screens". Progressive disclosure says: "Make more information available within reach, but don't overwhelm the user with all the features and possibilities" (Spillers 2004).
Progressive disclosure is a concept that has been around since at least the early 1980's. The technique caught the attention of user interface specialists with John M. Carroll and Mary Rosson’s lab work at IBM (Carroll 1983), where they found that hiding advanced functionality early on led to an increased success of its use later on. The approach dubbed "training wheels" (Carroll 1984) is one of the only references validating the technique.
Empirical research lacking
Carroll and Rosson (1997) indicated that no empirical evidence exists regarding the effectiveness of progressive disclosure and that the training wheels approach only studied a "single computer application (word processor) and a single interface style (menu based control)".
Historically, progressive disclosure is a concept that came from the software usability experience. It is clearly easier to apply to software than it is on the Web, which is likely why few web-based progressive disclosure guidelines exist. In software, the interaction is between dialogues and 'fixed state' interactions. On the Web, interactions are chaotic, randomized and dynamic due to the fact that hypertext is a non-linear media.
Furthermore, in the software world the audience is predictable and targeted, making learning styles more predictable. On the Web, it's anybody's guess who might be using the site. The website visitor might be a particle physicist, a teen or a grandma. Learning styles, comfort levels and expectations differ greatly.
While independent usability studies have shown that appropriate usage of the progressive disclosure technique is valuable, more empirical research is clearly required.
New definitions needed
One of the weaknesses of the Carroll and Rosson studies is that they draw from Word processor metaphors (static desktop applications) and from a user base unlike the users of today who are exposed to dozens of interfaces and Internet sites. So to, the thinking about progressive disclosure by usability practitioners is framed in early 1990’s terms.
Nielsen (2006) introduces a hybrid to progressive disclosure called “staged disclosure”, characterized by the “wizard” (back-next) interaction technique. However, as with other applications of progressive disclosure, specific context of use can paralyze the effectiveness of progressive disclosure.
Today, new definitions of progressive disclosure need to be explored as interface complexity problems change and interfaces evolve. Microsoft Office 2007 task ribbons, Apple Leopard “stacks” and “spaces”; AJAX “instant add/edit/delete” website interfaces and iPhone “pinch and zoom” interactions require us to think differently about the potential of more accessible and elegant formats of progressive disclosure displays-across all displays and devices.
Examples of progressive disclosure
An example of progressive disclosure is an online news article that is spread across four screens (with a Next Page link at the bottom). This use of progressive disclosure serves advertising objectives (showing banners on each page) and not the user's task. Another example is a Web site that explains a product by making the user click through 4-5 pages of overview/benefits information before revealing the price of the product. The idea here is that if the user reads the product information, they will accept the price more easily. The problem with that approach is that it does not accommodate free-form exploration, a typical behavior on the web.
In its purest format, progressive disclosure is about offering a good “teaser”.A good teaser can include the following:
A sample of what is next
An introductory task that is most common
A high level view of what is expected
A wizard that walks the user through the task (a “staged disclosure” according to Nielsen).
A button that leads to more advanced functions (such as editing)
Progressive Disclosure usability guidelines
Usability guru Jakob Nielsen has stated (2000; 2002) that progressive disclosure is one of the best interaction design techniques. In interviews, for example, Nielsen has stated:
"Good usability includes ideas like progressive disclosure where you show a small number of features to the less experienced user to lower the hurdle of getting started and yet have a larger number of features available for the expert to call up". (Sitepoint interview 2002)
"Progressive disclosure is the best tool so far: show people the basics first, and once they understand that, allow them to get to the expert features. But don't show everything all at once or you will only confuse people and they will waste endless time messing with features that they don't need yet". (Slashdot interview 2000)
In 2006, Nielsen departed from merely stating the benefit of progressive disclosure, but providing several usability guidelines for using progressive disclosure. These guidelines included:
Getting the right split between initial and secondary features.
Making it obvious how users progress from the primary to the secondary disclosure levels (by increasing information scent and making target area visible).
Avoid multiple ways to progress to secondary options.
Consider multiple secondary displays, each of which is revealed by a different control on the initial display.
Using user observations to increase effectiveness
Progressive disclosure is an interaction design technique that emerges out of the insights gained during Field Studies or Task Analysis (user observation of tasks). Observing users in the field, allows you to understand their workflow outside of your technology. This insight gives you the data you need to prioritize and sequence content and functionality (Spillers 2004; Nielsen 2006).
By observing user workflow, sequence of task and priority of aids used in problem-solving, researchers can gain more insight into appropriate progressive disclosure design choices. For example, by observing someone's eating habits, you'll know whether they typically look at the desert and drinks menu at the start, in the middle or at the end of the meal. You'll discover whether they like to eat the main course or their salad first and whether they drink before a meal or at the end of a meal.
Progressive disclosure is best used as a contextual research tool, taking user insights gained in ethnographic field studies, and developing design decisions based on in-depth familiarity with what will aid users most in sense-making.
As a design technique progressive disclosure’s fallacies can be prevented by basing the progressively disclosed tasks and information on actual observed user behavior. Ad-hoc use of progressive disclosure will yield inaccurate results.
Using progressive disclosure effectively on the web
The best way to think about progressive disclosure on the web is: "Only show information that is relevant to the task the user wants to focus on, on any given page".
Examples of progressive disclosure on the Web:
Learn more link
Related topics link
Overview of account information on the first screen
View more details link
Advanced search link
Forrester Research (2003) points to an example with Internet configurator tools: “Instead, minimize jarring transitions by providing the right level of detail at the right time throughout the scenario. Progressive disclosure is a design technique that reduces the complexity of an interaction by providing interface layers that incrementally introduce content and function based on the customer’s progress through the application”.
Pros and Cons of Progressive Disclosure
Progressive disclosure is powerful because it embraces several good design principles:
Advocate for users with different needs (experienced and non-experienced users)
Limit what you show on a screen
Give access to the low hanging fruit and de-emphasize infrequent tasks
Only show users what they need when they need it
Focus the interface on making the user successful at the start
Benefits of Progressive Disclosure:
Remove the need for the user to explore and examine the interface first
Allow the user to chunk the task in a sequence that matches their expectation
Reduce cognitive overload
Increase the efficiency and ease of use of the site
Dangers of Progressive Disclosure
Users are forced to wait until you are ready to show them
Repeat use may not require progressive disclosure (depends on the task)
Over-constraining what users see (or dumbing it down too much)
Assuming you understand what is the most popular, common or important task
Progressive disclosure can be powerful. It allows users to orient to a screen, figure out what they need to do, and do it in steps that reveal more complex information as they go along. The downside to it, is in its inappropriate usage. Microsoft Word 2003, for example, is full of many inappropriate uses of progressive disclosure, such as the auto-hiding extra menus that users have to repeatedly activate even if they don't use the menu item (the down arrows that appear at the bottom of any menu). Word 2007 tries to address this by moving away from hidden menu items instead opting for the task ribbon interface.
Advances in implementing Progressive Disclosure
New JavaScript and AJAX interface techniques hold great promise for resolving progressive disclosure-one the most popular interaction design techniques (Spillers 2007) specifically with regard to:
Extending discoverability;
Providing dynamic “smart” help;
Giving the user less “drill down” or more shallow navigation; and
Showing related details or content.
