どのように優れた検索UIを設計しますか？

Question

ユーザーに「高度な」検索エンジンを提供したいと考えています。 私は基本的に、検索条件の多くが選択することがありますいくつかの一般的な/非常に単純であり、主に使用されます

• （すなわち期間、アイテムID）
• 一部が少し少ない主流です
• そして、いくつかは、多くのことを使用されることはありませんが、私はまだ、私は結果がdispl Iデータセットです

  から選んだために周り30+の基準を持って、彼らに

全体を提供したいですグリッド内にある。

私はインターネットでインスピレーションを求めています。さらにgoogleには高度な検索のための素晴らしい解決策がないようです。

私は過去にこの種のツールを設計していましたが、ユーザーは結果的にはそれほど効果的ではありませんでしたが、結果は本当にうれしくありませんでした。

• は、検索パネルは、（私はすべてのコントロールのためのより多くの場所を使用できるようになります）別の形

ですべての時間（つまり、私の結果グリッドの上に表示）または利用可能表示されている必要がありますと思いますか

• は、あなたはそれがすべての検索条件を表示するために、または彼はあなたが基準を整理する方法を複数の基準

• を使用/見たい場合は[詳細設定]でユーザーのクリックをさせた方が良いと思いますか？ （ユーザー、場所、時間などの基準に関する）

• 「検索」ボタンはどこに配置すればよいですか？より一般的な検索コントロールの横、または下部、またはその両方に表示されます。

もっと一般的に、すてきな検索UIをデザインする方法を共有したいというヒントはありますか？ この種の「高度な」検索エンジンでは、通常どのような機能が欠けていますか？

Answer 1

ただの一般的なアドバイス：簡単にしてください。多くの選択肢は、ユーザーを混乱させ、機能の一部が使用されない可能性を高めます。

貴重なものとそうでないものを見つけるために、さまざまなプロトタイプを試してみてください。

Answer 2

できるだけシンプルにインターフェイスを維持してください。ほとんどのユーザーは、テキストウィンドウと検索ボタンのみが必要です。残りのオプションは、高度な検索オプションの中に入れることができます。

この設定は、新規ユーザーにとっては面白いですし、実際に必要なより高価な高度な検索を保存することでリソースを節約するのに役立ちます。

Answer 3

私の考え：

- 必要に応じて高度な基準を表示してください。検索は、検索しようとする人々にできるだけシンプルにされているとすばらしいことです。

- 高度な検索の検索条件が非常に大きい場合は、検索結果を混乱させないでください。ユーザーが戻って条件を変更するのは非常に簡単で明白ですが、バットからすぐに条件を再確認して結果のスペースを無駄にしないようにしてください。

基準の整理は、それをすべて知らなくては言い難いです。他の人が言っているように/それは簡単です！一度にすべてを表示する必要はないかもしれません。私がもっと必要ならば領域を広げて、使いたくないものを隠すようにしましょう。その下に検索ボタンを押してください。しかし、再び、私はこのボタンを見つけるためにランダムな基準のページをスクロールしたくないでしょう。

Answer 4

• サイトのすべてのページにマストヘッドの一部として検索テキストボックスがあります。
• 「検索」の代わりに「検索」というラベルを付けるほうが、利点は常に機能よりも魅力的だからです。
• 洗練されたものは、検索アルゴリズムであり、GUIではありません。

Answer 5

私は「ルールのリスト」アプローチが好きです。

これは、ダイアログボックスが複雑すぎるのを防ぎますが、ユーザーに必要なすべてのオプションを提供します。

しかし、それは先進的なものが必要と仮定しています！インテリジェントに設計されたキーワードリストアプローチがうまくいくことがわかります。

Answer 6

UIの専門家ではありませんが、私は多くの悪いUIを見てきました。

