ot-ux-setup

Extract a repository's design tokens, components, and screen archetypes into a committed .uxproof/ contract.

Updated Sep 10, 2026
One-click install
npx skills add https://github.com/triage-software/skills --skill ot-ux-setup-triage-software
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ot-ux-setup
Source: https://github.com/triage-software/skills/tree/main/skills/ot-ux-setup
Command: npx skills add https://github.com/triage-software/skills --skill ot-ux-setup-triage-software

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires uxproof, and includes references (resource) components.

What problem does it solve? UX reviews often judge code against generic design rules instead of the repository's own design system. This Skill extracts the repo's actual design contract — tokens, component registry, screen archetypes, and conventions — into .uxproof/ so every subsequent UX review is grounded in this project's real design system. ## Core Features & Use Cases - Design contract extraction: Runs the pinned uxproof extractor to generate contract.json, tokens.json, components.json, and conventions.md from the working tree. - Manual section preservation: Team judgment calls written into the fenced manual section of conventions.md survive every regeneration and outrank generated rules. - Honest degradation: Repositories without a declared design system get a proposed palette derived from colors already in the code, clearly marked as suggestions rather than enforced tokens. - Use Case: Before running automated UX reviews on pull requests, run this once per repository so reviewers judge against your Tailwind tokens and component roots instead of generic heuristics; re-run after design-system changes to refresh the contract. ## Quick Start Ask the agent to extract this repository's design system into a .uxproof contract using the ot-ux-setup skill. ## Quick Start Run the ot-ux-setup skill to extract this repository's design tokens, components, and screen archetypes into a committed .uxproof contract.

Frequently Asked Questions about ot-ux-setup

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I extract a design system contract from my repository?▼

Run the ot-ux-setup skill, which executes the pinned `npx [email protected] init --no-skills` extractor over the working tree. It writes contract.json, tokens.json, components.json, and conventions.md into a .uxproof/ directory that you review and commit.

What design tokens and components does the extraction detect?▼

The extractor detects design tokens with their kind and source file, component roots with file counts, native-element equivalents like button mapping to Button, and screen archetypes such as list pages with canonical example files.

Does the UX contract extraction work without network or npm access?▼

Yes, the skill includes a manual-extraction fallback documented in references/contract-format.md that produces the same four files by hand. It does not improvise a partial scan when the npm extractor cannot run.

What happens to my custom conventions when the contract is regenerated?▼

Content inside the fenced manual section markers in conventions.md survives every regeneration and outranks generated rules on conflict. The skill never overwrites that section wholesale and stops with a blocked report if a step would drop it.

Can this skill review my UI code or mockups for design issues?▼

No, this skill only extracts the design contract and hands it over. Reviews belong to companion skills like ot-ux-review-pr for pull request UI or ot-ux-shape for whole modules, which the skill names instead of improvising findings.

What if my repository has no declared design tokens?▼

The contract records that honestly and proposes a de-facto palette derived from colors already used in the code. These proposals are documentation only and are never enforced as rules until the team declares real tokens.