Vercel、生成AIへのプロンプトでWebアプリのUIを自動生成してくれる「v0」をベータ公開。Freeプランも提供

2023年10月18日

Next.jsの開発元として知られるVerelは、生成AIに対して自然言語のプロンプトを与えることでWebアプリケーションのユーザーインターフェイスを自動生成してくれるサービス「v0」のベータ公開を発表しました

v0を使うと、人間のWebデザイナーに「こんな画面を作って」「ここの色は青にして」「ここのフォントは大きく」などと言葉で指定するの同じような感じで生成AIに指示をして、HTMLやCSSなどのコードを書くことなくWebアプリケーション画面の生成が可能です。

v0は先月(2023年9月)にプライベートアルファ版として発表されていたものです。今回、ベータ版となったことで料金体系が発表され、利用申し込みをしていたユーザーの多くが利用できるようになりました。

コードを書くことなく、言葉の指示だけでWeb画面を生成

下記はv0のデモ動画の一部です。

例えば、プロンプトに「A SaaS dashboard layout」(SaaSのダッシュボードのレイアウトを生成して)と入力します。

fig

すると下記のようなダッシュボード画面が自動生成されます。

fig

ここでログをクリックして「Make the company logo clolor blue.」と入力。

fig

すると、ロゴの色が青く変わります。

fig

このように生成されたWebアプリケーションの画面の要素を指定し、さらにプロンプトで指示していくことで、コードを書くことなくWebアプリケーションの画面が生成されます。

生成された画面は、もちろんソースコードを取得可能です。

fig

現時点でソースコードはReactベースのShadcn UIとTailwind CSSを用いて記述されています。今後Svelte、Vue、プレーンなHTMLやその他のCSSフレームワークを用いたソースコードの生成も検討していくとのことです。

月間200クレジットまで無料で使えるFreeプランも提供

v0は、Freeプランを含むサブスクリプションによる価格が設定されました。

Freeプランは1カ月あたり200クレジットまで利用可能です。1回の生成あたり10クレジットが消費されるため、20回までプロンプトの指定による生成が可能。

月額10ドルのBasicプランは1カ月あたり1500クレジットまで、月額30ドルのStandardプランは5000クレジットまで、月額50ドルの10000クレジットまで利用可能で、Basicプラン以上は追加のクレジット購入が可能です。

Tags: HTML/CSS 開発ツール React

このエントリーをはてなブックマークに追加
ツイート
follow us in feedly





タグクラウド

クラウド / AWS / Azure / Google Cloud
コンテナ / Docker / Kubernetes
クラウドネイティブ / サーバレス
クラウド障害 / 運用・監視

プログラミング言語 / 開発ツール
JavaScript / Java / .NET / WebAssembly
HTML/CSS / Web標準

アジャイル開発 / スクラム / DevOps / CI/CD
ソフトウェアテスト・品質
ローコード/ノーコード開発

データベース / RDB / NoSQL / 機械学習・AI
Oracle Database / MySQL / PostgreSQL
Office / 業務アプリケーション

ネットワーク / HTTP / QUIC / セキュリティ
OS / Windows / Linux / VMware
ハードウェア / サーバ / ストレージ

業界動向 / 働き方 / 給与・年収
編集後記 / 殿堂入り / おもしろ

全てのタグを見る

Blogger in Chief

photo of jniino

Junichi Niino(jniino)
IT系の雑誌編集者、オンラインメディア発行人を経て独立。2009年にPublickeyを開始しました。
詳しいプロフィール

Publickeyの新着情報をチェックしませんか?
Twitterで : @Publickey
Facebookで : Publickeyのページ
RSSリーダーで : Feed

最新記事10本