-
Rotation + Position + Anchor Point
Hello, I’m trying to automate the animation attached.
What I try to achieve is:
—having a square, say 90×90 on a 1080×1080 canvas, where, every half second, the square randomly rotates smoothly by a 90° angle, clockwise or anticlockwise, from one of its corners.
—after each rotation, the square finds itself in a new position, that it should retain, whereas its anchor point should shift from a corner to another, so the anchor point shift needs to occur and be added or subtracted to the current position, to keep the illusion that nothing happened.
—and so that shall repeat itself, allowing the square to move freely over the canvas like that, but it shall never go over the edge of it. Thus, something needs to prevent it from crossing it.
I’ve asked Chat GPT unsuccessfully. Does anyone see how I could achieve this?
Thanks a lot for any attention and help!
-
5 Replies
-
There’s multiple ways to tackle this.
But because there was the boundary issue that it should never go over the comp’s edge, I thought it might be easier to define a random Walk in orthogonal steps, and then randomizing for each step if the square would turn clockwise or anti-clockwise. So instead of starting from the randomization of rotations, I start from the positions on the grid.
The anchorpoint would put itself in the correct corner to anticipate clockwise/counterclockwise, and the position that’s doing the rqndom jumps also compensates for the anchorpoint.
Because mulitple properties need to look at the same random walk values, I start with putting those in exprssion controls:
– create a 90×90 solid layer.
– add a point Control to it named “Random Walk” with this expression:
pos = [960,540];
seedRandom(100,true);
directions = [[1,0],[0,1],[-1,0],[0,-1]];
for (t=0.5; t<=time; t+=0.5) {
// move to a random neighbouring square.
i = Math.floor(random(4));
change = directions[i]*90;
pos+=change;
// if we go out of bounds, go the other way;
if (pos[0]<45 || pos[0]>1875 || pos[1]<54 || pos[1]>1055) {
pos-=change*2;
}
}
pos;if Position gets this expression:
effect("randomWalk")("Point").value;It already jumps around without leaving the comp.
I also added an angle control named “randomTurn” with this expression:
posterizeTime(2);
random(1)<0.5 ? -90 : 90;Rotation gets this expression so it uses that random Turn:
ease(time%0.5, 0.0, 0.5, 0, effect("randomTurn")("Angle").value);But it’s turning in place, then jumping, so we need to have the anchorPoint look at where it’s going. I did it like this, but there’s probably a more clever Maths-y way to do it.
Expression fro Anchorpoint:
thisPos = effect("randomWalk")("Point").valueAtTime(Math.floor(time*2)/2);
nextPos = effect("randomWalk")("Point").valueAtTime(0.5+Math.floor(time*2)/2);
turn = effect("randomTurn")("Angle").value;
direction = ((nextPos - thisPos)/90).toString();
switch (direction) {
case "0,1":
a = turn == 90 ? [0,90] : [90,90];
break;
case "0,-1":
a = turn == 90 ? [90,0] : [0,0];
break;
case "1,0":
a = turn == 90 ? [90,90] : [90,0];
break;
case "-1,0":
a = turn == 90 ? [0,0] : [0,90];
break;
}
a;And finally, Position needs to compensate for the moving anchorPoint
effect("randomWalk")("Point").value + transform.anchorPoint - [45,45];
-
Wow! Thanks a million Filip, it works like a charm!!
Thanks again and again!!
-
Thank you for your solve, Filip!
-
So to bother you all on that matter again. I was trying that expression again, but it doesn’t seem to work, although it did work perfectly a year ago. I just assume something has changed within After Effects.
The error message I get is only on the Anchor Point expression, and says “ReferenceError: a is not defined”. Do you know where that could come from?
-
Ah no sorry, it does work! I do have a question though: what if the orientation of the square, instead of always going back to 0, stays coherent with the motion?
I mean, for now, the plain colour does the trick, so we don’t see that the square goes back to 0° at every step it takes. But if the square contains content, you can see that trick and damages the effects. Any idea?
I’m posting a preview since I’m not good at explaining well…
Reply to this Discussion! Login or Sign Up