動的にソートされたリストとの相互作用
現在、曲のリクエストが入力されるリストがあります。各曲のリクエストは、タイトルとアーティスト名のリストアイテムとして表示され、（Redditと同様に）賛成と反対のボタンが付いています。曲のリクエストのリストは、投票数によって常に動的に並べ替えられます。ユーザーが曲のリクエストに賛成票または反対票を投じようとすると（それを聞きたいかどうかを示すため）、その歌のリクエストは、賛成の場合は緑色に点滅し、反対の場合は赤色に点滅し、リストがスクロールして新しい位置にフォーカスしますユーザーの投票アクションが何をしたかに関してユーザーに有益なフィードバックを提供するために、曲のリクエストが行われました。
現在の問題は、リストが動的に並べ替えられているため、任意のタイミングで並べ替えられる可能性があり、ユーザーが操作するためのリストが不安定になる可能性があります。ユーザーはいつでも曲のリクエストを操作しようとするかもしれませんが、リストはその時点で並べ替えられる可能性があり、ユーザーを混乱させ、不安定な多くの「ジャンプ」を作成します。
解決策の1つは、一定の動的な並べ替えを破棄し、代わりに更新ボタンを提供して、ユーザーが曲のリクエストの新しい並べ替えを表示できるようにすることです（おそらく、曲のリクエストの位置がリスト内でどのように変化したかを確認するためのアニメーションが含まれています）。最後のリフレッシュ以降）。ただし、これはユーザーにとってかなりの作業のようであり、ユーザーがリストを更新していない間は、曲のリクエストの順序が不正確になっています。
もう1つの潜在的な解決策は、ユーザーのマウスが曲のリクエストリストの上に置かれたときに並べ替えを無効にすることです。ただし、モバイルデバイスでは、このような同等の検出は行われません。
最後に考えられる解決策は、ユーザーがリアルタイムの並べ替えのトグルとして使用できる一時停止ボタンのようなものを提供することです。一時停止すると、リアルタイムの並べ替えが無効になり、ユーザーは安定した静的なリストを操作できます。一時停止を解除すると、動的な並べ替えが再び有効になります。
この問題に対して、モバイル環境とデスクトップ環境の両方に互換性のある他の解決策があるかどうか知りたいです。
ここで重要なのは、リストは不安定ですが、2つの状態しかないということです。
私がタップしたかった曲はそれが始まった場所にあります
タップしたい曲が移動しました
私の解決策は2つになります。
- 強引で不必要なアニメーションを使用して、リスト項目が状態を変更しようとしている、状態を変更している、および新しい状態にあることを明確にします。そのため、背景色を明るくして、要素を視覚的に移動してから、通常に戻すことができます。
- リストの更新をデバウンスして、予測可能な間隔で行われるようにします。多分それは行う変更を追跡し、それらの変更を30秒ごとに行います
おそらく、更新プロセスはある種のタイマー（例えば5秒ごと）で行われます。その場合は、リストを操作（デスクトップでスクロール、モバイルで上下にドラッグ）して時間をゼロにリセットします。つまり、ユーザーがアクティブであれば何かをしている、彼らが更新がそのプロセスを妨害するのを見たいと思う可能性は低いです。 （更新が「ライブ」である場合、つまりサーバーからプッシュされ、通常はすぐに処理された場合、禁止された期間、対話delay更新を行います）。
さらに、（ Adarsh Sosaleの回答 のサイドバーのアイデアに触発されて）投票ボタンがデフォルトで表示されない場合があります...右（モバイル）からスワイプするか、またはクリックしたときにのみ表示されます。いくつかのトグルボタン/アイコン（デスクトップまたはモバイル）。投票ボタンが表示されると、すべての更新が一時停止されます。投票ボタンを閉じる/非表示にすると、通常の更新プロセスに戻ります。 （ユーザーが一度に複数のエントリに投票することを期待するかどうかに応じて、ユーザーが投票したときにボタンを自動的に非表示にすることができます） 。
アプリケーションの動的な側面をモーダルページまたは別のページに取り込むことを検討してください。ユーザーがアプリケーションのこの部分にアクセスするたびに、リストがリアルタイムで反映されるようにリストの順序が変わる場合があります。ページ読み込み時のアニメーションは、迅速で、既存のリストの更新を反映しているため、リストの動的な性質を強化するのにも役立ちます。ここに更新ボタンを追加して、強制的に更新することもできます。
別のエレガントなオプションは、リストのリアルタイムのステータスを表示する実装のようなサイドバーと、最新のリストとリストを更新して同期するボタンを持つことです。
動的に変化する実用的なリストを作成することは、本当にイライラさせられます！