Photoshop v.s. Sketch のjpg出力の画質とファイル容量比較

ブログを運営していると写真のトリミングを行う機会が一般人よりは多いわけですが、今までPhotoshopにお世話になってきました。が、Photoshopは重いので、代わりにSketchで出来たら便利だなぁと思い、jpg出力のサイズでも比較して今後の参考にしようと思います。

比較方法

先日のイスラエル旅行で撮った写真から3枚をピックアップして、出力クオリティ別にjpg出力、容量と画質を比較します。

  • 撮影はすべてPixel 3
  • 元サイズ4032×3024pxを、720×540pxに縮小 (このサイトで掲載する写真横幅が720pxのため)

Photoshop、Sketchでの手順はこんな感じです。

  • Photoshop : 解像度の変更で「再サンプル:自動」の後、Web用に保存
  • Sketch : アートボードに貼り付けて縮小、そのままExport。Bitmap Exportingは「Save for web」にチェック

さあ参りましょう。

1. まず容量の比較

画質は後で見るとして、まず単純に容量の比較です。

写真1


「とりあえずごちゃごちゃしている」写真を選択しました。

出力品質 Photoshop Sketch
100 508KB 658KB
80 262KB 181KB
60 159KB 119KB
40 98KB 68KB
20 69KB 37KB

写真2


「色数が少ない」写真を選択しました。

出力品質 Photoshop Sketch
100 264KB 391KB
80 116KB 76KB
60 66KB 50KB
40 40KB 30KB
20 29KB 19KB

写真3


「物が近くて、構図がシンプル」な写真を選択しました。

出力品質 Photoshop Sketch
100 270KB 402KB
80 117KB 79KB
60 65KB 50KB
40 38KB 31KB
20 27KB 20KB

ファイルサイズの傾向

3枚の写真で以下の傾向はいずれも共通していました。

  • Sketchの品質100だけ何故かやたら容量がでかい
  • 品質80以下だと、Photoshopの容量 > Sketchの容量

あとどうでもいいですが、写真2と写真3のファイルサイズはほぼ同じになりました。選んだ写真が良くなかったのかもしれません。

2. 次に画質の比較

定量的な比較ができませんので、以下の手順で検討してみました。

PhotoshopとSketchの比較

Photoshop、Sketch共に画質100(最高画質)の写真を比べると、明らかにSketchの方がボケています。

別の写真でもそうでした。こちらも両方とも画質100です。

樹木の陰影に注目すると分かりやすいと思われます。
ここまでハッキリと出力の違いがあるとは思いませんでした。

上記2例は200%以上拡大したものの比較ですが、サイズ原寸で比較すると、こんな影響度です。

クリームの上に乗っている葉っぱ?まわりは、原寸でも結構違いを感じてしまいます。

この傾向は全ての設定画質(80, 60, 40, 20)で同様でした。

この差をブログ運営上どれほど重要視するかは人それぞれだと思いますが、私の場合はやっぱレタッチはPhotoshopだなと感じます。

Photoshopの画質設定を比較する

次は、Photoshopの設定画質は何がちょうどいいのかな、という事を検討します。

同じ写真を、左から画質100、80、60、40、20で並べてみました。サイズは原寸です。

ここから何を判断軸にするか、ですが。私は以下の2点を感じました。

まず空のグラデーションが汚いので、画質40と20は検討の余地無しとします。
画質60の写真をどうするかで悩みますが、月が汚いのはちょっと気になりますがこれだけで判断しづらいので、他の写真も比較してみます。

画質100、80、60で比較します。サイズは原寸です。

俺には違いが分かりません。

という事で、重箱の隅をつついてみました。

画質60の写真において、白い皿に乗っているオブジェクトの周りにイガイガが認められます。急激に色の変化があった場合にjpg圧縮で発生するアレです。ただこれ、「強いていえば」レベルな気がします。

画質60と80の差ってほとんど分からないのですが、720pxくらいのサイズだったらファイル容量の差が50KB以下とかなので、保険かける意味で画質80選んでおけばいいのかなという感じがします。

最後に、画質100と80の比較ですが…。
画質の差は相変わらずほとんど分かりません。このためにわざわざファイルサイズが2倍する画質100を選択するか…と言われれば微妙な気がしました。

結論

Photoshopの画質80がちょうど良さそうだという、何となく予想がついていた結果になりました。気が向いたら画質60でもいいけど、というくらいでしょうか。

ただもともとは「Sketchで写真加工できたらお手軽なのになぁ」と思って始めた検証なので、結局Photoshopかいとなって少々残念です。
まぁ、自分の中での納得度が高まったという事で良しとしておきます。