om-ux-setup

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

2.6k|159|Updated Mar 8, 2021
One-click install
npx skills add https://github.com/go-musicfox/go-musicfox --skill om-ux-setup-go-musicfox
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: om-ux-setup
Source: https://github.com/go-musicfox/go-musicfox/tree/main/.agents/skills/om-ux-setup
Command: npx skills add https://github.com/go-musicfox/go-musicfox --skill om-ux-setup-go-musicfox

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 repository's actual design contract (tokens, component registry, screen archetypes, conventions) into a versioned .uxproof/ directory so every subsequent UX review is grounded in this codebase'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 override surface: Preserves a fenced manual section in conventions.md where team judgment calls survive every regeneration and outrank generated rules. - Honest degradation: When a repository has no declared tokens, it records that fact and proposes a palette derived from colors already in the code as a first draft, never as an enforced rule. - Use Case: A team adopting AI-assisted UX reviews runs this once per repository so that pull request reviews and module audits cite the project's own tokens and components instead of generic heuristics. ## Quick Start Ask the agent 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 contract from my repository?

Run the skill once per repository; it executes npx [email protected] init --no-skills to generate contract.json, tokens.json, components.json, and conventions.md in a .uxproof/ directory. Commit the result like code so reviews can reference it.

What design systems and frameworks does the contract extraction support?

The extractor detects frameworks such as Next.js, React, and Vite, and styling systems including Tailwind, plain CSS, and CSS-in-JS. Repositories without a declared design system still get a contract recording that fact plus a proposed palette from colors already in the code.

What happens if there is no network or npm access during extraction?

The skill does not improvise a partial scan. It follows the manual-extraction fallback in references/contract-format.md, writing the same four files by hand and noting in the report that the contract was written manually.

Will re-running the extraction 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 asks before refreshing an existing contract rather than regenerating silently.

Does this skill review my UI code or designs?

No. It only produces the design contract and hands it over. Reviews belong to companion skills such as om-ux-review-pr for pull requests or om-ux-shape for whole modules, which the skill names when judgment is requested.