Please keep the animated SVG's away! Motion is extremely effective at drawing the eye's attention, and so should never be used unless that's the goal. In fact I can't think of a single good design reason to ever animate an icon except for loading/progress icons, which already are ubiquitous and generally don't need any dedicated animation tools since they're so simple and reusable. You don't ever want normal interfac…
Where are all the animated SVGs?
101–110 of 200 posts
Re: Where are all the animated SVGs?
#102before others try: it won't run using wine (at least on lubuntu with wine 4.2) first i was like: oh, another person that understands why this does not happen and laments the state of things. then i scrolled down. this tool sounds awesome. i am a programmer that learned inkscape and edits the curves by hand afterwards, because designers can not be bothered, but animations are a tough problem for me to solve. i am almo…
Re: Where are all the animated SVGs?
#103Earlier quoted context omitted.
Please keep the animated SVG's away! Yes. Now, from the people who brought you the tag, continuous junky animations. You can also do spinning logos in WebGL, but you shouldn't. The only legit use for this is when you want clicking on a button to indicate that something happened. If you click on a "send" button, and an envelope zips across the screen and disappears, it's OK. If you click on the "Buy" button, it would…
> (Remember "material design?" Whatever happened to that?) The new hotness is "neumorphism": https://uxdesign.cc/neumorphism-in-user-interfaces-b47cef3bf...
Re: Where are all the animated SVGs?
#104Please keep the animated SVG's away! Motion is extremely effective at drawing the eye's attention, and so should never be used unless that's the goal. In fact I can't think of a single good design reason to ever animate an icon except for loading/progress icons, which already are ubiquitous and generally don't need any dedicated animation tools since they're so simple and reusable. You don't ever want normal interfac…
Re: Where are all the animated SVGs?
#105Back in 2013 the game magazine Polygon created really stunning illuminations in their Playstation 4 and Xbox One reviews. It's what got my interested in the more advanced uses of SVG and CSS -- it uses a clever trick where it uses the bezier curves as paths that are then filled in by offsetting the stroke fill... here it is. stroke-dasharray: 422px, 422px; stroke-dashoffset: 0px; fill: rgba(255, 255, 255, 0.333); htt…
Re: Where are all the animated SVGs?
#106Earlier quoted context omitted.
The performance issues are what prevented me from using SMIL. A project I was working on called for an SVG animation that we also had to move on scroll (don't ask...). The animation was choppy and definitely got the fans spinning. Swapping that out for the equivalent CSS animation and everything was smooth as butter. It's obvious that SMIL performance is not as important to the browser makers than CSS animation perfo…
I think reversible SVG animation on scroll effects _can_ be quite neat, e.g. https://www.opencrux.com/ It's far preferable to most scroll-related effects I've seen.
Re: Where are all the animated SVGs?
#107Please keep the animated SVG's away! Motion is extremely effective at drawing the eye's attention, and so should never be used unless that's the goal. In fact I can't think of a single good design reason to ever animate an icon except for loading/progress icons, which already are ubiquitous and generally don't need any dedicated animation tools since they're so simple and reusable. You don't ever want normal interfac…
I agree but with the cavaet that animated SVGs can be good for some special cases: * Loading indicator - from a UX perspective we are used to this so having a non-animated loading is weird. I think gmail used to do it but that was back in the mid 2000s. * Confirmation of a user action - if I have sent an email then a sound and/or animation can feel good. It is not necessary but sort of adds a magic to the application…
Re: Where are all the animated SVGs?
#108> This process reminds me of web design in the 2000s when Photoshop was king. ~~Cries in Adobe Fireworks~~ I always wondered why Adobe Fireworks, which was a hundred times better than PS for web design, never got traction. I mean this was the time of web 2.0 gradients and rounded corner gel buttons and people were making this stuff with freaking PS. Why? Adobe Fireworks could do vector graphics wonderfully.
I miss Fireworks so much, I even tried to run the latest version under wine but never managed to get it to run correctly. Does anyone know of a good alternative that runs on Linux? I've been using Gravit Designer but it's kinda slow.
Re: Where are all the animated SVGs?
#109Please keep the animated SVG's away! Motion is extremely effective at drawing the eye's attention, and so should never be used unless that's the goal. In fact I can't think of a single good design reason to ever animate an icon except for loading/progress icons, which already are ubiquitous and generally don't need any dedicated animation tools since they're so simple and reusable. You don't ever want normal interfac…
Please keep the animated SVG's away! Yes. Now, from the people who brought you the tag, continuous junky animations. You can also do spinning logos in WebGL, but you shouldn't. The only legit use for this is when you want clicking on a button to indicate that something happened. If you click on a "send" button, and an envelope zips across the screen and disappears, it's OK. If you click on the "Buy" button, it would…
You're going to love this.
Re: Where are all the animated SVGs?
#110Earlier quoted context omitted.
I agree but with the cavaet that animated SVGs can be good for some special cases: * Loading indicator - from a UX perspective we are used to this so having a non-animated loading is weird. I think gmail used to do it but that was back in the mid 2000s. * Confirmation of a user action - if I have sent an email then a sound and/or animation can feel good. It is not necessary but sort of adds a magic to the application…
https://stripe.com has a lot of animations in their landing page, just fyi