You are viewing a single comment's thread from:
RE: Development of gsaw-js v0.1 - The Scipio Files #11
Great idea and addition to Utopian.
I rmemeber when Dan first released animate.css, it really did help introduce the idea of css animations to a lot of developers. hopefully your project gsaw could do a similar thing for js based web animations. gsap is an awesome tool but tottaly not begginer friendly.
Perhaps if you're just using jQuery for the selector engine you could use sizzle instead. Sizzle is jQuerys selector engine broken out into a separate utility.
Thx for your comment! I agree completely that GSAP isn't beginner-friendly and because Animate.css is such as big success, there's a clear need for cool "just add some water" web animations that only requires adding an HTML class name and the inclusion of my JS repo (minimized, eventually, or just adding a few effect snippets you want to include in a project).
PS, there are multiple ways to select / target elements, even using just
document.getElementsByClassName(names), but I'm currently not sure if I want to support more advanced yet easy-to-use selections later on in development. SizzleJS could be an idea to use, so could D3JS or jQuery itself, or I could just strip jQuery out completely. Let's see, I don't think including a bunch of overhead-code this size makes a big impact on performance, but in case it does - eventually - I'll look into it! ;-)Edit: self-upvoted for context-visibility (the Steemit interface could / should deal with that as well... because I wrote such a long reply to @julieNBH's comment, this reply of mine to @sambillingham completely lost visual context... Maybe we can partially auto-collapse long comments, or add some UI element to "group" comment threads that belong together...)
Projects like http://bouncejs.com already does that. I don't get why we should use JS for animation unless maybe for games.
Also there's a new API in the works coming just for that (High FPS animations with no libraries)
https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API
BounceJS.com has a nice UI with building blocks! And it transpiles / exports to CSS3 animations. The reason why I don't like using CSS3 for web animations, is that it requires modern browsers (although that's not a big problem anymore), but far more importantly it doesn't allow quick "scene reordering". Suppose, after coding a bunch of animations, you decide (or your hiring client decides) to move "animation part 5" to "part 3" and "part 2" to "part 4". Then you're back to square one!
However, using GSAP (and my gsaw-js therefore as well) you can "wrap" animation scenes in multiple timelines. And also it allow for re-using pre-built animation components. The problem with GSAP however, is that it's not exactly JS-beginner-friendly... And neither is "regular" CSS3 animation coding, why would otherwise Animate.css (and family & friends) be so successful?
gsaw-js is intended as a pre-fab "Add Water" animation lib. You only add an HTML class to the element you want to animate, et voila!
BTW: there's plenty more room for DOM / SVG / Canvas animations than just in games:
E.g. advertizing banners, web apps, call-to-action buttons... Just watch where I'm steering gsaw-js to! I'm hoping to commit v.0.2 later today!