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

ユーティリティ - 画像編集の記事一覧

プレミアムユーザー限定記事

MOONGIFTプレミアムは、月額500円の有料サービスです。詳細はこちらから

もっと見る

List

  • 2019/07/17

photoEditor - Web上で簡易的な画像編集

ユーザに画像をアップロードしてもらう機能はよくありますが、そのままでは使いづらいことが良くあります。例えばサイズが大きすぎたり、回転してしまっていたりといった具合です。そんな時に簡易編集機能を提供できるのがphotoEditorです。## photoEditorの使い方写真を開いたところ。この状態では、まだサーバに送信...

List

  • 2019/06/22

glfx.js - JavaScriptで画像を加工

画像を加工する場合、画像編集ソフトウェアが使われます。そして加工したファイルを保存し、Web上にアップロードするでしょう。しかしこの場合、再度編集する際に備えて元ファイルは保存しておかなければなりません。また、同じ加工を何十枚もの画像に施すのも大変です。そこで使ってみたいのがglfx.jsです。JavaScriptを使...

List

  • 2019/02/21

photoEditor - Webブラウザ上で画像編集

Webアプリケーションでできることの幅が広がっていますが、最近ではさらにWebブラウザ上だけでできることも広がっています。Webブラウザ上のJavaScript、ワーカー、WebAssemblyと機能が拡充しています。今回はphotoEditorを紹介します。クリック一つで画像を加工できる、そんなWebアプリケーション...

List

  • 2019/01/07

PhotoDemon - ちょっとした画像編集ならこれで十分!

画像をちょっと編集しなければならない時、何のソフトウェアを使っているでしょう。Photoshopを持っていれば、もちろんそれで問題ありません。しかし持っていない場合、ほんの少しの修正のために数万円を払うのはためらうことでしょう。そこで紹介したいのがPhotoDemonです。## PhotoDemonの使い方メイン画面で...

List

  • 2018/08/08

TOAST UI Image Editor - Canvasを使ったリッチな画像編集

画像編集と言えばPhotoshopを思い浮かべる人が多いでしょう(またはGIMP)。しかしPhotoshopのすべての機能を満遍なく使いこなしている方はほとんどいないはずです。それどころか、無料のソフトウェアでも実は十分だったという方もいるでしょう。そこで注目したいのがTOAST UI Image Editorです。W...

List

  • 2018/07/24

DrawerJs - Web上で組み込んで使えるドロー

Webサービスの中にイラスト機能を追加したいと思ったことはないでしょうか。掲示板でも使えますし、作業内容を写真と合わせて記録するのにも向いています。テキストで書くのとはまた違った情報が入れられるでしょう。そこで使ってみたいのがDrawerJsです。Webサイトの中に組み込めるドローソフトウェアです。## DrawerJ...

List

  • 2018/07/04

MangaSketch - 漫画のネーム作成に特化したアプリケーション

漫画は日本が世界に誇るコンテンツです。毎日、多数の漫画が作られています。単なる娯楽としてだけの利用に限らず、学習教材や啓蒙などにも使われるなど、利用場面は増えています。そんな漫画のネームを作成するためのソフトウェアがMangaSketchです。## MangaSketchの使い方使い方、といっても筆者はタブレットがなく...

List

  • 2018/02/22

Caire - コマンド一つでシームカービング

写真データのサイズがどんどん大きくなるために必要になっているのがサムネイルです。しかし写真を単にそのままリサイズするのでは面白くありません。よりインパクトがあるところを中心にサムネイルを作りたいことでしょう。しかし、そのために人手で作業するのでは大変です。そこで、今回はシームカービングをコマンド一つで行ってくれるCai...

List

  • 2018/02/10

Analog Film Emulator - フィルムで撮影したような写真に加工

西洋の風景画が廃れた原因の一つにカメラがあります。ただ目の前の情景をそのまま写し取るのであれば、カメラの方が正確です。さらにそんなカメラでもフィルム式は廃られており、枚数がほぼ無制限なデジタルに移り変わっています。とは言え、今なおフィルムの味のある撮れ方が好きという方はたくさんいます。そうした方に触れてみて欲しいのがA...

List

  • 2017/03/21

CanvasEffect.js - Canvasで画像にエフェクト

HTML5のCanvasを使うと画像を取り込んで表示し、エフェクトを行うことができます。しかしCanvasの扱いは意外と面倒で、コードも多くなりがちです。そのためメンテナンス性が低くなってしまいます。そこで使ってみたいのがCanvasEffect.jsです。画像を編集するための専用ライブラリとなっています。## Can...

