v0を使って、AIにWebサイトを作らせよう
こんにちは、むなかたです。
今回は「v0」というサービスを使って超お手軽にWebサイトを公開してみる手順を紹介してみます。
v0の特徴は何と言っても「ブラウザだけで完結する」という点。AIツールのインストールが面倒だったり、スマホでお試ししたい方にピッタリのツールとなっているので、よろしければ一度触ってみてくださいね！
公式サイト: https://v0.app/
v0とは
v0（ブイゼロ）は、Webサイトを作成することに特化したAIツールで、AIに指示するだけでお手軽にWebサイトを作ることができるサービスです。
v0はデプロイサービスを開発している「Vercel」という会社が作ったものなので、サイト公開までがとても簡単という点が強みですね。
他にもWebサイトが作れるAIツールがあるのですが、このような特徴があります。
Webサイト作成に特化していて、リアルタイムでプレビューが見れる
操作が簡単で、公開もボタン一つでできる
ブラウザ上で完結する
iOSではアプリもあり、スマホでも作成できる
無料枠がある
すでにCodexやClaude CodeといったAIツールを使いこなしている方には不必要かもしれませんが、これからAI開発をスタートする入門者の方にイチオシのサービスです！
無料アカウントの制限
v0は無料で使い始めることができますが、使える枠が決まっているので要注意です。2026年6月現在だと以下のような制限があります。
5ドル分/月の利用枠
1日7回のメッセージ
サービスリリース当初はかなり無料枠が大きかったのですが、いまではかなりシビアになってしまいました。とはいえお試しには丁度いいので、最初のサイトづくりにぜひご活用くださいませ。
サイトの作成＆公開方法
ステップ1: アカウント作成
まずは、アカウント作成から始めます。 v0.app にアクセスしましょう。
画面右上の「Sign up」からアカウント作成画面に進んでください。
Vercelのアカウント作成画面に遷移するので、任意の方法でアカウント作成をお願いします。
アカウント作成とログインが完了したらTOPが以下のような画面に変化します。画面中央の入力欄に指示を行うことでサイトを作成することができます。
画面左下には残りクレジットが表示されているので、何か指示をした後には定期的にチェックしておくことをオススメします。
また、「v0 Max」と書かれた箇所をクリックするとAIのモデルを切り替えることができます。高レベルのモデルを使うとより複雑なサイトを作りやすいですがクレジット消費が激しいので、無料アカウントの場合は「v0 Mini」か「v0 Pro」を使うことを強くおすすめします。
ステップ2: 日本語で指示をして送信
それでは実際に作ってほしいサイトの内容を指示してみましょう。内容はお任せですが、例えば以下のようなサイトはシンプルな構成なため、少ないやり取りで作ることができます。
自分の自己紹介用サイト
会社やビジネスのホームページ
SNSのリンク集サイト
簡単なクイズやゲームができるサイト
今回は以下のように指示をしてみました。ちなみに、頭の中に具体的なイメージがある場合は、そちらを細かく伝えてあげることで、より自分のイメージに使いものが最初から出来上がりやすいです。
AIプログラミング学習コミュニティの紹介を行うサイトを作成してくださいしばらく待つとこのように指示した内容に沿ったサイトの見た目が作成されます。この時点ではプレビュー状態なので、まだサイトは公開されていません。
また、やり取りをするたびにクレジットが消費されます。今回は「v0 Max」でサイトを1つ作成しただけで5.0→4.33まで減ってしまったので、やり取りの数はなるべく減らすか、「v0 Mini」などの消費が少ないモデルを選ぶのがオススメですね。
ステップ3: 内容を確認して修正指示
生成されたサイトに調整が必要な場合は、左下のテキストエリアから追加で指示を行えます。
例えば今回AI作ってもらったサイトでは仮のコミュニティ名称がつけられているので、実際にぼくが運営している「創理」という名前に変更してもらうよう指示してみます。
左下の入力欄に修正してほしい内容を入力してEnterを押してみましょう。
コミュニティのタイトルを「創理」に変更してください。画面左側で色々と変更が行われたあと、画面右側で変更内容が反映されるはずです。たまにこの時点でエラーが出ることがあるのですが、その場合は続けて「エラーが出てるので直してください」のような指示を行うと良いです。
このようなことを繰り返して、自分の理想のサイトになるよう修正を行っていくだけでOKです！
ちなみに2回目の修正ではクレジットが4.33→4.10まで減ってました（v0 Max使用時）。1から作るときよりは消耗は少ないですが、頻繁なやり取りをしないよう要注意ですね。
ステップ4: 公開
最後にv0上で作成したサイトの公開方法について紹介します。
画面右上の「Publish」から「Publish to Production」をクリックしてみてください。
しばらく右上の「Publish」ボタンの部分がぐるぐるしているので待ちましょう。ポップアップは一度閉じてしまっても大丈夫で、「Publish」ボタンを押せば再度開くことが可能です。
少し待って、ポップアップ画面上に「Visit Site」と書かれたボタンが表示されたら公開完了です！このボタンを押してサイトにアクセスしてみましょう。
別のタブが開かれ先ほど作成したサイトが表示されているはずです。このURLを他の人に教えてあげればすでに誰でも見れる状態になっています。
公開後の設定
先ほどの例ではそのまま公開しましたが、いくつかのオプションがあるので紹介していきます。
① URLの変更
こちらは公開するURLを変更する設定です。
https://v0-●●.vercel.app
という形式は決まっているので、中間の●●の部分を他のサイトと重複しない形で指定することができます。
② 公開オプションの設定（有料プラン）
サイトの公開オプションを以下の2パターンで変更可能です。ただし、こちらは有料プランのみの機能なのでデフォルトでは「誰でも閲覧可能」という状態になります。
`Public` : 誰でも閲覧可能
`Password Protected` : 閲覧にパスワード入力が必要
③ アクセス状況の分析
「Analytics」というボタンを押すと、サイトのアクセスの状況を確認できる画面に遷移します。
よくあるサイト分析ツールと同じで、合計のアクセス数、どのページが見られているか、どこ経由でサイトに訪れたかの情報を確認することができます。