GoogleのAIであるGeminiでインスタントにウェブサイトを作成するサービスです。

手書きのワイヤーフレームをAIにインプットし、ウェブサイト化してくれます。ノーコードかつノー文字（一文字も打たずに！）からウェブサイトのフロントエンドを作れる時代がきましたね。ブースでホワイトボードに自身が作りたいウェブサイトの構造を描いて、カメラで読み込みます。すると、描いたウェブサイトとソースコードが表示されました。

処理時間はほとんどなく、数秒で表示されました！簡単なウェブサイトは人間でも早く作れると思いますが、流石に２～３秒は無理があります。ちなみにワイヤーフレームにテキストも書けます。例えば長方形の中に「ボタン」を書いたらHTMLのボタンエレメントを作成してくれます。なお、インプットとしてテキストのみも入力できます。それでワイヤーフレームだけだと伝わらない要素をAIに説明できます。

以下は入力画面です。

ブースでは、展示だけではなく、実際にInstant Web with Geminiを体験できたので、私は２つのサイト作成を体験しました。自分でワイヤーフレームを描いて、AIにウェブサイトを作成してもらえます。

一つ目は簡単なログイン画面でした。そちらは期待通りに、描かれたワイヤーフレームになっていました。ログインとパスワードの欄が入力可能のフォームになっていて、「ログイン情報保持」のチェックボックスも作成してくれました（チェックボックスを作成してもらえるようにチェックボックスにチェックマークを描く必要がありました）。

二つ目は様々なボックスがあるウェブショップのようなサイトでした。そちらはあまり手書きのワイヤーフレーム通りに作成できませんでした。デザインは難度が高く、テキストのインプットもなかったため、あまり良い成果出せなかったと思いました。少し複雑なウェブサイトを作ってもらいたい際はそれなりの情報をインプットする必要があるようです。

以下は二つ目の商品体験のワイヤーフレームです。

以下は結果画面です。

簡単なサイトだと、素早く作れるのでPoCや画面を本格的に作成する前の認識合わせに活用できると思いました。サイトの難度が高くなればなれるほどユーザビリティが低くなると思いますが、テキストインプットを利用して、サイトの要件を明確化したら多少予想通り作成してくれるでしょう。

当日の体験では簡素なウェブサイトだけでしたが、画像生成AIと連携したら簡単なインプットから画像を含む立派なウェブサイトを作成できそうです。ちなみにGoogle Cloud Next’24でGoogleがImagen 3.0 x Flutter x Geminiという画像生成AIも展示しました。

AIがウェブサイトを完全に作る未来が近づいてきたと感じています。

GoogleがImagen 3.0 x Flutter x Geminiに「猫、ニュースアナウンサー、トマトのニュース」のプロンプトで上記の可愛らしい画像がでました。AIのおかげで猫がワイヤーフレームから作ったウェブサイトでニュースを報告し始める日を楽しみにしております。