Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
(Nakayama) UXとUIの違い
Search
Shirasu3
March 26, 2025
Design
80
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
460
Other Decks in Design
See All in Design
Bet AI Day 2026丨デザインハーネス:専門職の判断基準をコードのように運用する
layerx
PRO
4
4.5k
root COMPANY DECK / We are hiring!
root_recruit
4
30k
UI生成の鍵は要件整理 -デザインプロセスのエッセンスを プロンプト作成に取り入れよう-
abokadotyann
4
1.1k
2026-04-06 CMU School of Design "Vision-Driven Design"
ishii_mit
0
150
PAMPHLET.pdf
mhand01
0
1.8k
エンジニアでも捗る デザイナー的思考入門(bitA Edit 新ver)
tinykitten
1
520
1000人規模の組織でデザインハーネスを導入するための第一歩
pkshadeck
PRO
5
4k
再設計される業務 - AIにより再設計される "デザインワークフロー" / AI Ops Lab #2 Redesigned orkflows
kgsi
0
920
2026/6/26 第6回韓日リビングラボネットワークフォーラムin世宗 ー未来を作るリビングラボー アジアの社会システム転換に向けたリビングラボの可能性
a2k
2
110
設計の進め方と 品質特性品質特性
harakeishi
0
1.3k
kintone開発におけるライターの役割の変化〜AI活用を添えて〜 / Changes in the Role of Writers in Kintone Development
keroyama
0
210
「おすすめ」はなぜ信用されないのか - 信頼を築くUI/UX設計
ryu1013
0
290
Featured
See All Featured
sira's awesome portfolio website redesign presentation
elsirapls
0
410
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
aleyda
1
1.4k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
The Cult of Friendly URLs
andyhume
79
7k
The Straight Up "How To Draw Better" Workshop
denniskardys
239
140k
Marketing to machines
jonoalderson
1
5.8k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
700
Reality Check: Gamification 10 Years Later
codingconduct
0
2.3k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.6k
How Software Deployment tools have changed in the past 20 years
geshan
1
34k
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
530
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
370
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のこと”