要点
- 今回の Stitch は、プロンプトから画面を作るだけでなく、会話しながら直したり、ルールを渡して精度を上げたりできる方向へ進んだ。
- DESIGN.md は、AI にデザインの判断基準を伝えるためのドキュメントだと考えると分かりやすい。
- 海外では「プロのデザイナーと一緒に作っている感じ」や Live 機能が話題になり、日本語圏では DESIGN.md の意味を読み解く投稿が伸びていた。
- 初学者目線では、まずは「何ができるのか」をつかみ、その次に DESIGN.md や SDK の意味を押さえる順番が理解しやすい。
導入
Google Stitch はもともと、自然言語から UI を作れるツールとして知られていた。今回のアップデートでは、その体験がさらに広がり、「作る」「直す」「ルールを渡す」をまとめて回せる方向へ進んでいる。
特に分かりにくいが重要なのが DESIGN.md だ。これは難しい新機能というより、「AI にデザインの方針を伝えるためのメモや仕様書」に近い。
この記事では、まず反応の大きかったポストで全体像をつかみ、その後に DESIGN.md や Live などの意味をやさしく整理していく。
公式が DESIGN.md を大型アップデートの中核として明示
Meet the new Stitch, your vibe design partner. Here are 5 major upgrades to help you create, iterate and collaborate: 🎨 AI-Native Canvas 🧠 Smarter Design Agent 🎙️ Voice ⚡️ Instant Prototypes 📐 Design Systems and DESIGN.md Rolling out now. Details and product walkthrough video in 🧵
3秒要約
新しい Stitch は「vibe design partner」として紹介されている。
日本語訳
新しい Stitch は「vibe design partner」として紹介されている。 作成、反復、コラボレーションを支える 5 つの主要アップデートとして、 AI-Native Canvas、より賢い Design Agent、Voice、Instant Prototypes、 そして Design Systems と DESIGN.md が挙げられている。 これらは現在ロールアウト中で、詳細と製品ウォークスルー動画はスレッドで案内されている。
初心者向け補足
ここで重要なのは、DESIGN.md が単独の補助機能ではなく、Design Systems と並列に語られている点だ。
公式は DESIGN.md を「出力物の後処理」ではなく、デザインシステム運用の一部として置いている。つまり、見た目の再現よりも判断基準の共有に重心がある。
実務で見るポイント
- まず見るべき一次情報。
- 社内運用では DESIGN.md を単独導入せず、Design Systems とセットで設計するのが自然。
アップデート前日の予告だけでも大きな期待値が確認できる
Tomorrow, we’re introducing you to your new vibe design partner. 🤝 Our biggest update ever drops tomorrow. 👀👇 https://t.co/lqp7zkb0O3
3秒要約
明日、新しい「vibe design partner」を紹介する。
日本語訳
明日、新しい「vibe design partner」を紹介する。 Stitch にとって過去最大のアップデートが翌日に公開される、という予告。
初心者向け補足
予告段階でこれだけ反応が大きいことからも、Stitch が単なる小さな改善ではなく、設計思想ごと切り替える節目として受け止められていたことが分かる。
大型アップデート全体の中で DESIGN.md が入ってきた点は、今後の主戦場が生成品質から運用品質に移る兆候でもある。
Direct Edits は生成後の最終調整を Stitch 内で閉じる
One of our most requested features is here! ✍️✨ Introducing Direct Edits. Vibe Design is incredible for exploring ideas at lightspeed, but sometimes you just need to fix a typo or swap an image. Now, you can add that final layer of polish right inside Stitch. You can manually edit text and images, or highlight a specific part of the screen and ask the agent to surgically update it. 3 ways to jump in: 1️⃣ Select a screen and hit the Edit dropdown. 2️⃣ Grab the Edit Tool from the global toolbar. 3️⃣ Select Tool: Double-click a screen to center it, then double-click again to enter Direct Edit mode. Go perfect those vibes. ✨
3秒要約
要望の多かった機能として Direct Edits が追加された。
日本語訳
要望の多かった機能として Direct Edits が追加された。 Vibe Design は高速なアイデア探索に向いている一方で、誤字修正や画像差し替えのような細かな調整が必要になる場面がある。 そこで Stitch の中で、その最後の磨き込みを直接できるようにしたという説明。 テキストや画像を手動で編集できるだけでなく、画面の特定部分を選択してエージェントに局所的な修正を依頼することもできる。 使い始める方法として、Edit ドロップダウン、グローバルツールバーの Edit Tool、ダブルクリックでの Direct Edit モード突入の 3 パターンが案内されている。
初心者向け補足
洗練運用では、AI に全部任せるのではなく、最後に人間が調整できる余地をどこに持つかが重要になる。
DESIGN.md がルールの明文化なら、Direct Edits は現場の微修正レイヤーであり、両方が揃って初めて継続運用しやすい。
Stitch SDK は人間とエージェントの両方に向けて設計されている
It’s a big week for Stitch!🚀 We’re so excited to show you what we’ve been building, starting today with the official Stitch TypeScript SDK. npm i @google/stitch-sdk We designed our SDK for both humans and their agents to drive Stitch designs. Call stitch from your code with simple methods like stitch.createProject() and screen.edit(). Use an agent-centric API stitch.listTools(), stitch.callTool("create_project", { }) and an AI SDK adapter for agentic workflows. Live on GitHub and npm. Works seamlessly with Node.js and Bun. Links in 🧵. Happy building! 🛠️
3秒要約
Stitch にとって大きな週の始まりとして、まず公式の TypeScript SDK が公開された。
日本語訳
Stitch にとって大きな週の始まりとして、まず公式の TypeScript SDK が公開された。 `npm i @google/stitch-sdk` で導入でき、人間だけでなくエージェントが Stitch のデザインを駆動することも前提に設計されている。 `stitch.createProject()` や `screen.edit()` のようなシンプルなメソッドから呼び出せるほか、 `stitch.listTools()` や `stitch.callTool("create_project", {})` のようなエージェント向け API、 AI SDK アダプターも用意されている。 GitHub と npm で公開されており、Node.js と Bun で利用できる。
初心者向け補足
ここは運用設計の要点で、DESIGN.md を人間向け資料として終わらせず、SDK や MCP を通じて自動化の入力にできる。
つまり Stitch は GUI 操作だけでなく、ルールと命令の両方を扱うプログラマブルなデザイン環境へ寄っている。
大規模なデザインシステムと厳格なルールを扱う方向性が示された
Gemini 3.1 Pro has come to Stitch! ✨ When you need the ultimate in reasoning, quality, and attention to detail, 3.1 Pro is for you. What does this mean for your Vibe Design workflow? 🧠 Deep Context: It easily juggles massive design systems and strict design rules without forgetting the details. 🏗️ Complex Architecture: Perfect for generating intricate dashboards, dense data tables, and multi-step forms. 📐 Pixel Precision: Superior spatial reasoning means cleaner CSS and tighter adherence to your brand guidelines. When the vibe needs to be exact, bring in the heavy hitter. Available now in the agent dropdown.
3秒要約
Gemini 3.1 Pro が Stitch で使えるようになった。
日本語訳
Gemini 3.1 Pro が Stitch で使えるようになった。 より強い推論力、品質、細部への注意が必要なときに向くモデルとして紹介されている。 Vibe Design ワークフローへの影響として、 大規模なデザインシステムや厳格なデザインルールを細部を落とさず扱える Deep Context、 複雑なダッシュボードや高密度テーブル、複数ステップのフォームに向く Complex Architecture、 ブランドガイドラインへの忠実さを高める Pixel Precision が挙げられている。 正確さが必要な場面では、この強いモデルを agent dropdown から選べるという内容。
初心者向け補足
DESIGN.md が効く前提には、ルールを保持して参照し続けるモデル側の能力が必要だ。
この投稿は、単にモデルが強くなった話ではなく、設計ルールを実際の生成ワークフローに組み込めるだけのコンテキスト処理能力が整ってきたことを示している。
開発メンバーが DESIGN.md の位置づけを端的に説明
New in the Stitch Vibe Design launch: DESIGN.md Design consistency specified. Stitch generates design systems and a markdown specification you can export. https://t.co/fBIjYE4bQz https://t.co/TQgmg2PFub
3秒要約
Stitch の Vibe Design ローンチで追加された新要素として DESIGN.md が紹介されている。
日本語訳
Stitch の Vibe Design ローンチで追加された新要素として DESIGN.md が紹介されている。 要点は「デザインの一貫性を仕様として記述すること」。 Stitch はデザインシステムと、エクスポート可能な Markdown の仕様書を生成できる、という説明。
初心者向け補足
この説明は非常に本質的で、DESIGN.md を「見た目の説明文」ではなく「consistency specified」、つまり一貫性を記述した仕様として置いている。
実務ではブランドトーン、余白ルール、CTA の使い分け、避けるべき表現をここに持たせる運用が考えやすい。
実践者は design.md を制御性と精度の向上として受け止めている
Lots of fun packed into today's Stitch update. One of my favorites is design.md. It gives me some more control and precision. https://t.co/QDV8QH4sEq
3秒要約
今日の Stitch アップデートには楽しい要素がたくさんあるが、 その中でも特に気に入っているのが design.md だという感想。
日本語訳
今日の Stitch アップデートには楽しい要素がたくさんあるが、 その中でも特に気に入っているのが design.md だという感想。 design.md によって、より高い制御性と精度が得られるとしている。
初心者向け補足
実務者視点では、DESIGN.md の価値は派手さではなくコントロール性にある。
生成 AI を実プロダクトに入れるときに一番効くのはこの「ズレを減らす」効果であり、likes はそこまで大きくなくても示唆は濃い。
Stitch を受け身のエージェントではなくデザインパートナーとして見る視点
I've been using Stitch Live Mode and it's a step toward something bigger: not an agent that waits for instructions, but a design partner that pushes back, asks better questions, and helps you see the work more clearly. https://t.co/7WiAA0Kf14
3秒要約
Stitch の Live Mode を使っていて感じるのは、 これはもっと大きな方向への一歩だということ。
日本語訳
Stitch の Live Mode を使っていて感じるのは、 これはもっと大きな方向への一歩だということ。 それは、指示を待つだけのエージェントではなく、 必要に応じて異議を唱え、より良い問いを返し、 仕事の輪郭をもっと明確に見せてくれるデザインパートナーへの進化だ、という見方。
初心者向け補足
洗練された運用にしたいなら、Stitch を「プロンプトを投げて画面を返す箱」として扱わない方がよい。
DESIGN.md も完成したルールブックではなく、会話の土台として更新されるべきドキュメントと見る方が運用しやすい。
日本語圏で最も構造的に刺さる指摘は「見た目と判断基準の分離」
Google Stitchについての記事を速報的に書きました。この記事で一番伝えたかったのは「デザインファイルが保持するのは見た目であって判断基準ではない」という構造的な制約の話。 Figma MCPでコンポーネントは渡せる。でも「このコンポーネントはこの文脈では使わない」というDo's and Don'tsは渡せない。DESIGN.mdはその溝をプレーンテキストで埋める試みとして面白い。 フォーマットが標準化されるかはまだわからないけど、「エージェントに渡すとしたら何を伝えるか」を言語化する行為自体に価値がある。
3秒要約
デザインファイルが保持するのは見た目であって判断基準ではない。Figma MCP でコンポーネントは渡せても、Do's and Don'ts は別で必要になる。
初心者向け補足
これは DESIGN.md の必要性を最も明確に言語化したポストと言ってよい。
コンポーネント参照だけでは AI は「使えるもの」を知るだけで、「使うべきでない場面」を学べない。だから Markdown で判断基準を外出しする必要がある。
日本語でアップデート全体像を把握する入口として有用
Google Stitchが「vibe design」を掲げてAIネイティブなデザインキャンバスに進化したので、今回のアップデート内容を整理する。 5つの主要アップデート👉 1️⃣ AI-Native Canvas → 無限キャンバス化。画像・テキスト・コードをコンテキストとして直接持ち込める 2️⃣ Design Agent + Agent Manager → プロジェクト全体を横断的に推論。複数方向の探索を並行管理 3️⃣ Voice → キャンバスに音声で直接指示。デザイン批評やリアルタイム編集が会話で完結 4️⃣ Instant Prototypes → 静的デザインから即座にインタラクティブプロトタイプ生成。次画面の自動提案も 5️⃣ Design Systems + DESIGN.md → デザインシステムをエージェント向けマークダウンとしてSSoT化 個人的に構造が見えたのはDESIGN.mdの位置づけ。 ドキュメントでREADME.md（人間向け）、AGENTS.md（コーディングエージェント向け）と並べて、DESIGN.md（デザインエージェント向け）を定義している。表面は人間が読めるmarkdown、裏側ではstructured tokensとして保持する二層構造。 作り方も3パターン：エージェント生成、既存URL・ブランド画像からの抽出、そして手書き。 Figma MCP、Coinbase CDS MCP、UbieのClaude Code Skillsなど「デザインシステムをエージェントに渡す」各社のアプローチと比較すると、Googleの解は「.mdファイル1枚」という割り切り。設計思想の違いが面白い。
3秒要約
Google Stitch が vibe design を掲げて AI ネイティブなデザインキャンバスに進化したので、今回のアップデート内容を整理する。
初心者向け補足
全体像の整理がされているため、チーム内の共有資料として使いやすい。
DESIGN.md 単体の理解だけではなく、どの機能群の中に置かれているのかを把握するのに向く。
早期アクセス勢は「プロのデザイナーと組んでいる感覚」と表現した
Vibe design is here ✨ I got early access to Stitch from @GoogleDeepMind and was blown away - it's like partnering with a pro designer. Start with a simple prompt for a mobile or Web UI and iterate through to a clickable prototype (and code!). Watch me make "Finn's Fudge" 👇 https://t.co/l3oUaR5Se3
3秒要約
早期アクセスで触れた実践者は、Stitch を「プロのデザイナーと組んでいるような体験」と表現した。
日本語訳
vibe design が来た。 Google DeepMind から Stitch の早期アクセスをもらって触ってみたが、 まるでプロのデザイナーと一緒に作業しているようだった。 モバイルや Web UI のシンプルなプロンプトから始めて、 クリック可能なプロトタイプとコードまで反復できる。 「Finn's Fudge」を作る様子を見てほしい、という投稿。
初心者向け補足
海外の初期反応では、出力の豪華さより「一緒に作ってくれる感じ」がよく語られていた。
デモ映えしやすい投稿でありつつ、プロトタイプまで一気通貫で持っていける点がバズの理由になっている。
実務で見るポイント
- デザインレビューより前に、試作品を見せる営業や社内共有に向く。
- 画像や動画付きの実演は理解コストを大きく下げる。
Josh Woodward は Live を「今日の本命機能」として挙げた
Huge Stitch update today! My favorite new feature: Stitch Live You can now click and *talk* to your designs ("change this screen") or use Stitch as a sounding board for real-time design critiques, and it gets to work on your changes.
3秒要約
Josh Woodward は今回の大きなアップデートの中で、特に Stitch Live を推していた。
日本語訳
今日は Stitch の大きなアップデート日。 その中で自分のお気に入り機能は Stitch Live だという。 画面をクリックして「この画面を変えて」と話しかけたり、 リアルタイムのデザイン批評の壁打ち相手として使ったりでき、 そのまま変更作業に入ってくれると説明している。
初心者向け補足
米国圏での反応を見ると、Live は「音声入力」よりも「その場でデザイン批評が回る」ことに価値が置かれている。
これはデザインチームの運用に入れるときに効く視点で、単独作業の高速化だけでなく共同思考の補助として使える。
反応の強い続報では「生成して終わりではなく、ワークフローに居続ける」が語られた
One thing we saw early with Stitch: people would generate a design, then leave. This seems common with a lot of “vibe” tools. With design.md, the SDK, and MCP, Stitch behaves less like a tool you visit and more like something that stays in your workflow. A collaborator, not a destination.
3秒要約
Stitch は design.md、SDK、MCP によって、訪れて終わるツールではなくワークフローに居続ける協働相手へ近づく。
日本語訳
Stitch で早い段階から見えていたのは、 デザインを生成したらそのまま離脱してしまう人が多いということ。 これは多くの「vibe」系ツールに共通する傾向でもある。 ただ、design.md、SDK、MCP が入ることで、 Stitch は「必要なときだけ訪れるツール」ではなく、 ワークフローに居続ける存在に近づく。 行き先ではなく、協働相手になる、という見方。
初心者向け補足
ここは運用上かなり重要で、バズの中でも最も実務に近い感想の一つ。
単発生成の体験を超えて日常の設計・更新フローに残れるかどうかが、Stitch の勝負どころだと分かる。
Demis Hassabis の短い後押しだけでも 20 万超の表示が付いた
You can vibe design some incredible interfaces with @stitchbygoogle
3秒要約
Demis Hassabis は、Stitch で素晴らしいインターフェースを vibe design できると短く言及した。
日本語訳
@stitchbygoogle を使えば、驚くようなインターフェースを vibe design できる。
初心者向け補足
内容自体は短いが、誰が言っているかによる波及が非常に大きい。
海外での初期認知拡大には、こうした短い endorsement が効いている。
「Designers cooked?」という煽り口でも反応が伸びた
Are designers cooked? I tried Google's new Stitch product! (no, of course designers aren't cooked, but stitch is super cool) https://t.co/SzHjm1bTAx
3秒要約
Aaron Francis は軽い煽り文句を使いつつも、Stitch はかなり面白いと評価している。
日本語訳
デザイナーはもう終わりなのか？ Google の新しい Stitch を試してみた。 もちろんデザイナーが不要になるわけではないが、 Stitch はかなりクールだ、という投稿。
初心者向け補足
海外では、機能の深掘りだけでなく「職能がどう変わるか」という切り口で拡散している。
一般開発者や indie hacker 層にまで届くときは、この種の入口の方が強い。
設計思想の核として「Design systems are meant to be interoperable」と整理した声
Design systems are meant to be interoperable. That's what we enable with DESIGN.MD
3秒要約
DESIGN.md は、デザインシステムを相互運用可能にするためのレイヤーだという整理。
日本語訳
デザインシステムは、本来相互運用できるものであるべきだ。 DESIGN.md によって、そこを可能にしている、という主張。
初心者向け補足
これは単なる紹介文ではなく、DESIGN.md をどう位置づけるかの設計思想そのもの。
人間向けドキュメントではなく、異なるツールやエージェント間をまたぐための媒体と見ると腹落ちしやすい。
日本語圏では「意図から始まる設計」と DESIGN.md の関係を補足する投稿も出た
Stitchの「vibe design」アップデートについて、kuniさん（@ku_ni_29 ）が速報記事を書いている✨機能整理からデザイナーの価値論まで丁寧にまとまっている。 記事の要点に自分の視点を補足すると... ☑️ デザインの起点が「画面」から「意図」へ → ワイヤーフレームではなくビジネス目標やユーザー感情から始める設計 ☑️ Agent Managerで発散→収束を並行管理 → 「別案も試したかったけど手が足りなかった」制約の解消 ☑️ DESIGN.mdでデザインシステムをプレーンテキスト化 → README.md（人間向け）・AGENTS.md（コーディングエージェント向け）と並ぶ、デザインエージェント向けの.md ☑️ 音声でキャンバスに直接指示 → デザイン批評やリアルタイム編集が会話で完結 ☑️ 静的デザインから即座にインタラクティブプロトタイプ生成 記事にある「意思決定を構造化する人へ」という指摘が的確で、DESIGN.mdが求めているのはまさにデザインの判断基準を言語化できる力。Figma MCP、Coinbase CDS MCPなど各社が「デザインシステムをエージェントに渡す」問題に取り組む中で、Googleの解は「.mdファイル1枚」という割り切り。 設計思想の比較を含めて自分も記事にまとめます...！
3秒要約
日本語圏では、画面ではなく意図から始める設計と、DESIGN.md による判断基準の言語化が補足されていた。
初心者向け補足
公式発表だけだと分かりにくい「意図から始める設計」の読み替えが入っており、日本語圏での理解の深まりが見える。
運用に落とすときは、画面仕様より前に意思決定の基準を書く必要があるという示唆になる。
総評
初学者目線でまず押さえるなら、今回の Stitch は「画面を出して終わり」ではなく、「会話しながら直し、ルールを渡し、継続的に使う」方向へ進んだアップデートだった。
DESIGN.md は難しく見えるが、本質はシンプルで、「こういうときはこう作る」「これは使わない」といった判断基準を AI に渡すための文章だと考えるとよい。
使い始めるなら、最初は Live やプロトタイプ生成の分かりやすい機能から触り、慣れてきたら DESIGN.md で自分のルールを少しずつ渡す流れが現実的だ。
洗練された運用を目指すなら、最終的にはデザイン原則や Do's and Don'ts を Markdown で言語化し、Stitch に渡せる形へ整えていくのがよい。