jQueryでカラー写真を白黒に「jQuery.BlackAndWhite」
jQuery.BlackAndWhiteはjQuery/JavaScript製のオープンソース・ソフトウェア（MIT License）です。
写真は見せ方によって大きく印象が変わってきます。サイズを変えたり一部を切り出したりするのも良いですが、今回は色を変化させてしまうjQuery.BlackAndWhiteを紹介します。
[](http://images.moongift.jp/2013/06/Screenshot 2013-06-10 8.50.12.1370867093.png)
写真の一覧です。白黒でシックでシャープな印象です。ここにマウスオーバーすると…
[](http://images.moongift.jp/2013/06/Screenshot 2013-06-10 8.50.16.1370867099.png)
マウスを載せた写真だけカラーになりました。
[](http://images.moongift.jp/2013/06/Screenshot 2013-06-10 8.50.20.1370867105.png)
マウスポインタを移動すればカラーになる写真が入れ替わっていきます。
[](http://images.moongift.jp/2013/06/Screenshot 2013-06-10 8.50.25.1370867111.png)
白黒とカラーで随分印象が変わりますね。
仕組みから言えば、カラーの画像を読み込んで白黒にイフェクトしつつ、それを再度描画しています。白黒写真の中にカラー写真があるとぐっと目を引きつける効果が期待できそうです。
MOONGIFTはこう見る
少し前まではPinterestやInstagramのように写真をどう並べて、どう見せるかに主眼が置かれていました。写真素材自体は変化せず、その配置や周囲のデザインによって効果的に引き立たせていました。
しかし今後注目すべきは写真をリアルタイムに加工し、様々な見せ方を実現させる事かも知れません。Instagramなどの加工は一度きりですが、JavaScriptであれば何度でも繰り返せて、元リソースはそのままにできます。これは面白い使い方がありそうです。