BIダッシュボードのUI/UXにおける10のポイント
1.分析シナリオを意識した構成
全体俯瞰からしだいに詳細分析に移れるように、分析にストーリー性を持たせます。ディメンション単位で画面をまとめて、ユーザが目的別に分析できるように設計します。基本的には、ディメンションの数だけ画面が必要です。
2.フォント
標準のフォントを決定した上で強調したい箇所は大きく、詳細は小さくメリハリを付けます。重要度の高いものなどは色を変えます。
3.レイアウトの整理整頓
システム全体を統一的に見せるために、標準的なフィルターやチャートの配置を決定します。見た目の美しさだけでなく、ユーザの直感的な操作が容易になります。
4.空白の使用
適度な空白を入れることで、伝えたいこと、強調したいことが引き立つようになります。
5.解像度
特に横スクロールは操作性や視認性に大きく影響します。仮に必要になっても極力少なくなるように配慮したほうがよいです。レスポンシブデザインの場合も、常に適度な情報が表示されるように工夫します。
6.適切な説明
チャートの留意点などの簡易的なコメントを分析画面の中に作り込み、それがチャートと同時に目に入るようにすることで、ユーザのデータの読み間違いを回避します。
7.初期画面表示時間をなるべく短縮する
重い演算が必要なチャートが複数存在すると初期表示が遅くなります。初期表示の遅さはユーザにとっては非常にストレスがかかります。また、システムへの信頼性を疑わせることにもつながります。初期表示の時点では、演算の重いチャートは非表示にして、ボタンを押すことで表示するよう設定するなど、時間の短縮化の工夫をしましょう。避けられない場合は「少し時間がかかります」などの注意メッセージなどを出すようにします。
8.情報過多を回避
一画面に多くのオブジェクトを配置するとさまざまな情報が得られる一方で、何が重要かがわかりにくくなります。ユーザが利用することを考慮して必要最小限の情報に絞るようにします。
9.色使いのルールの決定
チャートで使う色には、ひと目でメッセージを伝える機能があります。去年と今年では正反対の色を使う、同じカテゴリーいは同じ色を使うなど、色使いのルール化をすることで、ユーザの理解を助けることができます。
10.Eye Candy
本来の目的い無関係な過渡の装飾をEye Candyとやゆ的に呼びますが、これらはユーザの理解の妨げになることが多いので避けるようにします。