AI デザインディレクター（ai-design-director）
アイデア元：Anshu Chimala『How to turn your AI into a world-class designer』（Lenny's Newsletter、2026-09-01）。本ファイルは独立した書き換えと拡張であり、原文は含みません。
なぜデフォルトの出力はいつも「AI臭い」のか
大規模言語モデルは、一歩ごとに「最も多くの人を満足させる」次の単語を選びます。そのため、デザイン上の決定（配色、レイアウト、フォント）は平均化されます：紫色のグラデーション、左に文字・右に画像、トップバー、中央に大きなボタン。「ユニークに」「ランダムに」と言うだけでは無意味です。モデルは「ランダムに聞こえる」ものの、毎回同じものを書き出します。変化はモデルの外部から注入されなければならず、センスは人間か独立したレビューアーが判断する必要があります。
全体の流れ
- 発見：まず発散し、他の人が取れない方向性を見つける。
- 定義：方向性を深掘りし、独自のデザインアイデンティティを形成する。
- 納品：磨き上げ、削減し、AIの痕跡を取り除く。
各フェーズでは、確認できるもの（スクリーンショット）を生成し、テキストによる自己評価に頼らない。
一、発見
テクニック 1：ランダムシードシード（String Seed of Thought）
モデル自体は真のランダム性を持たないため、シェルで乱数を生成し、そこから「読み取る」ことでクリエイティブな方向性を見つける。
python3 scripts/seed.py # または：head -c 48 /dev/urandom | base64 | tr -dc 'A-Za-z0-9'
実装者への指示：
- スクリプトを実行して、長いランダムな文字列を取得する。
- その文字列からインスピレーションを得て方向性を決める：配色、レイアウト、フォント、リズム、メタファー。サブパターン、特殊な数字、文字の形など、何でもインスピレーションの源にする。
- 自分の判断力で、その方向性を美しく仕上げる。
- シードはあくまでインスピレーションとして使い、最終成果物に含めてはいけない。
複数の案が必要な場合、各案に新しいシードを使い、並行して生成し、その後選定する。
テクニック 2：大胆で具体的なクリエイティブブリーフ
「ランディングページを作って」を、イメージのある要求に変える。例：
- 「各スクリーンがピクセルゲームの1フレームのように見えるが、同時に機能するランディングページであること。」
- 「小さな等角投影の3Dシティの中に配置され、各機能が1つの街区であること。」
- 「過激な非対称性、耳障りな配色とフォント、不安を誘う余白——すべてのルールを破るが、それでも美しいこと。」
アイデアを探す3ステップ：
- モデルに「広く、深くない」形で、多数のデザイン言語の方向性をリストアップさせる（各方向性は1文で）。
- 気に入ったものをいくつか選び、あなたの正直な反応（何が好きか、嫌いか、どこが安っぽいか）を書き、モデルにあなたの好みで絞り込ませる。
- 満足したら、モデルに簡潔なプロンプトを書かせ、実装エージェントが最初のプロトタイプを作るために使えるようにする。
原則：AIのアイデアをそのままAIにフィードバックしても、誰もが持つものしか得られない。人間の取捨選択こそが独自性の源泉である。「これは無理だろう」というアイデアには試す価値がある。失敗したプロンプトは保存し、新しいモデルが出たら再テストする。
二、定義
テクニック 3：独立したレビューエージェント（正のフィードバックループ）
実装者は客観的ではない。自分のコードと理由が見えているからだ。別に「デザインレビュー」用のセッションを開く：
各ラウンド：
- 現在のデザインのスクリーンショットを撮る（デスクトップ + モバイル幅）。
- 新しいコンテキストでレビューアーを呼び出し、スクリーンショットだけを与える。コード、実装の詳細、過去のバージョン、過去のレビューコメントは与えない。
- レビューアーは最初に、このデザインが目指す美学を説明し、次にトップクラスのデザインスタジオならどうするかを想像し、最も大きなギャップをリストアップする。
- 最後に0〜10点のスコアを付ける：そのスタジオの水準にどれだけ近いか。
レビューのプロンプトには明記する：
- 構造と構図の全体像と、細部の両方を見ること。
- 過度な使用、大げさ、一目でAI生成とわかるパターンには減点すること。
- フィードバックは具体的で簡潔にし、決まり文句は避けること。
- 大胆で意見を持ち、安全で手抜きの答えを選ばないこと。
ルール：
- 停止条件は実装者に向けてのみ書く（例：「レビューアーが9点以上を付けないと完了とみなさない」など）。レビューのプロンプトには書かず、レビューアーの客観性を保つ。各ラウンドで同じレビュープロンプトを使う。
- 最初に1〜2ラウンド実行して収束するか確認し、それからラウンド数を決める。無限にtokenを消費するのを防ぐため。
- レビューアーは可能な限り大きく、センスの良いモデルを使う。実装者は安価で速いモデルを使っても良いが、方向性を実行できないほど小さくしない。レビューアーは意思決定だけなので、使用量はごくわずかである。
- レビュー基準は可能な限り客観的にする。理想的には：「ここに5枚の画像があります。4枚はプロの作品、1枚は私たちの作品です。洗練度とセンスで順位付けしてください。」参考画像をムードボードとして添付し、「ベンチマークとして使用し、コピーしない」ことを明記する。
テクニック 4：画像生成で画面を豊かにする
コーディングエージェントは、画像の代わりにグラデーション、幾何学図形、単純なパターンを使いたがる。これこそがAIの痕跡である。積極的に要求する：
- 画像生成を使って、メインビジュアル、テクスチャ、イラスト、商品画像を作成する。シェーダーや3D効果と組み合わせても良い。
- ブラウザでフレームごとに実際の効果を確認する。
- API keyはローカル開発でのみ使用する。別途、利用制限付きのkeyを作成し、gitで無視されるファイル（例：
.env.agents）に入れる。AGENTS.mdには「開発用であり、製品と一緒にリリースしてはいけない」と明記する。絶対にコードや成果物に書き込まない。
テクニック 5：動画生成で高度なモーションを実現する
- アニメーション要素：単色背景のループ動画を生成し、クロマキーやビデオマット処理用のモデルで背景を除去し、UI上の任意の場所に重ねる。動画に見えないようにする。ガラスの屈折などが必要な場合は、まずページの背景色でレンダリングし（屈折を焼き付ける）、その後マット処理する。
- 状態遷移：開始と終了のキーフレームから補間して遷移動画を生成する。前のセグメントの最終フレームを次のセグメントの開始フレームとすることで、シームレスな接続を保証する。ユーザーがスクロールやジェスチャーをしたときに、フレームごとにドラッグして再生する。
- 動画モデルは頻繁に更新される。統合プラットフォームを使い、1つのkeyでエージェントが適切なモデルを選べるようにしても良い。
三、納品
テクニック 6：削減（減らす）
AIは追加するだけで、削除することはほとんどない。抑制自体が高級感を示す。一つ一つ「これは本当に画面上に必要か？」と問いかける。よく削除すべきもの：
- 背景のグロー、発光するプログレスバー、意味のないグラデーション。
- 無計画なカラーの強調テキストやハイライト。
- 画像で既に表現できている場合の、不要なラベル、コンテナ、余白。
- プラットフォームのネイティブコンポーネントより見た目の悪い自作のボタンや入力フィールド。ネイティブコンポーネントを優先して使う。
- 過剰に説明するテキスト。
コードを削除することはモデルにとって「リスク」である。あなたが明確に後押しする必要がある。
テクニック 7：AIの痕跡を消す（本節は当リポジトリ独自のチェックリスト）
納品前に一つずつ確認し、該当すれば修正する：
- 紫・青紫のグラデーション、ガラスモーフィズムのカードの重なり、あらゆる場所の大きな角丸とドロップシャドウ。
- 左にテキスト・右に画像、トップバー、中央に大きなボタンという汎用的なヒーローセクション。
- 線画アイコンを備えた3列の等幅「機能カード」。
- 絵文字をアイコンとして使用。無意味な装飾用ブロブやグリッド背景。
- 決まりきった見出しのフレーズ（「あなたの可能性を解放...」「のために生まれた...」）や中身のないマーケティング用語。
- すべてのセクションが、小さなラベル、大きな見出し、サブ見出し、ボタンという同じリズム。
- フォントがシステムのサンセリフのみ。フォントサイズの階層が多すぎるか、逆に平坦すぎる。
- 統計数値、レビュー、ロゴウォールなど、でっち上げのコンテンツ（すべて削除するか、実際のデータに置き換える）。
- コントラスト不足、フォーカス枠の欠如、モバイルでのオーバーフロー。アクセシビリティの問題も「プロらしくない」。
エージェント向け実行チェックリスト
- 用途、ターゲット、保持すべきブランドや制約を明確にする（制約がなければ強制しない）。
- 案の段階：各案にランダムシード1つと具体的なクリエイティブブリーフ1つ。2〜4案を並行して作成し、スクリーンショットを人間が選ぶ。
- 選定後、レビューループに入る：スクリーンショット → 新しいコンテキストでレビュー → 修正 → 再度スクリーンショット。最初に1〜2ラウンド実施し、収束を確認する。
- 必要に応じて画像/動画素材を追加し、フレームごとに検収する。
- 削減 + AIの痕跡チェックリスト + アクセシビリティチェック（本文のコントラスト比は4.5:1以上）。
- 納品：最終スクリーンショット、レビュースコアの推移、使用したシードとブリーフ（再現性のため）。
セキュリティ
- 成果物、リポジトリ、ログにAPI keyを書き込まない。
- 生成素材の著作権に注意：存命のアーティストの特定の作品や商標を模倣するよう要求しない。
- 参考画像はベンチマークとしてのみ使用し、他人のデザインをそのままコピーしない。