このBrainで手に入るもの

AIに作らせたLP（HTMLファイル）を渡すと、既定のデザインが出ている場所と、まず直す1か所と、次にAIへ作らせるときの指示に貼る文を出す判定ツール（APIキー・追加料金なし）
Claude Code に読ませると、手順どおりに判定まで進む手順ファイル（SKILL.md）
Claude Opus 5.5 に40本のLPを作らせて数えた結果と、そのとき使った指示文の全文

必要なもの：Python 3.8以上が入ったパソコンと、判定したいページのHTMLファイル。スクショを撮る機能だけ、Chrome か Edge が要ります。Pythonのほかに入れるものはありません。

Anthropic の公式ガイド「Prompting Claude Opus 5.5」の Frontend design defaults の節に、こういう話が書いてあります（https://platform.claude.com/docs/en/build-with-claude/prompt-engineering/prompting-claude-opus-5-5#frontend-design-defaults）。

デザインの指示をしないでフロントエンドを作らせると、Opus 5.5 は少数の決まったスタイルに寄る。「AIっぽい見た目を避けて」のような大ざっぱな指示は、たいてい別の既定に置き換わるだけ（原文 "mostly swaps one default for another"）。効くのは、避けたいパターンを名指しすること。そして、1回目の結果が何に寄ったかを見て、避けるリストを足していくこと。

名指しの例として挙がっているのは、次の5つです。

クリーム色やオフホワイトの背景
見出しの一部の語だけを斜体（イタリック）にする
01 / 02 / 03 の番号ラベル（「01 ── こんな方へ」のように、セクションの頭に付けるゼロ埋めの番号）
等幅フォントのラベル（タイプライターのように、1文字ずつ幅がそろった書体で書いた小さな見出し）
ピル型のボタン（両端が半円の、薬のカプセルのような丸いボタン）

これを読んで、私は自分の環境で確かめたくなりました。日本語のLPでも同じことが起きるのか。起きるなら、何本中何本なのか。

9月の終わりには、Xで、Opus 5.5 で作ったモーショングラフィックス動画が流行って、もう見飽きたという流れができている、という趣旨の投稿が15万回以上表示されていました（9月27日の投稿。数字は10月2日の調べで確認した時点のもの。https://x.com/k_matsumaru/status/2104214844018995355）。同じ道具で同じように作れば、同じ顔のものが並びます。LPでも同じことが起きているはずだと思いました。

40本作らせて、数えました

架空の5業種（整骨院・パン屋・税理士事務所・オンライン英会話・工務店）のLPを、指示を変えて2回ずつ作らせました。モデルは Opus 5.5、考える深さ（effort）は Claude Code の既定の medium です。

① 指示なし
② 最後に「AIが作ったっぽい、ありがちなデザインは避けてください」を1行足す
③ 最後に、避ける5つの型を名指しで1行足す

各条件10本。できたLPを、今回作った判定ツールにかけた結果です。

▼ 型｜① 指示なし｜② 「避けて」｜③ 名指し

クリーム色の背景：10/10　／　10/10　／　0/10
見出しの一部だけ斜体：0/10　／　0/10　／　0/10
ピル型ボタン：4/10　／　0/10　／　0/10
01/02/03の番号ラベル：8/10　／　7/10　／　0/10
等幅フォントのラベル：0/10　／　1/10　／　0/10
1本あたりの不良の数：2.2　／　1.8　／　0.0

💥 クリーム色の背景は、「避けて」では1本も消えず、名指ししたら10本とも消えた。

「避けて」がまったく効かなかったわけではありません。ピル型ボタンは4本から0本に減っています。ただ、クリーム色の背景は10本とも残り、色はむしろ前より濃いベージュになりました（明るさの平均が0.951から0.920へ）。さらに10本中9本に、縦書きの部分（見出しや店名など）が入っていました。明朝体の見出し（10本）と生成り色（10本）と縦書き（9本）の、和風の雑誌のようなページに寄っています。