List

  • 2016/07/19

Pica - Canvasよりも高品質、かつ高速な画像リサイズライブラリ

HTML5のCanvasとJavaScriptを使うことによって画像をクライアントサイドで加工できるようになりました。特に多いのが縮小に関するニーズです。スマートフォンで撮影した画像はサイズが大きいので、転送にかかる時間や帯域の問題があります。そこで事前に縮小するのです。しかし縮小した時の画像の品質はブラウザに依存して...

List

  • 2016/02/11

Philter - Webブラウザ上の写真加工ライブラリ

サイト上で写真を綺麗に見せようと思ったら多少の加工は欠かせません。しかし大量にある写真を一つ一つメンテナンスするのは大変ですし、加工前の写真も保存しておくと容量が2倍必要になってしまいます。そこで使ってみたいのがJavaScript、つまりクライアントサイドでの写真加工です。今回はPhilterを紹介します。## Ph...

List

  • 2016/01/23

Photo Editor - Webベースの写真編集ソフトウェア

写真を加工するソフトウェアは数多くありますが、ちょっとした作業のために重たいソフトウェアを立ち上げるのは面倒ですよね。そこで簡易的なものであればWeb上だけでやってしまうのもいいかも知れません。今回はPhoto Editor、Webベースの写真をエディタを紹介します。## Photo Editorの使い方メイン画面です...

List

  • 2016/01/19

FeSlideFilter - スライドしてフィルタを適用

Instagramのようなカメラアプリではタップ一つで写真にフィルタリングできるようになっています。簡単に写真を加工できるのはとても魅力的で、ついつい加工してしまうでしょう。FeSlideFilterはちょっと変わったフィルタリング機能を提供します。タップではなくスワイプでフィルターをかけるのです。## FeSlide...

List

  • 2015/11/24

PictRuby - Rubyで書けるiOS用写真編集アプリ

同じ写真であってもちょっと加工するとイメージが一気に変わることがあります。一部だけの加工でなくともモノトーンにしたり、セピアにしたりと全体の配色を変えるだけでも十分です。今回紹介するオープンソース・ソフトウェアはPictRuby、iOS上で写真加工ができるアプリです。面白いのはフィルタをRubyスクリプトとして定義でき...

List

  • 2014/12/17

picEdit – ファイル選択の代わりに使える画像/Webカム + 画像編集

ソーシャルサービスが流行っていることもあり、プロフィール画像をアップロードさせるサービスが増えています。しかし常に使っている画像でもあれば良いですが、自分の写真が手元にない場合も多いでしょう。そこでファイル選択の代わりに使ってみたいのがpicEditです。Webカメラを使ってその場で写真を撮影、加工できるソフトウェアで...

List

  • 2014/09/01

DarkroomJS – JavaScriptで画像切り抜き

画像加工を行うと言えばローカルで画像編集ソフトウェアを使うのが思い浮かびますが、最近では随分Webベースで行えるようになっています。複雑な加工はまだまだですが、ちょっとした加工であればWeb上で行う方が手軽だったりします。今回はその一つ、DarkroomJSを紹介します。位置を決めて切り抜きするという加工をシンプルに手...

List

  • Premium_s 2014/06/06

使えるWebサービス・オープンソース(28)「サーバサイドレス画像加工」

Webサービスの中で画像を加工したいというニーズは多々あります。ちょっとしたものであればアバターの登録もそうです。アップロードされた画像をそのまま使うのではなく、サムネイルにサイズ変更して使ったり、正方形にしたりすることは良くあります。サーバサイドに仕組みを用意しても良いですが、それでは共有サーバで使えなかったり、イン...

List

  • 2014/04/24

smartcrop.js - 要注目!スマートなクロップ機能を実現

おお、これは格好いい!写真のサムネイル表示というのはやり方によって大きくインパクトが変わります。単純に縮めて表示すると何の写真か分かりづらくなります。さらに横長、縦長の写真では正方形に切り出すのは簡単ではありません。そこで使ってみたいのがsmartcrop.jsです。写真の中から一部を切り出すライブラリで、よりインパク...

List

  • 2014/01/10

Magickly - 自前で立てる画像編集サーバ

CGMなどのユーザ主導型のサービスで画像を扱う場合、アップロードされたままの画像というのは使い勝手が悪いものです。大きさを変えたり、多少加工したいという場合は多々あります。特に大きな画像はそのまま配信するとネットワーク負荷だけでなく表示にも時間がかかるためサムネイルを一旦表示すると言った工夫は必要です。そこで使ってみた...