大規模な検索フォームの適切な UI パターンを説明しているリソースを見つけるのに苦労しています。20 種類以上の入力が必要なフォームがあり、納得のいくデザインを思いつくことができません (ただし、私はデザインの専門家ではありません)。私の場合、Web ソリューションを探していますが、このシナリオの UI パターンはおそらくプラットフォームに依存しないと思います。
Google や Amazon (高度な検索) などのサイトをいくつか調べましたが、他にもっと良いアイデアがあるかどうか疑問に思っています。助言がありますか？
グーグルの高度な検索は良い出発点だと思います。
次のことを覚えておくとよいでしょう。
フォームの各フィールドの必要性について明確にしてください。それらはすべて完全に必要かもしれませんが、そうでないものもあれば、フォームを不必要に複雑にしている可能性があります。
フィールドセットを使用して質問を論理的な領域にグループ化し、ページ上で視覚的に分離してみてください。これにより、フォームの処理が簡単になります。
javascriptを使用してフォームの領域を非表示にして、最初のビューの混乱を少なくすることができます。ただし、これらのセクションを表示するためのコントロールのラベルが適切でない場合、ユーザーを混乱させるリスクがあります。
できるだけ多くの人にデザインを試してみてください。理想的には、それを使用するコミュニティの人たちです。
検索フォームのデザインにはいくつかの特定の課題があることを認識していますが、次のリソースが役立つはずです。
Wufoo-さまざまな目的のためのフォームデザインですが、そこには何か役に立つものがあるかもしれません。
Luke Wroblewskiの著書「Webフォームデザイン」は、フォームのデザインとレイアウトの方法に関する知識を深めようとしている場合の出発点として最適です。この本を手に入れる時間がない場合は、彼のWebサイトにも役立つヒントがいくつかあります。
さらに深く掘り下げたい場合は、ルイス・ローゼンフェルドとピーター・モーヴィルによるワールドワイドウェブの情報アーキテクチャを検討することもできます。今は少し古いですが、Webサイトの検索システムの設計に関する優れた章がいくつかあります。
プログレッシブ・ディスクロージャー(こちらとこちらとこちらを参照)とレスポンシブ・イネーブリングをご覧ください。また、適切なデフォルトがあれば役立ちます。「ユーザーからの入力を取得する」ための他のパターンを見てください。
通常、検索フィールドを 2 つのグループに分割できます。
この分割を問題に適用できれば、入力フィールドの最初のグループを含むフロントエンドを作成し、次にオンデマンドで開く/拡張する 2 つ目のフロントエンドを作成するのは簡単です。私は Web 開発者ではないので、この UI の動作を実現するのがどれほど難しいかはわかりません。
どのショッピング (nexttag.com、become.com、froogle.com、shopzilla、ebay など) サイトでも、このビジネスを行うことができます。ただし、私の考えは、ツールチップを作成して入力を取得し、送信後(ツールチップのボタン)、ツールチップが消え、結果が親ページに表示されることです。