v0・Bolt.new・Figma Make・Lovable・Framer——AIサイトビルダーは何が得意で、どう使い分けるか

2026年9月25日

AIサイトビルダー各社は「作って終わり」から一歩進み、Gitワークフローやデータベース連携、デザインの再現度、コンポーネント単位のAI生成へと競争軸を広げている。今日はv0・Lovable・Bolt.new・Figma Make・Framerの最新機能と使い分けを整理する。

v0：Gitワークフローとデータベース接続で「本番運用ツール」へ

v0は元々「プロンプトからコンポーネントを生成する」ツールだったが、2026年の大型アップデートでチャットごとにブランチを切ってPRを開き、マージでデプロイするGitパネル、VS Code風のエディタ、Snowflake・AWSなどのデータベースへの直接接続を備えた。エンジニアでないメンバーでも正式なGitフローで本番コードを出荷できる、という位置づけの変化が大きい。今後はAIモデルを組み込んだエージェント型ワークフローをv0上で構築し、Vercelのインフラへそのままデプロイする方向も示されている。生成コードがcomponents/ui/配下に収まりpackage.jsonの依存関係も自動更新されるなど、開発者向けの「素直さ」で高評価を得ている。

Bolt.new：Bolt Cloudでインフラ込みのフルスタック化

Bolt.new（開発元StackBlitz）はBolt V2で「Bolt Cloud」を追加し、データベース・認証・ファイルストレージ・エッジ関数・アナリティクス・ホスティングを標準搭載した。コード生成ツールから「デプロイまで完結するプラットフォーム」への転換であり、APIキーがプレビューURLやログに漏れないようにする「Secret Masking」などセキュリティ機能も強化されている。Claude CodeやOpenAI Codexを同一プロジェクト内で切り替えて使えるマルチモデル対応も特徴で、トークン課金制のため反復編集が多い大規模アプリではコスト管理に注意したい。

Figma Make：デザインシステムそのままの再現度が武器

Figma Makeは既存のFigmaデザインをそのままインタラクティブなプロトタイプに変換する。v0やLovableがスクリーンショットや説明文からUIを「推測」して生成するのに対し、Figma Makeはデザインのメタデータに直接アクセスできるため、実際のボタンスタイル・タイポグラフィ・余白をそのまま引き継げる。既にFigmaでデザインが固まっているチームが「動くプロトタイプ」を作る用途に強く、長期運用するアプリをゼロから構築する用途にはv0やLovableの方が向くとされる。

Lovable：アプリ全体を任せる「ノーコード寄り」の選択肢

Lovableは「コンポーネント単位」ではなく「アプリ全体」を1つのプロンプトから作る方向性を貫いている。Supabaseによる認証・DB設定、React形式でのコードエクスポートに加え、手描きのラフから発想できるDraw-to-BuildやClaude MCP連携を備え、コードを直接見なくても使い切れる設計が特徴だ。使い捨てのプロトタイプから小規模な本番アプリまで、コードに触れたくない担当者が一気通貫で形にしたい場面に向く。

Framer：デザインファースト×AIで「サイト全体」と「部品」の両方を生成

Framerは元々ノーコードのビジュアルデザインツールだったが、AI機能を段階的に強化しAIファーストなサイトビルダーへ変化している。代表的なのが次の2つ。

Wireframer：文章で説明するだけで、レスポンシブ対応済みの構造重視レイアウトを即座に生成する機能。ブログやコレクション（CMS）のレイアウトにも対応が広がっている。
Workshop：コードを書かずに、サイトの配色・フォント・レイアウトに合わせたオリジナルのインタラクティブコンポーネントをAIが生成する「バイブコーディング」的な機能。編集画面内で完結し、プロパティも右パネルにそのまま反映される。

加えてページを開いたまま編集できる「On-Page Editing」や、サイト全体の多言語翻訳・コピーのその場書き換えなど、デザイナーが手を止めずに仕上げまで進められる方向にAI機能が積み上がっている。

用途別の使い分け早見表

ツール	得意なこと	向いている場面
v0	Gitワークフロー・DB接続・クリーンなコード生成	本番運用するNext.js/Reactアプリをチームで開発
Bolt.new	Bolt Cloudによるインフラ込みフルスタック開発	デプロイまで一気に済ませたいフルスタックアプリ
Figma Make	既存デザインシステムの高精度な再現	Figmaで固めたデザインを動くプロトタイプに
Lovable	アプリ全体を1プロンプトから生成、ノーコード運用	コードを見ずに素早く形にしたいプロトタイプ〜小規模アプリ
Framer	サイト全体のレイアウト生成＋部品単位のAIコンポーネント生成	デザイン性の高いマーケティングサイト・LP