Google Stitchレビュー：私はAIと話してアプリを作成しました

あなたもが頭の中にアプリのアイデアが浮かんでいるのに、デザインツールを開くとアイデアが消えてしまうことがありますか？

そのギャップ（頭の中のアイデアと画面上のものの違い）を埋めるのが、Google Stitch (GOOGL ) です。私の経験からすると、かなり近いものを作成することができます。

Stitchは他のAIデザインツールとは異なります。新しいシステムを学ぶ必要も、コンポーネントをキャンバスにドラッグする必要もありません。

使い方は非常に簡単です。アプリやウェブサイトのデザインを説明する（音声でも可能）と、数分でフルスクリーンが表示されます。

このGoogle Stitchレビューでは、利点と欠点、Stitchの概要、対象者、主要機能について説明します。次に、UIデザインを作成する方法を紹介します。

最後に、Stitchと私のトップ3の代替ツール（Base44、Softr、Draftbit）を比較します。最後まで読むと、Stitchがあなたに合っているかどうかがわかります。

判定

Google Stitchは、テキスト、音声、スケッチからUIを作成することが非常に簡単です。Figmaやコードにエクスポートできます。また、手動でリアルタイムのデザイン変更を行うこともできます。素早いプロジェクトには最適ですが、デザインが汎用的なものになる可能性があり、制御が限定され、複雑なフローは扱いにくいです。

Stitchとは

Google Stitchは、Google Labsから提供されるUIデザインツールで、AIを使用してテキストプロンプト、スケッチ、またはスクリーンショットをレスポンシブウェブサイトやモバイルアプリケーションに変換します。

例えば、Stitchに、ダークテーマとカードベースのレイアウトを持つフィットネスアプリのモバイルダッシュボードを作成するように指示できます。すると、フルインターフェイスがリアルコンポーネントで構築されます。フロントエンドコード（HTMLとCSS）はエクスポート可能なので、デザインを開発者に簡単に渡したり、ワークフローに直接統合したりできます。

起源（Galileo AI）

しかし、Stitchは突然現れたわけではありません。Googleは、Galileo AIというスタートアップを買収しました。Galileo AIは、テキストプロンプトと画像からUIデザインを生成する専門会社でした。Googleはその技術を取り込み、Stitchとしてブランド化しました。

つまり、Stitchを使用する際には、すでにデザイナーが使用していたツールの進化版を使用していることになります。元のモデルは最初から作成されたわけではなく、改良されたものです。

初期の立ち上げ

ツールは、Google I/O 2025で正式に発表されました。これは、Googleの年次開発者イベントです。しかし、最初にリリースされたバージョンはかなり粗かったです。

2026年3月のリデザインが、人々の注目を集めるきっかけとなりました。インターフェイスはより洗練され、出力はより鮮明になり、プロトタイプのような感じではなく、実際のワークフローで使用できるものになりました。

“Vibe Design”ツール

Stitchが他のAIデザインツールと異なる点は、”Vibe Design”ツールであることです。つまり、技術的な仕様（例：12カラムグリッド、16pxのガター）を追加するのではなく、デザインの”雰囲気”を説明します。

例えば、”瞑想アプリのための落ち着き払った、信頼できるオンボーディングスクリーン”などです。Stitchはその意図を解釈し、実際のUIデザインに変換します。

ブラウザベース

最後に、インストール不要であることが本当に感謝しています。ブラウザでstitch.withgoogle.comにアクセスするだけで、設定やアカウント作成の手間はありません。ブラウザで動作します。

最新のGemini Proを使用しているにもかかわらず、ブラウザで動作することは、かなり印象的な機能です。

これがStitchの起源ストーリーです。アクセスしやすいツールであり、多くの人にとってUIデザインの考え方を変えるでしょう。

Stitchは誰に適していますか?

ここでは、Google Stitchが最も適している人を紹介します：

• インディーメーカーは、Stitchを使用してアプリのアイデアをフローとコードに変換できます（テクニカルな知識は不要です）。
• フロントエンドチームは、Stitchを使用してデザイン要素のさまざまなバージョンを自動的に生成し、プロジェクトをTailwindとJSXにエクスポートできます。
• プロダクトリードは、Stitchを使用してデザインのバリエーションを作成し、クライアントの目標に迅速に合うことができます。
• 非テクニカルな創設者は、Stitchの”Vibe Design”と音声コマンドを使用して、アプリを声で説明することで存在させることができます。
• エージェンシーは、Stitchを使用して無限のキャンバス上で複数のデザイン方向を探索し、クライアントとのミーティング中にリアルタイムでアイテレーションを行うことができます。

Stitchの主要機能

ここでは、Stitchの主要機能を紹介します：

