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
いいUIわるいUI
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
ttmtg
February 05, 2019
Design
0
95
いいUIわるいUI
非デザイナーの方やこれからUIデザインを勉強する方向けに、いいUIわるいUIの基本的な見分け方をまとめてみました。
ttmtg
February 05, 2019
Tweet
Share
Other Decks in Design
See All in Design
【MIXI MEETUP!ー TECH & DESIGN DAYー】【工数98%削減】Xでモンストを話題にせよ!生成AIの活用で日本トレンド6位を獲得した企画の設計&デザイン術
mixi_design
PRO
0
190
見栄えと使いやすさの先にある 特別感 をデザインする / Designing a Sense of Specialness Beyond Aesthetics and Usability
bitkey
PRO
0
250
Mandalyn_DT5001_FinalAssignment.pdf
lynteo
0
130
結びながら、ひらく - にじむ境界のデザイン
hilokifigma
3
1.3k
Spacemarket Brand Guide
spacemarket
2
140
decksh object reference
ajstarks
2
1.5k
組織はみんなでつくる。デザイナーが仕掛ける急拡大する組織のカルチャーづくり
mkasumi
0
1.1k
TUNAG BOOK 2024
stmn
PRO
0
1.4k
チームで事業価値を生み出す、プロアクティブなデザイナーになるための道のり/ Designship2025_Naya
root_recruit
0
380
「稼ぐ」だけでなく 「還す」ためのデザイン / Designship2025
culumu
1
570
大きな変化の中で、わたしが向き合ったこと #もがく中堅デザイナー
bengo4com
1
1.4k
AIスライドデザインを生成する仕組みを社内共有する
kenichiota0711
3
3.1k
Featured
See All Featured
Data-driven link building: lessons from a $708K investment (BrightonSEO talk)
szymonslowik
1
910
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
170
Done Done
chrislema
186
16k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.9k
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
110
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.2k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
79
Into the Great Unknown - MozCon
thekraken
40
2.2k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
61k
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
250
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
1
300
Transcript
いいUIわるいUI
UIとは何の略?
User Interface
010101010101010 101010101010101 010101010101010 101010101010101 010101010101010 ユーザー システム インターフェース
UIは大きく2種類あります
アナログUI デジタルUI
アナログUI デジタルUI
デジタルUIにも 大きく2種類あります
GUI Graphical User Interface CUI Character User Interface
GUI CUI
クイズ
これって いいUI?わるいUI?
None
None
None
いいUIかわるいUIかの基準は?
使う人や環境など、 前提条件によって変わる いいUIかわるいUIかの基準は?
使う人や環境など、 前提条件によって変わる いいUIかわるいUIかの基準は? Who(だれが)
使う人や環境など、 前提条件によって変わる いいUIかわるいUIかの基準は? Who(だれが) How(どのような環境で)
使う人や環境など、 前提条件によって変わる いいUIかわるいUIかの基準は? Who(だれが) How(どのような環境で) What(なんのために)
UIの良し悪しを判断するときは 前提条件を明確にしましょう
UIデザイナーが 考えている 3つのこと
UIデザイナーが考えていること その1
UIデザイナーが考えていること その1 そもそも 人間が使いやすいか
UIデザイナーが考えていること その2
UIデザイナーが考えていること その2 実現性がどれだけあるか
UIデザイナーが考えていること その3
UIデザイナーが考えていること その3 ・まよわない ・おぼえやすい ・ここちいい
UIデザイナーが考えていること その3 ・まよわない ・おぼえやすい ・ここちいい 逆に… ・混乱させないか? ・覚えてもらえるか? ・傷つけないか?
UIデザイナーが考えている 3つのこと
UIデザイナーが考えている 3つのこと ・人間が使いやすいか ・実現性があるか ・まおこ ・人間が使いやすいか ・実現性があるか ・まおこ
その1 そもそも 人間が使いやすいか
「人間が使いやすい」ってことは つまり?
直観的
直観的 思考・推理などによらず、 瞬間的・直接的・感覚的に物事の本質を 見てとるさま。
直観的を実現するもの
直観的を実現するもの ‑ 色の機能 ‑ レイアウトの機能 ‑ インタラクション ‑ アフォーダンス ‑
タイポグラフィ ‑ 非言語コミュニケーション ‑ 視覚、聴覚、触覚、錯覚 ‑ 学習能力、認知力、記憶力 ‑ 感情表現 ‑ メンタルモデル
その2 実現性がどれだけあるか
どんなすばらしそうなUIでも 実現できなきゃ価値がない
実現性の種類
実現性の種類 ・技術的実現性 ・経済的実現性 ・組織的実現性
実現性の種類 OS 仕様、言語制約、メモリ、構造、開発環境 予算、投資対効果、持続可能性 人的リソース、時間リソース、事業判断 ・技術的実現性 ・経済的実現性 ・組織的実現性
その3 まおこ
その3 ・まよわない ・おぼえやすい ・ここちいい
おさらい
いいUIかわるいUIかの基準は?
いいUIかわるいUIかの基準は? 使う人や環境など、 前提条件によって変わる Who(だれが) How(どのような環境で) What(なんのために)
UIデザイナーが考えている 3つのこと
UIデザイナーが考えている 3つのこと ・人間が使いやすいか ・実現性があるか ・まおこ ・人間が使いやすいか ・実現性があるか ・まおこ
UIデザインを 勉強するには?
UIを知って、
UIを知って、 UIを観察して、
UIを知って、 UIを観察して、 UIを作ってみる
UIを知って、 UIを観察して、 UIを作ってみる これを繰り返すのみ!!
Thanks!!