公式の説明とおおむね合っていました。違ったのは、クリーム色が別の色に置き換わらず、濃くなって残ったところです。

条件について1つ書いておきます。この40本は、私がふだん使っている Claude Code の設定（自分用の指示ファイル CLAUDE.md と、入れているスキル）が読み込まれた状態で作らせています。何も入れていない素の環境ではありません。実際に1本は、私が入れているLP制作用のスキルに触れていました。素の環境だと数字が変わる可能性があります。

公式の「足していく」を、1周回してみました

③の10本は、名指しした5つの型が全部消えました。

ところが一覧にして眺めると、10本中9本のファーストビューが、濃紺や深緑の濃い色で塗られていました。

💡 【ひとことメモ】ファーストビューは、ページを開いて最初に見える画面のことです。その一番上の大きな区画を「ヒーロー」と呼びます。この記事では、ヒーローの背景の色で数えています。

公式が勧めるとおり、これも名指しに足してもう10本作りました（④）。

▼ ③ 名指し｜④ 名指し2周目

5つの型（合計）：0　／　0
ヒーローが濃い色：9/10　／　0/10
グラデーションを敷いた区画がある：4/10　／　7/10

濃い色は消えました。数えると、グラデーションを敷いた区画が増えています。一覧を目で見ると、白か薄い青みグレーにぼかした丸いグラデーションを重ねた見た目が多くなっていました。

名指しは効きます。ただ、消した分だけ次の既定が出てきます。

しかも④の10本にも、名指しに入れていない特徴が2つ、10本中9〜10本に残っていました。それが何だったか、どれを名指しに足してどこで止めるかは、本編の第5章に書いています。

名指しリストを1回貼るだけでは、ここまでしか届きません。必要なのは、作るたびに自分のページを数えて、出てきた型を足していく道具です。そのために作ったのが、この検品ゲートです。

このゲートがやること

同梱している実物のLP（①で作らせた整骨院）にかけると、こう出ます。

■ sample/実物LP_指示なし_整骨院.html
  判定：FAIL （判定した型 5/5）
  不良クリーム／オフホワイトの背景 1件
        308行 body ページの背景 #f7f4ee
  なし見出しの一部だけイタリック
  なしピル型ボタン
  不良 01/02/03の番号ラベル 7件
        398行 body > main#top > section > div.wrap > div.section-head > span.section-num 「01 ── こんな方へ」
        419行 body > main#top > section.alt > div.wrap > div.section-head > span.section-num 「02 ── みなと整骨院の考え方」
        446行 body > main#top > section > div.wrap > div.section-head > span.section-num 「03 ── 初回の流れ」
        487行 body > main#top > section#price > div.wrap > div.section-head > span.section-num 「04 ── 料金」
        ほか3件
  なし等幅フォントのラベル

  ▶ 直すのは1か所：クリーム／オフホワイトの背景
    ページの背景色を白（#ffffff）かブランドの基調色に変える。1か所（body か一番外側の包み要素）で直る

  ▶ 次に作らせるときの指示に足す（名指しリスト）
    - 背景にクリーム色・オフホワイト・生成り色など暖色系の明るい色を使わない（今回は #f7f4ee）。背景は白か指定のブランド色。
    - セクションの見出しに 01 / 02 / 03 のようなゼロ埋め番号ラベルを付けない。

読み方：この整骨院のページでは、背景のクリーム色（#f7f4ee）と、セクションの頭の「01」「02」…の番号が7か所見つかりました。まず直すのは背景だけです。最後の2行は、次にAIへ作らせるときの指示にそのまま貼る文です。Claude Code なら、毎回読ませる設定ファイル（CLAUDE.md）に置いておくと、毎回の指示に書き足す手間が省けます（私が試したのは指示の最後に足すやり方で、CLAUDE.md に置いたときの効き方は測っていません）。

名指しリストを自分で貼るだけの場合と違うのは、次の3つです。

