Skip to main content
C
christiana45563537
Participating Frequently
June 8, 2021
Question

Animate lines in a wave pattern

  • June 8, 2021
  • 3 replies
  • 2357 views

Hi—

 

I'm pretty much a beginner in AE and know only the very basics so I might be jumping the gun here a little.

I did some graphics in Illustrator and blended one curved line with a straight line at the bottom and would like to animate the wave part at the top while the bottom line is still. Best analogy I can think of is probably like the bellows of an accordion if you only used one hand and kept the other still.

 

In my mind I'd like it to partly flow over the type, but perhaps that's too much to figure out. One thing at a time. The image below shows the idea – one curved shape and one with a straight/pointy shape. 

 

Any idea how to do this the simple, correct or whatever way?  

 

This topic has been closed for replies.

3 replies

R
Community Expert
Rick GerardCommunity Expert
Community Expert
June 9, 2021

Maybe this quick tutorial I did a long time ago will help. Sometimes preparing the animation entirely in Illustrator is the easiest way to accomplish the task.

C
christiana45563537Author
Participating Frequently
June 10, 2021

Thank you for sharing this. I'm not sure this is the right way for this particular project, but I'm gonna try it out and see if this is something I could use anyway either for this or another project.

ShiveringCactus
Community Expert
ShiveringCactusCommunity Expert
Community Expert
June 9, 2021

There are some posts I wished I hadn't opened.  This has been bugging me for an hour.

 
Here's where I ended up.  I made a precomp with a layer with grid lines on, with a second layer for the solid colour.  In the main comp, after spending ages with Displacement maps, I swapped to Wave World.  
There's probably other out there... you could check out the offset effect or maybe a 3D shape in C4D Lite?

    C
    christiana45563537Author
    Participating Frequently
    June 10, 2021

    Thank you so much for the effort you've put into this! I will have a look into it and see if I can make it work. 

    Kyle Hamrick
    Community Expert
    Kyle HamrickCommunity Expert
    Community Expert
    June 8, 2021

    Perhaps this is a simpler solution than you're after, but since you said you're a beginner, I'm trying to keep that in mind. 
    The easiest solution is just to simply create a much wider/extended version of your wave design, and then animate its X position in After Effects. Include a light blue fill as part of that wave element, and then it will cover the text when the peaks move past it. 

    If you feel like that doesn't get you the effect you're after, there are more complicated setups that could potentially help you achieve a more organic wave-like motion, but we might need to get into more detail about exactly how you're wanting this to look (or how deep down the rabbit hole you're wanting to go...)

     

    Good luck!

    C
    christiana45563537Author
    Participating Frequently
    June 9, 2021

    Thank you! That is a simple solution. In fact I did the same thing with a gradient in Flash about 15 years ago 🙂

    Will have to look into a different way if possible too as this won't work very well for the straight lines on the example to the right.

     

    I'd like to make the two points move up and down independently and dynamically as they pull the lines below with them either stretching or squeezing. If that makes sense.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices