chatGPTにアプリのLPを作ってもらった

GPT4が発表されてchatGPTがより話題になってきました。GPT3の頃はまだ個人利用が多かった気がしますが、GPT4になって企業も本格的に利用を始めたり、Microsfot co-pilotやGithub co-pilot、BingなどGPT4を利用したサービスも増えた気がします。
そこでchatGPTにアプリのLPを作ってもらうことにしました。
その際に使用したプロンプトを残しておこうと思います。
完成したものがこちらです。

最初はLPを作って欲しいこと、また紹介するアプリの特徴を伝えました。

Timetable4ICUというアプリを紹介するウェブサイトを作ってください。 Timetable4ICUは国際基督教大学の時間割アプリです。その機能としては以下のように紹介されています。
---
全授業のデータが登録されており、クラスの登録が簡単です。ロンフォーや連続のコマの結合、そしてクラス毎に授業名、教室を設定できます。また、タスク管理もできます。

プロンプト①
結果①

まずまずの出来ですが、まだ物足りません。
文章もただ並べられているだけです。また、リンクが無骨です。
そこでさらに修正をお願いしました。

ありがとうございます。雛形としては良いものができていると思います。 このコードを改良してさらにかっこいいものを作ってください。

プロンプト②
結果②

修正前に比べてだいぶ統一感も出てきました。アプリのボタンなどとてもよくなったと思います。何より情報を一箇所にまとめることで読みやすくし、余白を余白と感じさせないのは流石です。
しかし、まだ機能紹介などは文章が並んでいるだけです。そこでまた修正をお願いしました。

より洗練されたかっこいいデザインにしてください。ヘッダーは改善の余地があると思います。また、機能の箇条書きなども改善できると思います。

プロンプト③
結果④

かなり良くなりました。機能紹介の各要素がカラム表示になった上にアイコンが追加されました。視覚的にとても分かりやすいデザインになった気がします。
しかし、どこか文章がまだぎこちない気がします。
そこでさらに修正してもらいました。

さらに洗練された内容にしてください。必要であれば新しい言葉を追加しても構いません。デザインもさらに洗練してください。

プロンプト⑤
結果⑤

各機能の文言がランディングページっぽくなりました。一つ一つが連なって効果的な文言になった気がします。

最終的にGithub Pagesを使って今回作ってもらったLPを公開しました。
Github Pagesはデータベースとのやり取りをしない静的なサイトを作る際にはとても便利でした。ドメイン名などを気にしないのであれば、ドメインを取得してサーバーをレンタルしてといった手間がかからずにすぐにウェブページを公開できます。

所感としてはGPT4となってより曖昧なプロンプトへの対応力は上がったものの、まだその能力を使いこなせていないです。使いこなすにはまだ修行が必要そうです。
とはいえ明確な完成形が定まっていない場合は簡単に色んな雛形を作れてアイデア出しとかにはとても有効だと思いました。
また、完成形がある場合はOpen AIのDemo映像であったようにラフなどのスケッチを渡してそれを作ってもらうのが良いと思いました。
ただ、最後の細かな修正は自分でやる必要がありそうです。その修正方法はChat GPTに聞いても良いですが、やはりまだ自分で検索した方が早い気がしました。

この記事が気に入ったらサポートをしてみませんか?