前回のエントリーは「検索」についてまとめまして、今回は「チラ見せインターフェイス」について。
まぁ、一言で言うと一覧ページの商品サムネイルにマウス乗せたときに出てくるアレですわ。
ZOZOTOWN
アレその1。マウスオーバーするとカラーバリエーションを表示。ってどんだけZOZO好きやねん。ART-Meter：絵画の測り売りサイト
その2。マウスオーバーすると絵の説明が表示されます。スリング専門店 pu-pi
これもチラ見せの一つ。マウスオーバーすると生地の拡大が見れます。今はほとんどCSS組みになったけど、JavaScriptのロールオーバーが何気に活躍。今はｊQueryとかのライブラリ。ほかにも取扱サイズも付箋っぽく出てるのがニクい。個人的にこのサイトのデザイン好きです。全体の遷移で若干わかりにくい所はあるけど。こんな感じで、商品の詳細ページへいかずとも、詳細情報の一部を「チラっと」見せるのを「チラ見せインターフェイス」と言います。すんません勝手に名づけただけです。
ここで表示させるべき情報はできる限り少なくてユーザーが求めているピンポイントな情報である必要があります。でないとウザいだけで。きちっとそれを検証した上で設計しないといけません。ペルソナ設定とか？よくわからんけど。
詳細ページへ遷移せずとも、ある程度の詳細情報が見られると、クリックした後のガッカリ感がなくなります。ユーザーの「無駄クリック」を無くして使い心地を良くするいい方法です。気をつけないといけないのは、そこで見せる「チラリ」はユーザーが求めていた「チラリ」であるのが前提で、運営側の「詳細ページへの遷移を増やす為に！」という名目になると、ユーザーの為であった「チラリ」が悪い印象に変わってしまう可能性もあるということ。例えると、背表紙見てレンタルしたのに中見てガックリみたいな。そーゆーのも含めて「チラ見せインターフェイス」と名づけたっていうわけではないですから。