tui-designlisted

This skill should be used when designing terminal user interfaces, creating TUI layouts, choosing TUI color schemes, implementing keyboard navigation, building terminal dashboards, or working with any TUI framework. Activates on mentions of TUI design, terminal UI, Ratatui layout, Ink components, Textual widgets, Bubbletea views, terminal color palette, keybinding design, panel layout, split panes, terminal dashboard, box-drawing characters, sparklines, progress bars, modal dialogs, focus management, or terminal accessibility.
marcioaltoe/roundfix · ★ 2 · Web & Frontend · score 75

Install: claude install-skill marcioaltoe/roundfix

# TUI Design System Universal design patterns for building exceptional terminal user interfaces. Framework-agnostic, works with Ratatui, Ink, Textual, Bubbletea, or any TUI toolkit. **Core philosophy:** TUIs earn their power through spatial consistency, keyboard fluency, and information density that respects human attention. Design for the expert's speed without abandoning the beginner's discoverability. ## TUI Design Process ```dot digraph tui_design { rankdir=TB; "What are you building?" [shape=diamond]; "Select layout paradigm" [shape=box]; "Design interaction model" [shape=box]; "Define visual system" [shape=box]; "Validate against anti-patterns" [shape=box]; "Ship it" [shape=doublecircle]; "What are you building?" -> "Select layout paradigm"; "Select layout paradigm" -> "Design interaction model"; "Design interaction model" -> "Define visual system"; "Define visual system" -> "Validate against anti-patterns"; "Validate against anti-patterns" -> "Ship it"; } ``` --- ## 1. Layout Paradigm Selector Choose your primary layout based on what you're building: | App Type | Paradigm | Examples | | ------------------ | ------------------------ | ------------------- | | File manager | Miller Columns | yazi, ranger | | Git / DevOps tool | Persistent Multi-Panel | lazygit, lazydocker | | System monitor | Widget Dashboard | btop, bottom, oxker | | Data br