body{margin:0;background:#f4f6f8;color:#18181b;font-family:-apple-system,BlinkMacSystemFont,”Noto Sans JP”,”Hiragino Sans”,”Yu Gothic”,sans-serif;line-height:1.9}
.report-wrap{max-width:920px;margin:32px auto;background:#fff;padding:42px;border-radius:12px;box-shadow:0 12px 36px rgba(20,30,50,.10)}
h1{font-size:34px;line-height:1.35;margin:0 0 28px;padding:18px 20px;border-left:9px solid #111;background:#f7f7f7}
h2{font-size:26px;line-height:1.45;margin:46px 0 18px;padding:12px 0 10px;border-bottom:4px solid #111}
h3{font-size:21px;margin:28px 0 10px}
p{font-size:17px;margin:0 0 18px}
ul{font-size:16px;margin:8px 0 0 1.2em;padding:0}
li{margin:8px 0}
.small{font-size:13px;color:#64748b}
.lead{background:#fafafa;border:2px solid #e3e3e3;padding:20px 22px;border-radius:10px;margin:28px 0}
.mark{background:linear-gradient(transparent 55%,#fff176 55%);font-weight:800;padding:0 .12em}
.note{background:#fffbea;border:2px solid #facc15;border-radius:12px;padding:18px 20px;margin:24px 0}
.blue{background:#f0f7ff;border-color:#93c5fd}
.gray{background:#f8fafc;border-color:#e5e7eb}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}
.card{background:#fff;border:2px solid #e5e7eb;border-radius:12px;padding:18px}
.card h3{margin:0 0 10px;font-size:20px}
.diagram{background:#f7fbff;border:2px solid #b7d7f5;padding:22px;margin:28px 0;border-radius:12px}
.diagram strong{display:block;font-size:18px;margin-bottom:14px}
.flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:10px;align-items:stretch;margin-top:12px}
.box{background:#fff;border:2px solid #222;border-radius:10px;padding:14px 10px;text-align:center;font-weight:800;min-height:70px;display:flex;align-items:center;justify-content:center}
.arrow{font-size:24px;font-weight:900;display:flex;align-items:center}
.image-card{border:2px solid #e5e7eb;background:#f8fafc;border-radius:12px;overflow:hidden;margin:24px 0}
.image-card img{display:block;width:100%;height:auto;background:#fff}
.lp-preview{max-width:380px;margin:0 auto;background:#fff}
.caption{padding:12px 14px;font-size:13px;color:#475569;line-height:1.6}
.checklist{background:#f8fafc;border:2px solid #e5e7eb;border-radius:12px;padding:18px 20px;margin:24px 0}
.checklist p{margin:0 0 10px}
.prompt{background:#111827;color:#f8fafc;border-radius:12px;padding:18px 20px;margin:24px 0;white-space:pre-wrap;font-family:”SFMono-Regular”,Consolas,monospace;font-size:14px;line-height:1.8}
@media(max-width:760px){.report-wrap{margin:0;border-radius:0;padding:24px}h1{font-size:27px}h2{font-size:23px}.flow,.two-col{grid-template-columns:1fr}.arrow{justify-content:center;transform:rotate(90deg)}.lp-preview{max-width:100%}}
定期配信レポート
LPはClaudeとChatGPT image2で誰でも作れる
ストレッチ講座LP制作の実例
今回のテーマ
LP制作は、これまで「デザイナーに依頼するもの」「セールスコピーが書ける人だけが作れるもの」と思われがちでした。
しかし今は、ClaudeにLPの設計と改善を任せ、ChatGPT image2でビジュアルを作れば、専門デザイナーでなくても実用レベルのLPを作れるようになっています。
1. 今回作ったLPの概要
今回作成したのは、過去会員向けのオンラインストレッチレッスンLPです。訴求の中心は、「手元にあるストレッチポールを再活用し、暑い夏でも自宅で体を整えられる」というものです。
LP内では、開始日、開催スケジュール、料金、レッスン内容、録画視聴、講師紹介、参加者の声、申し込み前の確認事項まで、申込に必要な情報を1枚の縦長LPに整理しています。
2. Claudeは「LP設計者」として使う
LP制作で最初にやるべきことは、いきなり画像を作ることではありません。まず必要なのは、誰に、何を、どの順番で伝えるかを決めることです。
今回も、ClaudeにはLP設計者として入ってもらい、条件整理、構成案、訴求の優先順位、矛盾チェック、改善提案を担当させました。つまり、Claudeには「考える部分」を任せるという使い方です。
構成を固める
特に効果が大きかったのは、LP内の細かい条件整理です。たとえば、日曜と金曜は同じメニューであること、録画は過去3年分も含めて期間中に見放題であること、レッスン前日に案内メールが届くこと、終了後の案内メールがあることなどです。
こうした細かい条件は、人間が頭の中だけで整理すると漏れやすい部分です。Claudeにチェックさせることで、LPに入れるべき情報をかなり洗い出しやすくなります。
3. ChatGPT image2は「見た目のたたき台」に使う
Claudeで構成を固めたら、次にChatGPT image2でLPのビジュアルを作ります。ここで大事なのは、image2を「最終納品データ」として見るのではなく、LPの見た目を一気に具体化するためのたたき台として使うことです。
画像生成を使うと、色味、余白、見出しの大きさ、ボタンの置き方、スマホでの見え方などを短時間で確認できます。ゼロからデザインを組むよりも、完成イメージの共有がかなり速くなります。
注意点
画像生成LPは、細かい文字が崩れたり、料金・日程・返金条件などの重要情報に誤字が入ることがあります。だから最終的には、画像内テキストをそのまま使うのではなく、HTML側で正確な原稿として流し込むのが安全です。
4. 人間の役割は「条件を直すこと」
AIだけでLPを作るとき、最初から完璧なものは出ません。今回も、いくつか修正が入りました。
ヘッダー画像のパッド画面が逆だった
日曜と金曜は同じメニューにする必要があった
録画は過去3年分も含めて、期間中は全部閲覧可能だった
ストレッチポールは新規購入ではなく、過去会員が持っている前提だった
「まずは相談してみる」のCTAは不要だった
1/2返金の表現は削除し、基本は別日に振替、振替も中止なら返金に直した
ここが重要です。AIに丸投げするのではなく、人間が事業上の条件を確認し、違うところを指摘する。するとClaudeが設計を修正し、ChatGPT image2で見た目を作り直せます。
つまり、LP制作は「人間が全部作る」から、人間が条件を判断し、AIが構成と見た目を高速で作る仕事に変わります。
5. LP制作は一発勝負ではなく、改善ループで作る
今回のLPも、一度で完成したわけではありません。最初に上部LPを確認し、違和感を出し、条件を修正し、さらにサイズや表現を整えています。
特に、1枚目と2枚目・3枚目の幅が違う問題は、LP全体を縦につないだときに違和感が出るポイントでした。そこで3枚とも同じ幅に揃え、最終的に縦長LPとして見ても縮尺ズレが出ないようにしました。
作り直す
6. 誰でも作れる理由
LP制作で難しいのは、実は「デザインソフトの操作」だけではありません。どの順番で情報を出すか、何を不安解消として入れるか、どの条件を明記するか、どこで申し込みボタンを出すか。ここが難しいのです。
しかしClaudeを使えば、構成や言語化をかなり任せられます。さらにChatGPT image2を使えば、完成イメージのビジュアルも作れます。だから、デザイン経験が少ない人でも、LPの骨組みと見た目を短時間で形にできるのです。
Claudeに任せること
- LP構成の設計
- 訴求の優先順位づけ
- 不足情報の洗い出し
- 矛盾や怪しい表現のチェック
- 改善案の提案
ChatGPT image2に任せること
- LPデザイン案の作成
- スマホ縦長レイアウトの視覚化
- 色味・余白・ボタンの雰囲気確認
- 講座イメージ画像の作成
- 複数案の比較
7. 事業者が見るべきポイント
コンテンツビジネスや実店舗経営をしている人にとって、LPは売上に直結するページです。ただ、毎回外注すると時間も費用もかかります。
AIを使えば、キャンペーン、短期講座、体験会、再募集、既存顧客向け案内などのLPを、かなり速く作れるようになります。特に今回のような既存会員向けLPは、ゼロからブランド説明をするよりも、必要条件と申し込み導線をわかりやすくまとめることが重要です。
AI LP制作で見るべきポイントは、きれいさだけではありません。誰向けか、何を申し込むのか、不安が消えているか、条件が正確か、申し込みボタンが迷わず押せるかです。
8. そのまま使える指示テンプレート
同じようにLPを作る場合は、ClaudeやCodexに以下のように指示すると進めやすいです。
以下の条件をもとに、スマホ閲覧前提の縦長LPを設計してください。
目的：
既存顧客向けに、短期講座・キャンペーン・再募集の申し込みを増やすこと。
入れてほしい情報：
・誰向けの企画か
・何が得られるか
・開催日程
・料金
・必要な持ち物
・録画視聴や欠席時の扱い
・返金や中止時の条件
・講師紹介
・参加者の声
・申し込み前の確認事項
・申し込みボタン
条件に矛盾があれば指摘してください。
その後、ChatGPT image2で再現しやすいように、各セクションのデザイン指示も作ってください。
まとめ：LPは「才能」ではなく「設計と改善」で作れる
今回の実例でわかるのは、LP制作は特別な才能だけで作るものではなくなっているということです。
Claudeに設計させ、ChatGPT image2で見た目を作り、人間が条件や違和感を修正する。この流れを回せば、誰でもLPのたたき台を作れるようになります。
もちろん、最終的な日程、料金、返金条件、法務的な表現は人間が確認する必要があります。しかし、ゼロから考えて作る負担はかなり小さくなります。これからのLP制作は、作れる人に頼む時代から、AIを使って自分で検証する時代に変わっていきます。