← 記事一覧
·4 分·GXAI Studio
Step 4 — デザイン
Designer agent がビジュアルを作る。既存ゲームを見てスタイルをマッチさせる — 新しいスタイルを発明しない。
プロセスデザイン
ビジュアル。
Designer agent は新スタイルを発明しない。既存ゲームを読み、色、フォント、間隔をコピーし、新ゲームに適用する。
これで全ゲームが同じスタジオ製に見える。
スタジオデザイントークン
各ゲームが同じアトミックデザイントークンを共有。逸脱しない。
# スタジオトークン
色： #00ffff (シアン、メイン) #ff4466 (ピンク、強調) #ffcc33 (ゴールド、成功) #34d399 (緑、OK) #0a0a0f (暗背景)
フォント： Space Grotesk Inter
ボタン： シャープコーナー、2px ボーダー 間隔： 8 / 16 / 24 / 48px アニメ： ease-out, 200ms
✓ 同じトークン、全ゲーム ✓ プレイヤーは 1 秒で識別
/トークン
同じトークン、全ゲーム。
4 ゲームが同じ色、フォント、リズムを共有。意図的 — 1 つを遊んだプレイヤーは別のも一発で認識できる。
Designer の最初の指示：「これらのトークンを使え、提案じゃなくて」。
7 つの必須ステート
各画面モックは全 7 つのプレイヤーが見うるステートを含むこと。早期にデザインの穴を捕まえる。
# 画面ごと必須ステート
- idle — デフォルト
- loading — スピナー
- error — 接続切れ
- empty — データなし
- success — 操作確認
- disabled — ボタンロック
- focus — キーボードナビ
✓ 7 つ揃ってコード可 ✗ 欠ければ Designer に戻す
/ステート
7 つ揃わなければ未完。
大半の「あとで考える」バグは empty/error 状態を忘れた結果。コード前に Reviewer が捕まえる。
落とし穴
✗ トークンじゃなく新色を発明
✗ 「明らかだから」7 ステートをスキップ
✗ モックじゃなくアイデアを送る
✗ HTML で済むのに Figma を使う