既存デザインシステムの「再現」を頼むときは、勝手に最適化するスキルを外す（Figma見た目だけよりコード正本）
既存画面の踏襲を頼んでいるのにUI UX Pro Max系スキルが入っていると、AIが「より良い独自UI」に直そうとして再現度が落ちる。再現が目的ならそのスキルを外し、できればコード／Storybook側を渡す。
どんな問題を解決するか / いつ使うか
デザイナーがClaude Code等で既存DSに沿ったワイヤー〜プロトを作るとき、見た目は似ているのにDS再現が体感50〜60%に止まるとき。デザインスキルを入れる前に、SKILL.mdを読み・実行内容を確かめ・自分の好みに差し替えるやデザイン用スキルは入れただけでは使われない。担当エージェントに名前で指定し、使ったスキルを1行で報告させるとセットで使う。
具体手順
- 目的を一文で分ける
- ゼロから良いUIを探す／レビューで改善する → 探索・最適化スキルが有効
- 既存DS・既存カンプの再現 → 最適化スキルは邪魔になりやすい
- 再現タスクでは、業種向けにDSを推薦・上書きするスキル（例：UI UX Pro Max）を外すか無効化する
事例では削除後に既存デザインへ寄った出力になった。 - 渡す情報は「見た目」だけにしない
FigmaのDS＋カンプだけだと、トークン名やコンポーネントの組み方が伝わりにくい。可能なら：- 本番／Storybookのコンポーネントコードを正として渡す
- 遷移は静止画カンプに無いので、仕様書や画面遷移の表を足す
- 再現の指示に禁止を書く
例：「既存コンポーネントとトークン以外で新デザインを提案しない。最適化は頼むまでしない。」
よかった点（事例）：発散フェーズから動く画面を共有でき、PM・デザイン・エンジニアの前提が早く揃う。速さより「同じ画面を見ながら話す」が収穫。
注意点
- 再現度をテスト用に90%まで上げる手作業は重い。中長期ではコードベースのDS（Storybook等）へ寄せる方がAIと相性が良い、という現場の結論。
- レビュー時の改善提案は欲しいので、スキル自体を捨てるのではなくタスク種別でオン／オフする。
出典
- @kgsi · 2026-11-06 （紹介）
- 渡瀬（DESIGN101 | SynergyMarketing）「デザイナーがClaude Codeでワイヤー・デザイン・プロトタイプを作った話」