選択時のチェックボックスリストの並べ替え
チェックボックスリストのチェックボックスをオンにすると、選択したアイテムがリストの一番上に表示されるように要求しているユーザーストーリーの要件があります。
私の直感は、これはユーザーを混乱させると言っていますが、私はより「UX-y」タイプの説明を私の製品所有者に提供したいと思います。
その提案で私が目にするさまざまな問題があり、最も顕著に：
- ブレイク規約：チェックボックスはWebページでは非常によく知られた要素であり、その提案は、静的であり続ける、非常によく知られた広く普及しているリストの規則とはかなり異なります。チェックボックスの変更（たとえば、オン/オフに切り替えられる）と Jakob NielsenのWebユーザーエクスペリエンスの法則 は、「ユーザーはほとんどの時間を他のWebサイトに費やしている」と述べているので、確立された慣習を無視するための本当に良い理由。
- オフページ要素：リストが「折り畳み」を超えて拡大する可能性がある場合、この相互作用を行う方法は考えられません優雅に。ユーザーには、A）アイテムを選択すると非表示になるアイテム、またはB）リストの最上部にジャンプする（おそらく）破壊的なアニメーションが表示され、以前のコンテキストから削除されます。
- ブレークソート：リストに何らかのタイプのソートがある場合、この移動によりソートが不整合になります（つまり、チェックされていないアイテムとチェックされているアイテムがソートされます）別に）、または過度に複雑です（つまり、並べ替えは一番上の規則のチェックボックスをオーバーライドしますが、その規則はユーザーが別の規則を選択すると再び表示されます）。
これは、ユーザーが解決しようとしている問題を説明するだけでなく、ユーザー自身がソリューションを設計しようとする典型的なケースです。
この対話で達成したいことをユーザーに尋ねます。
この情報を入手すると、代替ソリューションについて話し合うのに適した場所になります。
（質問をすることは、誰かをオープンマインドにするための良い戦略です。誰かに間違っていると伝えると、彼らは防御的になり、元の立場に固執する可能性が高くなります。）
変更したばかりのアイテムを簡単に見つけられるメカニズムが必要だと私は強く思います。
変更を識別するためのより良い解決策は、異なる色の変更で行を強調表示することです。行が大量にある場合（つまり、画面外の行がある場合）、ビューを切り替えて変更のある行のみを表示するフィルターを提供することもできます。
または、アイテムをアニメーション化して上部に移動することもできます-アニメーションは常により多くの情報を伝えます。しかし、上で述べたように、「消える」ほど多くのアイテムがあると混乱することは事実です。
プロダクトオーナーは、選択をユーザーにわかりやすく、わかりやすいものにするという「良い」意図を持っていることをお勧めします。
実際、すべての要素のセットを未選択と選択に分割するパターンは、要素が多い場合に便利です。あなたは例を見ることができます：
選択したチェックボックスを移動することは、このパターンを実装する試みですが、最善ではありません。
私の命題は少し異なります。モックアップを見てください：
ポイントは次のとおりです。
- メイン領域で選択した要素を複製して、それらへのクイックリファレンスを提供します。
- チェックされた要素をメイン領域から簡単に削除する方法を提供します（チェックボックス領域で適切な要素のチェックを外します）
- チェックボックス領域で選択した要素を目立たなくして、チェックされていない要素にユーザーの注意を集中させる