ハトネコエ Web がくしゅうちょう

プログラミングやサーバー・Web制作、チームマネジメントなど得た技術のまとめ

mogrify コマンドで画像を一括変換しよう

imagemagick というと、
Rails 書いてる人にとっては minimagick (or rmagick) を使うために必要なやつでしょ?
ってイメージのほうが強いと思うけれど、もちろん CLI でも力を発揮してくれる。

1. くすんでしまったレナさん

f:id:nekonenene:20200426152720j:plain
いつもの画像解析でおなじみレナさん……と思いきや?

この画像、ウェブで見ると一見ふつうに見えるのだけれど、
なんとダウンロードして Mac や一部の画像編集ソフトで見ると変色する。

f:id:nekonenene:20200426153857p:plain
変色してしまったレナさん

さらにこのダウンロードした画像を画像編集ソフト「Affinity Photo」png 画像として保存すると、
以下のようにさらに変色する。

f:id:nekonenene:20200426154217p:plain
白く霞んでしまったレナさん

これと同じ現象が関わってる会社でも起こって、
「なんでだろう? でも色味が CMYK っぽいよな」と思って確認したところ、
まさにその通りで、Web向けの画像なのに Color model (色空間の指定)が CMYK になってしまっていた

f:id:nekonenene:20200426154733p:plain
Color model: CMYK (色空間がCMYK

つまり、ウェブブラウザは色空間が CMYK という情報を読み取れないので RGB として描画するのだが、
Mac や高性能な画像編集ソフトの場合は CMYK を理解できるために、CMYK として描画してしまい、
くすんだ色合いになってしまったわけだ。

さらに png で保存すると、png は RGB 形式での保存しか出来ないので、
画像編集ソフトがいい感じに CMYK → RGB の変換をおこなおうとして、結果として白くくすんでしまっていた。

おそらくこの最初のような画像が生まれた背景は、デザイナーさんが書き出し設定を印刷用設定にしたままJPEG出力をしたのだろう。
このような、ウェブ用なのに CMYK 指定が入っているという歪(いびつ)な画像を、今回大量に修正する必要があった。

2. convert コマンド

imagemagick をすでにインストールしてあるとして(Mac なら brew install imagemagick)、
convert コマンドで1枚ごとの変換が可能だ。

convert lenna.jpg -colorspace RGB lenna.jpg

変換前の画像 lenna.jpg の色空間を RGB に変更して上書きできる。

出力後のファイル名を変える場合には

convert lenna.jpg -colorspace RGB lenna_converted.jpg

などとおこなう。

3. mogrify コマンド

上書きの場合であれば、 convert コマンドを使わずに以下のように mogrify コマンドでも可能だ。

mogrify -colorspace RGB lenna.jpg

そしてこのコマンドではワイルドカードを扱えるので、
大量の画像を一括処理したい場合に有効活用できる。

# 注意:以下のコマンドを実行するとディレクトリ内のすべての .jpg 画像に影響が出るのでご注意ください
mogrify -colorspace RGB *.jpg

これで、問題の画像全てを1つのディレクトリにまとめて置いた上で、
そのディレクトリ内でこのコマンドを実行すれば、すべての .jpg 画像の色空間指定が修正される。

4. mogrify コマンドで画像ファイルを一括サイズ縮小

上記のような特殊なケースに限らず、 mogrify コマンドは活用できる。

例えば、「写真素材をWebサイトで使う前に、ユーザーがページ表示に時間かからないよう全部縮小しちゃいたいな」という場合。

以下のコマンドで、
アスペクト比を維持しつつ縦・横のどちらかの最大を 1200px、JPEG品質は 90% にして、72dpi で保存
ということが出来てしまう。

今回は上書きにならないよう、 resized ディレクトリを先に作って、
そこに変換後の画像を出力することとした。

mkdir resized
mogrify -resize 1200x1200\> -quality 90 -density 72 -path resized *.jpg

なお、PNG 画像も同様におこなえる。(ただし JPEG と異なり、quality のパラメーターが小さいほど容量が小さくなるわけではない点に注意)

mogrify -resize 1200x1200\> -quality 90 -density 72 -path resized *.png

他にも出来る画像処理はあるので、公式ドキュメントでオプション一覧を見ると良い。
https://imagemagick.org/script/mogrify.php

Windows だと画像リサイズソフトいっぱいあるのに
Mac だとつらいな〜、と思っていた人にはぜひ試してもらいたい。