1---
2title: Show What Matters Now, Reveal Complexity Later
3impact: HIGH
4tags: ux, progressive-disclosure, complexity
5---
6 
7## Show What Matters Now, Reveal Complexity Later
8 
9Don't overwhelm users with everything at once. Reveal complexity incrementally as needed.
10 
11**Incorrect (all controls visible):**
12 
13```tsx
14function Editor() {
15  return (
16    <div>
17      <BasicTools />
18      <AdvancedTools />
19      <ExpertTools />
20      <DebugTools />
21    </div>
22  );
23}
24```
25 
26**Correct (progressive disclosure):**
27 
28```tsx
29function Editor() {
30  const [showAdvanced, setShowAdvanced] = useState(false);
31  return (
32    <div>
33      <BasicTools />
34      {showAdvanced && <AdvancedTools />}
35      <button onClick={() => setShowAdvanced(!showAdvanced)}>
36        Toggle
37      </button>
38    </div>
39  );
40}
41```
42