• テキストプロンプトでアプリやウェブサイトのデザインを作成します。Stitchはすべてを生成します：複数のスクリーン、レイアウト、コンポーネント、色、タイポグラフィー。
• “Live Mode”を使用して、デバイスのマイクを通じてAIと会話し、アプリやウェブサイトのデザインを生成します。会話を続けることで、デザインを瞬時に変更できます。
• スケッチやスクリーンショットをアップロードして、編集可能なUIアプリやウェブサイトに変換します。
• スクリーンのバリアントを作成し、オリジナルを失うことなく比較します。複数のスクリーンに同時に変更を適用して、フローを一貫性を持たせます。
• 直接編集で色やテキストを簡単に編集し、プロンプトでさらに微調整します。
• デザインをFigmaにエクスポートします（レイヤー、コンポーネント、レイアウトが保持されます）
• プロジェクトをHTML/CSSまたはJSX/Tailwindとしてエクスポートし、開発者に渡したり、フロントエンドのワークフローで直接使用したりします。
• コマンドライン（CLI）からStitchを実行し、ビルドプロセスに含めます。
• 最新のGemini 3 Flashを使用して、高品質のデザインをHTMLとGemini 3.1 Proで生成します（最大の品質と推論を優先します）
• 画像を参考としてアップロードし、AIが生成するデザインのスタイル、レイアウト、または特定の要素に合わせます。

Stitchの使い方

ここでは、Google Stitchを使用して、旅行のパッキングチェックリストアプリのUIデザインを作成する方法を紹介します：

1. Stitchにサインアップする
2. プロンプトを追加する
3. 設定を調整する
4. Live Modeを試す
5. AIに何を作るか伝える
6. アプリ/ウェブサイトを生成する
7. プロンプトで編集する
8. 手動で編集する
9. プレビュー、エクスポート、共有する

ステップ1：Stitchにサインアップする

最初に、stitch.withgoogle.comにアクセスし、「今すぐ試す」を選択しました。

サインアップのハードルを超えずに、Stitch AIジェネレーターに移動しました。

左側には私のプロジェクトと共有されたプロジェクトがあり、中央にはジェネレーターがありました。ここで、スケッチやスクリーンショットをアップロードして、アプリやウェブサイトを生成することができます。

ステップ2：プロンプトを追加する

ジェネレーターの上部には、例プロンプトがありました：

• 天候や旅行の種類に基づいて何をパックするかを提案する旅行のパッキングチェックリストアプリ。
• モバイルアプリのロマンスとデートのアイデアのためのブラウズタブ。
• プログレスバー付きの言語学習アプリのクイズページ。タイトルは、スペイン語の単語を正しい答えと一致させることを挑戦します。4つの選択肢があります。

これらのオプションのいずれかを選択するか、独自のプロンプトを入力することができます。

Stitchが提供する例プロンプトは安全な選択肢ですが、明確な構造を持つもので、AIがうまく処理します。しかし、私はStitchがもっと面白いものを作成できるかどうかを見てみたかったです。

より具体的なプロンプトを追加しました：

「ロンドンへの3日間のビジネストリップの旅行のパッキングチェックリストアプリ。UIはプロフェッショナルで高級感があり、’Carry-on Only’のトグルと天候ウィジェットが含まれるべきです。’Tech & Electronics’のセクションを含め、色パレットは深いネイビーとソフトグレーを使用します。」

ステップ3：設定を調整する

下部には、以下の設定がありました：

• スクリーンショット、スケッチ、またはビジュアルインスピレーションを添付する
• デザインの種類（アプリまたはウェブサイト）を選択する
• デザインシステム（Bauhaus、Neon Tokyo、Candyなど）を選択する
• モデル（3 Flash、3.1 Pro、Nano Banana Pro、またはIdeate）を選択する

スクリーンショットやスケッチをアップロードする必要はありませんが、デザインの種類を「アプリ」に設定しました。デザインシステムとして「Silk」を選択し、最新のモデル（3.1 Pro）を選択しました（3.0よりも時間がかかりますが、デザインの品質は最高です）。

ステップ4：Live Modeを試す

しかし、「生成」をクリックする前に、「Live Mode」というボタンが目につきました。

ステップ5：AIに何を作るか伝える

実は、デバイスのマイクを通じてAIに何を作るかを伝えることができます。かなり面白い機能です。

これは、AIと会話するようなプロセスです。AIは質問をして、提案をして、リアルタイムにアイテレーションを行います。伝統的なツールとは異なる、コラボレーションのような感じでした。

AIに次のプロンプトを伝えました：

