How to Make Animated PNG

02 December 2010

[caption id=”attachment_910” align=”alignleft” width=”300”] Click image to view APNG correctly[/caption]

Have you ever heard of Animated PNGs (aPNGs)? Well certainly you’re familiar with PNGs, now imagine these high quality images act like Animated GIFs!

**So, since PNGs have better quality than GIFs why isn’t it widely used like the latter? ** The answer would be compatibility. IE still does not support this format even on its latest version (currently IE 8.0 )so unless its okay with IE, GIFs are still a better choice. And also, GIFs are lighter in terms of file sizes and is compatible on almost every platform on the cloud.

So why use Animated PNGs? and how do you make them? First of all, PNGs are a lot more flexible handling colors and transparency, plus it can produce better quality image compressions than GIFs, JPGs etc. Making this animated could be very useful especially on designing ad banners, header images and all sorts of design implementations made using GIFs. PNGs also look good on games and other non-web-based applications.

Making APNGs are simple if you have the right tools. I happen to have a problem converting a flash banner to APNG so I came across this open-source application named APNG Anime Maker

The application is pretty straight forward. All you need is a set of your PNG images in a sequence which you can be created by exporting a flash banner to ‘PNG sequence’.

We start by exporting a flash banner to a sequenced PNG. On your Flash Application, click on file > export > export movie

Save the file using the dropdown menu and selecting PNG Sequence. This will save the file into multiple PNGs based on the frame count on your timeline.

Choose a filename then click on Save. this should bring up the PNG settings dialogue box.

Details are taken from the document with the default settings as indicated above. Click on OK and you should get a sequence of PNGs saved from your flash movie. If you have 100 frames on your timeline, you should get 100 PNG files as well.

Now, Incase you haven’t downloaded the application yet, download APNG Anime Maker.

After installing the application, simply follow through simple instructions on the APNG Anime Maker site to merge your PNG sequence into a single file. And then, youre done! I now leave the experimentation to you. hehe

blog comments powered by Disqus