Recently there has been tons of activity on the Animated SVG exporter for Flash Pro.
Here are some recently added features. Before I explain them, here’s an example of most of the new features in use, thanks to Jazza Studios for the animation.
There are a few small issues with it but you get how nice the output is looking now.
(Weighs about 1.4mb gzipped, have patience)
Keep in mind that the only Javascript used in this is a few tiny triggers for the audio.
As I haven’t used a SMIL polyfill this won’t run in current versions of IE (check out my post here for adding IE support).
Audio support
Audio used in your animation is now output into your file. By default the sounds are saved as external files and referenced by the SVG. Note that this feature uses a very small amount of Javascript to trigger the sound effect, which may not be compatible with pure SVG players.
Image & Audio Embedding
These two new options allow for embedding referenced image and audio files directly into the SVG, allowing for a fully contained SVG file. Note that unlike when exporting a SWF from flash, there is no compression applied to these resources when exporting an SVG. All compression should be done on the assets before importing into Flash Pro.
SVG Scaling
When loading an SVG into an HTML document, it often important to specify how the SVG scales within it’s container. This option allows for three different settings: None, Contain within bounds & Crop to bounds.
Animated ViewBox
This is a powerful feature that allows you to animate the SVG viewBox, effectively moving the ‘camera’ around the animation scene. Use this by turning on the “Use animated viewBox” setting and animating an instance on your timeline with the name “viewBox”. The instance should have the same aspect ratio as your document and transforms like rotation and skew will be ignored on the instance.
This release also contain a bunch of bug fixes, notably for longer animations.
Grab the new version at Github
Note to CS users
None of these new features are accessible in the old CS version of the tool. I might have time in the future to add support, except for the two embedding options, which rely on CC APIs that are not accessible in CS.
smil2css would be a useful addition to flash2svg
https://github.com/webframes/smil2css
Just came by to say that my animations usually works as they should after I restart the computer, or at least have had Flash closed for a while – not exactly sure, and no idea why. Relieved nevertheless!
That’s a great idea, unfortunately smil2css doesn’t support enough features yet though (animateTransform most importantly).
Tom you are awesome.You created a really great tool. Thank you!
In early versions there was the ability to export via command “Export SVG”. I knwo, that you doesn’t support this ability any more. The reason why I ask regardless: I have lots of fla’s, where I want to export via batch. Therefore I’ve build a batch command, which does use your command “Export SVG”:
Your command “Export SVG.jsfl”:
if(!this.extensible){fl.runScript(fl.configURI+”Javascript/Extensible/init.jsfl”);}
(function(ext){
extensible.que.push(
new extensible.SVG()
);
})(extensible)
My batch command “Batch SVG Export.jsfl” that use your command:
(Removed by Tom for brevity, see links below)
But nothing happens – no error and no message. Is this a promising way or is it hopeless?
I’m on Windows 7 with CS6 and v3.36 of “Export SVG”. I doesn’t have CC …
Josef
Uhps – the files doesn’t look good in the blog. Here are the dowload-links:
http://www.filedropper.com/batchsvgexport
http://www.filedropper.com/exportsvg
http://www.filedropper.com/exportsvg2
Josef
Awesome Josef,
You’re welcome to submit a pull request on Github and I’ll integrate this into the tool.
Thank you for your offer. As I write I use CS6 only. Can you add the new ability to version 3.36 also?
Another question: Text do you export as foreignObject. The internet explorer 11 cannot handle foreignObject. Windows 7/8 cannot use Edge. Is there an option to export text as SVG-Text-Node? I olny have single lines.
Hi Josef,
I have very little time for this project any more.
I doubt very much that I’ll have a chance to add any features to the last CS6 compatible version of the plugin.
As for text, I doubt I’ll have time to add support for native SVG text, but you can use the “convert text to outlines” feature (in the plugin) to avoid the use of the foreignObject tag.
If 3.13 version had these new options, why does 3.36 not include them? I also am CS6 only. This extension is really fantastic…I would happily pay for it if I can get the scaling options to work. Please fell free to contact me.
Thanks,
-HiPresto.