frontend-design について
独自のビジュアルスタイルを持つ本番品質のフロントエンドを設計・構築するスキルです。実装を伴うタスクを対象とし、具体的な設計判断と作業内容を示します。
主な機能
- 01本番品質のフロントエンド設計
- 02独自のビジュアル方針
- 03具体的な実装アクション
活用シーン
- 01フロントエンド体験の設計
- 02本番向けインターフェースの構築
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/インストール後、Claude Code で/frontend-designを入力して読み込まれたか確認します。
同梱ファイルLICENSE.txt
詳細
frontend-design
目的
大胆で個性的な美しさを備えた、本番環境向けのフロントエンドを設計、構築します。
ルーティング
- 使用する場合：ユーザーが、大胆で個性的な美しさを備えた本番環境向けのフロントエンドの設計と構築を依頼した場合に使用します。
- 使用しない場合：依頼が計画書、ハイレベルな戦略、または実行を伴わない議論を求めている場合は使用せず、代わりに適切な計画または設計のワークフローを使用します。
- 出力：frontend-design の成果として、タスク固有の結果と具体的なアクションに関する注記を返します。
- 成功基準：ツール側の動作を捏造せず、依頼されたタスクに沿った具体的なアクションと判断を返します。
トリガーの例
肯定的な例
- この依頼には frontend-design スキルを使用してください。
- frontend-design を手伝ってください。
- ユーザーが、大胆で個性的な美しさを備えた本番環境向けのフロントエンドの設計と構築を依頼した場合に使用します。
- frontend-design：実行可能な結果を提示してください。
否定的な例
- 依頼が計画書、ハイレベルな戦略、または実行を伴わない議論を求めている場合は使用せず、代わりに適切な計画または設計のワークフローを使用します。
- frontend-design を無関係な依頼に使用しないでください。
- この依頼は frontend-design の対象範囲外です。
- これは概念的な議論のみを求めているため、ツールのワークフローは必要ありません。
実行時プロンプト
- 現在の実行時プロンプトの長さ：4071 文字。
- 実行時プロンプトは
../frontend-design.jsonに直接定義されています。
コメント
Markdown 対応