Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

PointC last won the day on December 13 2020

PointC had the most liked content!


  • Content Count

  • Joined

  • Last visited

  • Days Won


PointC last won the day on December 13 2020

PointC had the most liked content!

Community Reputation

11,131 Superhero

About PointC

  • Rank

Profile Information

  • Gender
  • Location
    Seattle area
  • Interests
    web design, motion graphics, 3D animation, video production, all things sci-fi, Mt. Rainier hiking and my dachshunds

Recent Profile Visitors

38,893 profile views
  1. My days are pretty much a 50/50 split between AE and GSAP and this is only my two cent opinion, but I would definitely do that in AE. As much as I love GSAP, the complexity of all those elements would be a nightmare. Adding interactivity on top of that would also take it up a level. Performance would be an issue as @ZachSaucier mentioned. If you do opt for the code/GSAP route, I'd say if it doesn't move, make it a static image. In AE, that whole thing would be pretty easy. All the walk cycles could be handled with Limber or DUIK. The rest of it is just a bit of vector work and adju
  2. Yep - for sure. I was just referring to the OP's demo and SplitText seemed like overkill for the desired result whereas a quick clone seemed like a quick and easy approach. Always lots of options with GSAP.
  3. Here's my simple two cent approach which just clones the h1. YMMV. https://codepen.io/PointC/pen/ExgExxL Happy tweening.
  4. PointC

    Another year ...

    Looks 'prefect' to me @mikel. Happy New Year! 🎉
  5. I'm not 100% sure why it takes that little hop backwards other than it seems to be because you're going past the end of the path and looping around. I have a lot of experience with the MotionPath plugin, but I've never split a path and gone past the end in a second tween like that. Maybe @ZachSaucier or @GreenSock can provide a deeper understanding of the 'why'. You could use a single tween like I did above and add some calls to the timeline. If some logic is true, the timeline pauses. If false it continues playing. Or something like that. If you want to fix the vector
  6. If I understand correctly, I think you could use the single tween like I did in the fork of your demo and then add the callbacks to the timeline itself rather than one of the child tweens. Maybe onStart() and onRepeat(). Does that work?
  7. Hi @adamgreenough Welcome to the forum. Maybe I'm missing something, but why do you need the second tween on that timeline? https://codepen.io/PointC/pen/2cdea647bc6dcaee67b75d04aa746644
  8. I think I've said so that so many times that I thought I could stop saying it. It should be branded in the forum scrolls of history. SVG is always my go-to for masks and clip-paths. I don't even bother checking support for anything else so if CSS clip-path suddenly gets broader support could somebody let me know? Thanks.
  9. Hi @Navaneethakrishnan Welcome to the forum. I'm not sure what your requirements are for the final project, but you may be able to use DrawSVG for this. Here's a quick demo with hard coded values that may give you some ideas. https://codepen.io/PointC/pen/eYdyRba Happy tweening and welcome aboard.
  10. Hi @dr34mo Welcome to the forum. You'd probably want to use a mask for that effect. Here is a version I made for another forum question using a SVG. It should give you some ideas. https://codepen.io/PointC/pen/EqmxZV Happy tweening,
  11. Hi @s-15 Welcome to the forum. Looks like updating to the latest version of GSAP makes everything work correctly. (You were using a version that is several years old.) https://codepen.io/PointC/pen/RwGjXZy I also changed you syntax to the GSAP 3. Check out the migration guide for all the info. Happy tweening.
  12. Wheee! Around and around it goes. Just my 2 cent demo. https://codepen.io/PointC/pen/VwjJaqw Happy tweening.
  13. We have a couple threads about this topic which should help. Happy tweening.
  14. Yeah, asset prep is always the big thing with SVG animations. If you can make the artwork from lines or stroked paths, loops can do a lot of heavy lifting for you. The example you showed above looks like it would work by cloning the original line/path and staggering the original and clone animation. It's not exactly the same, but I do have a tutorial showing dashed lines and cloning in a loop. That way you could easily create a mask or a different color version of the original path/line. Maybe you can find some useful info in it. https://www.motiontricks.com