CloudKidStudio / PixiFlash

A library for bridging CreateJS animations from Flash for use in Pixi.js
http://cloudkidstudio.github.io/PixiFlash/docs/
MIT License
78 stars 7 forks source link

Vector-based file with bitmap-based output... #4

Closed probityrules closed 8 years ago

probityrules commented 8 years ago

This may speak more to my ignorance regarding Flash/Animate, but here goes:

I'm testing out PixiFlash to see if we can nibble away at a few of our asset file sizes (currently using EaselJS-based sprite sheet frames). I've found that, for the size of animations we need, the vector-based JavaScript output is quite a bit larger (~3X) than our current method, but I think getting comparable output with png pieces to comprise the whole would likely be smaller than our current method. Does creating these pieces (bitmap-based animation) need to happen at the animation construction level, or is there a way to take an entirely vector-based animation and export it into the bitmap-based format for use by PixiFlash?

andrewstart commented 8 years ago

PixiFlash can make the most efficient files when combined with the scripts in https://github.com/SpringRoll/FlashToolkit. Included is a post-publishing script that modifies the published .js file to make it more friendly for Uglify compression. The best way to take vector based animation is to convert individual graphics (arms, legs, etc) on each frame using the Copy Layers to Bitmap script. Also, look through https://github.com/SpringRoll/SpringRoll/wiki/Optimized-Art-Creation-and-Usage as it will have more suggestions for optimizing art.

Secondly, If you are not compressing your spritesheets, you should be - we got good results from making 8-bit PNGs using ImageAlpha, further compressed by ImageOptim. If you have a spritesheet with too many colors for a PNG but also has transparency, the FlashToolkit repo includes AlphaSplitter.zip, a tool we made for splitting an image into an alpha image and a color image, for recombining at runtime. It can offer much smaller overall filesize over a 24 bit PNG.

probityrules commented 8 years ago

Thanks for the quick response! I'll check out the script you mentioned: I think that may be it. We already perform various PNG optimizations, but have as yet only worked with CreateJS Zoe png/json exports provided by our artists... ...so I'm moving up the chain a bit to see what kind of improvements we can get.