「ロンドンへの3日間のビジネストリップの旅行のパッキングチェックリストアプリ。UIはプロフェッショナルで高級感があり、’Carry-on Only’のトグルと天候ウィジェットが含まれるべきです。’Tech & Electronics’のセクションを含め、色パレットは深いネイビーとソフトグレーを使用します。」

ステップ6：アプリ/ウェブサイトを生成する

数分後、AIはスタイルガイドと4つのスクリーン（アイテムの追加、パッキングチェックリスト、天候と提案、旅行の概要）を生成しました。

Stitchが生成したものは、驚くほど正確でした。ロンドンに関する具体的な情報や、「Carry-On」トグルや天候ウィジェットなどの詳細が含まれていました。プロンプトを入力する必要はなく、AIに何を作るかを伝えるだけでした！

ステップ7：プロンプトで編集する

下部には、空のプロンプトフィールドがありました。ここで、AIに変更を依頼することができます（例：「Tech」セクションにさらにアイテムを追加する」または「ネイビーの色をチャコールグレーに変更する」）

数秒後、Stitchはネイビーではなくグレーを使用する新しいスクリーンを生成しました。同じロケーションを保持しつつ、イベントを「Private Client Dinner at Searcys」に変更し、メニューの表示ボタンと「リマインダー」トグルを追加しました。

ステップ8：手動で編集する

右側には、以下の手動ツールがありました：

• 選択（V）：スクリーンをクリックしてAIで編集するか、編集（E）をクリックして特定の編集を行う
• マーク（M）：特定のエリアをボックスで囲み、テキストボックスが表示され、AIに変更を依頼する
• 直接編集（E）：特定の要素をクリックして編集する
• パン（H）：クリックしてドラッグしてキャンバスを移動する
• ファイルをキャンバスにアップロードする：写真を参考としてAIに使用させる
• デザインシステム：使用されている色パレットを表示する
• お気に入り：好きなスクリーンをスターでマークしてコレクションを作成する

マークツールを試してみたかったので、キーボードの「M」キーを押して、カードをボックスで囲みました。

次のプロンプトをAIに伝えました：

「このイベントカードを「パーソナライズされたイテナリーウィジェット」に変えてください。バービカンセンターのロケーションを保持しつつ、イベントを「Searcysでのプライベートクライアントディナー」に変更してください。メニューの表示ボタンと「リマインダー」トグルを追加してください（現在はONに切り替えています）」

数秒後、Stitchは同じ要素を持つ新しいスクリーンを生成しました。同じロケーションを保持しつつ、イベントを「Searcysでのプライベートクライアントディナー」に変更し、メニューの表示ボタンと「リマインダー」トグルを追加しました。

ステップ9：プレビュー、エクスポート、共有する

すべてに満足したので、右上に移動しました。インスタントプロトタイプ、エクスポート、共有するためのオプションが多数ありました。

インスタントプロトタイプ（再生ボタン）オプションはかなり面白い機能でした。モバイルやタブレットのフォーマットで表示できるプロトタイプを生成しました。すべてのスクリーンが接続され、操作可能でした。さらにスクリーンを追加、編集、接続することもできました。

プレビューをクリックして編集することは、非常に簡単でした。複数のビューを切り替えたり、ツールを切り替えたりする必要はなく、すべてがコンテキスト内で更新されます。最終的な製品がどのように機能するか、どのように見えるかをより明確に理解することができました。

エクスポートオプションも確認しました。Figma、Jules、.zipなど、選択肢は多数ありました。

全体的に、Google Stitchはデザインプロセスを非常に簡単に感じさせてくれました。ツールの使い方よりも、ビルドに集中できるようになりました。

「Live Mode」は、最も印象的な機能でした。プロセスがインタラクティブになり、実際のアシスタントと一緒に作業しているような感じでした。

トップ3のStitch代替ツール

ここでは、Google Stitchのベストな代替ツールを紹介します：

Base44

Google Stitchの最初の代替ツールは、Base44です。アプリやウェブサイトを素早く生成することができます。コードやセットアップは不要です。

ユーザー認証、データストレージ、パーミッションが組み込まれているため、バックエンドの機能がすぐに利用できます。つまり、実際のログイン機能を持つダッシュボードを、1行のコードも書かずに作成できます。

両方のツールは、UIを素早く生成することができます。非開発者が何かを素早くプロトタイプ化しようとしている場合、どちらも役立ちます。しかし、ここで道が分かれます。

Stitchは、デザインツールとしての側面が強いです。UIレイアウトを生成すること、AIを使用したリアルタイムの変更、Figmaまたはクリーンなコードへのエクスポートに優れています。

一方、Base44は、より汎用的なツールです。管理ダッシュボード、オンラインストア、ランディングページなどの作成に適しています。説明して、バックエンドを含めて構築します。

