もう悩まない!UIデザイン設計で役立つ法則集

「良い感じに作って」
多くの社会人を苦しめている言葉の1つです。
そして、それっぽいものを作成して提出するとダメ出しを食らうまでがお約束。
大抵の原因は思考停止で作成していることにあり、
言い換えると「それが良い感じである根拠を用意していない」ということです。

今回はエンジニアである私の業界を例として、
「良い感じに」と言われがちなUIデザイン設計での対策案を挙げていきます。
結論から言うと「法則に従って設計する」という話で、
知っておくと役立つ法則とその活用例を挙げていきます。

ページや画面単位のデザインで役立つ法則

・ゲシュタルトの法則
人間は近いものや似ているものをグループ化しようとするという法則です。
似た機能は寄せる、逆に無関係のものは離すと違和感の少ないデザインになります。

・ヒックの法則
選択肢の数が増えるほど意思決定にかかる時間が長くなるという法則です。
可能なら選択肢を統合して数を減らす、カテゴリ分けをして不要な選択肢を省く
といった工夫が効果的ですね。

・系列位置効果
リストの最初と最後の項目がより記憶に残りやすいという効果です。
この記事をお読みいただいているみなさんも、
明日にはゲシュタルトの法則とWCAGの事しか覚えていないのでは?
そう思うと少し悲しいです…

ボタン等のオブジェクト配置で役立つ法則

・フィッツの法則
クリックしようと思ったボタンがカーソルから近いほど、
またボタンが大きいほど操作が早くなるというような法則です。
Windowsのスタートボタンは左下に巨大なボタンがあるイメージで、
適当にマウスを動かしてもクリックできるから素早く操作できるのです。
私はこの話を聞いて感動していたのになぜWin11では中央揃えがデフォに…

・ジェイコブの法則
ユーザーは新しいものにも、既存のものと同じような動作体験を望むという法則です。
独創的なデザインは操作に関わらないところで取り入れましょうね。

その他

・美的ユーザビリティ効果
良いデザインのものは使いやすいと感じやすいという効果です。
色や見た目に拘ることは思っているより重要ということです。

・Web Content Accessibility Guidelines
コンテンツの利用しやすさ向上のためのアレコレをまとめたガイドラインです。
障害を持つ方への配慮を目的としていますが、則るに越したことはない内容です。
詳しくはこちら

まとめ

これらのような研究者のお墨付きがあれば、
上司としてもOKを出しやすいものが出来上がるでしょう。
雑な指示をされた時こそ仕事力のアピールチャンスです。
その時に輝けるよう常にアンテナを張って、
役に立ちそうな情報を集めておけると素晴らしいですね!