トマシープが学ぶ

Unity/VR/AR/デザイン好きのミーハー 記事内容は自分用のメモです

「UIデザインの心理学」を読んで勉強

この本を読みます。 

UIデザインの心理学―わかりやすさ・使いやすさの法則

UIデザインの心理学―わかりやすさ・使いやすさの法則

 

ただのメモになってしまいました。

色弱

designcolor-web.com

Chromatic Vision Simulator

photoshopでもシミュレーションができる

f:id:bibinbaleo:20171003161559p:plain

グレースケールに変換する

cheome拡張機能でwebページをモノクロにしてくれる。

chrome.google.com

ただし全てがモノクロになるわけではないっぽい。ブログの背景画像とかはならなかった。

f:id:bibinbaleo:20171003152403p:plain

エラーメッセージは見ているもののすぐ近くに表示

赤はエラーのみに使う。

その他

uxmilk.jp

Molich, R., and Nielsen, J. (1990). Improving a human-computer dialogue, Communications of the ACM 33, 3 (March), 338-348.

Improving a human-computer dialogue

注意の瞬き

ゲシュタルトの法則

ferret-plus.com

共通運命

Gapminder Tools

繰り返しの排除

階層化

一つのウェブページで複数の動作を要求しない

ユーザーが作業中は指示全体を表示できるようにする。

何を検索したかを表示しておく

人間の記憶

人間はなまけもの

機能はイラストを使ってアイコン

思い出して入力するより、選ぶ方が楽

専門用語は使わない(UIテーマとか)

用語には一貫性を

フィッツの法則

Webに適用されるフィッツのUIの法則

ステアリングの法則

プルライトメニューはマウス動作が大変なのでメニュはできるだけ大きく。

f:id:bibinbaleo:20171031094230p:plain

プルライトメニューの例

 

応答性は一番大事。

何分かかるのか、今どういう状態なのかのフィードバック

中止できるようにする。

「3個のタスクが完了」ではなく「3/5のタスクが完了」

0%と100%は表示しないぐらいの勢いで

VRchatは最悪だった。ネット環境が悪かったせいで多分一生繋がらない環境なのに、中止ボタンもなければ今何をしているかの表示もない。マウスを操作することもできない

www.amazon.com

uxxinspiration.com

最後に

めちゃくちゃ文章量が多くて途中で飽きて読み切るのに1ヶ月ぐらいかかりました。

悪い例が実際に使われていたものなのがよかったです。

元となった論文や本の注[Boulton 2009]も文章中に書いてあるのし、最後のページに参考文献一覧があるので、これからUI系の研究をするという人の足がかりにもなると思った。というか私なんですけど

載っている参考文献は2007年以前のものが多かったです。2013年のものもほんの少しはありましたが・・・