生成AIツールはいまや、動画制作から住宅のリフォームまで、あらゆるところに入り込んできています。

そうした生成AIモデルが担う新たな作業に、ウェブサイトのデザインもあります。

HTMLのコードを一行たりとも書かず、人目を引くような洗練されたウェブサイトをつくってウェブ上で公開できるのです。

プロンプトでホームページの制作ができる

やり方は、テキストや画像をAIで生成する場合と同じです。

つまり、プロンプトを入力すれば、AIが魔法を使って、人間の指示どおりにウェブサイトを生成してくれるわけです。

ウェブサイトの目的や、希望するビジュアルスタイルはもちろん、ページ上に入れたい個別の構成要素(画像やメニューなど)を具体的に指示することもできます。

いまでは、さまざまなウェブサイト作成サービスがAIを導入しています。今回は、そうしたサービスから3つをピックアップしました。

Wix

WIXの画面
Wixでは、これぞと思えるウェブサイトが完成するまで、プロンプトを追加することができます。
Image: Lifehacker

「Wix」に新規登録すれば、AIウェブサイト作成ツール「Wix ADI」を使って、すぐさまサイト作成を開始できます(ただしご希望なら、AI任せにせず、従来のやり方で作成することも可能です)。

サイト作成にあたっては、さまざまな質問に答えていくことになります。

たとえば、「ウェブサイトにはどのようなタイトルをつけたいのか」「どのような内容のウェブサイトにするつもりか」「どのような機能が必要か」「特に伝えたいメッセージはあるか」といった質問です。

やりとりは、ChatGPTやGeminiを相手にする場合と大差ありません。

また、プロンプトごとに、AIに質問を言い直させたり、答え方を教えてもらったりできます(つまり、こちらが言うことの選択肢を提案してくれるわけです)。

そのほか以下のような特徴があります。

  • ウェブサイトの外観が生成されるたびに、微調整を加えたり、ゼロからやり直したりが可能
  • 細かい部分は思いどおりにならない
  • WixとWix ADIは、無料で利用できますが、月額17ドルからのプレミアムプランもあり(日本語版は1200円の「パーソナル」プランから)。

Framer

Framerの画面
Framerなら、サイトのスタイルを速やかに繰り返し表示することができます。
Image: Lifehacker

「Framer」には、高度なウェブサイト作成ツールが用意されているだけでなく、AI機能もあります。

ということで、サイト作成作業の一部は人工知能に任せたいけれど、手動であれこれアレンジしたいと考えている人には最適のツールと言えるでしょう。タグラインからページ全体まで、AIがすべてやってくれます。

必要なのはプロンプトだけです。

たとえば、「すっきりとしたミニマルデザインで、ヘッダー画像用のスペースが大きい、テックライターのウェブページ」と入力すれば、実用的でプロっぽいページがすぐに生成されます。

AIが生成した要素ならどれも、必要に応じて同じプロンプトを入力すると、再び生成されますし、手動で調整することも可能です。

そのほか以下のような特徴があります。

  • AIは、最適な配色も提案してくれるので、サイトの外観を瞬時に変更できる
  • 現時点では、AIによる画像生成機能はなし
  • 手動でアレンジができますし、広範囲にわたって手を加えることが可能
  • Framerは無料でも利用が可能で、有料プランは月額5ドル(692円)から

Hostinger

Hostingerの画面
Hostingerなら、たった1文のプロンプトをもとにウェブサイトをつくってくれます。
Image: Lifehacker

「Hostinger」では、新規登録して、ウェブサイトの種類、スタイル(「ミニマル」や「派手な」など)を選び、テキストのプロンプトを入力するだけで、ウェブサイトを丸ごと生成できます。

プロンプトは、できるだけ具体的にするのがベターです。米LHが試してみたところ、ほんの数行のテキストを入力しただけで、まずまずの出来栄えのサイトが生成されました。

とはいえその外観は、どこにでもある既存のウェブサイトとあまり変わりありません(いかにもAIらしいのですが)。

ウェブサイトの細かい部分に自分で手を入れる段階に進むと、テキストを生成してくれるAIライターが登場します。

やり方は、ChatGPTやGoogle Geminiとほぼ同じです。

そのほか以下のような特徴があります。

  • HostingerのAI生成機能は、画像やロゴも生み出せる
  • Hostingerは無料では使えず、有料プランは月額11ドル99セント
  • 30日間の返金保証付き
  • 生成可能なAI画像数には上限がある

「GPT Store」で見つけた英会話力アップに役立つGPTs2選|活用方法、特徴まで全網羅 | ライフハッカー・ジャパン https://www.lifehacker.jp/article/2402-chatgpt-store-english-study/

AndroidのアシスタントをAI化。いつでも「Hey Google」と言うだけでGeminiが呼び出せる | ライフハッカー・ジャパン https://www.lifehacker.jp/article/2403-how-to-make-gemini-your-default-assistant-on-android/