サムネイルの感触を試してみる

サムネイルをクリックすると大きい画像を表示します、という見せ方はよくあると思います。そのとき、大きい画像の出し方を考えるあまり、サムネイルの感触はお座成りになっていることがあるなぁ、と思うことがありました。
たとえば JS の Lightbox や Thickbox に代表される表現。あれは、拡大画像をいかにかっこよく見せるか、を考えられたものであって、サムネイルについては、いかに簡単にスクリプトを仕込むことができるか、という部分によって大事さが端折られてるようにも思えるのです。

まずはこれを見てください。

これは3パターンのサムネイルの感触を表現してみたものです。
・マウスを乗せるとボーダーの色が変わる
・マウスを乗せるとマスクが広がる
・マウスを乗せると一瞬、光る
というインタラクションがあって、広がる、っていうのはFlash的だなぁ、と思えます。他の2つはJSでもCSSでもできるもんね。

サムネイルの場合なんですが、1個だけサンプルを作っても、あんまり意味がありません。実際に使う場合は、いくつかのサムネイルを並べた状態になるので、サンプルを作るにしてもいくつか並べてみるのがいいと思います。

派手ならいいってもんじゃないので、コンテンツに合った感触が求められるのは当然のことです。が、「これは触ってて気持ちイイ」っていうピッタリ感があれば、あるいはその感触がついているもののクリック率が高ければ、コンテンツを作る指針になりそうな気がします。

この記事には、カテゴリ UI タグは , , がつけられています。