web-dev-qa-db-ja.com

動的に入力されるドロップダウンの使いやすさを向上させる方法は?

私は改善したい「ユニークなユーザーインターフェース」を持つクライアント用のアプリケーションに取り組んでいます。

Search Drop Down

現在、ユーザーがこのWebページにアクセスすると、地域のドロップダウンが1つだけ表示されます。ユーザーがリージョンの選択を開始すると、ページ全体が送信され、ゾーンのドロップダウンが表示されます。これは、すべての値が選択されるまで、ドロップダウンごとに繰り返されます。地域、ゾーン、地区、およびディーラー。

ページ全体が更新され、多くのクリックを必要とするため、これはユーザーにとってあまり使い勝手がよくないこと、明らかに好ましいことではありません。ここにユーザーエクスペリエンスを向上させる方法があるかどうかを確認したいと思いましたか?

UIを改善できない場合は、AJAXを呼び出してページ全体の更新を回避することをお勧めします。しかし、UIを改善するにはどうすればよいですか?

私が理解していることから、あなたはあなたが育てたいディーラーの名前をすでに持っています。

この特定のUI設計アプローチは、物事に到達するための物理的な世界の方法を複製します。そのディーラーに行きたい場合、どうすればいいですか?さて、私はその地域に行って、ゾーンに行き、地区に行き、そしてディーラーを見つけなければなりません。現実の世界では、あまり選択肢はありません。

しかし、ここでの目的のためには、検索ベースのアプローチがより適切であるだけでなく、はるかに単純で使いやすいと思います。

ここで私が話しているのは、Googleの提案に沿ったものです。ユーザーは、呼びたいディーラーの名前を入力し始めます。その名前の1つだけが存在する場合は、まあまあです。あなたはそれを持っている。そうでない場合は、地域、ゾーン、地区の情報を組み込んだ一連の「提案」が表示され、ユーザーは目的の情報を選択できます。

6
nemo

私は提案がありますが、最初にそれはかなりよく知られているパラダイムであり、うまく実装されていれば(ページ全体が更新されず、おそらくすべてのドロップリストが表示されていない場合)、うまく機能します。
垂直方向のスペースが少ない場合を除いて、ドロップリストを上下に並べることも検討します。

エクスペリエンスを完全に変更したい場合は、たとえばマップを追加してみてください。
これは、一部のユーザーが場所をより簡単に選択するのに役立つ可能性がありますが、キーボードと入力だけを使用することを好むユーザーにとっては少し面倒かもしれません。

これをエッジに適用したい場合は、無料の形式を解析してみてください。つまり、ユーザーが何かを入力して、そこからすべてのパラメーターを推測できるようにします(Googleマップなど)。

1
Dan Barak

Vijayの応答に追加したかったのは、ウェイファインディングと検索の複数の手法を検討できることです。つまり、ディーラー名のオートコンプリートを実行でき、ユーザーが反対側からドリルダウンできるようにすることもできます。リージョン、ゾーンなどを通過します。フォームの別のセクションまたは別のフォームを完全に使用できます。さまざまなサイトの主題を理解するために、ウェイファインディングと検索のパターン、およびそれらがWebデザインにどのように影響するかについて詳しく学ぶことができます。このテーマに関する優れた書籍には、Morville&Callenderによる検索パターン、MorvilleによるAmbient Findability、さらにはインターフェイスデザインの章のWebスタイルガイドのセクション(これは印刷物だけでなく、オンラインでも無料で入手できます)が含まれます。

1
ericawebdev