It’s been a while to write how I have been on my blog. My real life was so hustling me and couldn’t get time to write something.
I also feel like time stamping on each day for this 100 days challenge is not really useful for me. Instead of 100 days, I’d rather keep tracking what I have been doing. Doing so, It would be more flowy to explain what I think, and what I have experienced.
I will still use the 100days of code but days no longer point real day counts.
You may notice that I just brief that “I have worked on as usual, blah”. So what I have exactly worked?
I have worked on web animations. No animate tool, no authoring tools like that but only code. Well, I have to correct my words. Of course, I used tools for sprite kits and assets. Other than that, everything is on codes.
Applaud to GSAP!
I like to show you some examples that I have worked on.
So.. How I get to GSAP? A long time ago, I watched (@sarah_edo) Sarah Drasner’s presentation. On the conference video (I cannot find the video that I watched on youtube now) she explained how to manipulate SVG on the DOM with using GSAP. It was a very inspiring talk. When I got into the creative advertisement studio as an ongoing freelancer, I decided to use GSAP for all required interactions.
GSAP is quite awesome. It has a strong community that you can pretty much search for any animating effects. I mostly get helps from that community forum.
If you want to manipulate SVG up to very delicately, you have to buy the licence. Unfortunately, work doesn’t buy the licence (I am sure they will cover if I request but the communication to process always has been put behind.) so I haven’t used any premium plug-ins.
I use the tween max plug-in out of GSAP. This plug-in includes most of the free plug-ins as one package. This is quite enough for what I am doing since our assets are mostly rasterised assets.
As you see the examples above, you can animate pretty much what you want. You may sometimes need to think to tweak either on codes or assets. To make all compiled files under the 50k is a tricky part.