VOCABULARY / ENTRY
Progressive Disclosure
progressive-disclosure
Show primary content or options first, and make secondary content available when people need it.
Interactive specimen · Fictional product FIELDNOTES
Notification settings
Advanced settings
The time you entered is retained when this section is closed and reopened.
Recognizing it
- Primary options stay visible
- A clear entry point to secondary options
- State survives expanding and collapsing
Concept boundary
Hidden content needs a discoverable entry point. Essential prices, risks, and actions must not disappear in the name of simplicity.
When to consider it
- Primary and secondary settings can be distinguished
- Beginners and experienced people share the same interface
When to be cautious
- Everyone must repeatedly expand the same section to complete a task
- Information needed for a decision is classified as advanced content
Tradeoff
The initial amount of information is smaller, at the cost of discovering and opening secondary content.
Conditional rules · Editorial advice
When A section is collapsed and reopenedMustPreserve the information already entered.
When Information is necessary for a decisionMustMake costs and important consequences visible before the decision.
Related entries
Recognition Rather Than Recall ↗Works with · Designing an expansion control
The control should help people recognize what is inside.
Inline Edit ↗Works with · Editing secondary settings after expanding them
Disclosure and editing can address different problems in the same flow.
Hidden Costs ↗Can be misused as · Hiding unavoidable fees until after a commitment
Concealing information cannot be justified as progressive disclosure.
Sources and what they support
NN/g · Progressive Disclosure ↗
Defers secondary options so the initial interface can focus on primary options.
Retrieved: 2026-09-15Definitions reference these sources. Digital specimens, selection advice, relationships, and recipes are editorial work and have not been validated through user research.
Type extensions and implementation notes
Capability tags describe this specimen only; verify the implementation again in a real product.
{
"states": [
"collapsed",
"expanded"
],
"a11y": [
"The control works with a keyboard and exposes its expanded state"
],
"motion": "Expansion does not depend on animation"
}Full Agent entry JSON
{
"id": "progressive-disclosure",
"type": "interaction",
"name": {
"zh": "渐进披露",
"en": "Progressive Disclosure"
},
"aliases": [
"按需展开",
"高级设置",
"渐进式披露"
],
"granularity": "flow",
"intents": [
"configure",
"reduce-complexity"
],
"tags": [
"settings",
"beginners",
"secondary options",
"expand",
"advanced"
],
"definition": "Show primary content or options first, and make secondary content available when people need it.",
"boundary": "Hidden content needs a discoverable entry point. Essential prices, risks, and actions must not disappear in the name of simplicity.",
"signature": [
"Primary options stay visible",
"A clear entry point to secondary options",
"State survives expanding and collapsing"
],
"when": [
"Primary and secondary settings can be distinguished",
"Beginners and experienced people share the same interface"
],
"when_not": [
"Everyone must repeatedly expand the same section to complete a task",
"Information needed for a decision is classified as advanced content"
],
"tradeoff": "The initial amount of information is smaller, at the cost of discovering and opening secondary content.",
"comparison": {
"focus": "Controlling when secondary options appear",
"mechanism": "Presenting information in stages",
"cost": "Discovery and access costs for secondary content"
},
"sources": [
{
"id": "nng-disclosure",
"title": "NN/g · Progressive Disclosure",
"url": "https://www.nngroup.com/articles/progressive-disclosure/",
"claim": "Defers secondary options so the initial interface can focus on primary options.",
"checkedAt": "2026-09-15",
"archive": {
"lookupUrl": "https://web.archive.org/web/20260915*/https://www.nngroup.com/articles/progressive-disclosure/",
"status": "available",
"checkedAt": "2026-09-15T16:50:00.277Z",
"jobId": "spn2-c8cd05d9fd1d5430e711dfedd823448ccbfc74cb",
"url": "https://web.archive.org/web/20260915165025/https://www.nngroup.com/articles/progressive-disclosure/",
"timestamp": "20260915165025"
}
}
],
"relations": [
{
"target": "recognition",
"kind": "composes_with",
"condition": "Designing an expansion control",
"reason": "The control should help people recognize what is inside.",
"basis": "editorial"
},
{
"target": "inline-edit",
"kind": "composes_with",
"condition": "Editing secondary settings after expanding them",
"reason": "Disclosure and editing can address different problems in the same flow.",
"basis": "editorial"
},
{
"target": "hidden-costs",
"kind": "misused_as",
"condition": "Hiding unavoidable fees until after a commitment",
"reason": "Concealing information cannot be justified as progressive disclosure.",
"basis": "editorial"
}
],
"rules": [
{
"when": "A section is collapsed and reopened",
"instruction": "Preserve the information already entered.",
"strength": "must",
"basis": "editorial"
},
{
"when": "Information is necessary for a decision",
"instruction": "Make costs and important consequences visible before the decision.",
"strength": "must",
"basis": "editorial"
}
],
"behavior": {
"states": [
"collapsed",
"expanded"
],
"a11y": [
"The control works with a keyboard and exposes its expanded state"
],
"motion": "Expansion does not depend on animation"
},
"demo": "progressive-disclosure",
"version": "0.1.0",
"editorialStatus": "sample-reviewed",
"requirements": [],
"demoCapabilities": [
"keyboard",
"reduced_motion"
],
"implementationNote": "Capability tags describe this specimen only; verify the implementation again in a real product.",
"searchTerms": [
"设置",
"新手",
"次要选项",
"展开",
"advanced"
]
}