iPhoneの傾きを使って見せ方を変える画像ビューワー「lenticular.js」
lenticular.jsはiPhoneの傾きにあわせて表示を変える画像ビューワーです。
iPhoneなどのスマートフォンでは傾きを検出できる機能があります。それを使った面白い画像ビューワーがlenticular.jsです。
美女が布を巻いて立っています。マウスを動かしてみましょう。
マウスの動きにあわせてくるくると回ります。
左右はもちろん上下にも動きます。
こちらはおっさん。おっさんも動きます。
車。これは面白い見せ方です。
こちらはiPhone版。
格段に大きい写真でくるくる。
iPhoneで車を表示した場合。
タネを明かせば当然画像がたくさん作られています。
lenticular.jsはたくさんの画像をマウスや加速度センサーの動きにあわせて差し替えることで動きを演出しています。フレームをより細かくすればするほど滑らかに動くようになります。
lenticular.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。
MOONGIFTはこう見る
データの見せ方はとても大事です。同じデータであっても見せ方一つで印象が全く変わってきます。さらにその表示するデバイスによっても与えるインパクトが異なってくるでしょう。iPhoneの場合はもちろん、その特性を活かした見せ方を考えるべきです。
技術的に言えば加速度センサー、位置情報、電子コンパスなどになってくるでしょうか。アプリ化していなくともそういった技術は利用できます。それによってアピールの仕方を変えれば、非常にインタラクティブでユーザウケの良いサービスが作れるかもしれません。