自分のページのどの行に何が出ているかが分かる
不良が何個あっても、まず直す1か所に絞る
名指しで消したあとに出てくる次の既定を、自分のページで数えられる（observe.py。上の縦書きや濃色ヒーローもこれで数えられます）

HTMLがあるページは、ツールがHTMLとCSSを読んで機械的に数えます。AIに「このデザインはAIっぽいですか」とは聞きません。画像しかないときと、JavaScriptで後から付く見た目のように機械で読めない部分があるときだけ、スクショを Claude に見せる手順を使います。

AIに判定させない理由は、本編に実例つきで書いています。判定の値の意味を書き忘れた指示文で試したら、AIが根拠と逆のラベルを返しました。書き直したら、機械の判定と150判定すべてで一致しました（開発用の道具でページを上から6400pxまで撮った画像で比べた結果です。30本中6本はそれより下が切れていました。同梱の shoot.py は上の1800pxだけを撮ります）。それでも、指示文の書き方1つで答えが変わる道具は検品の本体にしない、と決めています。

公式の5つのうち、2つは日本語LPではほとんど出ませんでした

40本のうち「見出しの一部だけ斜体」は0本、「等幅フォントのラベル」は1本でした。日本語の見出しは、そもそも斜体にしにくいからだと思います。

その代わりに①では、10本中5本で「見出しの一部だけ色を変える」が出ていました（「原因から」の4文字だけ朱色にする、など）。斜体の日本語版のような書き方です。

公式のリストをそのまま使っても、日本語のページでは効く型と効かない型があります。自分のページで出やすい型を数える道具（observe.py）を入れたのは、そのためです。

検品ツールそのものも、検品しました

人のページを不良と言う道具が間違っていたら、話になりません。作る過程で次のことをやりました。

判定基準と、お手本の不良ページ（mock）の正解表を、判定スクリプトを書く前に固定した。 ハッシュ値（ファイルの指紋のような値）を記録してあります。結果に合わせて基準を後から動かさないためです。そのあと基準は3回、理由を書いてから改訂しました（最初の版は時刻を書き忘れ、古い版の本文も残していなかったので、照らし合わせられるのは v0.3 から先です）
コードを見せない別のAI担当（Claude の別セッション）に、判定を間違えさせるためのHTMLを52本作らせた（1回目は6つの担当で36本、2回目は別の2つの担当で16本）。担当には判定基準の文書だけを渡し、正解も付けさせています
手元にあった実際のHTMLに通して、途中で止まらないかを確かめた（最初は187本、最終版では増えた分も入れて189本）

最終版では、AI担当が「正解が1つに決まらない」と申告した5本を除く47本で、AI担当の付けた正解と一致しました。ただしこれは、この47本で見つかった食い違いを見て直したあとの数字です。初めて見るページでの精度とは別物です。最終版で189本に通して、途中で止まったものは0本でした。

そこにたどり着くまでに、作る途中で見つけた間違いが28件ありました。27件は直しました。1件は記録の取りこぼしで、取り戻せません。

見た目はほぼ白の #fffdfc を「クリーム色」と判定していた
固定フッターの入れ物に fixed-cta という名前が付いていただけで、入れ物ごとボタン扱いし、中の本物のピル型ボタン2個を見逃していた
最初に書いた判定基準は、AI担当が作った36本のうち14本で「この文言だと正解が1つに決まらない」と言われた
記事を書いたあとで、別のAI担当に記事と商品を3回検品させたら、商品の不具合がさらに14件見つかった（ブランドとして外した型があっても「合格」と出ていた、中身のない404ページが「合格」になっていた、前の直しが新しい不具合を生んでいた、など）。数え方の誤りが1件、記録の誤りが2件見つかった

28件は全部、何を間違えていたかと、どう直したか（直せなかった1件は、なぜ直せないか）を、レビュー特典に出します。