• KISSは良いスタートです。
• 直感的にしてください。
• 検索を上と下の両方に保存します。私は、ページをタイプアップするように強制する何かを使用するのは嫌です（Flexのドキュメントを参照してください。ページングコントロールは一番上にあります - あなたが知っている悲惨な痛みです）。
• 基準の組織は、二倍にすべきである：80％がいつでも利用可能な基準のセットを編集アップフロント
• 動的に使用する
  • 基本的な演算子（20％）。
• ユーザは、ランプアップ時間を最小限にして開始し、必要に応じて基準を追加/削除できるようにします。アイデアは彼が必要とするものを使用するようにし、自分の思考やワークフローをあなたのフィーチャセットの輝きで混乱させないようにすることです。
• 一般的には、他の人が触れたように、現在のUIの傾向では、ユーザーが明示的に高度な/微調整（オンデマンドUI）を望むまで、そして隠さないコントロールを使用します。
• 経験則として、1ページに最大5〜7個のフィーチャを設定することをお勧めします。
• このような方法で、ユーザーが自分のクエリを読むことができるように、そしてオペレータがその中から何らかの意味を作り出すように、条件を並べ替えることができれば、それは素晴らしいことです。
• 私は小さなテキストの大ファンで、アイコンを理解しやすいですが、そのような設定はインストール環境によって異なります。あなたの孫は、その偉大な働き者を使用できますか？
• 良いデザインでは、あなたのUIをアクセス可能にする必要があります。それはクラックするのは難しいナットだし、私はあなたがそれをどうやってやるのか全く分からない。

最高の運！

Answer 7

デフォルトでは、高度なコントロールは非表示にしておいてください。高度なコントロールが表示されているかどうかにかかわらず、検索入力とアクションボタンは常に表示され、目立つようにする必要があります。高度なコントロールの表示/非表示がプライマリ入力またはボタンの位置を変更しないことを確認します。ユーザーの空間メモリに影響を与えないよう静的に保つ必要があります。

アドバンスコントロールについては、表示する必要があるデータの種類を正確に知らなくても、潜在的な組織方法の概要のみを示すことができます。個人的に、私はLATCHが好き：

• 場所
• アルファベット
• 時間（タイムラインや年表 - 歴史博物館を考える）
• カテゴリー（百貨店を考える）
• 階層構造（最小の最大の、最も明るいものから最も暗いものなど

あなたのコントロールに応じて、そのうちの1つが最も理にかなっています。チェックボックスやラジオのリストではなく、複数の範囲入力または範囲入力（たとえば、 'lightest'、 'lighter'など）を使用すると、ページ上の視覚的要素の数が減るので好ましい。

実際には研究を読んでいない人々が文脈から完全に取り除かれた「プラスマイナス7」ルールについては忘れてしまいます。つまり、画面上に表示されるオプションではなく、外部の刺激に対する人間の反応にのみ適用されます。これはあなたが船外に出なければならないということではありませんが、多くのオプションがあっても視覚的に調整できます。クラッタは情報ではなくデザインの失敗です。

各オプションに適切なサイズのクリックターゲットを与えるには、たくさんの空白と<label>要素を使用することを忘れないでください。これはチェックボックスやラジオを扱うときに特に重要です。

結果が返されるときに、ユーザーのクエリを元に戻した明確なタイトル（<h2>または<h3>）と、返された結果の数があることを確認してください。 0の結果ページを忘れないでください！可能であれば、クエリを広げるためのアドバイスを提供してください。

Answer 8

1）検索パネルが結果グリッドの上に表示されるはずですか？

Googleの基本検索のような簡単な検索パネルは、コンパクトであるため、結果ページに表示されます。これにより、新しいページやウィンドウに時間を浪費することなく、異なる基準で検索を再試行することができます。高度な検索ははるかに混雑しているため、検索結果への簡単なアクセス（小さな区画内）と再検索への簡単なアクセスの間には、より重要なトレードオフがあるため、ユーザーが再検索する頻度を評価する必要があります。結果。たとえば、再検索が50％の時間で行われ、[結果]ページの[詳細検索]パネルに75％の追加スクロールが必要な場合は、[結果]の[詳細検索]パネルを使用しない方がよいでしょう。一般的なルールとして、高度な検索は、データが実際に切断され、試されていない限り、結果ページに表示されるべきではありません。

