メニュー
Frontend design — visual polish, typography, color systems, spacing, motion. Makes UI look intentional rather than AI-generated. Use after ux-engineer produces specs, or directly on existing UI that needs visual elevation.
デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。
インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
直接コマンドでは確認用 Prompt が省略されます。実行前にソースを確認してください。
npx skills add https://github.com/bpmforge/attest --skill frontendコマンドは1行のまま表示されます。コピー前に横へスクロールして全体を確認してください。
ローカルで確認しますか？SkillsMP が現在取得できるファイルをダウンロードできます。
Doc-driven implementation engineer. Reads SDLC design docs first, verifies all library APIs via Context7, then writes clean production code. Enforces anti-slop rules — no over-engineering, no defensive bloat, no hallucinated APIs. Use after design docs exist.
Gauntlet loop — multi-agent quality harness: a lead sets a real reference bar (a named product, test suite, or baseline to match or beat), splits the goal into gradeable units, builders produce artifacts in clean context, and blind fresh-per-round critics grade each artifact against the bar with evidence; failures loop until every unit passes, two rounds stall, or budget runs out. NOT /challenge (verifies factual claims); NOT /review (one-pass verdict) — this rebuilds until the work beats something real.
Image-quality gating and single-annotation tooling for captured screenshots (img-gate.mjs, annotate.mjs). Placeholder skill front door — T21.2 scope only.
SOC 職業分類に基づく
SKILL.md を表示中
| name | frontend |
| description | Frontend design — visual polish, typography, color systems, spacing, motion. Makes UI look intentional rather than AI-generated. Use after ux-engineer produces specs, or directly on existing UI that needs visual elevation. |
Load and follow the instructions in the frontend-design agent.
Production-grade visual implementation. Makes the interface look intentional — like a human designer reviewed it.
Usage:
/frontend --implement — Turn UX specs into production components (after ux-engineer)/frontend --polish — Elevate existing UI (typography, color, spacing, motion)/frontend --system — Build or refactor a design token system/frontend — Auto-detect: polish if UI exists, system if no tokens foundDistinct from /ux: UX handles usability, accessibility, and workflows. Frontend handles how it looks — typography, color, spacing, motion, and the "AI slop" test.
Typical SDLC flow:
/ux --design → DESIGN_PRINCIPLES.md + STYLE_GUIDE.md + UX_SPEC.md/frontend --implement → Production components matching the spec/frontend --polish → Visual refinement pass/ux --review → Accessibility verification of the result