人の目とも比べました。私が30本に付けたラベル（1人だけ。条件と機械の判定は伏せて付けました）と比べると、機械の判定は、「わからない」を除く125判定のうち98判定（78%）で一致しました。合わなかった27件を、AI担当に1件ずつ、私が見た画像・HTML・判定基準と突き合わせさせたところ、判定基準に当てはまるものを機械が見落とした例は0件でした（分類はAI担当によるもので、私は1件ずつ見直してはいません）。ずれていたのは私のラベルのほうです。字間を広げた小さなラベルを「等幅」と見たり、1・2・3 の番号を「01/02/03 の番号ラベル」と見たりしていました。押し間違いらしいものも8件ありました。詳しくは本編の第6章に書いています。

中身

判定スクリプト6本（Pythonのほかに入れるものなし・APIキー不要）
slopscan.py — 判定・直す1か所・名指しリスト（PC幅とスマホ幅の両方で判定）
observe.py — 何本ものページから、出やすい特徴を数える（5つの型＋縦書き・濃色ヒーローなど17項目）
shoot.py — 手元の Chrome でスクショを撮る
selftest.py — お手本の不良ページと正解表を突き合わせて、ツール自体が壊れていないか確かめる
doctor.py — 環境チェック
lib.py — HTMLとCSSを読んで、要素ごとに効いている見た目を計算する本体
判定基準の文書 — 5つの型の定義、直す1か所の決め方、作り直した理由（変更履歴）
スクショ判定の指示文 — HTMLで判定できないときに Claude に見せる文
効かない場所と壊れ方 — 実際に起きたことだけを書いた対処表
お手本の不良ページ（mock）8本と正解表 — 不良5本・混合2本・ひっかけ入りの合格1本
実物のサンプル6点 — Opus 5.5 が作ったLP 2本（指示なし／名指し）と、その判定レポート・集計の実例
ブランドシート — 意図して使っている型を判定から外す設定のひな形
SKILL.md・セットアップガイド・変更履歴

全部で28ファイルです。

動作を確かめた環境：Mac（Python 3.14）と Claude Code 2.1.281。Windows と Linux、Codex など Claude Code 以外のAIエージェントでは試していません（Pythonの標準機能だけで書いてあるので動くはずですが、確かめていません）。

向いている人・向いていない人

向いている人

Claude（Opus 5.5 や Claude Code）でLP・サービス紹介ページを作って、納品したり、自分の商品ページに使ったりしている人
毎回同じ顔のページになるのが気になっているけれど、どこを直せばいいか言葉にできていない人
Claude Code に頼める人（ターミナルにコマンドを1行打てれば、なお早いです）

ChatGPT や Gemini で作ったLPでも、HTMLファイルがあれば判定はかけられます。ただし5つの型と40本の実測は Opus 5.5 のものです。ほかのAIでどの型が出やすいかは測っていないので、observe.py で自分のページを数えてください。

向いていない人

AIで作ったことを隠したい人。これは隠す道具ではありません。既定の見た目のまま出さないための道具です
センスのいいデザインを作ってほしい人。これは測って止める道具で、デザインを良くはしません
HTMLファイルを手元に持てない作り方の人（Canva だけで作っている、など）。静的な判定は使えず、スクショを Claude に見せる手順だけになります
Kindleの表紙や、文章のAI臭を直したい人。表紙は私の別のBrain「kdp-cover-builder」、文章は「style-gate」の範囲です

効かないこと（先に書いておきます）

▼ 効かない｜理由

ページの骨組み：判定していません。名指しで変わるのは色・書体・飾りまでで、骨組みは動いていないように見えました（目で見た印象で、数えてはいません）
画像だけの成果物：HTMLがないと機械で判定できません。スクショ判定の手順を使います
JavaScriptで後から付く見た目：読みません。スクショ判定に回します
デザインの良し悪し：測っていません
名指しした型以外の「AIっぽさ」：止めません。新しい型は observe.py で数えて足します

免責

このゲートは、名指しした見た目の型が出ているかを判定するものです。デザインの品質、成約率、受注、売上の向上を保証するものではありません。

