UI Design Workbench

Русская версия · Changelog

Explore an application's screens and navigation in an interactive HTML preview built from its source code. No application build or launch is needed.

Use it to understand a project, inspect supported UI states, or request a separate UI/UX review. Parsing does not execute application logic or guarantee the same pixels as the running application.

Review view of the bundled demonstration fixture. Findings belong to the separate review workflow.

Install

For source analysis and basic checks, install Python 3.10+ and pipx, then run:

pipx install ui-design-workbench-cli
uidw --version
uidw doctor

doctor reports dependencies and cache settings. Full browser checks additionally need Node.js 22+ and Chrome, Edge or Chromium. Basic --level quick checks do not need them. To view the generated HTML, use a browser.

CLI use does not require an agent or MCP. For Codex and other agents, follow agent setup.

First preview

Open a terminal in your application's root directory. These commands work in PowerShell and a POSIX shell:

uidw config setup --detail medium
uidw workbench --output-dir ../ui-preview --level quick --open

This example selects representative preview data (medium). Run uidw config setup without the option to choose interactively. The first command stores settings; the second writes ../ui-preview/ui-preview.html and opens it. Check reports are under ../ui-preview/validation/.

Look for проверка pass in the CLI output. If checks fail, HTML may still exist as a diagnostic preview: read the reports before treating reconstruction as complete. CLI messages are primarily Russian; the HTML interface supports English and Russian. Add --lang en to select English in the preview.

For absolute paths, Windows examples, detail levels and recovery steps, see first run.

Choose the task

workbench and check validate reconstruction. review requests UI/UX findings. Detail (low/medium/high) controls preview content; --level quick/full controls validation. No detail level starts a UI/UX audit.

See using the preview, uidw --help and uidw help advanced for further commands.

Source support and accuracy

Each adapter supports a subset of its framework. Evidence below concerns small fixtures, not every platform configuration or application.

Missing values and unsupported constructs are reported as gaps. Fonts, system controls and runtime data can change the result. Optional native Android/Apple discovery never launches an emulator or simulator automatically. See accuracy details and native rendering.

Files and application source

Preview and review leave application source unchanged. Applying an accepted proposal is a separate action. The default cache lives outside the application repository; an explicit output directory receives HTML and reports. Export browser review state before moving the preview or clearing browser storage.

Upgrade

For a pipx installation:

pipx upgrade ui-design-workbench-cli
uidw --version

For a managed skill copy, also run uidw install-skill codex (or your agent name) and start a new agent session. Linked development skills and separate MCP environments have different steps: see agent upgrades.

Documentation

User guides: First run · Using the preview · Agent setup · Troubleshooting.

Technical references (English): Fidelity · Native rendering · Cache · Components · IR schema · Review contract.

Current CLI version: 0.6.10.