JSON export for web SVG animation.

General Moho topics.

Moderators: Víctor Paredes, Belgarath, slowtiger

Post Reply
User avatar
Maido H
Posts: 7
Joined: Thu Sep 10, 2020 12:13 pm
Contact:

JSON export for web SVG animation.

Post by Maido H »

I tried to search but I couldn't get the final NO so, therefore... would it be possible to export JSON files for web SVG animation (I might not understand fully the JSON and SVG relations here, but I hope the idea could be followed)? Has anyone tried and succeeded?

Characters are getting more and more into the web and to be honest After Effects is quite a terrible tool for character animation and MOHO would be a much better choice.

Thanks a lot!
:!: Moho is great and let's make it even better :idea:
User avatar
synthsin75
Posts: 9934
Joined: Mon Jan 14, 2008 11:20 pm
Location: Oklahoma
Contact:

Re: JSON export for web SVG animation.

Post by synthsin75 »

You can render to SVG or export to FBX in Moho. While the Moho file format is JSON, it does not export to JSON.
User avatar
Maido H
Posts: 7
Joined: Thu Sep 10, 2020 12:13 pm
Contact:

Re: JSON export for web SVG animation.

Post by Maido H »

The answer seems to be still no then, SVG export is possible only for one frame and it's quite useless when we talk about animation (not sure if it would be possible to assemble SVG sequence back together later with some kind of programs).
FBX is also very limited in it's nature, even if it would be possible to get the JSON out of it later - manual reads:
Many Moho commands (point binding, curvatures, bone stretching, etc.) that are not supported in FBX format. When designing files for FBX export, we recommend that you use the View > FBX Preview command to preview your project before export. For additional information on how to address unsupported features, see “FBX Preview Mode (Pro Only)”.
Unfortunate, then AE it is for web characters :/
:!: Moho is great and let's make it even better :idea:
User avatar
Maestral
Posts: 531
Joined: Tue Jan 27, 2009 5:44 pm
Location: Belgrade, Serbia

Re: JSON export for web SVG animation.

Post by Maestral »

Hope you'd not mind my curiosity but what do you use for SVG & JSON in AE? Lottie or something more flexible?
User avatar
Maido H
Posts: 7
Joined: Thu Sep 10, 2020 12:13 pm
Contact:

Re: JSON export for web SVG animation.

Post by Maido H »

Maestral wrote: Thu Oct 15, 2020 3:11 pm Hope you'd not mind my curiosity but what do you use for SVG & JSON in AE? Lottie or something more flexible?
Yes, Lottie if you say so :). Like I mentioned I do not have a very clear connection between SVG, JSON, and Lottie, which is what and how it works.
:!: Moho is great and let's make it even better :idea:
dkwroot
Posts: 677
Joined: Thu May 02, 2013 6:56 am
Location: USA
Contact:

Re: JSON export for web SVG animation.

Post by dkwroot »

Maido H wrote: Thu Oct 22, 2020 10:42 am
Maestral wrote: Thu Oct 15, 2020 3:11 pm Hope you'd not mind my curiosity but what do you use for SVG & JSON in AE? Lottie or something more flexible?
Yes, Lottie if you say so :). Like I mentioned I do not have a very clear connection between SVG, JSON, and Lottie, which is what and how it works.
JSON (JavaScript Object Notation) is just a data storage format popularized by the programming language JavaScript. It just stores information in an easy format so that other programs can import it.
SVG (Scalable Vector Graphics) is an image format that stores vector drawing data. Browsers can import these files and display vector drawings.

The problem with animated SVG is that many browsers don't support them directly anymore. In the past, we could use SMIL to inject animation logic right inside of an SVG and it would work on the browser, but then Chrome came along and ceased support for it in exchange for CSS3. These days if you want an animated svg, you'll need 3 files to view it. An HTML file to load a webpage, an SVG file to hold the graphics data and a CSS file to hold the animation data.

If someone were to develop an exporter for Moho to animated web graphics, they would have to convert the moho animated data to CSS and the Vector data to SVG. Then we would load a skeleton HTML file to pull everything together. It would be pretty messy and if you aren't familiar with web development, it probably wouldn't be terribly useful to you.
User avatar
SimplSam
Posts: 1033
Joined: Thu Mar 13, 2014 5:09 pm
Location: London, UK
Contact:

Re: JSON export for web SVG animation.

Post by SimplSam »

dkwroot wrote: Thu Oct 22, 2020 11:15 pm The problem with animated SVG is that many browsers don't support them directly anymore. In the past, we could use SMIL to inject animation logic right inside of an SVG and it would work on the browser, but then Chrome came along and ceased support for it in exchange for CSS3. These days if you want an animated svg, you'll need 3 files to view it. An HTML file to load a webpage, an SVG file to hold the graphics data and a CSS file to hold the animation data.
I believe more typically now there are 4 components for in-browser animations: HTML page, Image data (vector or bitmap), CSS data (styling or functional) and JavaScript scripting. All of these components can be embedded in the same single html text file - although more typically they might be separated for modularity sake.

Also.. SMIL in Chrome was rescued, as Chrome devs suspended their abandonment plan.
Moho 14.1 » Win 11 Pro 64GB » NVIDIA GTX 1080ti 11GB
Moho 14.1 » Mac mini 2012 8GB » macOS 10.15 Catalina
Tube: SimplSam


Sam
Bortyk
Posts: 1
Joined: Sat May 28, 2022 10:01 pm

Re: JSON export for web SVG animation.

Post by Bortyk »

Post Reply