Ready to watch this entire course?
Become a member and get unlimited access to the entire skills library of over 4,987 courses, including more 3D + Animation and personalized recommendations.Start Your Free Trial Now
- View Offline
One of the most exciting features that Flash has is the ability to manipulate graphics within 3D space, and that's what I want to do in this underwater scene. I want to manipulate some graphics, and those graphics are just going to be some text. So I am going to create a new layer, and this is going to be eco as the name of this layer because I am going to use the Text tool, and just type in "eco." So this is the graphic I want to manipulate in 3D space.
So the first thing I need to do is I need to convert it to a movie clip. So I am going to drag it to the library and call it eco and my registration point is going to be in the center. I will click OK. So there's the text I want to manipulate, and I will just zoom in on this text really fast, and what I need to do next is go down to that fourth tool here, the 3D Rotation tool. So as I select that tool, I'm given these circular lines.
So I can adjust the X position. If I rotate that vertical line, I can see it spin. There's the Y position as well, or I can even use this outer line - this orange line - and manipulate it in 3D space. So definitely pretty nice. I can go ahead and angle that in something like that. I am going to go ahead and create a new layer, and this time, I am going to type in friendly, and I'll drag that to the library, and call it "friendly." It's a movie clip, registration point in the center, click OK, and I can do the same thing, by selecting that fourth tool down with this text.
So I can kind of angle it in. The idea is I want this text to float up as if it's floating up in water, and this is lighter than the water. So that's the effect I want to do, and luckily, what I can do is I can actually animate these objects in 3D space, and this is really a pseudo 3D. It's not true 3D as in I am able to import a 3D model. But again, it will take any object and put it on a flat plane.
So I am going to start with this eco layer and this eco object, and I am going to animate it up so it follows the same principles of making sure it's a movie clip, on its own layer, then I can Create Motion Tween. So I am going to go ahead and Show All to show everything on my stage right here, and then I am going to select the Selection tool and move this down. In fact, let's go to frame 1 and sort of move it down off the stage.
Now, let's go to frame 30. I can then bring it into place. So it might start at an angle down here. In fact, let's kind of rotate it a little more, flip it like that, and you can see it animate, and then at this point, I want to go ahead and flatten it out a little more. So again, it might take a little getting used to. Well, I just rotate it around, just like that, and you can always manipulate any one of these lines accordingly to get that angle that you're looking for. There we go.
That's what I want. Again, it starts down here and then floats up into position right there, and I can add a couple more keyframes. Frame 70, I can go ahead and have it move a little bit, and even have it move up a little as well. So from 30 to 60, it continues to float, and then clear down here at the very end, that's when I am going to go ahead and move that object off of the stage, and use that 3D Rotation tool to manipulate it.
This is a case, since I am animating something off the stage - it starts off the stage and ends off the stage - I probably want to change my view. I want to change my view, so I can see everything on the pasteboard. So that will show all of the content that's beyond the viewable area. This allows me to use the Selection tool and move this object completely off the stage like that. That's what it does from frame 70 on to 120.
You can see it float off. So that's looking pretty good. I like the motion it has. I am going to do the same thing with this friendly movie clip, and I am going to rename that layer to "friendly." Now I am going to go ahead and right-click, and Create Motion tween. I will scroll down and again, this one is going to start off the stage like that. In fact, I will manipulate it some more, and maybe make it backwards, kind of like that, rotate it this way. There we go! It's going to start there, and it's going to land in place the same time the word "eco" does as well.
I can move that back up, use the Rotation tool again to rotate it into place. Now, I can understand that these lines can get kind of tricky - maybe you're not used to dealing with them, maybe you just don't want to - and that's perfectly fine because you can go beyond using these lines, and actually use the Transform panel. So I am going to go to Window and open up Transform, because in the Transform panel, you have the ability to manipulate the 3D rotation based on these coordinates.
So if I did want to flatten this out, I might want to change all of these to 0, even the Rotate to 0. So now I have something perfectly flat, and I can always manipulate it accordingly if I want to. But feel free, if you need to reset something back to 0, you can do that using the Transform panel, and let's just position this kind of like that, go down to frame 70, and again it continues to sort of float up in the water.
So I'll move it up and manipulate it a little more, and then I'll scroll down to frame 120, move it off the stage and then rotate it even further, kind of like that. All right! So let's check that. Move down, and now it rotates into place, it looks good, in a 3D fashion, pauses there, and then floats up.
Another thing you can do is I am going to create a new layer, and I'm just going to call this Recycle. But you can actually use pre-built 3D settings as well. So I am going to go ahead and select this recycle movie clip, and drop it onto the stage, and I am going to make sure this icon exists at about frame 30 when you can see that word. I will just reposition it. In fact, just to give it even a cooler look, I will select this movie clip, and I'll change the display to Overlay.
So we get that nice blue look, and really this is just an accent graphic for these words. So again, I can even put it on top, and what I want to do is I am going to go to Window, and go to Motion Presets because in my Motion Presets panel, under the default presets, notice there is a couple 3D motion tweens that you can use. I want to use this spiral-3D. So I am going to select that movie clip, select that motion preset, and click Apply.
Now, I will close that Motion Preset panel, and again once, those words come together, that's when you see that eco friendly symbol, and you can see it twirl around. I can start to adjust this further. I can actually decrease the length of it. So at about frame 70, I can even move it up with that text, but in general, it's going to actually just spin really fast and then disappear. So again, that was just using a quick motion preset to add a nice 3D accent to these graphics.
So let's go ahead and watch it in action. Remember, there's actually quite a bit going on. So if I hit Enter, you'll see that animate, just like that. That looks pretty good. If I do a test movie, everything is going to play, including the fish, as well as the jellyfish and the text. So you can see that come in, and then you can see that jellyfish kind of bust through it at that point, and that works pretty good.
I encourage you to use the 3D Rotation tool. It will add another dimension to any graphics that you are creating, as well as any animation you plan on implementing.
- Creating graphics and reusable assets
- Importing graphics
- Making an object move
- Animating a mask
- Using and customizing motion presets
- Morphing shapes
- Animating in 3D
- Adding bones to a character
- Controlling the Timeline with ActionScript
- Randomizing content