I’ve seen some people using this and I think it’s a pretty cool thing. So I wanted to share this with y’all! Here’s what it looks like (recorded from my story):
I used an overlay with text so the effect is even more visible.
This would look cool in like computer or tv screen scenes for example.
Things you should be familiar with before this tutorial:
- overlay placement
- rotating overlays
Here’s how to do it:
You place your overlay as usual, don’t get to much into detail as you’ll have to change its position after. Focus on the scale.
Rotate your overlay 0 degrees with anchor point 0.5 0.5. This is to set the overlay’s middle point.
Place your overlay again, because now it has moved positions. Just change the ‘old’ coordinates to now new ones.
Scale your overlay in x-direction to negative, then back to positive and loop it.
Important: ONLY one direction! (x for horizontal, y for vertical)
Here’s a “template” :
BACKGROUND with OVERLAY to 1 123 123
&overlay OVERLAY rotates 0 anchor point 0.5 0.5 in 0
&overlay OVERLAY scales to -1 1 in t THEN overlay OVERLAY scales to 1 1 in t loop inf times
t = amount of seconds
It’s only 3 lines of code!
Also, I don’t recomend using easing functions (easein, easeout etc.) on this animation, I thought it would look even better, it didn’t. Looks weird.
What do you think about this animation? Do you this tutorial helpful?
Here are some others tutorials by me:
- How to: cool night to day scene
- How to: cute falling leaf/feather animation (includes this animation)
- How to: G i f s
- How to: phone call scene (2 backgrounds)
My other threads: