ux-onboarding

ux-onboarding is a skill for Claude Code from TimboGP/timbogp-marketplace. It costs 145 tokens per session (985 once invoked), scanned A, original, MIT.

A guide to the user-experience and visual-design rules already used in a software project.

In plain words
What is it for?
It explains design tokens, reusable components, accessibility rules, interaction states, and the project's writing style.
Why use it?
It helps developers understand an unfamiliar interface without having to discover its patterns alone from scattered code.

Skill for Claude Code

Written for Claude Code: shipped in a Claude Code plugin. Also seen: mentions Claude Code; mentions Codex.

Part of the ux-design plugin — 9 skills, 5 commands, 1 agent shipped together

Good fit It explains design tokens, reusable components, accessibility rules, interaction states, and the project's writing style.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/timbogp/timbogp-marketplace/ux-onboarding
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent
npx skills add TimboGP/timbogp-marketplace --skill ux-onboarding
Clone the repo
git clone --depth 1 https://github.com/TimboGP/timbogp-marketplace

Made for: Claude Code.

Or install ux-design, the plugin that ships this one along with the rest of its 9 skills, 5 commands, 1 agent.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for ux-onboarding

README.md
[![agentmods](https://agentmods.dev/badge/skills/timbogp/timbogp-marketplace/ux-onboarding/github.svg)](https://agentmods.dev/skills/timbogp/timbogp-marketplace/ux-onboarding)
Your own site
<a href="https://agentmods.dev/skills/timbogp/timbogp-marketplace/ux-onboarding"><img src="https://agentmods.dev/badge/skills/timbogp/timbogp-marketplace/ux-onboarding/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for ux-onboarding

Your own site · 80×15
<a href="https://agentmods.dev/skills/timbogp/timbogp-marketplace/ux-onboarding"><img src="https://agentmods.dev/badge/skills/timbogp/timbogp-marketplace/ux-onboarding.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 145 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 985 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00145 $0.00985
Opus 5 $0.00072 $0.00492
Sonnet 5 $0.00029 $0.00197
Haiku 4.5 $0.00015 $0.00098

Measured 12d ago against content hash 076a4145acbd, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-12, from the pricing page.

Security

Grade A, and why

ux-onboarding scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 12d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

plugin/ux-design/skills/ux-onboarding/SKILL.md · 33 lines

How it starts

The opening of the file, as written. The whole thing — 33 lines — stays where its author put it; the contents beside it link to each section on GitHub.

UX Onboarding

Build a working mental model of how this project does UX — its design tokens, component patterns, accessibility conventions, interaction-feedback states, and copy voice — by being walked through the real code, not by reading a summary. This is familiarization, not scaffolding (the ux-foundations skill / /ux-bootstrap) or scoring (the ux-audit skill / /ux-audit). Lean on the ux-foundations, design-tokens, accessible-components, interaction-feedback, and ux-audit skills for what "good" looks like in each area.

When to use

The user wants to understand an existing UX/design layer they did not build — joining a new repo, picking up an unfamiliar frontend, or learning a team's conventions. Phrases like "walk me through this app's UX", "onboard me onto the design system", or "explain how this project handles components/tokens/a11y". If they instead want to create a baseline, use ux-foundations; to score one, use ux-audit.

Optional focus: a path or an area (e.g. "tokens", "the dialog component"). If none is given, cover the design layer end to end.

Procedure

  1. Detect the stack and survey the design layer. Read ../ux-foundations/references/stack-detection.md and run it; report framework, styling approach, and language in one line. Then build a short map: where tokens/theme live, the component library and its primitives, styling conventions, the accessibility patterns in use, the interaction-feedback patterns (loading / empty / error / success, toasts), and copy/voice conventions. Skim recent history (git log, recently merged PRs) for changes to use in step 4.
  2. Confirm the path. List the parts you'll walk through — dependencies first, usually tokens → primitives → composed components → app screens — and confirm scope. Honor any focus the user gave.
  3. Walk it part by part — one part at a time, never a wall of text. For each:
    • Explain how this project handles it and the pattern/convention it follows.
    • Send the user to the code — name concrete files/components to open and read (e.g. "open tokens.css and Button.tsx"), rather than pasting them.
    • Ask questions to answer — a few comprehension/prediction questions ("which token drives the focus-ring color?", "what makes this dialog's focus trap correct?"), then check the answers, correct misconceptions, and push deeper before moving on.
  4. Reimplement a recent change. From recent history, pick a few smaller UX/design changes — a new component variant, a token change, an added interaction state, a copy fix — each small enough to redo in one sitting and ideally in a part already walked. Present them as an interactive choice; the user picks one (or asks for different candidates). Stub out or revert it in a scratch copy (without showing the original diff), state the change's intent and acceptance criteria, and have the user reimplement it. Then review against what the project actually shipped — convention fit, accessibility, and which approach is better and why.
  5. Wrap up. Summarize the parts covered and the user's comprehension, the reimplementation outcome, and suggest the ux-audit skill (to score what they now understand) or a focused component review as next steps.

Read the full file on GitHub · 33 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 12d ago First seen · 33 lines · 145 tokens per session scan A 076a4145acbd

Subscribe to this mod's changes

ux-onboarding is a skill published in the GitHub repository TimboGP/timbogp-marketplace (3 stars, last pushed 2mo ago), licensed MIT. It adds 145 tokens to every session and 985 once invoked, about $0.0007 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.

Related

Other skills, from other repositories

accessibility

Audits code for WCAG 2.2 AA compliance and provides design guidance for accessible components. Covers semantic HTML, ARIA, keyboard nav, contrast, focus management, and motion.

RealDougEubanks/ClaudeMarketplace · 41 tokens

abd-design

ABD Design agent: produces architecture diagrams, component breakdowns, data flow, and design decisions from the current plan.

RealDougEubanks/ClaudeMarketplace · 26 tokens

ux-design

Guided, section-by-section UX spec authoring for a screen, flow, or HUD. Reads game concept, player journey, and relevant GDDs to provide context-aware design guidance. Produces ux-spec.md (per screen/flow) or hud-design.md using the studio templates.

IdoCohen560/claude-unity-game-studio · 61 tokens

ux-review

Validates a UX spec, HUD design, or interaction pattern library for completeness, accessibility compliance, GDD alignment, and implementation readiness. Produces APPROVED / NEEDS REVISION / MAJOR REVISION NEEDED verdict with specific gaps.

IdoCohen560/claude-unity-game-studio · 51 tokens

art-bible

Guided, section-by-section Art Bible authoring. Creates the visual identity specification that gates all asset production. Run after /brainstorm is approved and before /map-systems or any GDD authoring begins.

IdoCohen560/claude-unity-game-studio · 47 tokens

unity-ui-patterns

Unity UI/UX pattern design-to-code translation. Screen flow architecture, View/ViewModel separation, HUD architecture, feedback & juice systems, dynamic list/grid views, transition & animation contracts. UI Toolkit only. DESIGN INTENT format: INTENT/WRONG/RIGHT/SCAFFOLD/DESIGN HOOK. Based on Unity 6.3 LTS.

IdoCohen560/claude-unity-game-studio · 78 tokens