UI/UXデザイナーLT会 - vol.6で発表したスライドです。
Webサイトやアプリケーションには矢印がいっぱいです。もちろん、UIデザインしていても矢印をたくさん使います。
でも、どんなふうに矢印を使っているか私たちは普段意識できているでしょうか。好き勝手に向いた矢印に囲まれて、混乱してしまったことはないでしょうか。
まず矢印を、使われ方によってつぎの6つに分類してみました。
1. リンク: テキストリンクのラベルの前後に矢印を付けたり、ボタンの見た目でもページを遷移する振る舞いのもの。
2. オプションあり(ドロップダウン・他の選択肢あり): 矢印を押すと他の選択肢や条件指定などのオプションが表示されるもの。
3. ナビゲーション: 矢印を押して移動するもので、たんなるページ遷移に限らずそのコンテキストで連続した内容を表示したりタスクを行ったりするもの。
4. 階層表現(ドリルダウン): 矢印を押すとその下に子の階層を表示するもの。1個以上の階層がある場合に使われる。
5. UIのコントロール(開閉・送り・行の移動・並べ替え) : UIの動きの方向に矢印が向いているもの。または、上下矢印や左右矢印などで操作可能であることのシグニファイアとなっているもの。
6. アクション(送信・再生): 送信や再生開始など、そこでの特定のコマンドを実行するもの。
これほど様々な使われ方をする矢印って、アイコンとして万能じゃないでしょうか。
でも、本当になんにでも使っていいのでしょうか。
ひとまず、矢印が目指す方向に「何が」動いていくのかによって、つぎのような結論を出してみました。
それは「ユーザー」が主語になるなら矢印でもいい!というものです。
たとえば、リンクは現在のページから別のページに「ユーザーが」進む。ナビゲーションは「ユーザーが」現在地から別の場所に進む、または戻る。アクションは「ユーザーが」実行する。
その他の、オプションあり、階層表現、UIのコントロールには、矢印以外の表現が使用されることも多いです。
だからどうだということはありませんが、矢印が多くなりすぎて気が狂いそうになったときには、ぜひこのことを思い出していただければ幸いです。