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
(Nakayama) UXとUIの違い
Search
Shirasu3
March 26, 2025
Design
76
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
(Nakayama) UXとUIの違い
Shirasu3
March 26, 2025
More Decks by Shirasu3
See All by Shirasu3
「UXとUIの違い」v2
shirasu3
0
440
Other Decks in Design
See All in Design
広い関与の可能性に どう向き合うのか? 私たちは。|Timee MarketingDesign 2026-06-18
bebe
0
270
ClaudeCodeでマーケターの課題を解決する
kenichiota0711
11
14k
「見せる」登壇資料デザインの極意
takanorip
4
1.2k
From the Visible Crossroads: Turning Outputs into Outcomes
takaikanako
2
1.5k
工房としてのAI ── デザイナー、作家、ビルダー
hiranotomoki
0
370
UI生成の鍵は要件整理 -デザインプロセスのエッセンスを プロンプト作成に取り入れよう-
abokadotyann
4
990
タイル紹介サイト「タイルだもんで」
calpin
0
160
Signull 団体説明資料
signull
0
720
研修担当者が一番伸びた 熊本市役所✕AI『泥臭いAI研修』のワークショップ設計について
garyuten
2
440
Design dependencies
teba_eleven
0
140
「惜しいデザイン」 を生み出さないための AIレビューループ
0b1tk
2
2.6k
AI時代、デザイナーの価値はどこに?
tararira
2
1.8k
Featured
See All Featured
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
4.2k
Efficient Content Optimization with Google Search Console & Apps Script
katarinadahlin
PRO
1
740
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
10k
Designing Powerful Visuals for Engaging Learning
tmiket
1
460
How GitHub (no longer) Works
holman
316
150k
Build your cross-platform service in a week with App Engine
jlugia
234
18k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.4k
Leading Effective Engineering Teams in the AI Era
addyosmani
9
2.2k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.7k
GraphQLとの向き合い方2022年版
quramy
50
15k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
910
The innovator’s Mindset - Leading Through an Era of Exponential Change - McGill University 2025
jdejongh
PRO
1
230
Transcript
「UXとUIの違い」 UI だけ良くても、良い UX にならない
Nakayama(Shirasu)の紹介 ソフトウェアエンジニア Web 業界で 8年ほど。EC が得意。 最近はプロダクトマネジメント寄りの仕事をしています。 2024年に1年かけて Google
UX Certificate コースを修了。 アプリ UI やコンテンツがユーザにとってわかりやすいものであることを 意識して仕事をしています。UX エンジニアを自称したい。 ※ 2025/03/26 作成 参加者の顔や アイコンを追加
UXとUIの違いを 自分の言葉で 説明してください 問題
Nakayama の説明・考え • UX = User Experience, UI = User
Interface • UI はアプリのボタンの色とか余白といった視覚的なもの限定 • UX はユーザの行動すべて • UX の中に UI があるイメージ
「UXとUIの違い」 のスライドを見て。。。 再考しよう! 解答 解答:スライド
UX UI コンテンツ コンテキスト = + + UXの定義(解答スライドより引用) ※次のスライドで説明
ジョブ コンテンツ サービス = アウトカム コンテンツの定義
https://uxdaystokyo.com/articles/ui-ux-difference-study/ UXを理解する上での例え 箸など食器(UI) が使いやすく、料理(コンテンツ)も美味しい。が、 自分の状態・状況(コンテキスト)によって体験は異なる。
Nakayama の解釈 自宅の電気 駄目な or 良いUI ・電気をどう やってつけるの かわからない ・電気がつけら
れない ・電気をどう やってつけるの かわかる! ・電気がつけら れる!
駄目な or 良いコンテンツ Nakayamaの解釈 Nakayama の解釈 自宅の電気 ・部屋が明るく ならない ・部屋が明るく
なる!!
駄目な or 良いコンテキスト (私:名前)の解釈 Nakayama の解釈 自宅の電気 電気がつけら れて、部屋も明 るくなるけど
・・・ ・いつも部屋を 明るくしたいわ けではない 暗めの照明でく つろぎたいとき もある
新しい気づき・学び 見た目が使いやすい見た目で、やりたいことが実現 できればいい UX だと思っていた。 しかし、コンテキストが変わると、一見良いように 思うユーザ体験 UX が、悪いものになることもある。
UI, コンテンツは考えつきやすいが、 ユーザがどんなコンテキストでその製品を使うのかを 考えることが大切。だが、コンテキストを考えるのは難しいと感じた。
参考リンク • UXとUIの違い(UX TIMES) • The Definition of User Experience
(UX)(NNG) • UXとUIの比較以上の勉強をしよう(UX TIMES) • 書籍「UX+理論で作るWebデザイン」 この本に 今回のこと記載されてるよ! 体系的に学びたい方はぜひ
「#UXer1000000」でポストして広めよう! 2030までに = 100万人 自分の言葉で説明できる力をつけよう! ”UXのこと”