web-dev-qa-db-ja.com

ジャンルを含む、ジャンルを除く書籍を表示するためのフィルター

シナリオ:

  • ウェブサイトに10,000冊以上の本のリストがある
  • ユーザーがジャンルを介して楽しむ可能性のある本を見つけたい(15から選択できます)
  • チェックボックスをオンにして、「スリラー」というジャンルを含む本だけを表示します
  • 「ホラー」というジャンルも含まれている本が多すぎる(ユーザーがホラーを好まない)
  • ユーザーは、返されたスリラーのリストから「ホラー」を除外する方法を望んでいます。

できれば「インクルード」リストを乱雑にしたり妨害したりしないジャンルをユーザーが除外できる、不格好でない方法を探しています(これは、フィルタリングの主要な方法と見なされる、堅固でシンプルなUXです)。また、15のジャンルすべてを別のチェックリストに再度リストする必要がないようにしたいと思います。同じUIの一部として他の種類の一般的なフィルター(長さ、並べ替え、キーワード検索)がありますが、私は上記のヘルプのみが必要です。

私は、何らかの方法でアクティブ化されない限り、除外を最初は非表示にしておくと考えていました。

UIの領域はフルハイトのサイドバーであり、幅は最大250pxで、個別にスクロールできます。

4
Mr DC

各ジャンルの横にある3つの部分からなるコントロールを使用します。

  • 含める
  • 除外する
  • 気にしない

上部には「すべて」の選択肢もあるので、ユーザーはすべてを「含める」として簡単にマークできます(次に手動で一部を除外または無視します)、「除外」(および必要なものだけを手動で含めます)、「ドントケア」(そして手動で選択してください)。

それは3つのボタンであるかもしれません、しかしそれは多くのスペースをとります。または、色が変化するスライダーが適切に機能する場合があります-含める=緑、除外=赤、ドントケア=黄色。

次のモックアップのように、Word cloudについてはどうでしょうか。

mockup

download bmml sourceBalsamiq Mockups で作成されたワイヤーフレーム

Wordクラウドの特定のジャンルをクリックすると、取り消し線またはグレー表示になり、ユーザーが気が変わった場合に選択を元に戻すことができます。
[ジャンルを指定]リストで別のジャンルを選択すると、新しいWord cloudで完全に新しい検索結果が生成されます。

0
Mike