検索結果の上部にある[検索]パネルのもう1つの問題は、結果が条件に一致しない場合（たとえば、結果が表示された後にユーザーが条件を変更した後で[検索]を再度クリックする前）高度な検索では、ユーザーが基準を変更したかどうかを忘れたり、忘れたりして、結果にどのような基準が適用されているのか混同するのがずっと簡単です。高度な検索を別のページに置くと、この問題は回避されますが、詳細検索が結果ページに表示されている場合（たとえば、即時適用「ファセット検索」を使用して）はこの問題を回避できます。

いずれの場合も、結果ページには、検索に使用された条件が表示されます。

2）あなたはより多くの基準のためにユーザーが「上級」をクリックさせる方が良いと思いますか？

ほとんどのデータベースアプリケーションでは、特定のグループのユーザー（仕事の位置など）には、2〜5の特定の検索基準があり、仕事の大部分でそれらを取得します（例：2人のユーザー特定の基準値（例えば、保留中のステータスを有するすべての注文を検索する）を有する基準を含むこともある。このような状況では、アドホック検索の[アドバンス]ボタンがある場合、ユーザーは最も早く、混同される可能性は低くなりますが、既定の検索ではこれらの特定の検索に合わせたコントロールがあります。ユーザーがの場合は、主にが探索的なアドホック検索を行っている場合にのみ、デフォルトの詳細検索に設定されます。

3）どのように基準を整理しますか？

頻繁に使用される特定の基準がある場合は、2で説明したように基本検索によって処理されるため、頻度別に詳細検索の条件を並べ替えることにはほとんど利点がありません。ユーザーが探している基準を見つけるのが難しくなります。一般に、特定の名前付きフィールドを念頭に置いているユーザーに頼ることができるので、アルファベット順に条件を並べ替えるか、ユーザーが結果ページをよく知っていて、そのフィールドがユーザーの考え方に沿ってレイアウトされている場合は、結果の列に使用されます。

4）「検索」ボタンはどこに配置しますか？

[検索]ボタンは、常に表示するのが理想です。最適なソリューションは、ペインの外側にあるボタンを使用してスクロール可能なペインにすべての基準を設定することです。上部と下部にボタンを置くことは、一般的であるが、クルージーな選択肢である。ユーザーが基本検索から高度検索に移行した場合、共通の基準を使用していない可能性があるため、共通の基準では示しません。 検索ボタンを使用すると、応答時間が500ミリ秒未満になる場合があります。

5）すてきな検索UIを設計するにはどうすればよいですか？フィールドベースの多基準検索のための

、二つの基本的なデザインがあります

。各フィールドの基準値を入力する場所を持つ、すべてのフィールドの形式。この問題は、設定値のあるフィールドが表示外にスクロールして、ユーザーが値を設定したことを忘れている可能性があります。したがって、これを可能な限りコンパクトに保つ​​必要があります。 1つのアプローチについては、Alan CooperのAbout Face 2.0のデータ検索の改善の章を参照してください。ユーザーが確認できる[検索]ボタンの近くに、選択した条件の概要文字列を入力することもできます。文字列内の各条件をクリックすると、ユーザーはそれを変更する基準にジャンプすることさえできます。

b。ユーザーは、フィールドのリストから条件で使用するものを選択し、その条件の値を統合された場所に設定します。ここでの主な課題は、フィールドを選択するための「オーバーヘッド」クリックの回数を最小限に抑えることです。理想的には、フィールドのリストは常に利用可能であり、1回のクリックでフィールドが選択され、統合された場所に配置され、カーソルが値コントロールに配置されます（http://www.zuschlogin.com/content/blogimages/37/FindAdvanced.gifに示すような検索）。 （任意の慣習では、「検索」はユーザーの「検索」とは非常に異なります）検索では、指定された条件に一致するものを検索している間、特定の条件に一致する現在のページ内のものを強調表示します）

