Skip to content

Claude Designで一番やらかした失敗、正直に書く

実は、ちゃんと失敗している。

Claude Designを使い始めて3ヶ月目のこと。クライアントから依頼を受けたサービス紹介ページのリニューアルで、意気揚々とデザインを生成し、修正も重ねて「これはいい」と判断して提出した。

クライアントからの返信は「フォントが違います」の一行だった。

クライアントには自社ブランドフォントの指定があった。游ゴシックベースのカスタムフォントで、汎用の游ゴシックとは微妙に異なる。Claude Designは汎用フォントで出力していたのに、「まあ似てるからいいか」と自分で判断したのが最初の間違いだった。

さらに問題が重なった。メインカラーの HEX 値が #1A2B3C だったのに、プロンプトに「濃いネイビー」とだけ書いたせいで、生成結果は #0D1B2A になっていた。肉眼だとほぼ同じに見える。しかしクライアントには「コーポレートカラーと違います」と即座に指摘された。

修正対応に2日かかった。Claude Designへの怒りはなかった。完全に自分のミスだと分かっていたから。

Claude Design: Anthropic Labsが開発したAIビジュアルデザインツール。テキストプロンプトからUI・スライド・マーケ資料などを生成する。プロンプト: AIへの指示文。Claude Designでは自然言語でデザインを指示する。

原因はシンプルで「スタイルガイドを渡していなかった」に尽きる。

自分の中に「なんとなく雰囲気が出ればあとで修正できる」という甘い認識があった。でもClaudeはあくまで指示した情報しか参照できない。「濃いネイビー」という表現は、Claudeにとって解釈の余地がある。当然だ。

AIが文脈を察してくれるのはテキストのやり取りに限った話で、ブランドの固有値はそうじゃない。

1. HEX値・フォント名を最初のプロンプトに必ず書く

今はプロンプトの冒頭を必ずこう始める:

【ブランド仕様】
メインカラー: #1A2B3C
サブカラー: #E8F4FD
アクセント: #FF6B35
見出しフォント: 游ゴシック体 Medium
本文フォント: Noto Sans JP Regular

これを貼るのに30秒もかからない。しかしこの30秒が後の手戻りを何時間も防ぐ。

2. 提出前にカラーピッカーで必ず確認する

ブラウザの拡張機能でHEX値を拾い、スタイルガイドと照合するのをルール化した。「似てる」は厳禁。特に暗色系や淡色系は肉眼で判断できない。

3. 初回生成は「方向性確認」と割り切る

Claude Designの最初の出力を「提出できるもの」と期待するのをやめた。今は最低3〜4回の反復を前提にしている。1回目で「雰囲気OK」、2回目で「カラー・フォント整合」、3回目で「細部調整」という流れ。

失敗以来、クライアント案件の場合は必ず事前にブランド仕様をテキストでまとめてからプロンプトに貼る。面倒に思えるが、準備15分で手戻り数時間を回避できる。

「AIが作ってくれる」は半分正解で、半分は「AIに正確に伝える」自分の責任だと気づいた案件だった。失敗した価値はあったと思う。同じミスは二度としていない。

作成日:2026年8月14日

更新日:2026年8月14日