SVG Animation System (MOTION)

It would be very nice if Vectornator teams add an animation system for animating own svg projects. Now I draw the same picture in different poses and then I make a gif with all the pictures.

This is an example
SafePanda

5 Likes

I could see this happening, I just donā€™t know when

2 Likes

Yes it could be cool :pray:t2:

2 Likes

@unity.infodesign welcome to the Vectornator forum and thank you a lot of for you support.

3 Likes

I was looking for a way to export the timeline as an SVG animation instead of a movie file. I found this feature request instead. One possible way to implement this feature would be to integrate the Lottie open source (see https://lottiefiles.com/). Some other well known design apps like Adobe Animate, Adobe XD, and Sketch have already created plugin integrations for creating and editing Lottie SVG animations (see LottieFiles: Plugins and extensions for working with Lottie animations). Also, the Lottie player is now well supported for website development platforms, including as a standalone or within Wordpress.

The only downside Iā€™ve found with Lottie animations, and vector animations in general, is that they put a lot of pressure on the userā€™s browser CPU usage. But thatā€™s probably something the browsers need to catch up with by offloading much of that sort of processing to the GPU instead.

2 Likes

Hi @qrusnell and nice to meet you. Thank you for your feedback, I donā€™t know Lottie but I think could be an interesting solution but I donā€™t know if the Vectornator Team will consider this solution because Vectornator is a cross platform app and I donā€™t know if Lottie can be used on iOS. @qrusnell correct me if Iā€™m wrong.

LottieFiles is totally cross-platform. They have mobile and desktop versions of their code on Github. They also have their own free iOS or Android app to create SVG animations in their format. And they use JSON files for their document definitions. So the build looks very similar to Vectornatorā€™s.

Iā€™m not associated with Lottie at all. Iā€™ve just been looking for a better way to code SVG animations for awhile, and ran across Lottie recently when someone added a Lottie element to my favourite Wordpress theme builder.

1 Like

Thank you so much for your feedback @qrusnell. :smiling_face:

2 Likes

I would love svg animation support also. I am currently looking at different apps to do this.

2 Likes

I try to learn how animate with sprites in svg, code with css on html file, then work with Virtual Studio Code, there was more free options, so the original sprite was made on Vectornator , and share via codepen that let you share on the web for almost any gadget that support like brave, chrome, Firefox, safari sometimes got a lot of bugs

And then capture with QuickTime on my browser screen on the computer and convert to WEBM format from Google with adobe, I donā€™t like abode so try with HandBrake again a free software that help me with the conversion and well Iā€™m on the journey

Share part of the work

Maybe a longer road but hope help

And here a mp4 example

I look for a way to work with sprites in Vectornator and start with troubles when my file grow to 3600px width

And add some effects on keynote

2 Likes

Wow really cool

1 Like