写真は撮ったそのままよりもある程度加工した方が映えることがあります。とは言え、画像編集ソフトウェアを使うと元画像が変更されてしまうのでわざわざコピーを作成して編集すると言った手間が発生してしまいます。 そこで使ってみたいのがjQuery filter.meです。WebベースでJavaScriptを使って画像加工するので何度でもパラメータを変更して画像編集が試せます。

jQuery filter.meの使い方

jQuery filter.meが面白いのはPhotoshopのトーンカーブ設定ファイル（acv）を使って画像加工が行えるということです。トーンカーブの設定を色々作れば、後はWeb上で多彩に試して表示を確認できます。

使い方としては、JavaScriptで次のように指定します。

$('.filter').filterme({
    desaturate: false   // Value from 0 - 1. 1 equals full desaturation (black & white).
    curves: false       // Object of RGB values in production script, or string name of curves .acv file in development script.
    vignette: false     // 'true' or 'false'. Add a vignette to the image.
    folder: 'acv/'      // Development script only. Location of the .acv folder, relative to the current file.
    debug: false        // Set to 'true' for script debugging. Logs information along execution in console.
});

そしてHTMLのdata属性でフィルタを指定します。

<img src="photo.jpg" class="filter" data-filter="Nashville" />

JavaScriptで画像加工方法を指定するのは面倒ですが、Photoshopを使ってテンプレートが作れるならば色々なパターンを生成できるでしょう。後は実際にどれがいいかはjQuery filter.meを使って確認できるはずです。

jQuery filter.meはjQuery/JavaScript製、MIT License/GPLのオープンソース・ソフトウェアです。

jQuery filter.me » Filter your images via Photoshop Curves MatthewRuddy/jQuery-filter.me