ユーティリティ - 画像編集の記事一覧
filters.css - CSSを使って画像の簡易編集
写真を加工する際には画像編集ソフトウェアを使います。UGM（ユーザー生成コンテンツ）の場合、アップロードされる画像すべてを加工するのはたいへんです。サーバ側で処理できますが、サーバの負荷は大きくなるでしょう。そこで使ってみたいのがfilters.cssです。CSSベース、クライアント側でフィルタリング処理が可能です。#...
Photon - WebAssemblyで高速画像編集
WebAssembly（WASM）の大きな特徴として、その実行速度が挙げられます。Webブラウザ上で実行されるJavaScriptでは限界があった速度も、WebAssemblyであればネイティブ並の速度で実行できます。そんな実行速度の速さを活かしたソフトウェアがPhotonです。WebAssemblyの力で画像を処理し...
Perspec - 画像の歪みをGUIで補正
スマートフォンのカメラが高性能化しているので、書類などを撮影してスキャナ代わりに使っている人が大勢います。しかしカメラでは基準が分かりづらいので、ほんの少し歪んでしまってストレスを感じたりします。そこで使ってみたいのがPerspecです。画像の水平、垂直を修正できるソフトウェアです。## Perspecの使い方元の画像...
Painterro - Webブラウザで簡易画像編集
画像のちょっとした加工でPhotoshopを立ち上げたり、専門のソフトウェアを購入したりするのは嫌だと思っている方は多いはず。最近では些細な修正であればWebベースでも行えるようになっています。今回紹介するPainterroはWebベースの画像編集ソフトウェアです。スクリーンショットにちょっとした注記を入れる程度であれ...
photoEditor - Web上で簡易的な画像編集
ユーザに画像をアップロードしてもらう機能はよくありますが、そのままでは使いづらいことが良くあります。例えばサイズが大きすぎたり、回転してしまっていたりといった具合です。そんな時に簡易編集機能を提供できるのがphotoEditorです。## photoEditorの使い方写真を開いたところ。この状態では、まだサーバに送信...
glfx.js - JavaScriptで画像を加工
画像を加工する場合、画像編集ソフトウェアが使われます。そして加工したファイルを保存し、Web上にアップロードするでしょう。しかしこの場合、再度編集する際に備えて元ファイルは保存しておかなければなりません。また、同じ加工を何十枚もの画像に施すのも大変です。そこで使ってみたいのがglfx.jsです。JavaScriptを使...
photoEditor - Webブラウザ上で画像編集
Webアプリケーションでできることの幅が広がっていますが、最近ではさらにWebブラウザ上だけでできることも広がっています。Webブラウザ上のJavaScript、ワーカー、WebAssemblyと機能が拡充しています。今回はphotoEditorを紹介します。クリック一つで画像を加工できる、そんなWebアプリケーション...
PhotoDemon - ちょっとした画像編集ならこれで十分！
画像をちょっと編集しなければならない時、何のソフトウェアを使っているでしょう。Photoshopを持っていれば、もちろんそれで問題ありません。しかし持っていない場合、ほんの少しの修正のために数万円を払うのはためらうことでしょう。そこで紹介したいのがPhotoDemonです。## PhotoDemonの使い方メイン画面で...
TOAST UI Image Editor - Canvasを使ったリッチな画像編集
画像編集と言えばPhotoshopを思い浮かべる人が多いでしょう（またはGIMP）。しかしPhotoshopのすべての機能を満遍なく使いこなしている方はほとんどいないはずです。それどころか、無料のソフトウェアでも実は十分だったという方もいるでしょう。そこで注目したいのがTOAST UI Image Editorです。W...
DrawerJs - Web上で組み込んで使えるドロー
Webサービスの中にイラスト機能を追加したいと思ったことはないでしょうか。掲示板でも使えますし、作業内容を写真と合わせて記録するのにも向いています。テキストで書くのとはまた違った情報が入れられるでしょう。そこで使ってみたいのがDrawerJsです。Webサイトの中に組み込めるドローソフトウェアです。## DrawerJ...
MangaSketch - 漫画のネーム作成に特化したアプリケーション
漫画は日本が世界に誇るコンテンツです。毎日、多数の漫画が作られています。単なる娯楽としてだけの利用に限らず、学習教材や啓蒙などにも使われるなど、利用場面は増えています。そんな漫画のネームを作成するためのソフトウェアがMangaSketchです。## MangaSketchの使い方使い方、といっても筆者はタブレットがなく...
Caire - コマンド一つでシームカービング
写真データのサイズがどんどん大きくなるために必要になっているのがサムネイルです。しかし写真を単にそのままリサイズするのでは面白くありません。よりインパクトがあるところを中心にサムネイルを作りたいことでしょう。しかし、そのために人手で作業するのでは大変です。そこで、今回はシームカービングをコマンド一つで行ってくれるCai...
Analog Film Emulator - フィルムで撮影したような写真に加工
西洋の風景画が廃れた原因の一つにカメラがあります。ただ目の前の情景をそのまま写し取るのであれば、カメラの方が正確です。さらにそんなカメラでもフィルム式は廃られており、枚数がほぼ無制限なデジタルに移り変わっています。とは言え、今なおフィルムの味のある撮れ方が好きという方はたくさんいます。そうした方に触れてみて欲しいのがA...
CanvasEffect.js - Canvasで画像にエフェクト
HTML5のCanvasを使うと画像を取り込んで表示し、エフェクトを行うことができます。しかしCanvasの扱いは意外と面倒で、コードも多くなりがちです。そのためメンテナンス性が低くなってしまいます。そこで使ってみたいのがCanvasEffect.jsです。画像を編集するための専用ライブラリとなっています。## Can...
Pica - Canvasよりも高品質、かつ高速な画像リサイズライブラリ
HTML5のCanvasとJavaScriptを使うことによって画像をクライアントサイドで加工できるようになりました。特に多いのが縮小に関するニーズです。スマートフォンで撮影した画像はサイズが大きいので、転送にかかる時間や帯域の問題があります。そこで事前に縮小するのです。しかし縮小した時の画像の品質はブラウザに依存して...
Philter - Webブラウザ上の写真加工ライブラリ
サイト上で写真を綺麗に見せようと思ったら多少の加工は欠かせません。しかし大量にある写真を一つ一つメンテナンスするのは大変ですし、加工前の写真も保存しておくと容量が2倍必要になってしまいます。そこで使ってみたいのがJavaScript、つまりクライアントサイドでの写真加工です。今回はPhilterを紹介します。## Ph...
Photo Editor - Webベースの写真編集ソフトウェア
写真を加工するソフトウェアは数多くありますが、ちょっとした作業のために重たいソフトウェアを立ち上げるのは面倒ですよね。そこで簡易的なものであればWeb上だけでやってしまうのもいいかも知れません。今回はPhoto Editor、Webベースの写真をエディタを紹介します。## Photo Editorの使い方メイン画面です...
FeSlideFilter - スライドしてフィルタを適用
Instagramのようなカメラアプリではタップ一つで写真にフィルタリングできるようになっています。簡単に写真を加工できるのはとても魅力的で、ついつい加工してしまうでしょう。FeSlideFilterはちょっと変わったフィルタリング機能を提供します。タップではなくスワイプでフィルターをかけるのです。## FeSlide...
PictRuby - Rubyで書けるiOS用写真編集アプリ
同じ写真であってもちょっと加工するとイメージが一気に変わることがあります。一部だけの加工でなくともモノトーンにしたり、セピアにしたりと全体の配色を変えるだけでも十分です。今回紹介するオープンソース・ソフトウェアはPictRuby、iOS上で写真加工ができるアプリです。面白いのはフィルタをRubyスクリプトとして定義でき...
picEdit – ファイル選択の代わりに使える画像/Webカム + 画像編集
ソーシャルサービスが流行っていることもあり、プロフィール画像をアップロードさせるサービスが増えています。しかし常に使っている画像でもあれば良いですが、自分の写真が手元にない場合も多いでしょう。そこでファイル選択の代わりに使ってみたいのがpicEditです。Webカメラを使ってその場で写真を撮影、加工できるソフトウェアで...