Made with 🧠 and 🫀 by Youssef Bouksim

Back to library
🧅

Progressive Disclosure

Show people only what they need right now. Keep the rest out of sight until they ask for it. Less clutter, faster decisions, less confusion.

5 min readUX · Forms · Interaction

Imagine walking into a restaurant and instead of a menu, the chef lists every single ingredient in the kitchen. Technically it’s all the information you need — but it’s useless. What you actually want is: what can I order tonight?

That’s what bad UI design does. It shows everything at once — every option, every setting, every field — and leaves the user to figure out what’s relevant to them. Progressive disclosure is the opposite approach: show the essentials first. Let people ask for more when they need it.

The idea was formalised by software designer JF Nance in the 1980s, but it’s really just common sense. People don’t want to know everything upfront. They want to get started, and discover more as they go.

✦ Key takeaways
✓
<strong>Most users only need the basics.</strong> On any given form or settings page, the majority of people will use the default options and never touch the advanced stuff. Showing all options equally wastes their time and makes the simple task feel hard.
✓
<strong>Hiding something isn't the same as removing it.</strong> Progressive disclosure doesn't take features away — it just keeps them out of the way until someone needs them. The 'Advanced settings' link is still there. Power users will find it. Everyone else won't be slowed down by it.
✓
<strong>The order matters.</strong> Start with the most common task. End with the edge cases. If 90% of users just want to send an email, lead with: To, Subject, Message. The scheduling, tracking, and reply-to options can wait behind a click.
“Don’t show people everything at once. Show them what they need to get started. Let them ask for the rest.”
— JF Nance, IBM, 1987

Sending an email — the same form, two ways

Below are two versions of an email campaign form. Same features, same fields. The bad version shows everything at once. The good version shows the three fields most people need, with the rest behind a single “Advanced options” link.

Before — everything shown at once
yourapp.com/campaigns/new
Mailer
New campaign
Fill in all the details below to send your campaign.
Subject line
e.g. Your weekly update is here
Preview text
Text shown after subject in inbox
From name
e.g. Youssef at Appname
Reply-to
replies@yourcompany.com
Send to
All subscribers (4,210)
Email body
Write your email here...
Send time
Send now
Timezone
UTC+1
Open tracking
Click tracking
Unsubscribe link
Plain text fallback
Google Analytics UTM
Campaign tags
e.g. newsletter, q2, product-update
Send campaign
Save draft
13 fields and 5 toggles, all visible before the user has typed a word. Most people just want to write their email and send it.
After — essentials first, advanced hidden
yourapp.com/campaigns/new
Mailer
New campaign
Three steps to send your first campaign.
1
Content
2
Audience
3
Send
Subject line
e.g. Your weekly update is here
Send to
All subscribers (4,210)
Email body
Write your email here...
Advanced options7 settings
Send campaign
Save draft
3 fields to get started. Everything else is one click away.

The good version doesn’t remove any features. Every option from the bad version is still there — it’s just not in the way. A new user can send their first campaign in seconds. A power user who needs UTM tracking or a custom reply-to address will find it exactly where they’d expect it.

This is the key insight: progressive disclosure is not about making things simpler for everyone. It’s about making things easier for most people, without making them harder for anyone.


A field that only appears when you need it

When you search for a hotel on Booking.com, you pick how many adults, children, and rooms you need. Simple. But if you add a child, something new appears: a dropdown asking for the child’s age. Booking.com needs this to calculate the right price. But it would be annoying — and confusing — to ask everyone for a child’s age. So they don’t. They only ask when it’s actually relevant.

Try it below. Start with 0 children. Then click + to add a child and watch what happens.

After — child age appears only when needed
booking.com/searchresults?ss=Lagos
Booking.com
Stays
Flights
Rentals
Lagos
Check-in — Check-out
2 adults · 0 children · 1 room
Adults
2
Children
Ages 0 -- 17
0
Rooms
1
Home › Nigeria › Lagos › Search results
Lagos: 28 properties found
Click + next to Children and watch the age selector appear instantly. Remove the child and it disappears. The question is only asked when it matters.

This is progressive disclosure at its simplest. Booking.com knows that most searches don’t involve children. So it doesn’t ask everyone for a child’s age. The moment you say “I have a child” — and only then — the relevant question appears. The form adapts to your situation instead of dumping everything on you at once.


Where to use it

Progressive disclosure works anywhere people have different levels of need. Here are the most common places you’ll find it in products:

✦ Key takeaways
✓
<strong>Forms with optional fields.</strong> Show the required fields first. Put 'optional' fields behind a 'Show more' toggle — or don't show them at all unless the user asks.
✓
<strong>Settings pages.</strong> Lead with the three settings most people actually change. Put everything else in 'Advanced' or a secondary screen.
✓
<strong>Product descriptions.</strong> Short description first, 'Read more' for the details. People scanning a page shouldn't have to read a wall of text just to understand what something is.
✓
<strong>Onboarding flows.</strong> Don't explain every feature on day one. Introduce features when users first need them — not all at once in a tutorial they'll skip.
✓ Apply it like this
→Start with the 2-3 fields or options that cover 80% of use cases.
→Use clear labels like 'Advanced options' or 'More settings' — users need to know there's more hiding there.
→Keep advanced options available and easy to find — progressive disclosure hides things, it doesn't remove them.
→Introduce features when they become relevant — during the task, not all upfront.
✗ Common mistakes
→Showing every option at once — it overwhelms new users and makes simple tasks feel complicated.
→Hiding things so well that power users can't find them — 'Advanced' should be a click, not a treasure hunt.
→Using progressive disclosure to hide important information — like pricing, fees, or warnings. That's not UX, that's deception.
→Collapsing everything — if you hide even the basics, users won't know where to start.

Nance, J. F. (1987). Progressive disclosure. CHI ’87: Proceedings of the SIGCHI conference on Human factors in computing systems. · Nielsen, J. (2006). Progressive disclosure. Nielsen Norman Group.