04 Text animation the old-fashioned way

26 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$49.99
List Price:  $69.99
You save:  $20
€46.38
List Price:  €64.93
You save:  €18.55
£39.89
List Price:  £55.85
You save:  £15.96
CA$68.39
List Price:  CA$95.75
You save:  CA$27.36
A$75.62
List Price:  A$105.88
You save:  A$30.25
S$67.65
List Price:  S$94.72
You save:  S$27.06
HK$390.63
List Price:  HK$546.91
You save:  HK$156.28
CHF 45.32
List Price:  CHF 63.46
You save:  CHF 18.13
NOK kr540.83
List Price:  NOK kr757.20
You save:  NOK kr216.37
DKK kr346.01
List Price:  DKK kr484.44
You save:  DKK kr138.43
NZ$83.08
List Price:  NZ$116.32
You save:  NZ$33.23
د.إ183.61
List Price:  د.إ257.06
You save:  د.إ73.45
৳5,489.47
List Price:  ৳7,685.71
You save:  ৳2,196.23
₹4,174.70
List Price:  ₹5,844.92
You save:  ₹1,670.21
RM236.90
List Price:  RM331.68
You save:  RM94.78
₦70,962.30
List Price:  ₦99,352.90
You save:  ₦28,390.60
₨13,872.15
List Price:  ₨19,422.12
You save:  ₨5,549.97
฿1,835.14
List Price:  ฿2,569.35
You save:  ฿734.20
₺1,612.71
List Price:  ₺2,257.93
You save:  ₺645.21
B$257.06
List Price:  B$359.91
You save:  B$102.84
R919.21
List Price:  R1,286.96
You save:  R367.75
Лв90.71
List Price:  Лв127.01
You save:  Лв36.29
₩68,279.30
List Price:  ₩95,596.49
You save:  ₩27,317.18
₪186.20
List Price:  ₪260.69
You save:  ₪74.49
₱2,872.25
List Price:  ₱4,021.38
You save:  ₱1,149.12
¥7,785.79
List Price:  ¥10,900.73
You save:  ¥3,114.94
MX$837.71
List Price:  MX$1,172.87
You save:  MX$335.15
QR181.98
List Price:  QR254.79
You save:  QR72.81
P681.01
List Price:  P953.47
You save:  P272.46
KSh6,621.46
List Price:  KSh9,270.57
You save:  KSh2,649.11
E£2,369.41
List Price:  E£3,317.36
You save:  E£947.95
ብር2,858.54
List Price:  ብር4,002.19
You save:  ብር1,143.64
Kz41,809.30
List Price:  Kz58,536.37
You save:  Kz16,727.06
CLP$46,240.75
List Price:  CLP$64,740.75
You save:  CLP$18,500
CN¥361.16
List Price:  CN¥505.65
You save:  CN¥144.49
RD$2,895.12
List Price:  RD$4,053.41
You save:  RD$1,158.28
DA6,726.94
List Price:  DA9,418.25
You save:  DA2,691.31
FJ$113.51
List Price:  FJ$158.92
You save:  FJ$45.41
Q388.49
List Price:  Q543.91
You save:  Q155.42
GY$10,421.54
List Price:  GY$14,591
You save:  GY$4,169.45
ISK kr6,972.10
List Price:  ISK kr9,761.50
You save:  ISK kr2,789.40
DH500.60
List Price:  DH700.89
You save:  DH200.28
L887.29
List Price:  L1,242.28
You save:  L354.98
ден2,857.41
List Price:  ден4,000.60
You save:  ден1,143.19
MOP$400.79
List Price:  MOP$561.14
You save:  MOP$160.35
N$921.79
List Price:  N$1,290.58
You save:  N$368.79
C$1,832.69
List Price:  C$2,565.92
You save:  C$733.22
रु6,654.99
List Price:  रु9,317.52
You save:  रु2,662.52
S/185.34
List Price:  S/259.50
You save:  S/74.15
K193.05
List Price:  K270.29
You save:  K77.23
SAR187.48
List Price:  SAR262.49
You save:  SAR75.01
ZK1,362.81
List Price:  ZK1,908.05
You save:  ZK545.23
L230.78
List Price:  L323.12
You save:  L92.33
Kč1,156.66
List Price:  Kč1,619.42
You save:  Kč462.75
Ft17,987.75
List Price:  Ft25,184.29
You save:  Ft7,196.54
SEK kr541.71
List Price:  SEK kr758.43
You save:  SEK kr216.72
ARS$44,114.95
List Price:  ARS$61,764.46
You save:  ARS$17,649.51
Bs345.50
List Price:  Bs483.72
You save:  Bs138.22
COP$194,137.21
List Price:  COP$271,807.63
You save:  COP$77,670.42
₡25,482.48
List Price:  ₡35,677.52
You save:  ₡10,195.03
L1,227.34
List Price:  L1,718.38
You save:  L491.03
₲374,060
List Price:  ₲523,713.94
You save:  ₲149,653.93
$U1,921.90
List Price:  $U2,690.81
You save:  $U768.91
zł199.36
List Price:  zł279.12
You save:  zł79.76
Already have an account? Log In

