Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ChatGPT、Gemini、Claude は、なぜ似たようなUIを採用しているのか?
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
ふわり
September 05, 2025
Design
3
2.1k
ChatGPT、Gemini、Claude は、なぜ似たようなUIを採用しているのか?
ふわり
September 05, 2025
Tweet
Share
More Decks by ふわり
See All by ふわり
TDDをやってみたら、身に沁みてTDDの 〝良さ〟 を理解した話
fuwarisprit
1
31
ところでクリーンアーキテクチャって何がいいの?
fuwarisprit
0
19
Other Decks in Design
See All in Design
hicard_credential_202601
hicard
0
160
逆向きUIの世界 〜iOSアプリのRTL言語対応〜
akatsuki174
1
510
モビリティプラットフォームの未来を築くクラウド基盤
kossykinto
0
210
結びながら、ひらく - にじむ境界のデザイン
hilokifigma
3
1.4k
AIスライドデザインを生成する仕組みを社内共有する
kenichiota0711
5
4.3k
組織の右腕として共創する ー デザインと経営の二つの視点から見えた、新しい支援のかたち/ Designship2025_Nishimura
root_recruit
0
280
組織はみんなでつくる。デザイナーが仕掛ける急拡大する組織のカルチャーづくり
mkasumi
0
1.1k
「デザイン」の自分ごと化から始める、デザインピープルのふるまい
mewmo
PRO
0
160
デザインコンテキストのバトンをつなぐ—AI時代のプロダクトマネジメント
kumanoayumi
6
870
自分たちがターゲットになりにくい業務アプリケーションのユーザビリティを担保する取り組み / Initiatives to ensure the usability of business applications that are difficult for us to target
hiromitsuuuuu
1
1.3k
「余白」と「欲望」を味方につける ——AI時代のデザインエンジニアリングと「越境」の作法 #KNOTS2026
koyaman
1
1.4k
Figmaレクチャー会Part2 もっと使いこなす編@千株式会社 社内勉強会
designer_no_pon
1
260
Featured
See All Featured
Building Adaptive Systems
keathley
44
2.9k
Hiding What from Whom? A Critical Review of the History of Programming languages for Music
tomoyanonymous
2
430
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
2.8k
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
920
Evolving SEO for Evolving Search Engines
ryanjones
0
130
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
86
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
3.6k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
34k
Leading Effective Engineering Teams in the AI Era
addyosmani
9
1.6k
How to Ace a Technical Interview
jacobian
281
24k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
Believing is Seeing
oripsolob
1
58
Transcript
ChatGPT、Gemini、Claude は、 なぜ似たようなUIを採用しているのか?
株式会社ウィルゲート ソリューション開発ユニット ふわり @Fuwari_WE - 設計とデザインが好き - 趣味でTRPGのコミュニティ運営 - 毎月髪色が変わる
ネイルはおやすみちゅう……
みなさん AI 使ってますか?
None
None
None
None
似すぎ〜
None
None
None
None
似すぎ〜
お話する範囲 なぜUIが似ているのか 考察する ※ 公式見解ではなく個人の意見です 各サービスのベストプラクティス 開発への応用方法とか
共通する3つのUI
共通する3つのUI 対話的なチャット 会話形式で進行する インタフェース ストリーム表示 生成中のテキストを リアルタイムで出力 推論過程の表示 結論に至るまでの プロセスを示す
対話的なチャットUI
対話的なチャットUI 他のサービスでの採用例 - LINEなどのSNSのトーク画面 Conversational UI と呼ばれるもの - チャットがメインのサービスには よく採用されている
- 自然言語での操作を前提としたUI
LLMは新しい概念である LLMってなんだ? 指示が必要なの? 指示はどうやって出すの? プロンプト?
LLMは新しい概念である LLMってなんだ? 指示が必要なの? 指示はどうやって出すの? プロンプト? 慣れるまでが大変
LLM と Conversational UI を 組み合わせることで、 新しい概念 に 親しみを持たせる
新しい概念に親しみを持ってもらう Conversational UI を採用することで - よく使うアプリと使用感を統一 - 自然言語処理に特化したLLMとの相性も良い - 人とのコミュニケーションに限りなく近い体験
ELIZA効果 を生む
ELIZA効果とは 意識的には分かっていても、無意識的にコンピュータの 動作が人間と似ていると仮定する傾向のこと 人間にとって 受け入れやすい存在 になる 中の人おるやん 今日も元気 してっかー?
テキストのストリーム表示
テキストのストリーム表示 前提として、LLMの持つ技術的な制約に対する解決策 - すべてを出力し切るまでに時間がかかる - しかし、高速化にも限界が 結果がわかるまで時間がかかる
テキストのストリーム表示 他のサービスでの採用例 - Jiffcy(ジフシー) 入力したテキストが リアルタイムで相手に伝わる
テキストのストリーム表示 他のサービスでの採用例 - Jiffcy(ジフシー) 入力したテキストが リアルタイムで相手に伝わる ユーザーに とにかく早く 何かしらを 返したい
ユーザーの注意を 画面に集中させ続けるには、 10秒が限界 ― ヤコブ・ニールセン(Jakob Nielsen) 「Response Times: The 3
Important Limits」 より
「待つ」に関する研究 未完了のタスクや中断された物事は、 完了したものよりも意識に残りやすい (通称、ゼイガルニク効果) ― Bluma Wulfovna Zeigarnik 「完了および未完了行動の保持」 より
「待つ」に関する研究 未完了のタスクや中断された物事は、 完了したものよりも意識に残りやすい (通称、ゼイガルニク効果) ― Bluma Wulfovna Zeigarnik 「完了および未完了行動の保持」 より
適切なフィードバックはユーザーの 許容できる待ち時間を増加させる ― Fiona Fui-Hoon Nah 「How Long Are Web Users Willing to Wait?」 より
「待つ」に関する研究 未完了のタスクや中断された物事は、 完了したものよりも意識に残りやすい (通称、ゼイガルニク効果) ― Bluma Wulfovna Zeigarnik 「完了および未完了行動の保持」 より
適切なフィードバックはユーザーの 許容できる待ち時間を増加させる ― Fiona Fui-Hoon Nah 「How Long Are Web Users Willing to Wait?」 より 説明されない待ち時間は、説明された 待ち時間より長く感じられる ― David H. Maister 「The Psychology of Waiting Lines」 より
結果を早く返すのは無理なので、 早くFBして ユーザーを 安心させる
推論過程の表示
推論過程の表示 他のサービスでの採用例 - Uber Eats など 届くまでの 過程 を示す
LLMはブラックボックス なんでその結論に 至ったの? 根拠はなに? 指示した通りに 動いてなさそう、、、
LLMはブラックボックス なんでその結論に 至ったの? 根拠はなに? 指示した通りに 動いてなさそう、、、 ブラックボックスだから 信憑性や納得感に不安がある
結論に至るまでの プロセスを開示 して 信頼を得る
プロセスを開示して信頼を得る 手続き的公正 という考え方 - 決定(≒ 結果)に至るまでのプロセスを重視する考え方 - プロセスを開示すると信頼を得やすくなるとされている
プロセスを開示して信頼を得る 手続き的公正 という考え方 - 決定(≒ 結果)に至るまでのプロセスを重視する考え方 - プロセスを開示すると信頼を得やすくなるとされている 手続き的公正の理論と一致するように、 手続き的な説明は人々の信頼を回復させた。
― René F Kizilcec 「How Much Information?: Effects of Transparency onTrust in an Algorithmic Interface」 より
ChatGPT、Gemini、Claude は、 なぜ似たようなUIを採用しているのか?
なぜ似たようなUIを採用しているのか? どうやってLLMに 慣れてもらう? 結果が出るまでの 待ち時間が苦痛 結果に対する 不信感
なぜ似たようなUIを採用しているのか? どうやってLLMに 慣れてもらう? 結果が出るまでの 待ち時間が苦痛 結果に対する 不信感 会話として扱い 親しみを持たせる 未完了でも返事して
待つストレスを緩和 プロセスを開示して 信頼を得る
なぜ似たようなUIを採用しているのか? 会話として扱い 親しみを持たせる 未完了でも返事して 待つストレスを緩和 プロセスを開示して 信頼を得る
なぜ似たようなUIを採用しているのか? 会話として扱い 親しみを持たせる 未完了でも返事して 待つストレスを緩和 プロセスを開示して 信頼を得る より良い ユーザー体験を 目指している
なぜ似たようなUIを採用しているのか? 会話として扱い 親しみを持たせる 未完了でも返事して 待つストレスを緩和 プロセスを開示して 信頼を得る より良い ユーザー体験を 目指している
ただの模倣ではなく、 LLMのユーザー体験 を突き詰めた結果
今のUIは正しいのか?
今のUIは正しいのか? - ChatGPTのWAUが 7億人を突破 - すべてがこれらのUIによるものとは言えないが、 決して小さくない影響を及ぼしているはず 少なからず、これらのUIは受け入れられている
ここで一句