hill,

Made a little bouncy SVG loading animation. This was my first time actually writing pure SVG animation code instead of using a library. Was surprised at how easy/powerful it is. This article from @SaraSoueidan was super helpful https://css-tricks.com/guide-svg-animations-smil/. Check out the code here: https://codepen.io/patrickhill/pen/MWZMLbo

loading ui animation

amxmln,
@amxmln@mastodon.design avatar

@hill @SaraSoueidan it turned out great! I love the streaking of the dot. 😊 I've always loved animating SVG directly, but it's only feasible for simple things, CSS timelines can get messy quickly, although animating things with the native animation features of JS is also getting more viable I feel. 😊

hill,

@amxmln Thanks! Agree big time on the simple things comment. Would def go back to a framework if I had to animate more than a few points 😅

  • All
  • Subscribed
  • Moderated
  • Favorites
  • •
  • UIDesign
  • tacticalgear
  • DreamBathrooms
  • cisconetworking
  • khanakhh
  • mdbf
  • magazineikmin
  • modclub
  • InstantRegret
  • rosin
  • Youngstown
  • slotface
  • Durango
  • kavyap
  • ngwrru68w68
  • provamag3
  • everett
  • normalnudes
  • cubers
  • tester
  • thenastyranch
  • osvaldo12
  • GTA5RPClips
  • ethstaker
  • megavids
  • anitta
  • Leos
  • JUstTest
  • lostlight
  • All magazines
    •