Finish Progress Pics for Illustrating the clock*
Gif for loop*
I started drawing a clock in adobe illustrator.
I use the ellipse tool and rectangle tool to make the basic shapes, I made one hour line at 12 O clock and then used he rotation tool to rotate a copy of it by 30*
Then I used CMND + D to copy that move 10 more times to complete all the hours on the clock.
I made sure to have the Clock base on one layer. With one layer for the Long Hand
and one layer for the short hand
In a new adobe animate project 1920 x 1080
Insert New Symbol
Name it Clock and set it to graphic
File > Import > Import To Stage Select your Clock illustrator file. Select all the layers. Set Convert layers to Animate Layers.
Now I'm going to select each of my arms of the clock and make them into symbols each.
Now I've got the overall clock symbol, Within it the big hand and small hand symbols.
Go further down the timeline and add frames so we have time to work with on all layers.
Use the free transform tool to make the centre of rotation on each arm in the centre circle.
Now using keyframes every 10 frames I'm going to rotate the small hand 90* more than the previous frame.
Right clicking on each keyframe I created a classic tween
After setting the keyframes.
To make the loop smother I'm going to set a new keyframe on the 39th frame, this is 1 frame away from the end. And then I will delete the last 40th frame because it would be a duplicate with frame 1. Now when it loops it will be flawless.
I repeated the same steps with the longer arm, but I made this one have more rotations within the same time so it will be spinning faster.
Now back in Scene 1 im going to use keyframes and the free transform tool to make the clock move and warp.
Now it's all animated I also made it loop by having the same start and end frame.
I use the same trick from the spinning arms keyframes to make this loop smoothly by removing the last frame.
And I added a basic colour background with the rectangle tool on a new layer under the others.
Comments