v0って何?
指定したテキストのプロンプト(もしくは画像)に応じたデザインのReactコードを生成してくれるサービス。 現在ベータ版。 v0.dev
適当なプロンプトで試す
シンプルな商品詳細ページ
という雑なプロンプトで小手調べ。日本語でもちゃんと生成できた!
A、B、Cの3パターン作ってくれる。有能デザイナー。
生成されたコンポーネントはCLIもしくはコピペで自分のプロジェクトに追加できる。
Premiumプランの違い
- 生成モード「Quality」を選択可能
- 速度を犠牲にして生成されるデザインの品質を上げるモード。Freeだと「Speed」しか選べない
- 生成するデザインを非公開にできる
- デフォルトだと生成したデザインが公開され、トップページに表示される
- 付与されるクレジット数がFreeより多い
- クレジット=デザインを生成する毎に消費されるポイント
まとめ
苦手分野のデザインとHTML/CSSをサボれるのはありがたい。
個人開発したいけど1からデザイン作る気力がないときとかに使えそう。