← 一覧へ
🎨 デザインClaude Code難易度: 初心者
デザイン相談 design-consultation
プロジェクトの顔を一緒にデザインしよう！
これは何？
これは、新しいプロジェクトのデザインシステムを一から作りたい時に使えるスキルです。配色やフォント、レイアウトなどの統一感のあるデザインを提案してくれ、DESIGN.mdというファイルにまとめてくれます。デザインに悩んでいる初心者でも、プロのような一貫性のあるビジュアルを作る手助けをしてくれますよ。
これでできること
- プロジェクトに合ったカラーパレットを提案してもらえる
- 読みやすいタイポグラフィ（フォントの組み合わせ）を教えてもらえる
- 一貫性のあるレイアウトと余白のルールを作成できる
- 動きのある要素（アニメーション）のデザイン提案がもらえる
- 全てのデザインルールをDESIGN.mdにまとめられる
こんな時に便利
新しいWebサイトやアプリのデザインを一から作りたい時
既存のデザインに統一感がなく困っている時
ブランドのビジュアルアイデンティティを確立したい時
チームで共有するデザインガイドラインが必要な時
使い方
「デザインシステムを作ってください」や「DESIGN.mdを作成したい」といったリクエストをするだけでOKです。プロジェクトの目的やターゲットを伝えると、それに合ったデザインを提案してくれます。具体的な色やフォントの好みがある場合は、最初に伝えておくとより希望に沿った結果が得られますよ。
使用例（こう頼んでみよう）
このECサイト用にモダンで信頼感のあるデザインシステムを作ってください子ども向けアプリに合ったカラフルで楽しいDESIGN.mdを作成したいミニマルで洗練されたブランドガイドラインを提案してください必要なもの
- 特になし
導入方法
いちばん簡単（AIに頼む）
次のスキルを入れて: https://github.com/garrytan/gstack/tree/main/design-consultation手動で置く
Claude Code →
~/.claude/skills/design-consultation/Codex →
~/.agents/skills/design-consultation/使いこなしのコツ
- 「明るい感じ」「落ち着いた雰囲気」など、イメージする雰囲気を言葉で伝えると良いです
- 既に決まっているロゴやブランドカラーがある場合は最初に教えましょう
- 提案されたデザインが気に入らない時は、具体的にどう変えて欲しいか伝えると調整してくれます