※本記事にはアフィリエイトリンク(PR)が含まれます。
個人事業主として、スマホ向けLP(縦長のランディングページ)の制作を請け負っています。以前は「素材写真を探す・用意する」作業が制作時間の大きな割合を占めていましたが、今はベースの画像をAIで生成する方式に切り替えました。
この記事では、実際の案件と同じ流れで「AI画像生成でスマホLPを1本作る手順」を、使っているツール・プロンプトのコツ・つまずいたポイントまで含めて公開します。「AIで画像を作ってみたい」「デザインの仕事に活かしたい」という方の参考になればうれしいです。
完成形のイメージ
スマホLPは、縦長の画面を上から下へ読み進めてもらう1枚もののページです。私は次のようなセクション構成で作ることが多いです。
- ファーストビュー(キャッチコピー+メイン画像)
- 悩みへの共感
- サービス紹介
- 実績・お客様の声
- 申し込みボタン(CTA)
セクションごとに縦長の画像を用意して、上から積み上げていくイメージです。この「セクション画像」をAIで生成します。
使っているツールは3つ
役割分担がはっきり決まっています。
| ツール | 役割 |
|---|---|
| ChatGPT(画像生成) | セクションのベース画像を生成する |
| Photoshop | 色味の統一・不自然な部分の修正・画像の拡張 |
| Canva | 文字乗せ・ボタン配置・全体レイアウト |
ポイントは「AIに全部やらせない」ことです。AIが作るのはベース画像まで。文字とレイアウトは人間が仕上げます。この分担にしてから、仕上がりが安定するようになりました。
制作手順5ステップ
ステップ1:構成をテキストで固める
いきなり画像を作り始めず、まずセクション構成と「各セクションで伝えたいこと」を箇条書きにします。ここが決まっていないと、画像を何枚生成してもまとまりません。逆にここさえ固まれば、あとは流れ作業に近くなります。
ステップ2:ChatGPTでベース画像を生成する
セクションごとに縦長(9:16)の画像を生成します。プロンプトのコツは3つあります。
- 縦長の比率を毎回指定する(「9:16の縦長で」)
- 「文字は入れない」と明記する。AIが生成する文字は崩れやすいので、画像内の文字はあきらめて後の工程で載せます
- トーン指定を毎回同じ文言で入れる(「明るい自然光、淡いブルートーン、余白多め」など)。これでLP全体に統一感が出ます
ステップ3:Photoshopで補正する
生成した画像をそのまま使えることは少なく、だいたい手を入れます。よくやるのは次の3つです。
- 色味の統一(LP全体で彩度・明るさを揃える)
- 不自然な箇所の修正
- 縦の長さが足りないときに生成塗りつぶしで自然に延長する
ステップ4:Canvaで文字とパーツを載せる
キャッチコピー・説明文・ボタンなどをCanvaで載せます。フォントは2種類まで、文字は画像の面積の3分の1以内に抑えると、スマホでも読みやすくなります。
ステップ5:書き出してサーバーに公開する
完成した画像を書き出し、レンタルサーバー(私はエックスサーバーを使っています)にアップして公開します。
つまずいたポイントと対策
実際にやってみてつまずいたところと、今の対策です。
- AI画像の文字が崩れる → 画像内に文字を入れるのはあきらめて、「文字なし」で生成して後乗せに徹する
- セクションごとにトーンがバラバラになる → プロンプトの「トーン指定文」を固定して毎回使い回す
- 人物の顔が不自然になる → 顔のアップは避けて、後ろ姿・手元・引きの構図にする
作業時間の面でも変化がありました。以前は素材写真を探すだけで5時間ほどかかっていたのが、今はAIで生成してしまうので10分ほどで済むようになりました。
ツール選びについて
「3つ全部そろえないとダメですか?」と聞かれることがありますが、そんなことはありません。
- ChatGPTは無料プランでも画像生成を試せます(回数制限あり)
- Canvaも無料プランで文字乗せまで十分できます
- Photoshopは有料ですが、仕事として納品するなら補正力の差が出る部分です。私自身は使用歴4年半で、Adobeの月額コンプリートプランで契約しています
まずは無料の範囲で1枚作ってみて、「これを仕事にしたい」と思ったタイミングでPhotoshopを足す、という順番がおすすめです。
まとめ
AI画像生成でスマホLPを作る手順をまとめます。
- 構成をテキストで固める
- ChatGPTでベース画像を生成する(縦長・文字なし・トーン統一)
- Photoshopで補正する
- Canvaで文字とパーツを載せる
- 書き出して公開する
AIが素材を作ってくれるようになったことで、「デザインを学び始めた人が実際に形にする」までのハードルは確実に下がりました。まずはLPの1セクションぶん、縦長画像1枚から試してみてください。

コメント