Transcript

Hi, let's talk a bit more about debtors and they faces most of times sans serif typeface is used in motion design, as I've said before, it is convenient, readable and what is more important is the animated my attitude to animate their faces is next. I'm not a fan of making presentations or slideshows were heard of text bodies or my desks usually are involved to the words or phrases as maximum because of the text consists of letters, and they are graphic objects, so pay special attention to each of them. I don't use scripts for an animation text. And if it takes place in my animation, something goes wrong. The best perceptive face in After Effects is tape writer. This is my basic advice in the book with Tim Ferriss because you are not the type designer and have never created interface.

So be happy. A lot of you guys have been spending a lot of nights to create Helvetica. And while using Helvetica, you have been great in graphic objects. Already, there is no way not to fail in future. Welcome again to the after effects, and let's make a new composition. And they made text, why not?

Okay? At this stage, you have already had all the information to create these latest screensaver. And those moments that have not been covered. I'm going to tell you now, in particular, I'm going to talk about text animation from this screensaver. Let me create a letter, let it be s. And I will tell you about the simplest but not poorest option to animate the letter by transition and with the help of shape. In this case, I have a typeface dance ambreen here you can use any sans serif typeface to animate this letter.

I use pencil I turn off And stroke should be zero. At the beginning I would draw this letter with a band careful draw s and inside the letter no borders after you can add stroke check the coral to be different. Here I have white letter and being object inside after I tune it in more details, so I can scale this choke again and turn to animation. Okay, let me open the shape via add add trim paths and at the beginning of the frame, I put the coke in the end value the value will be zero One second and the belly here will be 100% in and out to play the animation, check a smooth and pleasant animation. I think it is okay after as lead the letter and with the help of track Matt did doc this stroke from that and is that the letter is being drawn very easy.

Now it is looking pretty clear and let me change the color and make it okay blue the applicate both of the layers. Move the upper one and beat select the lower letter and change the color to okay yellow By this way, I created a double stroke and the animation become became nice. Of course, you can remake it or add as much as you like. It depends on your fantasy. I'm going to duplicate it again. Select these two layers Ctrl plus d then move them and for example, change the color of the second letter to white.

So, you can tune the speed more or less or make it make it different. So you can of course add in the graphs. Then you can select the upper layer double And go to the layer grid cheap. Frontex, this tool makes shaved applicate and you can delete the letter and we're going to work with the shape what does it mean for us? Okay, you can turn off the field and turn on talk and the value the value will be okay Sarah. Also add trim pulse via ad tab and animated.

The value has zero in the first frame then slide a second it will be 100% change care systems And also on one days beginning this point to move because now it's looking to Tao is static, you know. So I put one more key and animate the moving of the line like this. Now we see that the tail is random to turn on everything and look at the animation. So now we have these running stroke, except animated letters. Actually, I don't recommend to leave as choke because it looks bad. It looks good, very rare.

Here during the animation, it is cool, but after the animation, after the animation, we can just add her with this chalk. Not very cool stuff. So in this case, I use stroke as an action thing. So I'm going to duplicate it again and make it to disappear. Move a bit by timeline. Make these chalk wider.

And with the help of alpha invert map, just do it. Now the stroke is being drawn and the spirit. This is an example when you have something more difficult, starting with a simple one, then I can precompose it, layer precompose name it pass and move it this way. Have a look. As I see you can make the animation more difficult by using simple tricks. Just duplicated, rotate, change position and you got higher level animated, I think it's clear the effect is easy you need just to try it and find your option.

Second option to draw a better use bound to and draw cross talk like this way to underline them increase the value of this talk, be sure that they match each other. So please check it. You can duplicate it, make a copy and then rotate it a bit to create another land search The direction and using this part of the letter, I'll show you another option how you can do this animation with a simple stroke and the Add to impulse and animated 01 hundred percent, put key here. And added graphs haven't made the line. And now I want to duplicate this line. Turn off that line and that and I'm going to animate not only appearing but also disappearing as well.

