デジタルカメラを対象にしたこちらや携帯電話を対象にしたこちらを参考にして習作目的で制作してみました。
スライダーバーやチェックボックス、プルダウンメニューなどで取捨選択された情報から製品を絞り込み、その結果、該当した製品のイメージだけが表示されるというコンテンツです。ターゲットをテキストで構成した場合はこちら。
　使用している自動車の写真は、市販されているミニカーを撮影し、スペックはそのミニカーの車種をもとにネット上で調べ連動させています。細かい形式が不明なミニカーからスペックを結びつけていますので、掲載している車種とスペックが実際に販売されているのものと違う場合があるかもしれません。もし、この車種でこの数値は絶対にありえないというものがあればお知らせ頂ければと思います。尚、デモ版ですので購入などの参考にはなさらないでください。万が一、情報に不備があっても当方では、責任を負いかねます。
　このデモ版ではターゲットを自動車にしてありますが他に考えられる例として、食品などに含有される栄養素やカロリーなどの分類。サービス関連では、旅行のパッケージを内容や日時、料金による分類。技術を要とする職種に従事しているスタッフを技能またはサービスで分類。一般的にはカタログやパンフレットなどで商品の写真の近くに表示されている性能や特徴、サービスなどを示すピクトなどを分類の基準に考えると理解しやすいと思います。
　習作とはいえ、参考にしたサイトとまったく同じ機能では意味がありませんので、２方向からしぼり込めるスライダーバーと簡易ソート機能を付けてあります。
 

スライダーバーやチェックボックス、プルダウンメニューなどを可動させて情報を絞り込みます。絞り込みの結果、該当する製品は表示され、該当していない製品は非表示となります。簡易ソート用のプルダウンメニューにて項目を選ぶと製品が並びかわります。

絞り込みはビジュアル（製品の表示）と連動しており、万が一、絞り込み結果に該当する製品がない場合でも、スライダーバーなどで絞り込みの範囲を広げることが容易に行える為、目的とする製品に一番近い製品が何かを得ることが可能です。また、絞り込み変更毎にサーバーへアクセスしない為、容易かつ短時間に絞り込み範囲が変更出来ます。

ビジュアルを重点におくことによるファイル容量や絞り込み変更時のスピードなどを考慮すると、おのずと掲載点数に上限をもうけなければいけないでしょう。また、製品の差し替えによる更新なども掲載内容や環境によっては手間が掛かるかもしれません。

このコンテンツは、ENGAWA LABさんのブログで、「ファセット分類」に関する情報が掲載されていたことがきっかけになり制作してみました。