![見出し画像](https://assets.st-note.com/production/uploads/images/107705799/rectangle_large_type_2_d55bc7f04cff1b5c9b05e4373109fd3d.png?width=1200)
ChatGPTを使ってLPを作ってみる
デザイングループで社内向けにデザイナーラジオを行いました。なんかデザイナーが日頃思ってることや最近学んだことを発表するお昼のラジオ番組みたいなことをやってるやつです。
そこでChatGPTの話をしたいなということになって、LPを作ってみましたので、その話をします。
先人たちの苦労
今日話したいこと
・AIを駆使してデザイン業務は楽になるのか
・LPデザインの一般的な制作手順を紹介
・実際にやってみた内容を振り返る
・気になることがあれば聞いてみます(chatGPTに)
・そのほか質問あれば随時受け入れます
AIを駆使してランディングページを作ってみた
こんなんになりました
![](https://assets.st-note.com/img/1684979262665-3MDrp4X9x1.png)
まあ気に入ってるか入ってないかでいうと入ってないけど即席にしては簡単にできて良かったですよ。
作っていく過程
とりあえずランディングページの作り方を聞いてみる
![](https://assets.st-note.com/img/1683690930653-ncBWYgeha1.png?width=1200)
はいはい。確かに確かにって感じです。
今回作るのは「吉祥寺の果物を使ったジュース屋」のLPにしました。
まずはLPを作る目的を聞きました。
![](https://assets.st-note.com/img/1684743649916-lv7jrnJ6jC.png?width=1200)
ブランドイメージを定めるのとプロモーションを行うために作ることにします。
ターゲットを決める
![](https://assets.st-note.com/img/1683691203195-hrrx5Y1peI.png?width=1200)
で、エシカルで健康志向な人のペルソナを聞いてみた
![](https://assets.st-note.com/img/1683691244314-XfXgHi9RY1.png?width=1200)
さらに年齢層と性別について聞いてみた
![](https://assets.st-note.com/img/1683691314917-KrAi2OJLgR.png?width=1200)
これらをペルソナ化してみました。
![](https://assets.st-note.com/img/1683711507610-xTlcXyK0UW.png?width=1200)
![](https://assets.st-note.com/img/1683711794987-yqPMCIcFXr.png?width=1200)
なんか吉祥寺にはいなさそうな人になりましたが、まあいっか。
女性も聞いてみます。
![](https://assets.st-note.com/img/1683711584619-BXsgMU1Xlc.png?width=1200)
![](https://assets.st-note.com/img/1683711814127-Z2sOtQ8PEO.png?width=1200)
こっちのほうがいそうですね。いいですね。
ターゲットが決まった
ページ構成を決める
![](https://assets.st-note.com/img/1683706708083-r4Rg9bmPcL.png?width=1200)
![](https://assets.st-note.com/img/1684743442334-XL4Gfbz07M.png?width=1200)
ビジュアルデザインの方向性を決める
![](https://assets.st-note.com/img/1683707509007-ZsdIK4aPny.png?width=1200)
2かな?
ワイヤーを作ってみる
およそレイアウトができそうなんで作ってみます。
すごい簡単にできた・・・
![](https://assets.st-note.com/img/1684739721767-kKyFq6bUwU.png)
キャッチコピーが必要なので、キャッチコピーを決めます。
ペルソナ無視のキャッチコピー
![](https://assets.st-note.com/img/1684744424255-bMUqSkR4B4.png?width=1200)
ペルソナをインプットしたキャッチコピー
![](https://assets.st-note.com/img/1684744119364-n22YHl1k47.png?width=1200)
自分が飲みたい状況を入れてみたキャッチコピー
![](https://assets.st-note.com/img/1684744380905-Ebi9pp1qFw.png?width=1200)
色を決める
メイン商品を伝えてどんなカラーがいいか聞きました。
![](https://assets.st-note.com/img/1684973127301-CTah7wtdvC.png?width=1200)
![](https://assets.st-note.com/img/1684973166978-CCQeykNlao.png?width=1200)
![](https://assets.st-note.com/img/1684973190064-exmp6vaPvm.png)
なんかじゃっかん気に食わないので違うパターンも出してもらいました。
パステル調にしてもらったり、トレンドを取り入れてもらったりしました。
![](https://assets.st-note.com/img/1684973294677-vjQ3jEyMyg.png)
トレンドを取り入れた右下のオレンジがなんか気に入ったのでこれで行こうと思います。
ロゴを作る
ロゴは <DesignEvo ロゴメーカーさん>で作りました。(選びました)
え、結構いいですね。かわいい。
![](https://assets.st-note.com/img/1684721502760-eI8BVELAbN.png)
名前はもちろんチャットGPTに決めてもらいました。6案くらい出してもらった中でいちばんかわいかったのにしました。
作っていく
画像を生成する
![](https://assets.st-note.com/img/1684745063362-BQ2YL5Rf5A.png?width=1200)
Adobeの新しいAI画像生成のサービスを使ってみました。かっこいいかも?
それを埋めていく
あとちょっと装飾して完成しました
完成したのがこちら↓
※ファーストビューの画像かっこいいの作ろうと思ったんですがPhotoshopが落ちて萎えたんでそれなりに雑なものになりました。
![](https://assets.st-note.com/img/1684983018612-cuZjkywHAk.png)
やってみた感想
・ターゲットの設定などは聞いたらすぐ出してくれるのでよい
・ページの構成などもたたきとしてはよい
・カラーなども最初のたたきとして数を出してくれるので楽
・キャッチコピーも数は出る。よいかは微妙
・画像生成は面白い
全体的に最初の案出しとしてAIを使うのはいいかも!!