om-ux-setup

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

1|Updated Apr 23, 2026
One-click install
npx skills add https://github.com/tkogut/agents-os-core --skill om-ux-setup-tkogut
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: om-ux-setup
Source: https://github.com/tkogut/agents-os-core/tree/main/global_skills/om-ux-setup
Command: npx skills add https://github.com/tkogut/agents-os-core --skill om-ux-setup-tkogut

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 actual design contract (tokens, component registry, screen archetypes, conventions) from the working tree into .uxproof/, so every subsequent UX review is grounded in this repo's real design system. ## Core Features & Use Cases - Design contract extraction: Runs the pinned npx uxproof@0.3.1 init --no-skills extractor to produce contract.json, tokens.json, components.json, and conventions.md, with a manual by-hand fallback when npm or network access is unavailable. - Persistent team conventions: A fenced manual section in conventions.md captures judgment calls only the team knows (naming rules, forbidden patterns, tone) and survives every regeneration, outranking generated rules. - Honest degradation: When a repository has no declared design system, it records that fact and proposes a palette derived from colors already in the code, clearly marked as suggestions rather than enforced tokens. - Use Case: Before running UX reviews on a Next.js + Tailwind codebase, run this once to generate the .uxproof/ contract, commit it, and let review skills judge pull requests against the project's own tokens and components. ## Quick Start Ask the agent to run the UX setup skill to extract this repository's design system into a .uxproof/ contract and report what was found.

Frequently Asked Questions about om-ux-setup

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

FAQPage Schema
How do I extract a design system from my repository for UX reviews?▼

Run this skill once per repository: it executes the pinned uxproof extractor to scan the working tree and writes contract.json, tokens.json, components.json, and conventions.md into .uxproof/. Commit the result so UX review skills judge against your repo's actual design system.

What does the uxproof extractor detect in a frontend codebase?▼

It detects the framework (Next.js, React, Vite), the styling system (Tailwind, CSS, CSS-in-JS), design tokens with their source files, component roots and registries, native-element equivalents, and screen archetypes with canonical example files.

Can I run the design contract extraction without npm or network access?▼

Yes. The skill defines a manual-extraction fallback in references/contract-format.md that produces the same four .uxproof/ files by hand. The report must state that the contract was written manually rather than extracted.

What happens if my repository has no design system or declared tokens?▼

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

Will regenerating the contract overwrite my team's custom conventions?▼

No. The fenced manual section in conventions.md survives every regeneration and outranks generated rules on conflict. The skill also never regenerates silently: it asks before refreshing an existing contract.

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

No. It only extracts the contract and hands it over, deliberately producing no findings or verdicts. For reviews it points to companion skills such as om-ux-review-pr for pull requests or om-ux-shape for whole modules.