自然言語でプロ並みのUIを作成｜Stitchって何？

Geminiにお願いしても、デザインが思いどおりにならない?

実はGoogleには、デザインに特化した「Google Stitch」というAIツールがあります。

StitchもGeminiを使っていますが、UIデザイン専用に作られているため、Geminiアプリを使うより洗練された画面を作れます。

まだベータ版ですが、この記事と次の記事の2回に分けて、Stitchの概要と使い方を紹介します。。

▲Stitchの画面

1. Stitchとは？

Stitchは、Googleが提供している最先端のAIデザインツールです。2025年の「Google I/O」で発表され、言葉や画像からUIデザインとコードを数秒で自動生成する機能が話題となりました。

2026年3月の大型アップデートでは、アイデア出しから試作までを1画面で行える「無限キャンバス」や「音声指示」、「複数画面の連携機能」などが追加され、より直感的で使いやすく進化しています。

使用AI
Googleの高性能AI「Gemini」を採用
提供形態
現在は実験的プロジェクトを公開する「Google Labs」として提供中
アクセス方法
stitch.withgoogle.com から、Googleアカウントでログインするだけで利用可能

↓こんな感じに自動で作業してくれます。

2. Stitchで何ができるの？

主に以下のような、強力なデザイン支援機能を備えています。

Webサイトもスマホアプリもデザインできる
Stitchでは、作り始めるときに「ウェブ」か「アプリ」かを選べます。「ウェブ」は、ブラウザで見るWebサイトのデザインです。「アプリ」は、スマホにインストールして使うアプリの画面デザインです（レシピアプリや家計簿アプリの画面など）。どちらも、同じように自然言語で作れます。
言葉や画像からUIを自動生成
「レシピアプリのトップ画面を作って」「マカロン専門店のトップページを作って」とテキストで指示するだけで、画面デザインを作成します。手書きのラフを元にした生成も可能です。
バリエーション豊富なデザイン提案
デザインを3つ作成して」と頼めば、雰囲気の違う3案が出るので、その中から好みに一番近いものを1つ選べます。
連動する複数画面の一括生成
別々の画面をまとめて作ることも可能です。「ログイン画面」「ホーム画面」「詳細画面」など、役割の違う画面を、一連の流れでつながったセットとして生成できます。
他のAI開発ツールとの連携機能
Stitch単体が出力する基本コードはHTML／Tailwind CSSが中心ですが、画面右上の「エクスポート」から、いろいろなツールへデザインを渡せます。デザインを作り込む「Figma」、Googleの「AI Studio」、LovableやBoltといったAIアプリ作成ツール、公開用の「Netlify」など、用途に合わせて移行できます。Stitchで作ったデザインを引き継いで、次の作業に進めます。

3. 料金システム

Stitchは、Googleアカウントがあれば無料（クレジットカード登録不要）で使い始められます。

ただし、使用するAIモデルのグレードによって、利用回数の上限が設定されています。

現時点で明確な有料プランは公開されていませんが、制限のルールは頻繁に変わるため、最新情報は公式サイトで確認してください。

4. 「v0」との違いを比較

前回紹介したv0との違いをまとめました。

ツール名	主な機能・特徴	最適な場面
Stitch	・言葉や画像からUI（画面）を自動生成・複数画面のつながりをまとめて構築・FigmaやGoogle AI Studioをはじめ、AIアプリ開発ツール（Lovable, Bolt, Netlify等）へエクスポート可能	・アプリ全体の「デザイン案」や「画面遷移」を最速で作りたいとき・Stitchでデザインの骨組みを作り、外部AIツールに繋いで「動くReactアプリ」に仕上げたいとき
v0	・言葉からパーツを生成・1画面のディテールを細かく作り込み・ボタン一つでURLを発行し、そのままネット上へ公開が可能	・すでに作りたい画面が決まっていて、特定の部品や1画面を徹底的に作り込みたいとき・まずは手軽に「動くサイト」を完成させて、今すぐWeb上に公開したいとき

両方とも「自然言語で画面を作るAIツール」ですが、Stitchとv0では得意分野や思想が異なります。

「Stitchで理想のデザインの骨組みを作り、それをベースにv0などの実装ツールで仕上げる」といった使い方もありそうです。

5. 使用前に知っておきたい注意点

便利なStitchですが、発展途上のツールゆえに以下の点に注意する必要があります。

現時点ではベータ版
StitchはGoogle Labsのプロジェクトであるため、今後予告なく仕様が変更されたり、サービス形態が変わったりする場合があります。
バックエンドは未実装
例えば「お問い合わせフォーム」や「ログイン画面」を作った場合、Stitchが自動生成してくれるのは入力欄やボタンなどのデザインだけです。実際に送信ボタンを押したときに「メールを自動送信する」「ユーザー情報をデータベースに保存する」といった裏側のシステム処理は、別途、連携した外部ツールで実装する必要があります。
入力したデータは学習に使われる
初期設定のままだと、入力したプロンプトや画像がGoogleのAIの学習に利用されます。右上のアカウントアイコン→「Stitchの設定」→「AIモデルのトレーニングを許可する」のチェックをはずし「変更を保存」をクリックしてから使いましょう。

Stitchは、言葉や画像で指示するだけでプロ並みの画面デザインを形にしてくれる画期的なAIツールです。

「デザインのアイデア出しで行き詰まっているとき」や、「クライアントに素早く画面イメージを提案したいとき」に役立つでしょう。

次の記事では、Stitchの具体的な使い方を紹介します。