Google Stitchは、テキストや画像でアイデアを伝えるだけで、プロ品質のUIデザインを自動生成してくれるAIデザインツールです。Google Labsが提供しており、Geminiモデルを搭載しています。
「こんなアプリを作りたい」と一言入力するだけで、要件定義・デザインシステムの構築・複数画面の生成まで自動で進めてくれます。生成したデザインはFigmaにワンクリックで貼り付けたり、HTML/Tailwind CSSのコードとして出力することもできます。
Google Stitch の主な機能
Stitchは「バイブデザイン（vibe design）」というコンセプトのもと、アイデアの言語化からプロトタイプ完成までをカバーしています。
🎨 テキスト → UI生成
自然言語でアプリの概要を伝えると、要件定義からデザインシステム構築、複数画面の生成まで自動で進行します。
🖼️ 画像 → UI変換
手書きスケッチやワイヤーフレーム、スクリーンショットをアップロードすると、デジタルのUI画面に変換してくれます。
📋 Figmaエクスポート
生成したデザインをコピーしてFigmaにCtrl+Vで貼り付けるだけ。レイヤー構造やAuto Layoutも維持されます。
💻 コード出力
HTML + Tailwind CSSのクリーンなコードを出力。Claude CodeやCursorに渡して開発に着手できます。
2026年3月の新機能
2026年3月の大型アップデートで、以下の機能が追加されました。
- AIネイティブ無限キャンバス：アイデアの初期段階からプロトタイプまで、1つのキャンバス上でシームレスに作業できるように
- Voice Canvas：音声で「ダークモードにして」「3パターン出して」などの指示が可能
- DESIGN.md：デザインルール（カラー、フォント、コンポーネントパターン）をAI可読なMarkdown形式で出力。他プロジェクトへの流用が容易
- MCPサーバー：Gemini CLI、Claude Code、CursorからStitchのデザインを直接参照可能に
- Instant Prototype：生成した複数画面をつなぎ合わせて、クリック可能なプロトタイプを作成
Google Stitch の料金
現時点ではGoogle Labsの実験的プロジェクトとして無料で提供されています。2つのモードがあり、使用するAIモデルと生成回数が異なります。
| モード | AIモデル | 月間生成回数 | おすすめ用途 |
|---|---|---|---|
| Standardおすすめ | Gemini Flash | 350回/月 | ラフなアイデア出し、素早い探索 |
| Experimental | Gemini Pro | 50回/月 | 高品質な生成、画像ベースの変換 |
💡 料金について
Google Labsの実験プロジェクトのため、現時点では完全無料です。将来的な有料化については未発表。Googleアカウントがあれば、サブスクリプションやクレジットカード登録なしで利用できます。
こんな人におすすめ
- プロトタイプを素早く作って打ち合わせに使いたい方
- Figmaを使いこなせないが、アイデアを形にしたい方
- デザイナーに依頼する前に、方向性を固めたい方
- v0やBoltでコード生成する前に、デザインの品質を上げたい開発者
知っておきたい注意点
利用前に確認しておきたいこと
- コード出力はHTML/Tailwind CSSのみ：React/Vue/SwiftUI等のフレームワーク出力は未対応（React対応は近日予定）
- バックエンドは生成されない：フォームやログイン画面は見た目のみ。サーバー処理は別途開発が必要
- 日本語対応は不完全：日本語プロンプトでも英語UIが生成されることがある。「日本語にして」と追加指示で修正可能
- デザインのテイストは海外寄り：欧米のSaaSサイト風のデザインがベース。日本向けに調整するにはFigmaでの追加作業が必要
- アニメーション・インタラクション非対応：ホバーエフェクトやスクロールアニメーションは含まれない
- Google Labsの実験プロジェクト：将来的な提供形態の変更やサービス終了の可能性はある
まとめ
Google Stitchは、UIデザインのプロトタイプ作成を劇的に速くしてくれるツールです。テキスト1行から要件定義→デザインシステム→複数画面の生成まで自動で進み、Figmaへのエクスポートやコード出力もスムーズ。Figma Makeのような有料サービスと同等以上の機能を、現時点では無料で使えるのは大きなメリットです。
完成品を作るツールではなく、「アイデアを素早く形にして議論の材料を作るツール」として使うのがおすすめです。
グーグル