# Clean default UI pass

Last updated: 2026-05-12

## Goal

The application had become functionally rich but visually too dense. The default view should communicate one simple loop:

```text
upload audio → adjust 2-3 controls → extract → audition waveform and sample cards
```

Everything else should remain available, but it should not compete with that loop until the user opens the relevant panel.

## Implemented changes

| Area | Change |
|---|---|
| Default panels | Left-sidebar source, selection, pipeline, history, right-sidebar exports, and bottom review/edit are collapsed by default. |
| Bottom dock | Reduced to a compact tab bar until a tool is opened; opening a bottom tool expands only the bottom dock. |
| Top bar | Shorter top bar, smaller logo mark, compact upload control, compact backend status, smaller primary action. |
| Main workspace | Waveform and sample cards get more of the viewport by shrinking sidebars, gaps, padding, and the collapsed bottom dock. |
| Common controls | Helper paragraphs, long field hints, and range captions are hidden in the default common-control card. |
| Advanced controls | Advanced DSP/model/cache parameters remain available but are collapsed and visually quieter. |
| Pipeline/logs/history | Still present, but no longer visible unless the user opens the relevant left-sidebar panel. |
| Review/edit tools | Still present, but moved behind the collapsed bottom dock so normal extraction is not visually crowded. |
| Local scrolling | The page remains non-scrolling; only panels and grids scroll internally when needed. |

## Default visible surface

The default screen now shows only:

1. app identity;
2. upload control;
3. backend status;
4. primary extract button;
5. collapsed utility panels;
6. waveform transport;
7. sample-card grid;
8. common extraction controls.

This keeps the advanced workstation architecture without making the application feel like a debug console.

## Preserved behavior

No backend API or DOM id was removed. Existing functionality is still wired:

- whole-app drag/drop upload;
- extraction jobs and SSE progress;
- source/stem/reproduced preview transport;
- waveform onset selection and force-onset mode;
- sample/hit audition;
- run history;
- supervised editing;
- edited export;
- raw tables;
- advanced parameter tuning.

## Remaining UI work

1. Add a single keyboard shortcut/help overlay so hidden tools remain discoverable.
2. Add browser screenshot regression tests for the clean default layout.
3. Consider a true icon rail if the left collapsed panel summaries still feel too wide after real browser review.
4. Add a focused empty state inside the waveform/sample area before upload.
5. Migrate the frontend to TypeScript/Vite once the UI stops changing rapidly.