電車に乗っているとき、飲食店でメニューを開いたとき、銀行のATMを操作するとき——気づけば、目に入るUIを「なぜこう設計されているんだろう」という目で見ている自分がいる。
Google Stitch を使い始める前は、UIは「使えるか使えないか」という基準でしか見ていなかった。不便を感じたらダメなUIで、特に何も感じなければいいUI、くらいの解像度だった。
Stitch でUIを設計し、プロンプトを書き、生成結果を批評し、修正する——その繰り返しの中で、日常で目にするUIへの見方が変わっていった。「使えるか」ではなく「なぜこう作られているか」を考えるようになった。
それは仕事に役立つ変化だったが、同時に少し「呪い」のようにもなった。どこへ行ってもUIが目に入る。
結論から言うと——Google Stitch でUIを設計し続けることで、「UIを見る目」が鍛えられる。それはプロンプトを書くスキルより深い変化で、日常のあらゆる場所でUIを観察する習慣、そして「なぜそう設計されているか」を問う問いが自然に浮かぶようになることだ。
「使えるか」から「なぜこうなっているか」へ
Stitch を使い始めた最初の変化は、「このUIはなぜこのレイアウトなのか」という問いが自然に生まれるようになったことだ。
コンビニのセルフレジを見る目が変わった
コンビニのセルフレジは、ボタンの配置や操作フローが設計された結果だ。以前は「使いにくいな」と感じて終わっていたのが、今は「なぜこのボタンがここにあるのか」「なぜこの順番で画面が進むのか」を考えるようになった。
たとえばセルフレジの「袋は必要ですか?」という確認画面。ここに「はい」と「いいえ」ボタンがあるとき、どちらが押しやすい位置に置かれているか、どちらが大きく表示されているか——それだけで、店舗側の意図が読める。「いいえ(袋不要)」を推奨したければ大きく・目立つ位置に置く。「はい(袋あり)」を選ばれやすくしたければ右下(利き手側)に置く。
Stitch でボタン配置の影響を何度も体験しているから、この「配置の意図」が見えやすくなった。
スマホアプリのオンボーディングを観察する目
新しいアプリを入れるとき、以前はオンボーディングをできるだけ早くスキップしていた。今は「どういうフローで設計されているか」を確認するために、あえてスキップしないで全部見るようにしている。
観察するポイントは:
- 何ステップか、スキップはできるか
- 説明するのか体験させるのか
- アカウント作成をいつ求めるか
- パーミッション要求のタイミングと理由の伝え方
- 完了後のホーム画面がどんな「初期状態」か
Stitch でオンボーディングフローを自分で設計した後からは、他のアプリのオンボーディングを見るたびに「ああ、ここで体験させようとしているな」「パーミッション要求のタイミングが早すぎるな」という感想が自然に出てくる。
「良いUI」の基準が変わった
Stitch を使う前の「良いUI」の基準は、感情的なものだった。「かっこいい」「きれい」「使いやすい」。
Stitch で設計を繰り返す中で、基準が少し変わった。
「気づかないUI」が良いUIだとわかった
本当に良いUIは、ユーザーがUIを意識しない。
操作しているときに「あれ、どこを押せばいいんだろう」と思わせない。「次に何をするか」が自然にわかる。「なんかおかしいな」という引っかかりがない。そういうUIは、使っている最中は「存在しないも同然」だ。
Stitch でUIを設計しているとき、「生成されたUIを見て何も感じない(引っかかりがない)」という状態が、実はひとつの完成に近いことに気づいた。「きれいだな」とも「変だな」とも感じない、透明なUI。それが理想の状態だと思うようになった。
余白が「情報」として見えるようになった
Stitch でスペーシングを意識した設計を繰り返すうちに、他のサービスのUIで「余白の設計意図」が見えるようになった。
Apple のWebサイトを見るとき、余白の豊かさが「このブランドはプレミアムだ」という印象を作っていることが読み取れる。逆に情報が詰まったUIが「忙しいサービス」「コスト重視のサービス」という印象を与えることも、余白を設計した経験があるからわかる。
以前は「Appleのサイトはきれい」という感想で終わっていた。今は「このセクション間の余白は約80px、フォントサイズとのバランスが絶妙だ」という解像度で見ている。
「批評できる目」がプロンプトを上手にする
Stitch でUIを設計していて気づいたのは、「生成されたUIを批評できる能力」がプロンプトの質を上げるということだ。
「なんか違う」を言語化できるか
生成されたUIを見て「なんか違う」と感じたとき、それを言語化できるかどうかが修正プロンプトの質を決める。
「なんか違う」→「ボタンの色が背景と同化していて目立たない」→「CTAボタンの背景色を#2A5FD8(現在の#6B7280より彩度の高いブルー)に変更し、テキストを白に」
この変換ができるようになるには、「なぜ違和感があるか」を分解できる目が必要だ。日常でUIを「なぜこうなっているか」という目で観察することが、この分解能力を鍛える。
Stitch を使い始めてから日常のUIを観察するようになったことで、「なんか違う」の言語化が以前より速くなった。それがプロンプト修正のスピードにも繋がっている。
「なぜ成功しているか」を分析する習慣
失敗したUIを観察するのと同じくらい、成功しているUIの「なぜ」を分析することが重要だ。
たとえばDuolingoのゲーミフィケーションUI。ストリーク(連続記録)の表示は非常にシンプルだが、強い感情(「続けなきゃ」という圧力と「続けられた」という誇り)を作る。なぜそれができるのか——炎のアイコン・連続日数の数字・色の変化——それぞれの要素がどう感情に働きかけているかを分析できるようになったのは、Stitch でゲーミフィケーションUIを自分で設計した後からだ。
日常で「UIを観察する」習慣の作り方
Stitch をきっかけにUIを観察する習慣がついた。その習慣を意図的に作る方法をまとめる。
- 新しいアプリのオンボーディングを全部見る:スキップせずに最後まで体験し、設計意図を観察する
- 「使いにくい」と感じたUIを言語化する:「なぜ使いにくいか」を3つ挙げてみる
- 気に入ったUIのスクリーンショットを撮る:なぜ良いと思ったかをメモする。Stitch のプロンプトライブラリに「参考UIメモ」として保存している
- Stitch で「このUIに似せて作って」を試す:観察したUIを言語化してStitchに渡すことで、「そのUIがなぜそう見えるか」への解像度が上がる
よくある質問(FAQ)
Q. UIを観察する習慣をつけるために、特に参考になるサービス・アプリはありますか?
A. オンボーディング設計の参考にはDuolingo・Notion・Headspace、ゲーミフィケーションの参考にはDuolingo・GitHub(コントリビューショングラフ)・Strava、フォーム設計の参考にはTypeform・Stripe、全体的なUIの質という点ではApple のWebサイト・Linear・Figmaが学びになります。これらをStitchで「似たUIを作って」と試してみると、なぜそのUIが良いかが言語化しやすくなります。
Q. UIへの観察眼を鍛えるのに、Stitch 以外に有効なことはありますか?
A. Mobbin(UIデザインのパターン集)・Dribbble・UIzardのデザインギャラリーを見て「なぜこのデザインが良いか」を言語化する練習が有効です。また読書では「ノン・デザイナーズ・デザインブック」(Robin Williams著)が視覚的な原則(近接・整列・反復・コントラスト)を実例を通じて解説しており、UIの「なぜ」を言語化するための基礎知識が得られます。
Q. 「UIが気になりすぎる」ようになって、逆に使うことに集中できなくなることはありませんか?
A. 正直、あります。特に仕事で使うアプリを初めて使うとき、ユーザーとして体験する前にUIの設計を分析してしまうことがあります。でも「ユーザーとして使う目」と「設計者として観察する目」は切り替えられるので、普段使いでは前者を意識するようにしています。設計意図の分析は「後でやる」と決めると、両方の目をバランスよく使えます。
Q. チームでUIへの観察眼を共有するにはどうすればいいですか?
A. 週次の「UI観察共有」の場を設けているチームがあります。「今週見た良いUIを1つ持ち寄って、なぜ良いかを説明する」という5分の共有が、チーム全体のUIリテラシーを上げる効果があります。NotionやSlackに「良いUIメモ」チャンネルを作って非同期で共有する方法も有効です。
Q. UIを観察する力は、Stitch のプロンプト力に直結しますか?
A. 直結します。「このUIはなぜ良いか」を言語化できる人は、「どういうUIを作りたいか」をStitchに伝える言語を持っています。観察→言語化→プロンプト化というサイクルが自然になると、Stitch での設計速度と品質が両方上がります。
まとめ:UIを「使う人」から「読む人」になる
Google Stitch を使い始めてから、私はUIを「使う人」から「読む人」になったと感じている。
UIは設計者の意図が込められた「文章」だ。なぜこのボタンがここにあるのか、なぜこの余白がこれだけ広いのか、なぜこの色がここで使われているのか——それぞれに意図がある。
その意図を「読む」ことができると、UIを見る体験がまったく変わる。コンビニのセルフレジも、銀行のATMも、食べログのレビュー画面も、設計者の意図が詰まった「文章」として見えてくる。
Stitch はUIを設計するツールだ。でも使い続けることで「UIを読む目」を鍛えてくれる——そういう予想外の副産物が、このツールを使い続けている理由のひとつだ。
次のステップ:今日、自分がよく使うアプリをひとつ選んで「なぜこのUIはこう設計されているか」を3点書き出してみましょう。その言語化がStitchのプロンプトを書く力に直接つながります。