これらのデザインは、フィールドは論理ANDによって作成され、基礎となるデータベーステーブル間の結合には制限がありますが、ほぼすべてのユーザーを満足させる可能性があります。タスクがより複雑な結合やブールの組み合わせを必要とする場合は、グラフィカルなクエリ設計（例えば、Badre AN、Catarci T、Massari A、& Santucci G 1996）を参照してください。図式的対象問合せ言語の使いやすさの比較J Kennedy & P Barclay（Eds）Interfaces to Databases（IDS-3）：データベースへのインタフェースに関する第3回国際ワークショップの議事録、Napier University、Edinburgh、7-10-8）およびQuery by Exampleの設計

Answer 9

私が使用するデフォルトのデザインパターンはFilter Tableです。おそらく、ユースケースの90％をカバーしています。より複雑な検索のためには、ユーザーの目的や使用例に関するより具体的な情報が必要です。そのため、これらの状況に最適なソリューションを設計することが可能です。

Answer 10

各質問（イタリック体）に対する私の回答が（通常のテキストで）尋ねられます。

「1）は、検索パネルは、私はすべてのコントロールのためのより多くの場所を使用できるようになり、別の形（）にすべての時間（つまり、私の結果グリッドの上に表示）または利用可能表示されている必要がありますと思いますか

結果グリッドの上部に表示すると、検索結果を表示するための余分な水平スペースが残され、水平方向にスクロールせずにさらに多くの列の検索データを表示できます。

「2）あなたはそれがすべての検索条件を表示するために、または 『高度』にユーザーのクリックをさせた方が良いと思います、彼はより多くの基準使用/見たい場合は、」

表示し、利用可能なすべての条件をが、タブ付きの方法で入力検索フィールドをカテゴリに分類し、各カテゴリのタブを有する。

「3）がどのように判断基準を整理するのでしょうか？使用頻度によって、あるいはむしろ、地域によって（すなわち、ユーザに関連基準、場所に、時間など）」

は、エリアによって」整理異なる人が異なる基準を使うのが好きだからです。 各条件にはそれぞれ独自のタブがあります。しかし、あなたが考えるように、「人気がある」から「あまり人気がありません」の順にタブを整理します。あなたのケースでは、タブは「名前による」（フィールド名、ミドルネーム、ラストネーム、母親の名前、ニックネーム、父親の名前など）、「場所による」（地名、郡名、地区名、州名、国名など） など、高度なタブ（使用するフィールドを最小限にする）まで表示されます。

「4）私は、次のより一般的な検索コントロールへ、または下、あるいはその両方で？ 『検索』ボタンを置くべき？」で前述したように

は、検索の入力フィールドを入れて「フィールドのタイプ」に基づいてそれらを分類するタブ付きの方法（この領域を検索グリッドと呼ぶ）。次に、検索グリッドの真下に合わせて「検索」、「クリア/リセット」などのアクションボタンを配置します（この領域をボタングリッドと呼んでいます）。次に、検索結果ウィンドウをボタングリッドの下に配置します。表示される水平領域が増えるため、最大の列を一度に表示できます。

Answer 11

infragistics UIパターンのサイト：http://quince.infragistics.comを参照してください。個人的に

、私はDevExpress社からxtragridのように、濾過可能なグリッドを使用して見たい：最初にグリッドを埋めるために、それ以上の検索バーと相まってhttp://www.devexpress.com/Products/NET/Controls/WinForms/Grid/datafiltering.xml

。

Answer 12

これはまだ言及されていないと思いますが、ユーザーが検索フィールドのいずれかでEnterキーを押したときに検索を開始する必要があることを忘れないでください。おそらくこれについて既に認識していると思いますが、とにかく言及する価値があります。

Answer 13

シンプルです。ユーザー受け入れテストを行った後で機能を構築し、ログを使用して使用する（または使用しない）機能を確認するという繰り返しアプローチをお勧めします。改善すべき点を知る唯一の方法は、ユーザーを監視することです。