B2B SaaS の情報密度: パワー ユーザーと初心者向けのダッシュボードの設計

密度は専門家向けの機能です

アナリスト、サポート エージェント、オペレーターなど、B2B ツールを 1 日中使用する人々は、スクロールやタブの切り替えに時間がかかるため、一度に多くの情報を表示することを好むことがよくあります。きれいなスクリーンショットを撮るためにすべてを広くすると、作業が遅くなる可能性があります。目標は、密度が高くても目を通しやすい情報です。

密度を選択させる

設計システムはコンポーネントに密​​度を組み込むようになりました。たとえば、IBM の Carbon データ テーブルでは、高密度レイアウト用の特小 (24 ピクセル) からスキャンを容易にする特大 (64 ピクセル) まで 5 つの行の高さが用意されており、デフォルトは中 (40 ピクセル) です。

• ユーザーごとに記憶される 2 つまたは 3 つの密度設定を提供します。
• フォント サイズやコントラストではなく、間隔と行の高さを変更します。
• 密度に関係なく、タッチ デバイス上でタッチ ターゲットを十分な大きさに保ちます。

階層化により密度が読みやすくなる

Nielsen Norman Group は、ダッシュボードを、人々がすぐに行動できる一目でわかる情報を提供する視覚化として定義し、人々が最も早く読み取ることができる長さと 2D 位置で量をエンコードすることを推奨しています。実際には、意思決定を促すいくつかの数字を先頭に配置し、すべてをグリッドに配置し、色は意味 (ステータス、アラート) のみに使用し、比較できるように数字を右揃えにします。

専門家の速度を低下させることなく初心者を保護する

段階的な開示により、高度なオプションが利用可能になりますが、邪魔にはなりません。新しいユーザーは焦点を絞ったデフォルト ビューで開始し、必要に応じて列、フィルター、ウィジェットを追加できるようにします。また、専門家がすぐに緻密な設定に戻れるようにビューを保存します。

密集したインターフェースでの動き

データの多い画面では、動きは装飾ではなく変化を説明する必要があります。つまり、更新されたばかりの値を強調表示したり、行をアニメーション化して新しいソート位置に移動したり、グラフの遷移を表示してユーザーが動きを追跡できるようにする必要があります。短くし、データと競合する連続的なアニメーションを避けてください。