フルアプリを素早く構築し、バックエンドを含めて作成する必要がある場合は、Base44を選択してください。クリーンなUIとFigmaエクスポート、コードエクスポートのためのAIデザイン変更が必要な場合は、Google Stitchを選択してください。

Base44のレビューを読むか、Base44を訪れてください。

Softr

Google Stitchの次の代替ツールは、Softrです。特にビジネス向けに何かを作成している場合は、こちらが適しています。

Softrを使用すると、コードを書かずに、カスタムAIアプリ、ダッシュボード、クライアントポータルを作成できます。組み込みデータベースとセキュアなログインが利用可能です。Airtable、Google Sheets、HubSpotなどのツールとの接続もあります。

SoftrとGoogle Stitchの両方は、ノーコードです。開発のバックグラウンドがない人でも使えるようになっています。しかし、ここで類似点はほとんど終わります。

一方で、Stitchはデザイン第一のツールです。美しいUIスクリーンをAIの支援で生成し、Figmaまたはコードにエクスポートします。データを管理したり、自動化されたワークフローを管理したりすることはありません。

一方、Softrは、データがすでにどこかに存在しているという考え方に基づいています。ビジネスワークフロー、データインターフェイス、正しい人に正しい情報へのアクセスを提供することに重点を置いています。

どちらを選択するかは、次のとおりです。クライアントポータルやログイン、データへのアクセスが必要な場合は、Softrを選択してください。アプリスクリーンをデザインし、開発者にエクスポートする場合は、Stitchを選択してください。Stitchはアプリの見た目をデザインするものですが、Softrはアプリの動作を構築するものです。

Softrのレビューを読むか、Softrを訪れてください。

Draftbit

Google Stitchの最後の代替ツールは、Draftbitです。モバイルアプリとウェブアプリを設計、構築、公開するためのローコードビルダーです。コードの完全なエクスポートとインスタントアプリストアの公開が可能です。

両方のプラットフォームは、コードを書かずにアプリインターフェイスを素早く生成するのに役立ちます。開発を速めるのに適しています。

しかし、Draftbitは、より深い開発機能で際立っています。ロジックを追加したり、APIを接続したり、リアルタイムで共同作業したり、コードをエクスポートしたり（プラットフォームロックインなし）できます。アプリを公開するために構築されていますが、Google Stitchは、AIを使用したUIデザインの生成と改良、Figmaおよびコードへのエクスポートに重点を置いています。

モバイルアプリを機能付きで構築して公開する場合、コードの所有権を保持する場合は、Draftbitを選択してください。AIを使用したUIデザインの高速生成と改良、Figmaおよびコードへのエクスポートが必要な場合は、Google Stitchを選択してください。

Draftbitのレビューを読むか、Draftbitを訪れてください。

Stitchレビュー：あなたに合ったツールですか？

Google Stitchを試した後、自信を持って言えるのは、伝統的なデザインツールとは感じられないということです。会話をしているような感じがします。誰かがあなたが何を作ろうとしているかを理解しているようです。

アイデアを話し、スクリーンが数分で生成され、すぐにプレビューしてフローを確認することができるのは、他にない経験です。特に、アイデアが頻繁に変わる初期の段階で、スピードと即時性の組み合わせは、他にないものです。

しかし、Stitchは完璧ではありません。バックエンドロジック、自動化されたワークフロー、または完全なアプリの機能が必要な場合は、すぐに限界を感じるでしょう。

その場合は、これらの代替ツールのいずれかを試してみてください：

• Base44は、アプリを素早く構築するためのバックエンド（ログイン、データストレージなど）に最適です。
• Softrは、ビジネスツール、クライアントポータル、既存のデータを基に構築されたアプリに最適です。
• Draftbitは、モバイルアプリを構築して公開するための完全なコントロールとコード所有に最適です。

しかし、ここでStitchが優れている点は、アイデアを素早くプレゼンテーション可能なものに変えることができることです。初期のコンセプト、クライアントへのピッチ、または頭の中のアイデアをスクリーン上に表現するには、Stitchより優れたツールは見つけてません。

このGoogle Stitchレビューを読んでくれてありがとう。役に立ったと思います。 無料で試してみて、どう感じるかを見てみましょう。

よくある質問

Google Stitchは完全に無料ですか？

はい、Google Stitchは無料です。テキストまたはスケッチからUIデザインを生成し、音声キャンバス、プロトタイプ、コードエクスポートが可能です。

Google Stitchの用途は何ですか？

Google Stitchは、Google Labsから提供されるAIツールで、テキストまたは画像からUIデザインとインタラクティブなプロトタイプを素早く生成することができます。