どうも。

Webアプリケーションの価値を高める要素の一つに、UI（ユーザーインターフェース）の使いやすさというものがあります。UIとは、人間とコンピュータの間での情報をやりとりするためのインターフェースのことで、Webアプリケーションでいえばブラウザに表示される画面になります。

今回はその、Webアプリケーションの顔とも言える「UI」の使いやすさについて、勘違いしている人が非常に多いので、記事にします。

使いやすいUIなど、主観でしかない

まず前提として、「使いやすい」「使いやすくない」というのは、個人の主観です。あなたが使いやすいと思おうが、顧客が使いやすいと言おうが、それは決して信用してはなりません。中には使いやすくないと思う人が必ずいますし、使いやすいという意見そのものに信憑性はありません。

なぜなら、利用者はそのUIが優れているのかどうかについて、判断することは不可能だから、です。

私は、とあるWebアプリの製品を見て、「なんだこのUI、クッソ使いにくい。よくこんなもん売れるな」と思ったことがあります。しかし、その製品の担当者いわく、「顧客からは使いやすいと評価されている」とのことでした。

この「評価されている」情報がホントなのかウソなのか、そもそも使いやすいという評価がどの程度のものなのか、UIに理解がある人が評価してるのかさっきパソコンを初めて触った人が評価してるのか……、それによって意味合いは全く変わってきますが、それ以前にそんなことを考えること自体、不毛です。

そして利用者は、何かの機会で他のUIを見た途端、こう言います。

こっちのシステムの方が使いやすいね

と。

UIの使い勝手というものは極めて感覚的なものであり、なおかつ他との比較がなかなかできないものです。長く使えば当然慣れて使いやすく感じることもあるでしょうし、逆に新しいものが新鮮に見えることもあるでしょう。

つまり、そんな各個人に依存するような至極感覚的なものを参考にして、いいものが出来上がるわけがないということです。

UIに、統一性と意味を持たせる

UIは言ってしまえばデザインです。プロの作るデザインには必ず意味があります。意味もなしに、「何となく使いやすいと思うから」という理由だけで、UIを決定してはなりません。

UIを構成する一つ一つのパーツに対して、そんな決定方法を取ってしまったら、それはもう最悪です。一つ一つ、それぞれのパーツは使いやすいかもしれませんが、「あの選択ボックスはこの使い方」「こっちの選択ボックスは違う使い方」などといったことになり、統一性が失われます。そして、統一性のないUIはユーザーを混乱させ、効率を下げ、ストレスを与える結果になります。

UIはユーザーが直感的に操作できる必要があります。そのために必要な要素は、「統一性」だけです。その統一性の持たせ方によって、UIが直感的に操作しやすくなるかどうかが決まってきます。

これは、感情や直感で決めるものでは断じてなく、完全なる理論でもって決定すべきということです。そしてその理論には、なぜそうする必要があるのかと言った、理由や意味を持たせなければいけません。

• クリック数を最小にするように努める
• 1画面内の情報量を極力減らす/増やす
• 1画面内の操作ボタンの数は4つまでにする
• 必ず右上に操作ボタンを青色で配置
• 削除や無効化などのボタンは操作ボタンの直下に赤色で配置
• それ以外のボタンは左上に白色で配置

例えばですが、上記のような、理論立てた明確なルール、意図された設計思想でもってデザインはなされるべきです。一つ一つのルールに意味があり、全体を通して統一性ができます。ここで、よく言われる「近接」「整列」「反復」「コントラスト」の4原則に基づいたルールにすれば、より精度の高いものになるでしょう。

こうすることによって、ユーザーはいち早くそのシステムのクセを把握しやすくなり、大きな流行の変革があったとしても、長く使われ続けるUIにすることができます。

他のシステムの真似事などもってのほか

恥ずかしながら、いま参画しているプロジェクトの画面設計者は、とある有名企業のWebシステムのUIを丸パクリしています。こんなことはもってのほかです。

先ほど述べたとおり、UIには必ず、意図された設計思想があるべきです。しかしながら、他のシステムの真似事をするということは、その中に含まれたすべての設計思想を把握していく必要がありますが、そんなことは設計書でも盗まない限り不可能です。

つまり、パクリ元の使い勝手と同じにすることはできても、その使い勝手を超えることはできないということです。そもそもパクリ元が思想など何もないUIだったとしたら、話は別ですが。

斬新なUIなど、いらない

よく、「◯◯アプリのような斬新なUIにしてくれ」というような話を貰うことがあります。しかしそんなものは一過性の流行であり、使いやすさという観点から言えば、逆を行くことになります。

良くも悪くも、「平凡」というのは「理解がしやすい」ので「慣れが早い」です。また、流行に流されず生き残っているものなので、「寿命も長い」です。一方、「斬新」というのは最初こそ操作に快感を覚えるようなUIやUXかも知れませんが、後々ユーザーが操作に慣れて、斬新さに飽きがきたとき、それが邪魔に感じる可能性があります。

あくまでもUIは、快感を得るためのものではなく、快適に「目的の操作」をするためのものです。決して「斬新な操作感」を得るためにシステムを触っているわけではありません。目的を履き違えてはならないのです。

間違っても、全体の統一性を無視して、部分的に斬新なUIを実装するなんていうことはしてはいけないのです。そんなことをするくらいなら、Yamahaルーターのコマンドリファレンスのような、真っ白で基本的なHTMLでUIを作成したほうが、よっぽどマシです。

まとめ

いまはHTML5/CSS3の発展や、スマホアプリの登場によって、これまでにないUIを体感できる機会が多いです。しかし、それらのUIの設計者は、決して直感や斬新さだけを追求して設計したわけではないはずです。裏には必ずそのデザインの持つ「意味」があります。

その辺りを無視し、小手先だけでUIを作ると、すぐに風化するUIになってしまうことでしょう。

マーケティング上、流行も大事ですが、その前に基礎をしっかり固めましょう、ということです。