web-dev-qa-db-ja.com

フィードからタイルを削除するときに予想される動作

シナリオ:画面にタイルベースのUIがあります。各タイルの高さと幅は同じです。画面はフィードと同様に機能します。新しいコンテンツがフィードに追加されます。ユーザーは垂直方向にスクロールして、タイルの次のセットを表示できます(次のタイルのセットは遅延読み込み方式でロードされます)。ユーザー自身のタイルもフィードに表示されます。ユーザーはフィードから自分のタイルを編集、削除できます。

問題:現在、ユーザーが自分のタイルを削除すると、そのタイルはフィードから削除されます。次のタイルはすべて1つ上に移動します。ただし、これによりフィードで多くの動きが発生します。下の画像を確認してください。

enter image description here

上の画像に表示される矢印は、削除後のタイルの現在の動きです

タイルが削除されたときに予期される動作は何ですか?ここで、ユーザーはフィードの任意のページにアクセスできます。 タイルベースのUIで従う必要がある特定の規則、プロトコル、またはパターンはありますか?正しい方法は何ですか最適なユーザーエクスペリエンスでこれを実現するには

追伸現在、私は次のオプションを見ています:

  1. 次のリフレッシュまでタイルをグレー表示
  2. フィードを強制的に更新します(これにより、ユーザーがフィードの上部に表示されます)
  3. 同じ動作を維持し、他のオプションを開いています。
1
Aditya Durgude

ホームページの使いやすさに関するNielsen Norman Groupのガイドラインに基づくオプション1を選びます。

ユーザーがホームページをリロードまたは更新すると、変更が不快になる可能性があります。 移行をできるだけスムーズに保ち、ページの以前のエクスペリエンスとの継続性を維持するようにしてください。ホームページを自動的に更新して、ユーザーに更新をプッシュしないでください。自動再読み込みは煩わしい感じです。特に、ユーザーがページの一部を使用していて、リフレッシュ中に消えたり位置が変わったりする場合は、ユーザーの下から敷物を引き出すようなものです。

出典: 113ホームページの使いやすさの設計ガイドライン

これは基本的にオプション2を排除します。ユーザーが自分でページを更新するまで、タイルを灰色のままにします。グレー表示のタイルに「元に戻す」オプションを追加することもできます。

ユーザーは多くの場合、誤ってシステム機能を選択します。拡張ダイアログを経由せずに不要な状態を終了するには、明確にマークされた「非常口」が必要になります。 元に戻すとやり直しをサポートします

出典: 10ユーザーインターフェース設計のユーザビリティヒューリスティック

3
Nick Groeneveld