Inspiring

Answered

Export Animation as SVG - alternatives to snap.svg

Forum|Forum|7 years ago
September 4, 2018
13 replies
32077 views

Hi,

tldr; are there anything at all (even paid options) that lets me export animation as a svg, other than snap.svg plugin?

I need to export animations as small svg clips, and canvas elements will not fit the bill at all in any shape or form. However, snap.svg, the plugin, is at best outdated and is no longer maintained (their own GitHub page admits this), and at worst it was a shady work around to begin with. Just tried to install it on my new computer, and it wouldn't even install with the zxp file supposedly being corrupted or something. I just with Adobe Animate could do this out of the box - for something that's called Adobe Animate CC, and branded as a software that's going to replace Flash, not being able to export my animation as svg seems ridiculous.

Fingers crossed for a solution... Or what does anyone have an alternative platform altogether for something like this?

Best,

Tony

This topic has been closed for replies.

Correct answer byunghoona16325993

So, for thoes who are MacOS users, there is an alternative product I've discovered and have been using: Keyshape (https://www.keyshapeapp.com)

I was really hoping I wouldn't be the one to answer my own question after a year or so of searching, but oh well.

Here are some pros:

simple lightweight program
intuitive and easy to use
plenty of flexibility and features, such as easing and animating on a path, masking, etc.
one time payment, no subscription hell
decent support: I've had Adobe support provide me with blatantly wrong information and take lots of persuasion from me to admist that they don't actually know what they are doing and they'll have to get back to me. Keyshape developers were able to give me clear instructions and even demo files when I was stuck.
ABLE TO EXPORT SVG FILES IN SIMPLE FORMATS THAT'S EASY TO USE ON THE WEB
Of course supports various other file formats as well
works very well with Adobe Illustrator - just copy paste in your vectors.

Some cons:

Not able to use JavaScript to give interactivity or other scripting features.
Only availble on MacOS
Lacks other development tools/features (e.g., AIR for Desktop)

Would be wonderful if Affinity developed something alternative to Animate, but looks like that won't happen anytime soon 😞

T

théophiled90501014

Participant

For those coming here from googe, (one of the) the more modern solution is lottie: LottieFiles for Adobe After Effects: Streamline your animation workflow

A

aneschutz

Participating Frequently

Lottie is an amazing resource BUT for those who don't use After Effects, unfortunately, Lottie is not an option.
We are trying to simply export an animated SVG from Adobe Animate - which should be quite simple for a vector-based animation tool.

T

théophiled90501014

Participant

mh seems like there was a poc to export from adobe animate to lottie: https://community.adobe.com/t5/animate-discussions/export-to-lottie/td-p/9451694

But reading the github PR, the project seems dead. Maybe you could import the animate project into after effect, then export from AE to lottie ? https://openlab.bmcc.cuny.edu/mmp260-pinkas-s2020/week-11/

I don't use adobe animate so I have no idea if this could work 😕😕

Zen Creative Agency

Known Participant

So Adobe ANIMATE doesn't ANIMATE SVGs.

Are you serious, Adobe? This is unbelievable.

Not only that, you thought it would be a good idea to remove any third party export support, JUST TO REALLY ADD INSULT TO INJURY.

Sometimes it feels like you're deliberately messing with your customers, I swear. There is no other logical explanation for such lunacy.

Kirmm Ella

Known Participant

https://github.com/TomByrne/Flash2Svg

Edu Couchez

Inspiring

Any suggestion on how install it, for the designers with 0 skills on programming?

thanks!

JoãoCésar17023019

Community Expert

Hi.

1 - Open the link: https://github.com/TomByrne/Flash2Svg;

2 - Go to the right side of the page and search for the Releases section;

3 - Click on the latest release - the one with a green pill label;

4 - Download the ZXP file from the Assets section;

5 - Then you can go to https://zxpinstaller.com/ and install the app for your operating system;

6 - After installing ZXP installer, drag and drop the ZXP file you've just download onto the software window.

Just keep in mind that this is an old extension and it won't probably work on newest versions of Animate.

Regards,

JC

L

lottaar

Participant

Still no option to export an animated SVG? As a web designer looking to make an animated logo for the web I took for granted Adobe Animate was exactly what I needed but perhaps I picked the wrong software?

Edu Couchez

Inspiring

hey! definitivelly you picked the wrong software (even maybe the wrong company). Animate is basically the same Flash that has been out there since mid 90's... only redesigned UI and some improvements. You picked because Adove has lots of resorces and artists to create beautiful marketing imagery, to make you think you need their tools. I've installed and uninstalled intermitently Animate thrugh the years, thinking at last would find a way to include it in my design work pipeline... but not, I've to turn back again to manually SVG/CSS styling and animation: Not intuitive, complicated, but you get what you want stright from a HTML simple code.

