リポジトリ説明（原文）
Guidance for distinctive, intentional UI design, typography, visual direction, and non-template-like product interfaces.
170K StarsSource terms (see LICENSE.txt)design-creative
$ npx skills add anthropics/skills --skill frontend-designワークフローガイド
フロントエンドとプロダクト UI ワークフロー
「フロントエンドとプロダクト UI」向けの、レビュー可能な Agent ワークフローです。
「フロントエンドとプロダクト UI」向けの、レビュー可能な Agent ワークフローです。
期待する結果
- 「フロントエンドとプロダクト UI」の目的を明確化
- 適切な能力を選択
- 次の段階の前に結果を検証
ワークフローマップ
この順序で進める
01
タスクを整理
要求を明確でレビュー可能な Agent タスクにします。
02
能力を選択
広いカテゴリではなく現在の段階に合う能力を選びます。
03
実行と確認
ソース、権限、範囲を確認してから最小限の有効な作業を実行します。
04
結論を検証
次の段階に進む前に根拠と結果を確認します。
推奨能力
各ステップの Skill を選ぶ
このワークフローへの適合性、品質、GitHub の採用、保守の新しさで順位付けしています。単一のインストール命令ではなく判断ガイドです。
比較
リポジトリ説明（原文）
Review UI code for web interface guidelines, UX quality, accessibility, and interaction design best practices.
30K StarsSource terms (see source)design-creative
$ npx skills add vercel-labs/agent-skills --skill web-design-guidelinesリポジトリ説明（原文）
Translate Figma designs into production-ready UI code with close visual fidelity and component-level detail.
25K StarsSource terms (see source)design-creative
$ npx skills add openai/skills --skill figma-implement-designリポジトリ説明（原文）
Design and implementation guidance for distinctive landing pages, portfolios, product demos, and purposeful redesigns.
78K StarsMITdesign-creative
$ npx skills add Leonxlnx/taste-skill --skill design-taste-frontendリポジトリ説明（原文）
Apply Anthropic official brand colors, typography, and visual standards to appropriate Anthropic-related artifacts.
170K StarsSource terms (see LICENSE.txt)design-creative
$ npx skills add anthropics/skills --skill brand-guidelinesリポジトリ説明（原文）
React and Next.js performance guidance for writing, reviewing, and refactoring production UI code.
30K StarsMITcoding-agents
$ npx skills add vercel-labs/agent-skills --skill vercel-react-best-practicesリポジトリ説明（原文）
Use Playwright to interact with and test local web applications, capture screenshots, debug UI behavior, and inspect browser logs.
170K StarsSource terms (see LICENSE.txt)browser-automation
$ npx skills add anthropics/skills --skill webapp-testingリポジトリ説明（原文）
Create original visual art, posters, PNG assets, and PDF documents through a clear design philosophy.
170K StarsSource terms (see LICENSE.txt)design-creative
$ npx skills add anthropics/skills --skill canvas-design適した用途
- - フロントエンドとプロダクト UI のワークフロー
- - 監査可能な Agent の判断
- - 管理されたワークスペースでの試行
適さない場合
- - 機密システムへ無監督でアクセスする必要がある場合
- - 資料や出力品質を確認できない場合
実行可能な Pack が必要ですか？
Skill Pack にはインストール順、監査リンク、機械可読な Agent 計画が含まれます。