Slide 1

Slide 1 text

「UXとUIの違い」
 UX中心に考える


Slide 2

Slide 2 text

(私:西山)の紹介
 (肩書)ソフトウェアエンジニア
 (仕事歴)職業エンジニア歴4年ちょっと
 (仕事や行っていること)物流プラットフォーム開発
 (UXの学び)
 ● 社内の取り組みで1年ほどUXについて学んでいるが、UXデザインとは何かに ついてピンときていない
 (スライド実施日)2025/03/16


Slide 3

Slide 3 text

UXとUIの違いを
 自分の言葉で
 説明してください
 問題


Slide 4

Slide 4 text

(私:西山)の説明・考え
 講座前:
 ● UXは、ユーザが何かをして得られる体験
 ● UIは、UXにアクセスするための手段
 ● UIを通してユーザが何かを行うことで得られるものがUX
 講座後:
 UXは、ユーザの状況(コンテキスト)と提供されたコンテンツ、コンテンツへ のアクセス手段であるUIから形作られる、ユーザがコンテンツへのアクセ スを通して得られる体験


Slide 5

Slide 5 text

「UXとUIの違い」
 のスライドを見て。。。
 再考しよう!
 解答
 解答:スライド


Slide 6

Slide 6 text

UX UI コンテンツ※ 
 コンテキスト
 = + + UXの定義(解答スライドより引用)

Slide 7

Slide 7 text

ジョブ コンテンツ サービス
 = アウトカム 
 コンテンツの解釈

Slide 8

Slide 8 text

https://uxdaystokyo.com/articles/ui-ux-difference-study/ UXを理解する上での例え 箸など食器が使いやすく(UI)、料理も美味しい(コンテンツ)。 けど自分の状態・状況(コンテキスト)によって体験は異なる。

Slide 9

Slide 9 text

(私:西山)の解釈
 駄目なUI・良いUI
 (電子レンジを題材に)
 ダメなUI
 ● 1Wずつしかワット数を調整できない
 良いUI
 ● よく使うワット数をひねりひとつで指定できる


Slide 10

Slide 10 text

駄目なUX・良いUX
 (電子レンジを題材に)
 ダメなUX
 ● ワット数・時間を正しく指定したのに、全然食材が温ま らない
 良いUX
 ● ボタン数回押すだけで温め開始でき、ちゃんと温めてく れるので、手軽に温かい料理にありつける
 (私:西山)の解釈


Slide 11

Slide 11 text

駄目な(良い)コンテキスト
 (電子レンジを題材に)
 ダメなコンテキスト
 ● 温めに使いたいけど、置く場所がない
 良いコンテキスト
 ● 電源が届く距離に、置ける場所があるし、あると便利
 (私:西山)の解釈


Slide 12

Slide 12 text

新しい気づき・学び
 ● 自分のUXに関する考えはかなりUI寄りだったかも
 ○ コンテンツ中心に考えていくのが大事かも
 ○ UIはコンテンツをうまく扱えるようにするための手段ぐらいの気持ちでいた方が いい
 ● UX=UI+コンテンツ+コンテキストの式は目から鱗
 ○ ただ、何がUIで何がコンテンツかには拘らないようにした方がいいかも
 ○ UI中心に考えてないか、コンテンツ、コンテキストを置いてけぼりにしてないかを 意識するための式だと思った方がいい
 ● UI+コンテンツ=こちらが提供できるもの、コンテキスト=こちらが提供できないもの、どち らもあることを意識した方がいい
 ○ 作る側だと、コンテキストを見落としがち
 ○ ただ意識するだけではダメかも。コンテキストも見落とさないための道具が、UX ツールの中には色々あるので、それを活用していくのが良い


Slide 13

Slide 13 text

参考リンク ● UXとUIの違い(UX TIMES)
 ● The Definition of User Experience (UX)(NNG)
 ● UXとUIの比較以上の勉強をしよう(UX TIMES)
 ● 書籍「UX+理論で作るWebデザイン」


Slide 14

Slide 14 text

「#UXer1000000」でポストして
 広めよう!
 2030までに = 100万人 自分の言葉で説明できる力をつけよう!
 ”UXのこと”