web-dev-qa-db-ja.com

改ページ対データグリッドの無限スクロール

Pavination Vs.データグリッドの無限スクロール

ページネーションと比較して、調査結果や論文、ユーザビリティテストの結果はありますか。データグリッドでの無限スクロール。プロジェクトでデータグリッドのUXパターンを定義しようとしているので、優れたリサーチバックアップを探しています。どんな情報も役立ちます。

ページネーション付きデータグリッド enter image description here

無限スクロールのデータグリッド enter image description here

ありがとう。

2
Rupesh Nath

TL; DR優れたユーザーインターフェイスは、最高のUXを提供するユーザータスクをサポートする必要があります。まずUXについて考え、適切なUIパターンを使用して実装します。

一般的なタスク

データグリッドコントロールを操作する場合、いくつかの一般的なタスクがあると思います。

  • 特定の条件でレコードまたはレコードセットを検索します(たとえば、特定の価格ですべてのアイテムを検索します)。有限集合に対するフィルタリングとソートのオプションはそれを解決します。無限スクロールの場合、それは問題です。すべてのセットが処理されたか、それとも単にロードされたパーツでしたか?
  • 最上位/最下位レコードのセットを取得します(たとえば、上位10件の販売アイテムを取得します)。有限セットでの並べ替えオプションはそれを完全に行います。そして、無限スクロールパターンに問題があります。
  • レコード数を取得しています。ページ番号付きのグリッドコントロールは、この数を示します。

ページネーション

ページネーション付きのデータグリッドは、前述のタスクを非常によくサポートしています。ページネーションは、セット内の有限数のレコードの考えを伝えます。したがって、すべての操作(フィルタリング、並べ替え)がセット全体で実行されることは、ユーザーにとって明らかです。それは、ユーザーのメンタルモデルと整合しています。

無限スクロール

データグリッドでのユーザーアクションは非常にタスク指向です。多数の数値を観察することは退屈な作業であり、認知負荷が高すぎます。そして最悪のこと:フィルタリング/並べ替えの結果は、ユーザーがページをスクロールした深さに完全に依存し、データ自体から独立しています!

無限スクロールは、この種のタスクには適切ではありません。

ページネーションの代替

時々、ユーザーはセット全体で作業する必要はありません。たとえば、Googleフライトです。 UIを簡素化し、認識の負荷を軽減するために、Googleフライトはグリッドに最適なオプションのみを表示し、長いまたはより高価なフライトを表示リンクを提供して、グリッド内のより多くのレコードを開示します。

enter image description here
そのため、最適なオプションはユーザータスクによって異なります。まずUXについて考え、それを実装するための最良のUIパターンを選択します。

読むのに適した記事があります: 無限スクロール、ページ区切り、または「さらに読み込む」ボタン?eコマースでのユーザビリティの結果

3