PrinPrin情報局

2009年9月10日木曜日

アニメーションPNGの作成方法

一つ前の記事で書いたアニメーションPNG(APNG)ですが、今日は、作成方法です。

作成方法として、いろいろあると思いますが、私の作成方法として昨日までは、FireFoxのアドオンソフトの「APNG Edit(FireFoxのツールに追加されます。)」を使って作ったりしていましたが、今日は、「APNGfromCSV」と言うフリーソフトを使って作成してみました。
ダウンロードは、Vectorからダウンロードです。
Vector:APNGfromCSV (データ / 画像&サウンド) - ソフトの詳細

CSVファイルで定義を作成してAPNGファイルを作成するタイプのソフトです。

メモ帳などで、テキストファイルを作成すればいいので、簡単です。

↓ こんな内容のファイルです。

#option,default=image001.jpg
image001.jpg,,,1,2
image002.jpg,,,1,2
image003.jpg,,,1,2
image004.jpg,,,1,2
image005.jpg,,,1,2
     :
     :
     :
image015.jpg,,,1,1

このCSVファイルと画像ファイル(image001.jpg~image015.jpg)を同じフォルダーへ置いておいて、CSVファイルを「APNGfromCSV」と言うソフトで開く事で作成されます。

500ms間隔でアニメーションされる設定で、最後のコマだけ1000msになっています。(1,2って言う部分が時間です。1/2秒って言う事だと思います。)

APNGファイルに対応しているブラウザーなのですが、今のところ、FireFoxとOperaのようです。

↓ この写真をクリックしてみて下さい。対応しているブラウザーでしたら、アニメーションが始まります。対応していない場合は、静止画のままです。

Tvd_20090904a_001

※Googleアカウントが無い方は、コメントを入れる時に「名前/URL」を選んで下さいね^^

2 件のコメント:

Kagami Kohime さんのコメント...

確かにGIFアニメより綺麗だし、良いかも。
みんなも再生可能なWebブラウザに乗り換えると良いよ(笑)!

Tvd Kidd さんのコメント...

>Kagamiさん、
フラッシュ動画もいいけど、こっちのが手軽そうです。
なぜIEは対応していないのでしょうね!