HOME
 Web Animation Generator 
ブラウザ(オンライン)だけでアニメーションを作成できるサイトです。
静止画像、連番画像zip、編集 → GIFアニメーション、アニメーションPNG(APNG)、動画(mp4)
アニメーションGIF → 分解画像ファイル
動画(mp4) → 分解画像ファイル





画像 -   から  まで 





 アニメーションPNG 


アニメーション
 回 
Total 0.1 秒
  
 ms 
Dispose 
Blend



 アニメーションGIF 


アニメーション
 回 
Total 0.1 秒

  
アニメーションGIFの作成では、

・表示時間はアニメーションPNGで指定した値が適用されます。

・DisposeもアニメーションPNGで指定した値が適用されます。

・アニメーションPNGで指定したBlendは、アニメーションGIFでは使用されません。





 Movie (mp4) 


アニメーション
フレームレート1
フレームレート2
Total 0.0 秒
Movie(mp4)の作成では、

・アニメーションPNG,GIFで指定した値は適用されません。

・フレームレート1は、1秒間で使用する画像の枚数です。

・フレームレート2は、1秒間に表示する回数です。

少し、紛らわしいですが、フレームレート1に30、フレームレート2に60を指定した場合、「デフォルト画像」~「画像-29」の30枚を2回づつ表示して60枚にし、この60枚を1秒間に表示する、という指定になります。







◇ 「デフォルト画像をアニメーションに使う」 について ◇
「デフォルト画像」とは、APNG(アニメーションPNG)に対応していないブラウザで表示される画像のことです。
「デフォルト画像をアニメーションに使う」の設定では、文字通り、「デフォルト画像」(1枚目の画像)をアニメーションに含めるかどうかを指定することができますが、2017年11月現在ではブラウザによって表示の動作が異なっています。
他のサイトでも各ブラウザに関して、APNGに対応/未対応の情報が公開されていますが、当サイトでも各ブラウザでの現在の最新バージョンで表示の確認をしましたので、APNG利用の際の参考にしていただければと思います。

以下にInternet Explorer(Edge)、Chrome、Firefoxで確認した結果を示します。
申し訳ありませんが、Safariについては未確認です。

確認で使用したAPNG画像は、「デフォルト画像」、「画像-1」~「画像-3」で次の4枚の画像を選択して、「デフォルト画像をアニメーションに使う」にチェックONで作成したものとOFFして作成したものを用意して確認しました。
     
  デフォルト画像 今回の結果から、確認した中では現状でAPNGに完全に対応しているのはFirefoxだけのようです。当サイトのプログラムミスも考えられますが、Mozillaのサイトで公開されているAnimated PNG graphicsの仕様に基づいてプログラムを作成しており、Firefoxで期待通りに表示されていること、生成されたAPNGファイルのバイナリの確認から考えてプログラムに間違いはないと思います。

◇ 「Dispose」 について ◇
Mozillaからの引用です。
NONE (APNG_DISPOSE_OP_NONE)
次のフレームを描画する前に消去しません。出力バッファをそのまま使用します。
BACKGROUND(APNG_DISPOSE_OP_BACKGROUND)
次のフレームを描画する前に、出力バッファのフレーム領域を完全に透過な黒で塗りつぶします。
PREVIOUS (APNG_DISPOSE_OP_PREVIOUS)
次のフレームを描画する前に、出力バッファのフレーム領域をこのフレームに入る前の状態に戻します。

◇ 「Blend」 について ◇
Mozillaからの引用です。
SOURCE (APNG_BLEND_OP_SOURCE)
アルファ値を含めた全ての要素をフレームの出力バッファ領域に上書きします。
OVER (APNG_BLEND_OP_OVER)
書き込むデータのアルファ値を使って出力バッファに合成します。

以上ご参考の上、ご利用ください。
現在、当サイトは、基本の機能だけですが、徐々に機能アップしていく予定です。


Copyright© 2017-2018 Sakamoto(H)
管理者へ連絡