The best magazine
One of the first applications for light and shadow is a sweeping arc, like we see in stadiums or blasting the sky on nights of celebration.
To see the sweep of continuity of your arc, to see the distance for your light from it's object, you practically have to view the scene from above.
No problem.
Views of each perspective are available and so are multiple view windows that allow you to view the your animation from the front presentation view, for example, and from above at the same time.
These different views and using multiple views are invaluable as you develop three dimensional presentations.
What do you want to consider when you develop an arc? Well, whenever I read guides and tutorials that involve Math, they usually begin with a disclaimer warning you it will have no harmful effects on your psyche.
I like Math but realize it is not every designer's cup of tea so we will do the briefest of brief overviews that will help us put this on the map of practical application.
When you view any movie, any composition, any animation, your are viewing an X-Y grid.
Even if it is has 3D depth and perspective, the 'real estate' you are viewing in your movie hall, television set, or Internet browser is an X-Y grid with width and height.
This is where *everything* happens.
When you are designing, you place everything on this grid a certain distance from the left margin and lower margin, or in Math talk from your grid 'origin'.
Yikes! That's almost everything there is to it.
When 'things' are moving, they are moving on this grid, up or down, right or left.
If something is moving over and up and continues this motion at the exact same rate, this is velocity, like your car going 50 miles per hour.
It's not going faster or slower, it is moving, but it's moving at the same rate.
When one of your dimensions is changing it's rate, not only moving but moving faster, this is acceleration.
Your object is moving and it's moving faster.
Your car went from 50 to 60 miles an hour.
When you plot this motion, velocity is a straight line.
Picture a line from the lower left hand corner to the upper right.
Your rate of change is constant.
When your object is accelerating, this is depicted as a curve.
Every time you move over two units, you move up four, when you move over four, you move up sixteen.
Your rate of change is exponential.
Your rate of change is changing.
There are countless real world applications of these most simple concepts, gravity, the depiction of a rocket blasting off, the depiction of something falling out of the sky but all we really want here is the concept that this simple shape, an arc, is represented in Math by exponential relationship.
Y = X squared is about as simple as it gets and that is exactly what we use to create an arc for our shape in our animation.
Consider your light traveling half the path of a circle; again it is sweeping from one end of the stage to the other, way out in the audience, several hundred feet from the stage.
Let's define this arc with some special After Effects considerations: var x =30*time; var y = 100; var z = 0; // y = 7*(Math.
pow((time-5),2)); z = (7*(Math.
pow((time-5),2)))-100; [x,y,z] You have defined a simple shape like a circle.
Making the definition above defines the path your shape will travel on your After Effects stage in 10 seconds.
Let's consider their simplicity.
Pretend you are standing behind the sweeping light in the stadium.
It will sweep an arc all the way from the right to the left of the stage but it will remain at the same height during this passage.
The "y=100" fixes the light height at 100 feet.
On our Web design After Effects stage, our stage is 320x240, 320 units wide, 240 unit in height.
At the upper left of our stage our X,Y values are 0,0.
Placing our light at 100 units fixed height will place it near the middle of our viewing plane.
We have defined X = 30 * time.
Why? If our viewing grid is 320 units wide and we want our light to pass completely across the stage in 10 seconds, divide 320/10 and you get 32.
I chose 30 to bring it 'inside' a bit but again, picture what is happening.
At 0 seconds.
30 times 0 = 0.
Your light hasn't started moving yet.
At 2 seconds, 2x30= 60 feet.
Your light has moved 60 feet across the screen.
At 5 seconds, 5x30=150, your light has moved 150 feet across the screen, halfway and at 10 seconds, 10x30 your light has moved 300 feet across the stadium.
Modifying your Math to fit your After Effects composition size is critical but it is some pretty simple Math plotting the total time of your composition against it's dimension.
Now the fun part.
z = (7*(Math.
pow((time-5),2)))-100; In After Effects 'expression talk' Math.
pow(value, value2) says raise the first value to the power of the second value.
Math.
pow(3,2) says, 3 to the second power, 3 'squared'.
Math.
pow(time,3) says time value 'cubed', time to the third power.
In our formula, Math.
pow(time-5),2), we are saying, use the value for time elapsed, subtract 5, then multiply that value by itself: (time-5) 'squared'.
This looks a little bit wilder but, like the other definitions it makes the most sense framed in reality.
Our animation is developing in time.
Our motion occurs in ten seconds.
Our light sweeps the stadium in 10 seconds.
In our very brief 'arc 101' we stated that to define a curved path, an arc, we need an exponential relationship.
One dimension is changing faster than the other, exponentially in fact.
We have been working with the primitive x=y^2; ( x equal y squared ); What makes this special? I think most of us remember that two negative numbers multiplied together equal a positive number.
Negative 5 times negative 5 equal 25, just like positive 5 times positive 5 equal 25.
If you are looking at an X-Y grid with 0,0 at it's center, moving to the left 5 units, negative 5, and up 25 will plot the values for X and Y when X = -5.
Move over 5 to the right and up 25, and this will plot the values for X and Y when X=5.
In other words, Y is the same when X is plus or minus 5.
When X is plus or minus 4, Y will be 16.
When X is plus or minus 3, Y will be the same, it will be 9.
If you don't work with grids or picture this well, you might simply draw it.
Draw your dots 5 to the left and right of your center and 25 above, 4 to left and right, 16 above, 3 to the left and right, 9 above.
When you do this, you are drawing an arc.
The values are the same for Y on either side of the center and the values get larger faster so to speak, exponentially.
That's about it for our basic Math but let's revisit our definition for the path of our stadium light.
Remember the X value is horizontal, left to right, it is the light sweeping across the stadium.
The Y value of the light is it's height and in our example, it stays the at the same height as it sweeps.
The Z value, is the distance of the light, and technically it is the distance the light moves from it's backboard, from the center of it's arc.
What exactly do we mean by the distance the light moves from it's backboard? You are looking down on the stadium.
There are racks and rigs to support the lighting.
At the center of the stage, but 100 feet away, back into the audience area is the source, the origin of the light on it's rig.
As it moves across the stadium, it maintains the same distance to the stage, just like at any point on a circle it is the same distance to the center, the radius distance.
However, as you move toward the stage away from the backboard, you increase that distance.
When you are all the way to the right or left, you are furthest from your rig beginning point but you have maintained the exact same distance to the stage on your arc path.
z = (7*(Math.
pow((time-5),2)))-100; There is no such thing as 'negative time' so to get the effect we described above, the same value for plus and minus X's, we subtract 5 from our time value.
In our 'real world', when we begin our sweeping light arc, it is 0 seconds, no time has passed.
Time-5 is negative 5, negative 5 times itself equal 25.
25 times 7 equal 175 and this is the distance we want to 'sweep'.
Subtracting 5 from our time allows us to take advantage of the arc concept that a negative value times itself, produces the same result as it's positive value: -5 times -5 equals 25.
5 times 5 equals 25.
When one second has passed, time-5 will be 1 minus 5, or negative 4.
Negative 4 times itself equal 16.
When time equal 9 seconds, or 1 second from the end of the display, 9 minus 5 equal 4.
4 times itself equal 16.
So as the time progresses, each 'X' value in time will produce a corresponding matching value for distance, for Z as we approach the end of the animation.
Half way through our composition, at 5 seconds, time-5 will equal 0 placing the light at the source of our arc, the least distance from our rig 'backboard' then increasing again as it approaches the end of it's sweep.
At 10 seconds, time-5 will be 10-5, 5 times itself will be 25, the same value as at the beginning of our animation, 7 times 25 will be 175 and this basically simple function describes the path of our sweeping light around our stage.
The -100 in our formula moves our light 100 feet from the stage independently from the other Math, our light will remain 100 feet from the stage as it moves through it's arc away from the controlling rig.
z= (7*(Math.
pow((time-5),2)))-100; This is not the easiest concept to visualize reading an article but you will be surprised how easy it is to construct and view using this very simple math and really, just 3 objects: a back board, a moving shape, and a light illuminating the shape.
It is very easy to visualize and this is really the thrust of this article: not teaching the math of arcs and circles but presenting a relatively easy project to construct that will introduce you to the multiple views available in After Effects, with a little contribution from light transmission to make the fun exponential! As you are viewing the arced path of your stadium light, you are looking 'down' from above, viewing the 'Z' distance from the stage to the light and it is only through this view that you see the sweep of the arc.
The Math we've waded through creates a 'true' arc based on the exponential values of distance as our light moves from left to right.
There is one other even easier concept that we do need to include here at the end.
You don't need any Mathematical functions to use After Effects 'pickwhip' and once you have defined the sweeping path of your shape, our stage light, you will have an After Effects light object behind it that will travel the same path.
This really is easy.
Use the 'pickwhip' tool to define your light position by binding it to your shape.
It will travel the exact same path as your shape plus some greater distance as you define the light to shine behind it.
Choose the attribute you want to bind, enter 'alt' and click.
The values of the attribute you want to bind will turn red.
Underneath your values you see an equal sign, the 'pickwhip', and a greater sign.
Grab the 'pickwhip' with your mouse and drag it's pointer to the value you want to bind it to.
In our case, drag the light's position to that of the shape we are following.
It's three position attributes will then be defined linking to the shape object.
You don't have to accept them all.
You might want to bind, then change one value, say the height of the light, or it's distance from the stage, but using the pickwhip allows you to bind to another shape and if there is a formula or complex definition, you inherit it instantly.
tempX = thisComp.
layer("star 3").
transform.
position[0]; // tempY = thisComp.
layer("star 3").
transform.
position[1]; tempY = 125; tempZ = thisComp.
layer("star 3").
transform.
position[2]-750; [tempX, tempY, tempZ] When you use the 'pickwhip' it simply creates temp=thisComp.
layer("star 3").
transform.
position statements.
You can see I replaced the 'Y' value, the height with a fixed value.
Our light remains at the same height.
You can see I subtracted 750 from my light's 'Z' distance, it's distance from the stage.
It will follow exactly plus some additional distance you apply to get the lighting effect you want.
Use this same 'pickwhip' effect for the light point of interest.
As your light follows your shape around the stage with your defined distance, you want the focus of your light to remain fixed on the center of this shape, to be bound to this shape as you orient your light effect.
Try the steps outlined in this exercise.
There is a lot of explanation for a few simple steps.
Define your object, convert to 3D, use this formula for the shape position, turn up light transmission for your shape, bind your light to your object and you will have a very useful 3D animation, with light reflection, shadow, and expression defined paths.
Your light's path and focus will be bound by simply using the 'pickwhip' tool.
Try it out!
Source: ...