Googleは、AIを使ってモバイルアプリやウェブアプリのユーザーインターフェース（UI）を生成できる「Stitch」をGoogle Labsで提供している。すこしずつ機能が改善され続けており、2025年10月16日には公開共有機能を追加したことを案内した。

この公開共有機能を使うことで、そのリンクを知っている人はログイン不要で閲覧できるようになる。その際、そのUIを生成したときのAIとの会話のやりとりも共有されるかたちになる（ただし読み取り専用⁠）⁠。なお、共有された際に、その画面左上のメニューボタンから「すべてダウンロード」を選択することで、HTMLファイルと画像ファイルをダウンロードできる。将来はリミックス可能なコラボレーション機能の提供を検討しているという。

Stitchは、モバイルアプリやウェブページのUIのアイデアやイメージを自然言語（プロンプト）で書くことで、AIが具体的なページのデザインとそのコードを生成するツール。Google Labs製品ということもあり、無料で提供されている（毎月の使用上限が設定されている⁠）⁠。

またStitchで作成したデザインはHTMLファイルと画像ファイルとしてダウンロードできる。もし「標準モード」でデザインを作成していれば、Stitch上からFigmaにデザインをコピーすることもできる（ただしデフォルトは「試験運用モード」に設定されている⁠）⁠。

今回、公開共有機能が追加されたことで、Stitch上で作成したデザインを他の人に見せることが容易になり、フィードバックをもらったりしやすくなった。それにより、モバイルアプリやウェブアプリのプロトタイピングや、実際のプロダクト開発に向けたデザインの作成を素早く進められる。

Stitchの基本的な使い方を以下簡単に紹介する。

Stitchのトップページ右上にある「今すぐ試す」ボタンを押すと、Googleアカウントでログインできる。

ログインして最初に確認しておきたいのが、画面右上のアカウントアイコンのコンテキストメニューにある「Stitchの設定⁠」⁠。そのなかに「AIモデルのトレーニングを許可する」の設定があり、StitchにおけるAIとの会話や生成したコードをGoogleがAIモデルのトレーニングに使用することを許可／不許可を選択できる。デフォルトでは許可になっているので、それで問題がある場合には調整する必要がある。Stitchのプライバシーポリシーも参照のこと。

ログイン後のStitchの画面（ダッシュボード）の左側にはサンプルデザインと作成したデザインが並び、右側にはプロンプトの入力画面が表示される。プロンプトの処理はデフォルトで、Gemini 2.5 Proを利用できる「試験運用モード」が設定されている。試験運用モードは「標準モード」で可能なFigmaへのコピーができないが、より忠実度が高いデザイン生成が可能となっている。なお、標準モードは月350回、試験運用モードでは月200回までの使用上限が設定されており、その月の使用量は前述した設定画面で確認できる。

ダッシュボード左側のサンプルデザインはStitch公式の参考デザインがいくつか並んでいて、読み取り専用モードで開くことができる。UIを生成した際のチャットのやり取りも確認できる。

実際に始めるにはダッシュボード画面右側のプロンプト入力欄において「モバイル」または「ウェブ」のいずれかを選び、必要あれば参考用の画像をアップして、プロンプトを書いて始めるかたちとなる。

なお、複数のページ（たとえばアプリの画面遷移ごとのページ）のデザインを一度に作成することも可能になっている。生成後は、全体のフローをわかりやすくするために、作成されたページの順番を入れ替えたり、自由に配置したりできる。

一度ダッシュボードでプロンプトを入力すると、そのデザイン（プロジェクト）の画面となる。その際、自動的にそのプロジェクトの名前が付けられる（プロジェクト名はいつでも変更可能⁠）⁠。

画面左側にはチャットの履歴と、改善を継続したい場合の入力欄が表示される。画面右側は「キャンバス」と呼ばれる、生成されたページのデザインが表示されるエリアとなっている。

生成されたページには名前が自動的に付けられて、そのページ上部に小さく表示される。この名前部分をダブルクリックすることで名前を変更できる。

生成されたページのデザインをプロンプトを使って改善したい場合には、キャンバスにあるページを選択してから書くことで、そのデザインも添付できる（デザインを生成した直後は、そのページのデザインが自動選択されるため、チャットのみで進める場合には特に意識することなく生成したデザインが毎回添付される⁠）⁠。

また、Shiftキーまたは範囲選択で複数画面を同時に選択してからプロンプトを入力することで、一括で複数の画面を改善することも可能になっている。

再生成されるデザインは、キャンバスに新しいページとして追加・表示される。そのため古いデザインと新しいデザインを比較しながら、さらに改善を重ねていくことができる。なお各ページは、ドラッグして移動させることが可能であり、また複数選択して位置を合わせることも可能になっている。

キャンバス上で生成されたページデザインを選択すると以下のメニューが表示され、いくつかの機能が使える。

「アノテーションを付けて編集（プレビュー🍌⁠）⁠」を選択すると、ページ上の領域を指定してNano Banana（Gemini 2.5 Flash Image）を使ったプロンプトを書ける編集画面が表示される。ここでは画面下部の中央にある矩形ボタンを選択して、領域を指定して変更したい事柄を記述する（画面下部の右側の描画ボタンを選択して、自由に赤線で描画することもできる⁠）⁠。ひととおり変更したい点を記述したら、画面上部にある「適用」ボタンを押すことで、この要求が実行される（Nano Bananaを使うので、ページ内のイメージ画像の調整も可能ではある⁠）⁠。

「テーマを調整」を選択すると、画面右側に、デザイン（ライト／ダーク⁠）⁠、色、角丸の半径、フォントを調整できるパネルが表示される。このパネルの選択を変更してパネル下部にある「テーマを変更」ボタンを押すと、その変更を適用したデザインに修正されたものが生成される。なお複数ページを選択してからテーマを調整することで、選択したページ全体にテーマの修正を適用できる。

「パターンを作成」を選択すると、変更したいデザインの方向性をプロンプトとして書くための入力ボックスが表示されるので、必要あれば記述する。その隣にある生成ボタンを押すことで、現在選択しているページデザインの派生デザインが複数生成される。なお、プロンプトを書かずにを空白のままに生成すると、そのページを完全に再生成できる。

なお生成されたページは、マウスを使ってページの横幅を狭くすることでレスポンシブデザイン（画面幅に合ったデザイン）が適用されて表示される。メニューからコンピューターアイコンのボタンを押して「View Mobile width」「⁠View Desktop width」を選択すると、それぞれモバイル幅とデスクトップ幅にリサイズすることも可能だ。なおページはコピー＆貼り付けを使って複製できる。

共有ボタンを押すと、そのページのHTMLコードや画像ファイルをダウンロードできる。標準モードだと「Figmaへのコピー」も表示される。

ページは単一のHTMLファイルとしてダウンロードされる。Tailwind CSSやGoogleフォントが利用されるようだ。

選択したページを一括してダウンロードすることもできる。また、そのデザインプロジェクトのページすべてをダウンロードすることも可能で、画面左上のメニューから「すべてダウンロード」を選択する。なおこのメニューから、ダッシュボードに戻ることもできる。