mcpField
P
progressive-disclosure

progressive-disclosure

github.com/flpbaladaDesign & UI835 installsUpdated 1d ago
Repository

About progressive-disclosure

A design skill for structuring interfaces with progressive disclosure. It offers visibility rules, reveal patterns, and checks for evaluating findability and task completion.

Key features

  1. 01Organizes content into four visibility levels
  2. 02Keeps primary actions visible
  3. 03Uses expandable sections, tooltips, and tabs
  4. 04Adds search for deep settings
  5. 05Checks task completion and findability

Use cases

  1. 01Simplifying a complex settings interface
  2. 02Choosing which actions appear by default
  3. 03Designing a multi-step setup flow
  4. 04Checking whether advanced features are discoverable

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/flpbalada/fb-skills --skill progressive-disclosure

After installing, type/progressive-disclosurein Claude Code to confirm it loaded.

Details

From the project README

Progressive Disclosure

Show what user needs now. Reveal more when needed.

Goal

Reduce visible complexity without hiding essential work.

Rules

  • Keep primary actions visible.
  • Hide only secondary or advanced options.
  • Use clear reveal controls.
  • Keep reveal patterns consistent.
  • Remember user preference when useful.
  • Provide search for deep settings.
  • Test with new and experienced users.

Levels

  • Level 0: essential, always visible.
  • Level 1: important, one action away.
  • Level 2: useful but less common.
  • Level 3: advanced, intentionally deeper.

Patterns

  • Expand section for extra fields.
  • Tooltip for short help.
  • Drawer or modal for sub-flow.
  • Tabs for peer categories.
  • More menu for secondary actions.
  • Wizard for multi-step setup.

Flow

  1. Inventory visible elements.
  2. Mark user need and frequency.
  3. Keep essential frequent items visible.
  4. Move contextual items one action away.
  5. Move rare advanced items deeper.
  6. Add clear trigger labels or icons.
  7. Test task completion and findability.

Resources

Output

## Progressive Disclosure Plan

Interface: [name]

Level 0:
- [element]

Level 1:
- Trigger: [control]
- Reveals: [elements]

Level 2+:
- Trigger: [control]
- Reveals: [elements]

Metrics:
- Task completion: [target]
- Time to complete: [target]
- Support tickets/confusion: [target]

Checks

  • Primary task works without expansion.
  • Advanced feature can be found.
  • Reveal affordance is obvious.

Comments

Markdown supported