web-dev-qa-db-ja.com

ブレッドクラムと選択したファセット/フィルターを1つに組み合わせる

ファセット検索などのサイトがあるとします。ユーザーが選択したファセットを、ファセットナビゲーションコントロール(左縦)の一部としてだけでなく、ページの上部にも表示したいと考えています。

選択されたファセットを上部に表示することは、どの選択(私の場合はホテル)が表示されるかを一目でユーザーに知らせるための良い方法です(選択されたファセットを削除して結果セットを広げるオプションがあります)。

この推論に沿って、「選択されたファセット」を(ほとんど)表示すると、一般的なナビゲーションの一部になります。つまり、サイトのどこにいるのか(提供されたフィルターなど)を示します。

この観点から、「アクティブなファセット」の表示と「ブレッドクラム」を組み合わせて、ユーザーがサイトのどこにいるかを統一的に把握することは意味がないのではないでしょうか。

それは私にとって意味があるので私は尋ねていますが、これが以前に行われたのを見たことがありません(または私も完全に可能であるように十分によく見えていません)

例えば:

  • 検索>ホテル>フィルター:2月12日-2月14日、2人
  • 探索>アクティビティ>フィルター:ロマンチック
  • 検索>ホテル>ホテルの詳細:>フィルター:2月12日-2月14日

現時点で私のデザインの1つがどのように見えるかを示す小さな画像を添付しました。

breadcrumb + selected facets (shown as 'filters') of a hotel-detail page

これはうまく機能しますか。パンくずリストと選択したファセットは、ユーザーがサイトにいるのと同じ「メンタルモデル」の一部ですか?

9
Geert-Jan

はい、フィルターをブレッドクラムと統合して、より堅牢な製品閲覧エクスペリエンスを作成することが可能です。このようなシステムは ファセットナビゲーション と呼ばれます(フィルターはファセットです)。これには1つ注意点があります。ユーザーに、残りの部分を変更せずにユーザーを編集または削除するオプションを提供する必要があります。

ブレッドクラムを模倣したファセットナビゲーションは、分類とオプションが静的なeコマースサイトに簡単に実装できます。ただし、お客様の状況(ホテルの空室状況)では、データベースクエリがより複雑であり、完了するまでに時間がかかるため、技術的な問題が発生する可能性があります。そのため、サイトの特定のセクションでは使用せずに、他のセクション(アクティビティ検索など)で使用したい場合があります。

非常に柔軟なファセットナビゲーションの私のお気に入りの例はNewEggです。
newegg faceted navigation
各ファセット(高レベルのカテゴリではない)に(x)削除するためのリンク。

その他の例と高度なナビゲーションパターンについては、「 Categories、Facets—and Browsable Facets? "を参照してください。

7
dnbrv

ブレッドクラムはウェブサイトにlocationを示し、フィルターはmodeを示すために使用されます。 2つをUIの同じ領域に配置すると、実際には同じものであることが示唆され、混乱を招く可能性があります。

ソリューションから生じる1つの複雑さは、2つのコンポーネントが通常、互いに独立して動作するように設計されていることです。たとえば、別のホテル(場所)に移動できますが、フィルター設定(モード)は保持します。フィルターが低レベルのブレッドクラム項目であることを示唆しているため、提案は混乱する可能性があります。別のホテルにアクセスすると、ブレッドクラムの一部が変更されますが、ユーザーが変更を確認するのに慣れている一番右の要素にはなりません。

全体的にあなたの考えは少し複雑に聞こえます、そしてそれがどんな問題を解決するのかわかりません。ただし、視聴者がそれを理解できるかどうかを確認するには、モックアップを作成して、何人かのユーザーと試してみるのが一番です。

4
Rahul