web-dev-qa-db-ja.com

アカウントエリアでのファセット検索の最適なソリューション

私の会社は、データをリストで表示する新しいメンバーシップサイトを立ち上げています。私はデザイナーとして、ユーザーを念頭に置いてアカウント領域を設計しようとしています。検索用のフィルターを適切に取得できません。

enter image description here

本当に新しい視点が欲しいです。フィルターは左側に向かっており、1つのアイデアは、各フィルターをクリックしたときにフライアウトすることでした(カテゴリーや国も同様であるため、すべてのフィルターを[Amazonのように]縦に拡張するのではなく、長いです)。したがって、ユーザーが「Categories」をクリックすると、1つのシナリオとして、すべてのカテゴリがポップアップ表示されるフライアウトメニューが表示され、[カテゴリ]をクリックしてそのメニューを閉じるよりも多くのカテゴリを選択できます。

上部のボタンには、選択したフィルターが表示されます。

私が言ったように、私は新しい視点とアイデアを探しているだけです。完全な再配置、さまざまなアイデア...何でも。

5
kennyk3

何かが私を混乱させます。 「ベンダーを参照:[検索ボックス] [送信]」と表示されます

私にとってブラウジングとは、検索クエリを入力するのではなく、クリックすることです。このページのタイトルは「ベンダーの参照」だと思いますが、検索ボックスのラベルとして表示しています。

Chrisはフィルターコントロールを統合するための素晴らしい提案をしていると思います。フィルターを設定するコントロールは、フィルターが設定されているかどうかに関係なく、フィルターを解除するコントロールと同様に保持されます。可能な場合は常に、制御、その状態に関するフィードバック、およびその状態の反転の間の明確な関係を常に維持してください。レシーバーの電源スイッチがオンとオフを切り替える方法と同様に、通常、オンのときに緑色に点灯するLEDが統合されているか近くにあります。

フライアウトやドロップダウンの使用を断念することは可能かもしれないことを付け加えたいと思います。彼らはユーザーのターゲットを動かしています。通常、カーソルの位置に注意する必要があります。また、役立つ情報についても説明します。代わりに、フィルターとテーブルの間の領域を引き出してみませんか?ユーザーが[送信]をクリックするまでそのままにして、カーソルを特定の領域に置いておく必要がある、または領域の外側をクリックしないように注意するという「操作ゲーム」の問題(オランダ語ではBibber博士)を解決できます。

これにより、フィルターを強化するための十分な余地も得られます。巨大なドロップダウンメニューの代わりに、すべての国のアルファベットインデックスを使用できます。

mockup

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

1
Koen Lageveen

どの矢印がフィルターであり、テキストが表示されているかを示す矢印がなければ、それらを混同していたでしょう。

左側のアイコンナビゲーションは、(他のページへの)ボタンナビゲーションのように見え、ドロップダウンフィルターではありません。矢印などを組み込んで、さらに多くのオプションがあることを示します。私はまた、(あなたが説明したように)クリックではなくホバーでそれらのドロップダウンをアクティブにすることを検討します。ホバリングは、すべてのフィルターをクリックするよりもはるかに高速です。

ニューエッグは良い例です。

表示テキストもボタンのように見えます。実際、私はまずドロップダウンメニューを期待してそれらをクリックしたでしょう。言葉遣いとそれらの表の上の位置は、より関連しているようです。

テーブルを全幅に拡張できず、テーブルの上に1つのフィルターナビゲーション(フィルターと表示テキストの組み合わせ)を配置できない理由はありますか?現時点では、フィルターと表示テキストの間の距離により、それらは無関係で少し混乱しているように見えます。新しいフィルタが選択されたときに、検索結果を自動的に更新することもできます。

enter image description here

0
Chris N.