So, I just finished my first animation using your tool. Let me tell you how excited I was that you're able to export to an animated SVG! This is a simple helper animation to illustrate to a user how to drag and drop an element on my site.
I found myself frustrated, however, when, having completed the export, I discovered that rather than using transformative or animation-driven CSS, or even SMIL, the file exports with a massive JS payload (presumably the "Expressive Player").
It took me a good 45 minutes to decompile, prettify, and read the script (because the odds of me embedding an unknown JS script to a corporate production website approach zero so closely it may as well be taken for granted), work out how to refactor the output so it could be SVGo'd (taking my 350kb SVG down to 220kb... because 204kb of that IS your script), and to re-encode the JS back into the SVG to encapsulate it (so I can load it with an
<image> tag as opposed to an
The problem with this approach (using a script file instead of, say, SMIL) is that the resultant SVG cannot be re-URLEncoded into something that can be loaded into a CSS background). That's not the end of the world, of course, I can simply use an image tag, but it does serve to highlight a break in the compatibility. It also makes it far more brittle from a JS library-compatibility standpoint, a mobile flexibility standpoint, and none of that is withstanding (and I honestly, genuinely feel for your devs here) from a debugging standpoint.
As an experiment, I rebuilt the image in the way I always have in the past: by hand, using SMIL tags. The resultant file, including all the animation markup, sits at 17kb, optimized, and CAN be embedded directly into my Sass for CDN caching and reuse, and, of course, loads very nearly instantly, even over single-bar-reception mobile 3G.
Please understand: this is NOT complaining or lambasting your tool; not whatsoever! To the contrary: you folks have built a positively-stellar webapp here - better than literally ALL of the others I've used from a UX and ease-of-use standpoint, and approaching free-standing desktop apps in its utility. And I say this as a 30-year web software engineer and usability/UX specialist. If I had to compare the level of polish to something, I'd point to Figma (and given what Adobe just paid for them, this is high praise indeed), or even Flash Pro (not the player; like I said: this is NOT an insult).
Call this some constructive criticism, or feature requests, or user feedback. Here goes:
I don't know what the target demo's primary use case for the tool is. When all one has is a hammer, every problem looks like a skull, and I, personally, would use such an application for animating SVG's for use on the web, exclusively. That's not to say I'm the norm, just what I see my use case as (if I'm looking to do something like a YouTube animation, or game cutscene work, I'm infinitely more likely to use something like Animate, AfterEffects, Premiere, Blender, etc. Even for asset creation, I'd lean towards a freestanding app, like Illustrator, Sketch, or even InkScape). That said, here's what I'd like to see, personally:
The ability to OPTIMIZE the output. This MATTERS for web. Very few people need vector graphics to 5 decimals of precision, in my experience. At least, not for final output. This feature could simply be a popup window with a live preview and a
<range> control, allowing users to dictate where the rounding happens. In my case, my 384px-wide output isn't benefitting much from precision to the nearest 10,000th of a pixel. SVGo is open-source. Integrate it! If you find yourselves struggling to find a suite of settings that work without butchering the output, poke me. I'll give you mine to start from.
Same goes for the JS. If you're gonna insist on using it, you GOTTA slim that down some. Your player takes up more file size than my site's FRAMEWORK. A great place to start would be those numerics, too. Things like
513.3983153660931,128.62676529378754 seem excessively over-precise to me.
513.4,128.6 is visually indistinguishable (at least in a browser. Note those are ACTUAL VALUES from your .svg output). I shouldn't be brushing up against the bounds of floating point to make a box slide.
A live preview OF the export. I found myself having to switch back and forth between a CODEPEN to see what the result was actually gonna look like. Again: not a deal-breaker, but I daresay I have a hair more experience than the vast majority of PEOPLE, much less your users, specifically. I rather strongly doubt the average user is gonna be ABLE to tweak this the way I have.
Open source your PLAYER code. Not the App (obviously), but the embed. There's a non-zero percentage of corporate users you're burning straightaway by not having that visible, and besides: people like me will actually GIVE YOU CODE, FOR FREE, to fix any issues you may have arising, because we don't have time to wait on it. Indeed, I'd love to see your export code; I think it'd be entertaining as hell to write...
The ability to export SVG's as an encapsulated file. There's almost NOTHING your tool is doing that cannot be done with SMIL, albeit with a GREAT deal more pain and suffering. But as things stand, there's no possible way to embed the output into, say, an email. Hell, on my corporate network, there's no way to actually ATTACH the file (our nanny software picks up the
<script> tag)! I gotta zip or tar the thing before I can share it. If there was an option to output straight-up SVG/SMIL code, I'd use this tool 20 times a week, for everything from icons to animated trainers!
Again: I want to reiterate: I'm NOT being critical here. I cannot overstress how much my ghast is well and truly flabbered at the sheer quality of this tool. Unfortunately, at this moment, it doesn't meet my use cases, personally, but you smacked the living daylights outta my gob with how polished and slick this thing is. Next time y'all are hiring, poke me, lol! This is a fantastic accomplishment you guys have produced (one I'd have killed to work on), and I genuinely look forward to seeing it expand.
Please feel free to hit me with any questions or counterpoints, either here or via e-mail.