web-dev-qa-db-ja.com

多層の大きなノード（300以上）のカテゴリツリー-最高のセレクター？

私たちの製品には、ユーザーが自分の完璧なカテゴリーを見つけるためにナビゲートする必要がある大きな多層カテゴリー・ツリー（300以上のノード）があります。

当社のユーザーはイベントマーケティング担当者であり、正しいイベントカテゴリを選択することは、製品の配信に不可欠です。ユーザーは90％以上の確率でこのフォームにWebアプリ経由で入力しますが、モバイルは二次的な懸念事項です。

現在の実装

新しい（新しい）実装： http://g.recordit.co/LtutziUPZH.gif

オプションSelector Options

あ

  • Tier 1を選択-> Tier 2を選択-> Tier 3を選択...

B

  • 検索可能なリスト、結果の前に「3」文字を入力
  • 完全にスクロール可能なリスト
  • カテゴリツリー全体を表示するモーダルポップアップ

答えはおそらくこれらのいくつかの組み合わせになります。誰かが共有する同様の経験を持っていますか？

usabilityformsuser-behaviorsearch
4
Phil L

オプションBの方がはるかに良いオプションであることに他の人も同意します。これは、多数のカテゴリを持つ人がそれを処理する方法とほぼ同じです。アマゾンとebay。 Amazon/ebayは、階層を通過するという二次的なオプションを許可しますが、これは通常二次的なものです。

たいてい見栄えの良いgifを見ると、オプションが検索の一部として表示される理由を理解するのが難しい場合があることに気付きました。

Stack Exchangeには独自の非常に優れたカテゴリセレクタがあります。

注意すべき点：

  1. 一致する文字列に下線を引きます
  2. それらはクロスカテゴリーを持っています。パフォーマンスと応答時間
  3. カテゴリの説明が含まれています
  4. 彼らはより多くの情報を与えるためにメガメニュースタイルを使用しています
  5. 検索すると、それらはまだあなたがするのと同じくらい多くのカテゴリーを表示しています（5）

enter image description here

1
icc97

検索バー（オプションフィルター）を追加できます。セマンティックUIには、そのための優れたソリューションがあります。 https://semantic-ui.com/modules/dropdown.html#search-selection

私は自分のアプリケーションで400人のユーザーのリストを使用してメッセージレシーバーを選択するためにこの方法を個人的に使用しましたが、うまく機能しました。

1
Ivan Venediktov

2番目のオプションは最初のオプションよりもはるかに使いやすいようです。私の意見では、ユーザーに「カテゴリが見つかりません」と言う方法と、別の検索方法を提供することでしょう。

0
DarrylGodden