Open tears and animate this talk of two paths. Move about to free frames bought care 100% then move free frames more added graphs and here you can stretch it more. Okay easy out. Okay, I'm going to turn it off and describe the basic principle. We use this line to draw these edge and if our use of a mat, so the edge is bare. Here is it when I turn the second learn, so you will see an effect of additional move like it is a brush stroke and it leaves these mark and applicated again can change the color to yellow Change the width and the time of animation and make this and the same with a second take.

Also it will be nice to change the cups to round cups. Just open shape stroke and change it to round cup. Okay you can add as many allies as you want to unit make it more difficult. That's cool. I think that we've covered the animation by stroke it is pretty clear I've downloaded in the course my lesson that I did a long ago, where I covered the topic about 3d stroke and how to animate lettering or handwriting. It is definitely worth watching to cover all about the stroke.

And now I'm going to tell you the topic. This trick that I used in the screensaver how I like it very much, and it is ideal, then to work with sans serif typeface and take the letter O and show you how to animate this tragedy of the letter. He received the letter. Then put it in the center. Or for example, you can use, you can turn on rulers and slide it to the center of their letter. Then select rectangle mask tool and cut the letter this way dublicate it, then open it first or second anyway, an open mosque and here I choose subtract.

Now we have two parts of the letter. I don't need rulers, turn it off, and let's trash it and put the clock position here and here and till that time I move one part here and another part here. Okay, let me do it symmetrically. So, Ghana to deduct 200 from these values So it will be 756 and here the value will be 1156 change the key and is in and added graphs both in this case to be equal. Here I use pencil and draw a shape. Actually I need this to cover shape, create session chomper and make this talk by them.

As the letter has advanced he changed the color and check everything That's demanded by add to impulse put here 50% and there are some 50% both have kids from the beginning. This slide to the end of our animation and here will be zero and there are 100% change it to easy in and tune them. Oh, you see these bug here. So I can tune the graph or do it manually by position case. There is only to duplicate this layer and make a second jumper. Here.

You can stretch a letter for example, I will take the letter R. So you can cut it here and stretch it by jumpers. I'll show you. This is a cool option of scale because you don't lost the weight of the object by the need and the form become sharper and it is acceptable to deform it a little bit. For example, I take the letter O and start to scale it. So you see, it sucks really. Do not use kale in the text ever try to save the typeface and the width of lines and your life will be good.

Of course, if you have another letter nearby for example, the letter P. Again can check it by letters so it will be pushed by the Stretching of another lecture. It should be noted t in the animation by the position case and work with it. Oh, I have a strange idea. Let me add the letter T here. So, so inside this port, I would add a kind of soup or a big spoon or my bed the fact of smell that is hot and tasty. It's simple, more fun of text.

Let's speak more about morphing. Let me create the letter R and y. And now the task is to transform our two i, this Ted face is a good one because it is easy to draw by shapes and also to cut in two parts. I'm gonna duplicate the letter white twice, so that these two copies the first copy I cut this way and the second one like this And the last part will have on the foundation of the letter. There is only two more anchor points properly to have the ability of rotation of these parts. I don't need these for now.

Okay select and group one, two, and move one here and another there. Then open rotation top food case and move it over to frames change the rotation of the first time To make it straight and I'd like to tune rotation or position. So I did. And the same thing I'm going to do with the second stick match it open position and two you need by position. There is simple animation. here can be easy out and out back to add inertial bounds in here.

I use live genre I have two more constantina Hey dude, how are you? Thank you for their expression. I copied it and paste it to the rotation and the frost stick. Okay, have a look. Oh, it's two here. So I'm gonna change the values like zero.pi two and three.

I can copy it and paste it to the second stick rotation. Okay, the sample of y letter is ready. And let's turn to the our editor By the way, I precomposed the literal why layer precompose name it why. And let the letter air stay here at the beginning. I animate the position Firstly, it slides here Transform to the line. And after comes back where it transforms to the letter Y, open position to key move in.

Okay, graphs and yeah, it's okay. One frame to stay here. Then I turn on the little y and match the sticks of r and y would they key here? Now I don't need the letter Y and let's select mask two and make such a mask for now, open the transforms of mask and animate the path to the key and move to the moment where the letter stops and the mask will have this look. You can amend it quickly and actually it would be better poorer transformation maybe even as maximum as you can then turn on why later and measured by timeline. As you see by using usual tools like stroke shapes or masks, you can make a nice morphing transform one word to another.

And it all depends on you. You can mix it, combine it, try three And even shorter here to make it cool. And to make it leet just try to use this technique and applaud the hero examples of morphing one word to another

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.