記事の数字は、2026年10月2日に私の環境（Claude Code 2.1.281・定額プラン・Claude Opus 5.5・effort medium、私のふだんの設定入り）で、架空の5業種のLPを各条件10本作らせた結果です。モデルの更新や指示文の違いで、出る型は変わります。

この記事とパッケージは個人の検証で、Anthropic社とは関係ありません。Claude・Opus は同社の商標です。記事に出てくる店名はすべて架空で、実在の店舗とは関係ありません。

特典

購入者全員（本文に収録・LINE登録不要）

パッケージ一式（28ファイル）。

レビュー特典

「検品ゲートの検品記録全件」。作る途中で見つけた28件を、どう見つかったか・何を間違えていたか・どう直したかまで全部出します（再現用のページつき）。AI担当が作った判定ひっかけ52本の正解表と判定結果、40本の実測の生データ（1本ずつの判定結果）、私が30本に付けたラベルと食い違い27件の分類も入れます。

星の数や好意的な評価はお願いしません。使ってみてどこで詰まったかを書いていただけると、次の改訂に入れられます。

価格

1,980円です。

AIの利用料は別です。ゲート自体はAPIキーなしで動きますが、ページの生成や作り直しをAIにやらせる場合はその分がかかります。私が①〜③の30本を作らせたときは、定額プランの範囲で回しました（API料金に換算すると1本あたり約0.65ドルでした）。

サポートについて

個別の質問への対応、ページの判定代行、デザインの修正、Claude Code の設定の代行はしていません。動かないときの切り分けは、同梱の references/troubleshooting.md と、本編の第8章・よくある質問にまとめています。モデルが更新されて出る型が変わっても、このゲートが判定するのは名指しした型だけです。新しい型への対応は、改訂として出します。

そのほかにやっていること

このゲートは見た目の話だけです。ただ、なぜ「機械で検品して、通らなければ止める」型の道具ばかり作っているのかを書いておきます。

AIで一人で回す仕組みを作って、その設計と失敗の記録を公開しているからです。見た目のゲートはその一部分にすぎません。

YouTube「速報マーケットch」 —— 顔なし・一人・AIで平日2本の株式市況動画
Kindle —— AIで書いて出した本。原稿も表紙も自分で組んでいます
Brain —— 事実のゲート（ai-verify-gate）、文章のゲート（style-gate）、そして今回の見た目のゲート。全部「AIに作らせて、機械で検品して、通らなければ止める」型です

やっていることと、うまくいかなかったことは次のページにまとめてあります。有償の制作のご相談もここから受けています（このゲートの使い方の質問は受けていません）。

👉 https://sokuho-market-line.4uudream.workers.dev/t/6f43a488-c63d-4c4c-b311-92ac70a74537

リンク先には株式投資の話も出てきますが、投資助言ではありません。運営の実例と見解です。

本編で読めること

本編は約2万字です。

第0章最初に動かす — 環境チェックから、同梱のLPに判定をかけるまで。Claude Code に任せるときの頼み方も
第1章設計原則 — AIに判定させない理由、基準を先に固定する理由、直すのを1か所にする理由
第2章 5つの型 — それぞれ何を見て判定しているか、40本で何本出たか、どう直すか
第3章 40本の全記録 — 使った指示文の全文と、全部の数字
第4章判定を読む・直す — AIに1か所だけ直させる言い方と、名指しリストの置き場所。④で使った名指しの1行もそのまま載せています
第5章名指しを回す — 名指しを足しても残った特徴と、どこで止めるか
第6章スクショ判定 — HTMLがないときの判定と、指示文を書き間違えたときに起きたこと
第7章検品ツールの検品記録 — 28件の間違いと、判定基準を作り直した経緯
第8〜10章 — 効かない場所／文章・事実のゲートとの重ね方／型を足す改造のしかた
FAQと用語集

読み終えたら、自分のLPに1行かけて、直す1か所と、次の指示に貼る文が出る状態になります。

まず第0章の doctor.py から始めてください。