mcpField
T
tui-fundamentals

tui-fundamentals

github.com/josiahsiegelDesign & UI59279 installsUpdated 19w ago
Repository

About tui-fundamentals

A design and architecture guide for developers planning terminal user interfaces. It covers when to use a TUI, framework selection, state organization, and terminal compatibility.

Key features

  1. 01Assess whether a TUI fits
  2. 02Separate model, update, and view
  3. 03Adapt layouts to terminal size
  4. 04Centralize terminal lifecycle handling
  5. 05Framework selection guidance

Use cases

  1. 01Plan a full-screen TUI or CLI
  2. 02Choose a framework for a terminal app
  3. 03Design layouts for terminal resizing
  4. 04Support both automation and interaction

Install

Copy the command and run it in a terminal.

$npx skills add https://github.com/josiahsiegel/claude-plugin-marketplace --skill tui-fundamentals

After installing, type/tui-fundamentalsin Claude Code to confirm it loaded.

Bundled filesreferences/framework-selection.mdreferences/tui-architecture.md

Details

From the project README

TUI Fundamentals, Architecture, and Framework Selection

Use this skill when the task is about the shape of the terminal product: what kind of TUI to build, which abstraction to use, how to organize state, or whether a full-screen terminal UI is the right answer.

First decision: is a TUI appropriate?

Prefer a rich TUI when users need continuous visual feedback, multi-step navigation, keyboard-driven exploration, selection among many items, or a dashboard-like control surface. Prefer a line-oriented CLI, prompts, or plain output when the flow is short, scriptable, primarily automation-focused, or likely to be used by screen readers and CI systems.

A production terminal product often ships both:

  • A scriptable CLI surface for automation, accessibility, logs, and non-TTY use.
  • An optional TUI for exploration, monitoring, bulk selection, or guided workflows.

Architecture rules

  1. Separate model, update, and view. Business state should not print directly to the terminal. Rendering consumes state; input produces events; update logic transforms state.
  2. Treat terminal size as input. Layout must be recomputed from width and height on every resize. Never bake in one terminal size.
  3. Own terminal lifecycle in one place. Raw mode, alternate screen, mouse, focus, keyboard protocols, and cleanup should be centralized.
  4. Make every action keyboard-operable. Mouse support is an enhancement, not the primary navigation model.
  5. Design for degradation. TERM=dumb, non-TTY output, missing color, Windows console differences, tmux/screen, SSH, and CI should have clear behavior.
  6. Avoid hidden global terminal writes. Logs, progress, and background task output must not corrupt the screen.

Framework selection quick matrix

NeedStrong default
Rust full-screen app with precise renderingRatatui + Crossterm
Python product-grade app with widgets, CSS, async workersTextual
Python rich output, progress, tables, markdown, logsRich
Python REPL, shell, completions, complex prompt inputprompt_toolkit
Classic dependency-light Unix TUIcurses/ncurses
Go Elm-style app with composable commandsBubble Tea + Bubbles + Lip Gloss
Go batteries-included forms/tables/tree viewstview over tcell
Go portable low-level cell enginetcell
React-style terminal components in NodeInk
Node DOM-like full-screen widgetsBlessed
.NET full-screen viewsTerminal.Gui
.NET rich CLI output and promptsSpectre.Console

Read references/framework-selection.md before committing to a framework in a new project.

Product design checklist

  • Define the primary user journey in one sentence.
  • Decide whether the app is full-screen, inline, prompt-based, or hybrid.
  • List required environments: Windows Terminal, classic conhost, macOS Terminal, iTerm2, GNOME Terminal, Alacritty, SSH, tmux/screen, CI, and logs.
  • Define minimum terminal dimensions and the small-screen fallback.
  • Define exit keys, destructive confirmation rules, and recovery instructions.
  • Define non-interactive equivalents for every essential action.
  • Decide how help is exposed: footer hints, ?, command palette, --help, docs.

Failure modes

  • Building a full-screen UI for a workflow that should be scriptable.
  • Choosing a low-level escape-sequence approach when a framework already solves layout, input, cleanup, and testing.
  • Mixing business logic with terminal writes, making tests brittle and rendering inconsistent.
  • Ignoring screen-reader users, CI, pipes, and TERM=dumb until late.
  • Assuming color, Unicode icons, Nerd Fonts, or mouse support are always available.

Reference files

  • references/framework-selection.md - Detailed ecosystem comparison and decision tree.
  • references/tui-architecture.md - State, event, lifecycle, logging, and distribution patterns.

Comments

Markdown supported