GIFアニメーションとPNGアニメーションの画質を比較したら意外な事実発見

apngアニメーションの作り方

 今話題のPNGアニメーション(apng)って、どれだけ画質が違うのか比較して見ました。

 カラーだと、色数で勝るPNG形式の方がきれいに見えそうですが、実際にはweb上で見る限りPNGとGIFのアニメーションは区別が付きません。

 どのような時に差が出るのか。
 いろいろやってみた結果、大きな差が出たのが下のアニメーションのケースです。

 サンプルとして、ブランコに乗った人のアイコンを使ってアニメーションを作ってみました。

GIFアニメーション

PNGアニメーション

 iExplorer、Google ChromeはPNGアニメーション未対応のため静止画像として表示されます。


 「APNG Assembler 2.9」で作成。

 二つのアニメーションを比較すると全く違うことに気づきますね。GIFアニメの方はラインがギザギザですが、PNGアニメの方はきれいに表示されています。

 単色のアニメーションでこのような違いが起きるとは意外でした。

 GIFアニメでもうまくやれば結構きれいに作れるのですが、同じ条件で作っている今回の二つのアニメーションにこれだけの画質の差が生じたことに驚きました。

 PNG形式なのでグラデーションのことばかり考えていたのですが、ベクトル画像に使えそうです。