PROMPT GUIDE
LPデザインのプロンプト例｜AIでランディングページのデザイン案を作る【作例つき】
LP（ランディングページ）のデザインは、いきなり細かく作り込むより、まず「どんな方向性にするか」の案をいくつか見比べるのが近道です。ところが、デザイン案を何パターンも作るのは、デザイナーに頼んでも自分で作っても時間がかかります。
AIを使えば、LPのファーストビュー（最初に見える画面）の案を、業種や雰囲気を変えながら数分でいくつも作れます。この記事では、信頼感・世界観・勢い・スマホ縦長の4タイプに分けて、LPの作例とプロンプトを紹介します。
- 信頼感で選ばれるLPの作り方
- 写真と余白で世界観を見せるLPの作り方
- 勢い・楽しさを伝えるLPの作り方
- スマホ縦長LPの作り方
- ファーストビューの組み立て方と使うときの注意
作例のLPのサービス名・電話番号・価格などは、すべてサンプルです。AIの画像はデザインの「案」として使い、実際のサイトはこの案をもとに制作します。
信頼感で選ばれる
安心して申し込めるデザイン
01美容クリニック
登録なしで使える
A landing page hero for 1a beauty skin clinic named "2サンプル美容クリニック": the headline "3素肌に、自信を。", a soft portrait of 4a woman with clear skin on the right, a pink button "5無料カウンセリング予約", a simple top menu, 6blush pink and white palette, elegant and calm. Realistic desktop website screenshot, clean modern UI, crisp readable Japanese text. No real brand names, logos, or existing characters.
1美容皮膚クリニック「2サンプル美容クリニック」のLPのファーストビュー。見出し「3素肌に、自信を。」、右に4透明感のある肌の女性のやわらかなポートレート、ピンクのボタン「5無料カウンセリング予約」、シンプルな上部メニュー、6ブラッシュピンクと白の配色、上品で落ち着いた雰囲気。リアルなPCサイトのスクリーンショット風、すっきりしたモダンなUI、読みやすい日本語。実在のブランド名・ロゴ・キャラクターは入れない。
02歯科クリニック
登録なしで使える
A landing page hero for 1a dental clinic named "2サンプル歯科": a clean bright photo of 3a smiling dentist with a patient, the headline "4痛くない、こわくない歯医者。", a light blue button "5WEB予約", the phone number "6000-0000-0000", consultation hours in a small table, white and 7light blue palette. Realistic desktop website screenshot, clean modern UI, crisp readable Japanese text. No real brand names, logos, or existing characters.
1歯科クリニック「2サンプル歯科」のLPのファーストビュー。3患者と笑顔の歯科医の清潔で明るい写真、見出し「4痛くない、こわくない歯医者。」、水色のボタン「5WEB予約」、電話番号「6000-0000-0000」、小さな表の診療時間、白と7水色の配色。リアルなPCサイトのスクリーンショット風、すっきりしたモダンなUI、読みやすい日本語。実在のブランド名・ロゴ・キャラクターは入れない。
03学習塾
登録なしで使える
A landing page hero for 1a cram school named "2〇〇ゼミナール": a photo of 3a focused student at a desk with a teacher, the headline "4わかるが、自信に変わる。", a badge "5合格実績 No.1 ※当社調べ" style placeholder, a navy button "6無料体験授業", trustworthy navy and white. Realistic desktop website screenshot, clean modern UI, crisp readable Japanese text. No real brand names, logos, or existing characters.
1学習塾「2〇〇ゼミナール」のLPのファーストビュー。3先生と机に向かって集中する生徒の写真、見出し「4わかるが、自信に変わる。」、バッジ「5合格実績 No.1 ※当社調べ」の仮置き、紺のボタン「6無料体験授業」、信頼感のある紺と白。リアルなPCサイトのスクリーンショット風、すっきりしたモダンなUI、読みやすい日本語。実在のブランド名・ロゴ・キャラクターは入れない。
医療や教育のLPで何より大事なのは、「ここなら安心して任せられる」と感じてもらうことです。そのために、白を基調に1色のアクセント、清潔感のある写真、はっきりしたボタンの3つをそろえます。プロンプトでは「white and light blue palette」「a clean bright photo」「a button that says〜」の3点を書くのが基本です。色を増やすほど落ち着きがなくなるので、アクセントは1色にしぼりましょう。
写真は、人物の笑顔が入ると安心感がぐっと増します。美容なら肌のきれいな女性、歯科なら患者に笑顔で話しかける先生、塾なら先生と一緒に机に向かう生徒。サービスを受けている場面をイメージできる写真を選ぶと、見る人が「自分もこうなれる」と想像しやすくなります。
見出しは、サービスの説明よりも「お客さんがどうなれるか」を短く書くのがコツです。「痛くない、こわくない歯医者。」「わかるが、自信に変わる。」のように、不安を取りのぞく言葉や、なりたい姿を伝える言葉が効果的です。予約や相談のボタンは、ファーストビューの中に必ず1つ入れておきましょう。
作例の歯科クリニックでは、電話番号を「000-0000-0000」にしています。AIは実在しそうな電話番号を勝手に作ることがあるので、番号を入れるときは、必ずサンプルの番号を指定してください。
世界観で魅せる
写真と余白で語る
04温泉旅館
登録なしで使える
A landing page hero for 1a hot spring inn named "2〇〇温泉 旅館": a calm photo of 3an open-air bath surrounded by autumn leaves, vertical Japanese headline "4何もしない、を贈る宿。", a subtle 5indigo button "6空室を確認する", generous white space, Japanese modern style. Realistic desktop website screenshot, clean modern UI, crisp readable Japanese text. No real brand names, logos, or existing characters.
1温泉旅館「2〇〇温泉 旅館」のLPのファーストビュー。3紅葉に囲まれた露天風呂の落ち着いた写真、縦書きの日本語の見出し「4何もしない、を贈る宿。」、控えめな5藍色のボタン「6空室を確認する」、たっぷりの余白、和モダンなスタイル。リアルなPCサイトのスクリーンショット風、すっきりしたモダンなUI、読みやすい日本語。実在のブランド名・ロゴ・キャラクターは入れない。
05新築マンション
登録なしで使える
A landing page hero for 1a new luxury condominium named "2SAMPLE RESIDENCE": a dusk exterior photo of 3a modern tower, a thin elegant serif headline "4都心に、静けさを住まう。", a gold button "5資料請求", a navy header bar, high-end real estate style. Realistic desktop website screenshot, clean modern UI, crisp readable Japanese text. No real brand names, logos, or existing characters.
1高級な新築マンション「2SAMPLE RESIDENCE」のLPのファーストビュー。夕暮れの3モダンなタワーの外観写真、細く上品なセリフ体の見出し「4都心に、静けさを住まう。」、金色のボタン「5資料請求」、紺のヘッダー、高級不動産らしい雰囲気。リアルなPCサイトのスクリーンショット風、すっきりしたモダンなUI、読みやすい日本語。実在のブランド名・ロゴ・キャラクターは入れない。
06結婚式場
登録なしで使える
A landing page hero for 1a wedding venue named "2SAMPLE WEDDING": a soft backlit photo of 3a couple in a garden chapel, a delicate script headline "4ふたりらしい、一日を。", a champagne-gold button "5ブライダルフェア予約", ivory and gold palette. Realistic desktop website screenshot, clean modern UI, crisp readable Japanese text. No real brand names, logos, or existing characters.
1結婚式場「2SAMPLE WEDDING」のLPのファーストビュー。3ガーデンチャペルにいる2人のやわらかな逆光の写真、繊細な筆記体風の見出し「4ふたりらしい、一日を。」、シャンパンゴールドのボタン「5ブライダルフェア予約」、アイボリーと金の配色。リアルなPCサイトのスクリーンショット風、すっきりしたモダンなUI、読みやすい日本語。実在のブランド名・ロゴ・キャラクターは入れない。
高級感や非日常を伝えたいLPは、大きな写真と余白、細い文字で作ります。「vertical Japanese headline（縦書きの見出し）」「thin elegant serif（細く上品な明朝体）」「generous white space（たっぷりの余白）」がキーワードです。情報を詰め込まず、写真の世界に浸ってもらうことを優先します。
温泉旅館なら紅葉に囲まれた露天風呂、マンションなら夕暮れに明かりがともるタワー、結婚式場なら逆光のガーデンチャペル。どれも「その場所で過ごす時間」を想像させる写真です。時間帯や季節を具体的に書くと、写真に物語が生まれます。
このタイプのLPは、ボタンの色も控えめにするのがポイントです。「a subtle indigo button」「a gold button」「a champagne-gold button」のように、写真の雰囲気をこわさない落ち着いた色を選びます。派手なボタンは、せっかくの世界観を安っぽく見せてしまいます。
見出しは、短い詩のような言葉が合います。「何もしない、を贈る宿。」「都心に、静けさを住まう。」のように、説明ではなく体験を想像させる言葉を選びましょう。
勢い・楽しさ
気持ちを上げるデザイン
07フィットネスジム
メンバー限定・準備中
A landing page hero for a personal training gym named "サンプルGYM": a bold black and neon yellow design, a strong photo of a person traini…
このサイトの限定全文は準備中です。現時点ではnoteに加入しても全文を開けません。
08音楽フェス
メンバー限定・準備中
A landing page hero for a summer music festival named "SAMPLE FES 2027": a vivid gradient sky over a crowd and a stage, huge bold titl…
このサイトの限定全文は準備中です。現時点ではnoteに加入しても全文を開けません。
09保育園
メンバー限定・準備中
A landing page hero for a nursery school named "ぷろんぷと保育園": crayon-style illustrations of children playing under a big tree, r…
このサイトの限定全文は準備中です。現時点ではnoteに加入しても全文を開けません。
ジムやイベント、子ども向けのサービスは、見た瞬間に気持ちが上がるデザインが合います。「energetic diagonal shapes（勢いのある斜めの図形）」「playful stickers and shapes」「crayon-style illustrations」のように、形やイラストで勢いや楽しさを出します。
色は2〜3色にしぼると、にぎやかでもまとまります。ジムなら黒とネオンイエロー、フェスなら夕焼けのグラデーション、保育園ならパステルカラー。業種のイメージに合う色を選び、ボタンはいちばん目立つ色にしましょう。
勢いのあるLPでも、見出しは大きく、短くが基本です。「2か月で、変わる。」「のびのび、まいにち。」のように、ひと息で読める長さにします。フェスのように日付が大事なものは、日付を見出しと同じくらい大きく入れると、ひと目で必要な情報が伝わります。
保育園のように子どもが関わるサービスでは、実際の子どもの写真ではなくイラストを使うのも1つの方法です。プライバシーに配慮しながら、あたたかい雰囲気を伝えられます。
スマホ縦長のLP
スクロールで読ませる
10コスメ（スマホ縦長）
メンバー限定・準備中
A long vertical smartphone landing page for a skincare serum named "SAMPLE BEAUTY", shown as a full mobile page: a hero with the bottle on water ripples and the headline "3…
このサイトの限定全文は準備中です。現時点ではnoteに加入しても全文を開けません。
11セミナー申込（スマホ縦長）
メンバー限定・準備中
A long vertical smartphone landing page for an online AI seminar: a hero with the title "生成AI、はじめの90分", the date "10/24(土) 20:00〜", a speaker…
このサイトの限定全文は準備中です。現時点ではnoteに加入しても全文を開けません。
12家計簿アプリ
メンバー限定・準備中
A landing page hero for a household budget app named "さんぷる家計簿": two smartphone mockups showing clean charts, the headline "レシートを撮るだけ、家計簿おわり。",…
このサイトの限定全文は準備中です。現時点ではnoteに加入しても全文を開けません。
今はLPの多くがスマホで見られています。縦長LPは「ファーストビュー → 根拠 → お客様の声 → ボタン」の順が基本です。プロンプトでも、この順番どおりにセクションを書いていくと、スクロールして読みたくなる流れの案ができます。
「a sticky button at the bottom（下に固定されたボタン）」と書くと、スマホらしい固定ボタンが入ります。スクロールのどの位置にいても申し込めるので、スマホのLPでは定番の作りです。比率は9:16にして、「realistic smartphone web page screenshot」と書くと、スマホの画面らしい見た目になります。
アプリの紹介LPは、スマホの画面（mockup）を2つほど並べると、アプリの中身が伝わりやすくなります。ダウンロードボタンは、実在のアプリストアのバッジやOSのマークが入らないよう「generic download buttons with no platform names or icons」と書いておきましょう。
LPのプロンプトの型
作例のLPは、どれも次の6つの要素でできています。上から順に書くと、ファーストビューらしい案になります。
A landing page hero for a dental clinicnamed "サンプル歯科"a clean bright photo of a smiling dentistthe headline "痛くない、こわくない歯医者。"a light blue button "WEB予約"white and light blue palette, realistic desktop website screenshot作例のプロンプトを分解してみる
温泉旅館のLPのプロンプトを、部分ごとに見てみましょう。
| プロンプトの部分 | 役割 |
|---|---|
| A landing page hero for a hot spring inn | 何のLPか。業種を書き換える |
| named "〇〇温泉 旅館" | サービス名。自分の名前に書き換える |
| a calm photo of an open-air bath surrounded by autumn leaves | 主役の写真。季節や場所を変えると印象が変わる |
| vertical Japanese headline "何もしない、を贈る宿。" | 見出し。縦書きで和の雰囲気を出している |
| a subtle indigo button "空室を確認する" | ボタン。写真をこわさない控えめな色 |
| generous white space, Japanese modern style | 余白と全体のスタイル |
LPの案づくりのコツ
細かい文章は入れず、見出しとボタンの言葉だけを指定しましょう。AIは長い文章を崩しやすいです。
色や写真を変えた案を並べると、どの方向性がいいかが一目でわかります。
同じ内容で16:9と9:16を作っておくと、PCとスマホの見え方を比べられます。
「〇〇のサイト風」とは書かず、色・写真・雰囲気で指定しましょう。
AIの画像はそのままサイトにはできません。あくまで方向性を決めるたたき台として使います。
LPづくりの英語早見表
| 入れたいこと | 英語 |
|---|---|
| PC画面の見た目 | realistic desktop website screenshot |
| スマホの見た目 | realistic smartphone web page screenshot |
| 上部メニュー | a simple top menu / navigation bar |
| 申し込みボタン | a button that says "〇〇" |
| 縦書きの見出し | vertical Japanese headline |
| 下の固定ボタン | a sticky button at the bottom |
| サンプルの電話番号 | the phone number "000-0000-0000" |
| アイコンを入れない | no platform names or icons |
LPの案づくりに向いているAI
| AI | 向いていること |
|---|---|
| GPT Image | 見出しやボタンの文字が入ったLPの案全般 |
| Nano Banana | すでにあるサイトのスクリーンショットを渡して、色や写真だけを変えた案を作る |
| Seedream | LPに使うメインの写真（人物・建物・料理など）だけを作る |
LPの案をこんなふうに使う
- デザイナーへの依頼書に添える：「こんな雰囲気で」と言葉で伝えるより、画像の案を見せた方がずっと早く、イメージのずれも少なくなります。
- 社内やクライアントとの打ち合わせ：複数の方向性の案を並べて「どれが近いですか？」と聞けば、話し合いがスムーズに進みます。
- 自分でサイトを作るときの設計図：ノーコードツールやテンプレートでサイトを作るときも、完成イメージがあると迷いません。
- 広告バナーやSNS投稿との統一：LPの色や雰囲気を先に決めておけば、バナーやSNSの画像もそろえやすくなります。
案を決める前のチェックリスト
- 見出しを読んだだけで、何のサービスかがわかるか。
- 申し込み・予約のボタンが、ファーストビューの中にあるか。
- スマホで見たときにも、見出しとボタンがはっきり見えるか。
- 実在のサービスのロゴや、他社のサイトに似すぎていないか。
よくある失敗と直し方
| 困ったこと | 直し方 |
|---|---|
| 文字が小さくて読めない | 見出しとボタンだけを指定し、細かい文章は実際の制作で入れる。 |
| 実在のサービスのマークが入る | no platform names or icons を入れる。 |
| 電話番号がリアル | 000-0000-0000 のようなサンプル番号を指定する。 |
| ごちゃごちゃして見える | generous white space、a simple top menu を入れ、要素を減らす。 |
使うときの注意
- AIの画像はデザインの「案」です。実際のLPは、この案をもとにHTMLやデザインツールで作ります。
- 実在のブランド名や、他社のサイトにそっくりなデザインは避けましょう。
- 「No.1」「当社調べ」などの表記は、実際に根拠がある場合だけ使ってください。
- 人物の写真を実際のサイトで使う場合は、AIで作ったイメージであることがわかるようにするか、実際の写真に差し替えましょう。
よくある質問
Qこの画像をそのままサイトにできますか？
画像なのでそのままでは使えません。デザインの方向性を決める「案」として使い、実際の制作で作り直します。
Q業種を変えたいです
作例の色つき部分（業種・見出し・ボタン・配色）を入れ替えれば、別の業種のLP案になります。
Q下の方のセクションも作れますか？
「features section with three icons」「customer reviews section」のように書けば、ファーストビュー以外のセクションの案も作れます。
Qデザイナーに渡してもいいですか？
はい。「こんな雰囲気にしたい」というイメージを伝える資料として、とても役に立ちます。
Q色だけを変えた案を作りたいです
同じプロンプトで、配色の部分（white and light blue など）だけを入れ替えて何回か作ると、色違いの案を比べられます。
QLPの文章も考えてもらえますか？
見出しやボタンの言葉のアイデアは、文章が得意なAIに「このサービスのLPの見出し案を10個」と頼むと、たくさん出してもらえます。
まとめ
LPの案は、業種に合った色・写真・ボタンをそろえるのが基本です。信頼感なら白と1色、世界観なら大きな写真と余白、勢いなら形と色、スマホなら縦の流れ。まずは作例をコピーして、見出しとボタンの文字を入れ替えてみてください。
LPの作例は20本以上そろっています。
Web・LPのプロンプトを見る →NEXT READ
あわせて読みたい記事
PROMPT GUIDEロゴのプロンプト例｜AIでロゴデザインを作る方法【作例つき】お店や活動、YouTubeチャンネルのロゴ。デザイナーに頼む前に、まずはAIで方向性の案をたくさん出してみませんか。AIを使えば、ミニマルなもの、業種らしいもの、キャラクターが入ったもの、3Dやネオンのような質感のあるものまで、数分で何十案も作れます。この記事では、ロゴの作例を選び、タイプ別にプロンプトとコツを紹介します。文字入りのロゴは、文字に強いGPT Imageで作るのがおすすめです。2026年9月29日
PROMPT GUIDE広告バナーのプロンプト例｜AIでSNS広告・Webバナーを作る【作例つき】広告バナーは、セールやキャンペーン、季節のイベントのたびに、毎月・毎週のように作り直すものです。そのたびにデザインソフトを開いて一から作るのは大変ですよね。AIにバナーの下書きを作ってもらえば、デザインの時間を大きく減らせます。この記事では、セール・業種別・季節イベント・SNS広告の4つの目的別に、バナーの作例とプロンプトを紹介します。文字が入るので、GPT Imageで作るのがおすすめです。2026年9月29日
PROMPT GUIDE映画ポスター風のプロンプト例｜AIでかっこいいポスターを作る【作例つき】自分の作品や動画、イベントの告知を、映画のポスターのように見せられたら楽しいですよね。映画ポスターは、1枚の絵とタイトル、キャッチコピーだけで「どんな物語か」を伝える、とても完成されたデザインです。AIを使えば、SF、ホラー、時代劇、恋愛、アート系まで、ジャンルごとの「らしさ」を持ったポスター風の画像が作れます。この記事では、20本の作例から12本を選び、ジャンル別にプロンプトとコツを紹介します。タイトルやキャッチコピーを入れるので、GPT Imageで作るのがおすすめです。2026年9月29日
PROMPT GUIDEAI美女のプロンプト例｜リアルな人物写真・ポートレートをAIで作る呪文【作例つき】「AI美女」を作りたいのに、肌がつるつるすぎて人形みたい、どれも同じ顔になる、なんだか不自然……という悩みはとてもよくあります。実は、きれいな人物写真を作るコツは「美しい顔を細かく説明すること」ではありません。プロのカメラマンと同じように、光・レンズ・肌の質感をどう書くかで、仕上がりは大きく変わります。この記事では、映画のような一枚から、仕事で使えるプロフィール写真、広告やLPの中の人物まで、自然でリアルな人物写真を作るプロンプトを作例と一緒に紹介します。2026年9月29日PROMPT GUIDEアニメ風のプロンプト例｜AIでアニメ・イラスト画像を作る呪文【作例つき】AIで「アニメっぽい絵」を作るのは簡単になりました。でも、「ちゃんとアニメのワンシーンに見える絵」や「自分のキャラクターとして使える絵」にするには、いくつかコツがあります。塗りの種類、背景の描き込み、時代の空気感。この3つをプロンプトでどう書くかで、同じキャラクターでもまったく違う絵になります。この記事では、キャラクター・背景・デザインまで、アニメ風の作例とプロンプトをまとめて紹介します。2026年9月29日
PROMPT GUIDEYouTubeサムネのプロンプト例｜AIでクリックされるサムネイルを作る方法【作例つき】サムネイルは、動画が見られるかどうかを左右するいちばん大事な1枚です。でも、毎回デザインソフトで作るのは時間がかかりますし、デザインが苦手な人にとっては大きな負担です。AIを使えば、クリックされやすいサムネの「下書き」を数十秒で作れます。この記事では、解説・比較・ランキングのような定番から、料理・旅行などの実写系、ホラーやレトロのような世界観のあるサムネまで、ジャンル別の作例とプロンプトを紹介します。文字入りのサムネは、文字に強いGPT Imageで作るのがおすすめです。2026年9月29日