【Google AI Studio】時短クッキング No.35：APNG形式からアニメＧIF形式に変換するアプリ

「時短クッキング No.34」では、PNG形式を拡張したアニメーション対応の画像フォーマット
APNG（Animated PNG） のデータを作成しました。
今回は、そのAPNGを アニメGIF形式に変換するアプリ を作りました。

NoteがAPNG形式に対応していない

「時短クッキング No.34」の記事を作っていて、ひとつ気が付いたことがあります。
それは、APNG形式の画像をNoteに貼り付けても、アニメーションしてくれないという点です。

一方、アニメGIF形式であれば、Noteに貼り付けても正しくアニメーションします。
そこで必要になったのが、APNG形式 → アニメGIF形式に変換するアプリ というわけです。

APNG to GIF Masterの使い方

これを形にしたのが、「APNG to GIF Master」 というAPNG→アニメGIF変換アプリです。
起動すると、次のような画面になります。

❶ 起動画面

❷ APNG画像をドラッグ＆ドロップ

右側の「Drop your APNG file here」という点線枠に、APNG画像をドラッグ＆ドロップするか、
「Select File」ボタンを押してファイルを選択します。

APNG画像が読み込まれると、即座にアニメGIFへ変換され、プレビュー表示されます。
透明部分は、「check（格子）」「white（白）」「black（黒）」ボタンで切り替え可能です。

左下には、変換後の カラーパレット が表示されます。
左上の「T」の文字が付いた色（パレットカラー0）が 透明パレット です。

❸ 設定ウィンドウの項目

左上にいくつかの設定項目があります。
各項目を操作すると、その場で再変換が行われ、プレビューに即時反映されます。

• 透過を有効にする
  透明パレットを「透明として扱う（オン）」か、「通常色として扱う（オフ）」かを選択します。
  デフォルトはオンです。

• 背景色（マットカラー）
  「透過を有効にする」をオフにした場合に、透明パレット部分を塗りつぶす色を指定します。
  ※「透過を有効にする」をオンにすると、「背景色（マットカラー）」は無効になります。

• 透過閾値 (Alpha)
  APNGのアルファチャンネルのうち、どこまでを透明パレットに割り当てるかの
  閾値（しきいち） を調整します。

❹ 変換したファイルをダウンロード

「Download GIF」ボタンをクリックすると、アニメGIFがダウンロードされます。
「RESET」ボタンをクリックすると、プレビューが破棄され、初期画面に戻ります。

APNGからアニメGIFへの変換アルゴリズム

APNGとアニメGIFはいずれも、複数の画像を連続表示することで動きを表現する画像フォーマットです。
ただし、仕組みと表現力には大きな違いがあります。

APNGはPNGを拡張した形式で、フルカラー表示と半透明表現（アルファチャンネル） に対応しています。
一方、アニメGIFは 256色パレット制限 があり、透明表現も「透明」か「不透明」かの二択です。

つまり、変換作業の肝は、
この表現力の差をどう埋めるか にあります。

今回採用したアルゴリズムは、次のとおりです。

• アニメGIFの パレットカラー0 を透明パレット用としてリザーブ

• APNGのフルカラー情報を減色し、パレットカラー1〜255 に割り当て

• APNGのアルファチャンネルを、リザーブしたパレットカラー0に割り当て
  （スライダーで透明閾値を調整可能にする）

• パレットカラー0を透明として設定

※：ループについては、APNGの設定に関係なく無限ループに再設定しています。アニメGIFは動いてナンボじゃないかと・・・

関連URL

本アプリは次で公開しています。

シェアURLはこちらです。

まとめ：急遽作りました

冒頭でも触れましたが、本アプリは NoteでAPNGがアニメーションしない ことに気付き、急遽作成しました。
結果として、「APNG（Animated PNG）」作成ツールが、GIFアニメ作成用ツールとしても使える ようになりました。

Noteのおかげですね。

以上！