Stats
Actions
Tags
From atolye
Stage 2 — Generate a distinctive design system + screen mockups from the plan, publish to claude.ai/design, hand off code-ready. Writes NO app code. Invoke with /atolye:design [plan|direction].
How this skill is triggered — by the user, by Claude, or both
Slash command
/atolye:designThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
From the plan, produce a **distinctive, production-grade design system + key screen mockups**, publish it
From the plan, produce a distinctive, production-grade design system + key screen mockups, publish it to a claude.ai/design project, and hand off code-ready. Do NOT write application code.
A charter — purpose fixed, execution dynamic. Use the frontend-design skill as the aesthetic engine (invoke it if present, otherwise apply its principles): no AI-slop, a bold and cohesive direction.
$ARGUMENTS (file/direction) or the repo PLAN.md / prior planning. Extract app name,
screens, components, tone, and any stated stack; if something critical is missing, ask briefly.design/): tokens.css + tokens.json; components/<name>/index.html
(each preview's first line is <!-- @dsCard group="..." -->); screens/<name>.html; README.md
(brief + inventory). Clean, semantic, token-based → can be poured into any stack later./design-sync skill to push the bundle to a claude.ai/design project
(follow its format/flow rules; inform the user before pushing). Print the project link.design/ inventory + "how to iterate / how to pour into
code". Next: "Move to stack → /atolye:stack".design/ and the project incrementally; don't wipe./plugin is recommended.Creates, edits, and optimizes skills for Claude Code, including drafting, evaluating with test prompts, iterating on performance, and improving skill descriptions for better triggering accuracy.
npx claudepluginhub mikeowski/atolye --plugin atolye