メインコンテンツへスキップ
レッスン一覧に戻る

atom.ai-marketer.lp-structure-design

LP全体の構成を設計する

LP全体の構成を設計する LP(ランディングページ=商品やサービスを紹介して、申し込みや購入につなげるための1枚の縦長Webページ)を作るとき、いきなりデザインに取りかかると「何をどの順番で伝えればいいんだろう?」...

design-lp-structuredesign-lp-structure「design lp structure」に関するスキルがこのレッスンで身につきます。
想定時間未設定公開状態: draft
学習メモ

成果物成果物このレッスンが終わったとき、あなたの手元に残る具体的な成果物です(例: 公開済みの Web ページ、動作するフォームなど)。

種類: markdown_doc検証: basic_manual_check_v1

証跡証跡成果物が正しく作れたことを確認するためのチェックリストです(例: ブラウザで動作する、フォーム送信で値が保存される)。

screenshot

メディアメディアレッスン内に出てくる図や動画のスロットです。実際の画面やイメージで理解を補助します。

diagramscreen_capture

レッスン本文

LP全体の構成を設計する

LP(ランディングページ=商品やサービスを紹介して、申し込みや購入につなげるための1枚の縦長Webページ)を作るとき、いきなりデザインに取りかかると「何をどの順番で伝えればいいんだろう?」と手が止まりがちです。

これは料理にたとえると「レシピを決めずに材料を買いに行く」ようなもの。まずは**全体の構成(=レシピ)**を先に決めると、そのあとの作業がぐっとスムーズになります。

このレッスンでは、AIに相談しながら15分以内でLPの構成案を1本つくります。完了すると「自分の商品・サービスのLPに何をどの順番で載せるか」が決まった状態になります。

準備する

以下を手元に用意してください。

  • 紹介したい商品・サービスの概要(メモ書き程度でOK)
  • ターゲット(誰に届けたいか。「30代の副業を始めたい会社員」など)
  • AIチャットツール(ChatGPT、Claude、どれでもOK。ブラウザで開いておく)

LPの基本パーツを知る

LPには「型」があります。はじめての方はまず以下の7パーツを覚えましょう。

順番パーツ名役割
1ファーストビュー最初に目に入る部分。キャッチコピーとメイン画像
2悩み・課題の共感「こんなお悩みありませんか?」で読者の心をつかむ
3解決策の提示あなたの商品・サービスがどう解決するかを伝える
4特徴・メリット選ばれる理由を3つ程度にまとめる
5お客様の声・実績信頼感を高める証拠を見せる
6料金・プラン具体的な価格や申し込み条件を明示する
7CTA(行動ボタン)「申し込む」「無料で試す」など最終アクション

LP構成の7パーツ図

この7つが揃っていれば、読者は「何の商品で、なぜ自分に必要で、いくらで、どうすれば手に入るか」を迷わず理解できます。

AIに構成案をつくってもらう

ここからがこのレッスンの本番です。AIチャットに以下のプロンプト(=AIへの指示文)をコピペして送ってください。【 】の中身だけ、あなたの情報に書き換えます。

あなたはLPの構成設計のプロです。
以下の情報をもとに、LP(ランディングページ)の構成案をMarkdown形式で作ってください。

■ 商品・サービス名: 【ここに商品名を入れる】
■ 概要: 【どんな商品・サービスか1-2文で】
■ ターゲット: 【届けたい人の特徴】
■ ゴール: 【LPを読んだ人にどうしてほしいか(例: 無料体験に申し込む)】

以下の7セクションそれぞれについて、見出しと掲載する内容の要点を箇条書きで書いてください:
1. ファーストビュー(キャッチコピー案を2つ)
2. 悩み・課題の共感(ターゲットが抱える悩みを3つ)
3. 解決策の提示
4. 特徴・メリット(3つ)
5. お客様の声・実績(架空でOK、トーンの参考として)
6. 料金・プラン
7. CTA(ボタンの文言案を2つ)

良い例と悪い例

良い例(具体的に書き換えている):

■ 商品・サービス名: おうち薬膳オンライン講座
■ 概要: 忙しい人でも15分で作れる薬膳レシピを月4回配信するサブスク講座
■ ターゲット: 30-40代の健康を気にし始めた共働き女性
■ ゴール: 7日間の無料お試しに申し込む

悪い例(情報が足りない):

■ 商品・サービス名: 講座
■ 概要: オンライン講座です
■ ターゲット: みんな
■ ゴール: 申し込み

悪い例のようにあいまいだと、AIの回答も「どんな商品にも当てはまるふわっとした内容」になってしまいます。できるだけ具体的に書くのがコツです。

AIの回答を確認して調整する

AIから構成案が返ってきたら、以下の3点をチェックしてください。

  1. 7セクション全部あるか? → 抜けていたら「〇〇のセクションが抜けています。追加してください」と伝える
  2. ターゲットに合っているか? → ズレていたら「ターゲットは〇〇なので、もっと〇〇寄りにしてください」と伝える
  3. キャッチコピーがピンとくるか? → しっくりこなければ「もっと〇〇な雰囲気で、キャッチコピーの別案を3つ出してください」と伝える

修正を1-2回やりとりすれば、十分使える構成案になります。完璧を目指す必要はありません。

構成案を保存する

できあがった構成案をコピーして、以下のいずれかの方法で保存しましょう。

  • Googleドキュメントに貼り付ける(チームで共有しやすい)
  • Notionのページに貼り付ける(他の企画と一緒に管理できる)
  • テキストファイルとしてパソコンに保存する(一番シンプル)

ファイル名は LP構成案_商品名_日付.md のようにしておくと、あとで見つけやすくなります。

保存した構成案のスクリーンショット

完了を確認する

以下の3つが揃っていれば、このレッスンは完了です。

  • 7セクション(ファーストビュー〜CTA)が全部含まれた構成案がある
  • キャッチコピー案が少なくとも2つ書かれている
  • 構成案をGoogleドキュメント・Notion・テキストファイルのいずれかに保存した

スクリーンショットを撮っておくと、学習の記録として振り返りに使えます。

つまずいたときは

つまずきポイント対処法
AIの回答が長すぎて読みきれない「各セクション3行以内で簡潔にまとめ直してください」と伝える
キャッチコピーがどれもピンとこない「〇〇という言葉を使って」「もっとカジュアルに」など具体的な方向を指定して再生成を依頼する
自分の商品の概要をうまく言葉にできない「私は〇〇をしています。これを1-2文でまとめてください」とAIに相談する
料金セクションの書き方がわからない料金が未定なら「料金: 近日公開」としておいてOK。構成の枠だけ作っておく

次のステップ

LP構成案ができたら、次は各セクションの本文を書いていくステップに進みます。構成が決まっているので、1セクションずつAIに下書きを頼めば、効率よくLP全体を完成させられます。

成果物成果物このレッスンが終わったとき、あなたの手元に残る具体的な成果物です(例: 公開済みの Web ページ、動作するフォームなど)。

種類: markdown_doc

検証: basic_manual_check_v1

証跡とメディア

証跡証跡成果物が正しく作れたことを確認するためのチェックリストです(例: ブラウザで動作する、フォーム送信で値が保存される)。

screenshot

メディア

diagramscreen_capture
前提 atom

必須

なし

あると楽

なし

学習完了