【初歩に立ち返ろう】直感的なUIデザインのための超基本チェックリスト

bookshelf-413705_640

はじめに:

本当にユーザーフレンドリーなUIデザインは、意外と難しいもの。

見た目を優先するあまり、使いにくくなってしまっていませんか?

相次ぐ機能追加により、基本のコンセプトを忘れてしまっていませんか?

基本的ながら意外とやってしまいがちなミスについて、

チェックリストをまとめてみました。

①ユーザーの目線の流れは正しく誘導できているか?

ユーザーが目線を向ける優先度がはっきりわかるようにしましょう。

例えば、全体を見て横書きのページであることがわかれば、

ユーザーは左から右に、そして上から下に目線を動かすはずです。

また、ユーザーは目立つ色や形の部分に注目します。

赤や黄色等の注目する色、ギザギザとした形や集中線を置きます。

注目すべきポイントを明確にして目線の流れをスムースに誘導してあげましょう。

注目ポイントは多くて3つ、基本は1・2個で抑えましょう。

でないと、目立たせるだけの品のないデザインとなります。

②押せる場所と押せない場所は区別できているか?

ユーザーがアクションを起こせる場所と、起こせない場所は、

はっきりと区別しましょう。

次に何をするべきなのかが不明瞭だと、

ユーザーは混乱し、結局何もせずに終わってしまいます。

ボタンであれば立体的にして押せそうな形にしたり、

文字であれば下線を引いて色を変えるだけでも大きく違います。

逆に押せない部分であれば、のっぺりとしたデザインとしたり

同色でとけ込ませる様にしましょう。

また、ボタン化が可能であれば、遷移しない形でボタンが押された回数を計測し

誤動作を招いているのかをチェックする事も一つチェックする方法としてあります。

最初のチュートリアル等でも、押せる場所を理解させるというのも重要なポイントです。

③レベルの違う情報を同じデザインにしていないか?

同じデザインや同じ配置にする情報のレベルはきちんと揃えましょう。

服で言えば、「Tシャツ」「トップス」「シャツ」「ジャケット」の4つがあるとします。

この4つを同じ場所に列挙することはしてはいけません。

なぜなら「トップス」だけが他のものを含む上位のカテゴリーだからです。

提示すべき情報が複雑になればなるほどこうしたミスは多くなりやすいので、

念のため注意しておきましょう。

種別に関してで言えば、項目を全てカードに書き出し重ねていくといった事や

エクセル等でまとめていくと言った事が必要です。

④ユーザーにやらせたい事は一致しているか?

これは①~③とも関係してきますが、

ユーザーを正しく誘導するためには、そもそもユーザーが何をするのか

何がそのサービスによってできるのか?

と言う事を伝えなければいけません。

アプリケーションに長々と説法してしまえばユーザーは離れてしまいますし、

何も説明しなければ理解してもらえません。

そうした時に、シンプルにユーザー側にしてもらいたい事を伝えるのが

ユーザーインターフェースといえます。

新規ユーザーに触ってもらう時には、

予測された通りに理解してもらえるのかを試してみましょう。

⑤機能追加により内容が変わってきてないか?

多くの機能追加に関しては、他アプリへの差別化として重要なポイントです。

しかし、機能が追加しすぎてわかりにくくなっていませんか?

最初期のテレビチャンネルと現在のテレビチャンネルを比べてみて下さい。

多くの機能をチャンネルは持っています。

はじめてチャンネルをさわる3歳児に両方を渡してみて下さい。

どっちが先にユーザーに使い方の習得を促すでしょうか?

間違いなく、再初期のモデルの方がユーザー側にメリットの高いユーザーインターフェースを持っています。

理由としては、シンプルと言うだけではありません。

トライエラーを繰り返す事で学習ができるのです。

機能が多くなればなるほど、予測範囲外の結果が導きだされ、頭の回転がついていきません。

作り手側であれば、理解ができる事も3歳児であれば理解できません。

(決してユーザーが3歳児と言っている訳ではありませんが。)

■まとめ

いかがでしたでしょうか。

よく設計されたUIは、ユーザーが意識せず使うだけで、正しい動きができると言うもの

インターフェースが要因でサービス利用者減少に繋がっているアプリも多くあります。是非、それらを整え背か良いにアプリを展開しましょう。

カテゴリーApps