M

mihaic22966460

Participant

Hey, check SVGator www.svgator.com
I think this will be the best soultion when it comes to animating SVGs. You can export with CSS animations only or include JavaScript for more advanced stuff like morphing animations. They also have a player embedded in the exported file or you can also choose to use it external from their CDN. Either way, it works like a charm, and you can also export .dart or .js for Flutter and react Native frameworks. I'm really surprised that very few know about this tool.

S

studio graphique MESR

Participant

Hello. Has there been an evolution since August? Is there an implementation date? I really don't understand why a vector animation software can't export an animated svg as a single file. Using svgator for now.
Thanks

E

erikb97369088

Participant

I am new to animate vector for applications. I am paying whol stupid unusable package from Adobe full of unusable funy softwares and if i need to do smth for my client, I need to pay other startup application to get result???

Shame on you Adobe

A

aneschutz

Participating Frequently

It's 2020 and this discussion is still on the map, but looks like Adobe is not considering add this feature, am I right?

I just don't understand why it's so hard to implement this feature, once we know some other tools that easily do the same, with a lower cost if you compare with the Adobe subscription costs. Makes no sense.

E

Edubal

Participant

Maybe Adobe is just waiting a stable solution to buy and integrate, saving time and effort.

If any of you coders outside Adobe manage to find that solution, please, dont sell it cheap.

Peter Villevoye

Community Expert

Try Tumult Hype.

For a long time it was a kind of smooth Mac-only equivalent for that (in)famous Adobe Edge Animate, but as Adobe cancelled their breed of Edge puppies, Hype started to bring web animation to a much higher level. It offers SVG anchor point animation, and many more excellent features.

G

Geebee

Participant

Yes i would love to have a solution for this too. I did an animation job back in 2018 which i exported as SVG via snap.svg and its build in his webside. Now the customer ask me to go futher with this animation, but as snap.svg is not supported anymore in Animate 2020, so I´ve got a big problem. Please ADOBE put some energy into an inhouse SVG Exporter. The trend with animations on websites are coming back now.

Robert Mc Dowell

Legend

https://github.com/TomByrne/Flash2Svg

Tamerq

Participant

Any updates on this from Adobe?!! I assure you that there are many out there that need this feature!

6

6clicks

Participant

Yes definitively ... missig this .. lot's of app are doing great job at this ..

like : https://app.svgator.com/

.. but ADOBE have to be part of this...

Nick Goard

Participant

We are actually doing an internal (but important) project right now that would be solved if SVG animations could be exported from Adobe Animate CC. I know we can use a variety of scripts to achieve what we want (Snap.SVG, Bodymovin + After Effects, GreenSock, etc...) - In the interest of saving time though, because we're an agency and working on our OWN website (which this project is for) is tough to get done when we have to manually write code, test and re-test. So the quickest route would be best, looks like we will have to look at online SVG animation/creators to get the job done without burning up hours. I do so wish this feature was available for Animate though, yes SWF's are dead on the web, everyone knows this, but animated SVG's are the next SWF's I think...let's get moving Adobe Please? Get on top of the future

B

byunghoona16325993AuthorCorrect answer

Inspiring

So, for thoes who are MacOS users, there is an alternative product I've discovered and have been using: Keyshape (https://www.keyshapeapp.com)

I was really hoping I wouldn't be the one to answer my own question after a year or so of searching, but oh well.

Here are some pros:

simple lightweight program
intuitive and easy to use
plenty of flexibility and features, such as easing and animating on a path, masking, etc.
one time payment, no subscription hell
decent support: I've had Adobe support provide me with blatantly wrong information and take lots of persuasion from me to admist that they don't actually know what they are doing and they'll have to get back to me. Keyshape developers were able to give me clear instructions and even demo files when I was stuck.
ABLE TO EXPORT SVG FILES IN SIMPLE FORMATS THAT'S EASY TO USE ON THE WEB
Of course supports various other file formats as well
works very well with Adobe Illustrator - just copy paste in your vectors.

Some cons:

Not able to use JavaScript to give interactivity or other scripting features.
Only availble on MacOS
Lacks other development tools/features (e.g., AIR for Desktop)

Would be wonderful if Affinity developed something alternative to Animate, but looks like that won't happen anytime soon 😞

njnjahvi

Participant

Thanks dude.
I really don't understand why it's still not a priority for Adobe team in 2020.
I'll try your app 😉
Thanks again

Show more replies

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded