ITエンジニア/デザイナ向けにオープンソースを毎日紹介

CSS PhotoEditorはiOS6のMobile Safari上で使えるスタイルシートによる画像編集ソフトウェアです。

Webアプリケーションの機能が増すにつれて、徐々にネイティブアプリでしかできないと思われたことがWebブラウザで実現するようになっています。今回はCSSを使った写真編集アプリケーションCSS PhotoEditorを紹介します。


下に並んでいるのが画像編集用機能で、上にあるメーターで調整します。


明るさを調整。


コントラストを強めに。


色合いを変更しました。


ぼかし設定。


セピアに調整。メーターのアイコンが変わっているのも注目です。


透明度調整。


横向き表示にも対応しています。


紹介動画です。

CSS PhotoEditorは9つのフィルタ、水平表示への対応、Ajaxベースのファイル読み込みなど面白い機能がたくさんつまっています。ぜひサイトにアクセスしてその操作性を確かめてみて下さい。なお画像の保存機能はありませんが、ダブルタップで画像だけを拡大表示しますのでそれを保存すればフィルタリングが行われた画像を保存できます。

CSS PhotoEditorはJavaScript/PHP製のソフトウェア(ソースコードは公開されていますがライセンスは明記されていません)です。


MOONGIFTはこう見る

CSS PhotoEditorはiPhone4Sレベルでは若干重たいのが気になりますが、機能的にはとても興味深いソフトウェアです。写真全体にフィルタがかかってしまいますが、ここまでの加工ができるなら十分ではないでしょうか。Instagramレベルの画像加工であればWebベースで十分こなせそうです。

CSSで行う場合、そのフィルタの設定さえ保存できていれば元画像を元のまま保存しておけるのが利点と言えます。サーバサイドでの合成と異なり、好きなタイミングで画像を自由に加工できます。ネイティブに頼らない画像加工も選択肢として十分考えられるようになってきたのではないでしょうか。

CSS PhotoEditor for iOS6 - kudakurage

kudakurage/CSS-PhotoEditor-for-iOS6 · GitHub

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2