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
ttmtg
February 05, 2019
Design
0
94
いいUIわるいUI
非デザイナーの方やこれからUIデザインを勉強する方向けに、いいUIわるいUIの基本的な見分け方をまとめてみました。
ttmtg
February 05, 2019
Tweet
Share
Other Decks in Design
See All in Design
プロダクトを成長させる生成 AI のユースケース発見ワークショップ vol.3
icoxfog417
1
110
noteのアクセシビリティ これまでのプロダクト・組織へのアプローチとこれからのこと
tatsuyasawanobori
1
1.1k
B/43プラスカードができるまで
putchomsmartbank
0
490
20231122_Design Leader Impact Award_Presentation_FAKE Okazaki
okazakityo
1
250
Goodpatch Tour💙 / We are hiring!
goodpatch
28
700k
デザイナー採用 3社目で学び中のこと / Learnings of Designer Recruitment | Yasuhiro Yokota
yasuhiroyokota
1
260
雑誌『広告』をサイズ展開する
takuro_nakajima
PRO
0
1.4k
231206_Book-launch-event_kato
hjmkth
2
1.2k
メドレーという会社と デザインチームのひみつ/About Medley design team
medley
0
420
#コムデナ vol.2 「初めてのデザインカンファレンス協賛!共有したい3つのやらかし」
kiyoshifuwa
1
340
UX/UI改善に貢献するユーザーテストとは? 基礎知識から実施のプロセスまで解説
ncdc
0
340
Designing UIs without a UI designer
strongeron
0
130
Featured
See All Featured
No one is an island. Learnings from fostering a developers community.
thoeni
16
2.1k
Statistics for Hackers
jakevdp
790
220k
Build The Right Thing And Hit Your Dates
maggiecrowley
25
2k
The Illustrated Children's Guide to Kubernetes
chrisshort
32
46k
Designing the Hi-DPI Web
ddemaree
276
33k
Become a Pro
speakerdeck
PRO
13
4.6k
Thoughts on Productivity
jonyablonski
60
3.9k
Embracing the Ebb and Flow
colly
80
4.2k
How GitHub (no longer) Works
holman
305
140k
The Mythical Team-Month
searls
216
42k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.7k
Being A Developer After 40
akosma
66
580k
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!!