SKILL.md
Gestalt UI Organisation
UI should be organised so that the visual structure communicates relationships — which commands, controls, and elements belong together — without requiring users to read labels or documentation.
Core Gestalt Principles for UI Layout
1. Proximity
Elements that are close together are perceived as a group.
- Place related controls (e.g. Bold / Italic / Underline) close together with minimal gap between them
- Separate unrelated groups with larger whitespace
- Do not use lines or borders as the primary grouping mechanism — proximity alone should convey the relationship
Example: A toolbar with [Cut] [Copy] [Paste] grouped tightly, then a wider gap before [Undo] [Redo], communicates two distinct command groups without any visual divider.
Prefer whitespace over separator lines
Default to whitespace, not divider lines, for grouping. Most separators do work that spacing does better — they add noise and a "boxed-in" feel without adding information. Remove the majority and let proximity carry the grouping.
Caveat: a line takes almost no space, so removing it leaves groups too close. Removing separators usually means adding spacing — budget the whitespace (occasionally a subtle background or heading) rather than just deleting the line and leaving the layout cramped.