Senin, 28 Januari 2013

Fake 3D

A couple years ago, I accidentally discovered method for giving Flash text an extruded, 3D look, and it's insanely easy to do.
Step 1 - Create Some Text – Easy enough, right? In this case, I want to put a gradient on the text, so to keep things simple, I'm just going to break the text apart by going to Modify > Break Apart, or by hitting Ctrl+B on the keyboard. (Make sure everything is spelled correctly first. You can't edit the text after you do this.) This will break your text field up into multiple single-character text fields, so you'll need to break apart a second time in order to get the raw shape that we're looking for. Broken apart, your selected text should look like this:
Step 2 - Color Your Text – I'm going to apply a simple, top-to-bottom gradient to make our text a little more interesting. To do this, make sure your text is selected and open the Color panel (Window > Color). Click on the paint bucket icon in the Color panel to make sure the fill is selected, and then change the drop-down menu from "Solid color" to "Linear gradient." Click on the left handle and select a bright red color, then select the right handle and choose a darker red, like so:

By default, you may notice that the gradient on your text is moving from left to right. I want it to move from top to bottom. Select the Gradient Transform Tool, which is grouped with the Free Transform Tool, and select the first letter. Use the rotate and resize handles to transform your gradient so that it's moving from top to bottom. Repeat this for all letters until you have something like this:

Step 3 - Movie Clipify Your Text – Switch to your selection tool (keyboard shortcut = V), and select all of your text. Hit F8 to convert it to a Movie Clip, and set the registration point to the center.
Step 4 - Duplicate and Relocate – With your Movie Clip selected, hit Ctrl+C (or Cmd+C on a Mac) to copy your text, and then hit Ctrl+Shift+V (Cmd+Shift+V on a Mac) TEN TIMES to paste ten more copies of your text right on top of the original copy. Since they're all copied to the same place, it will still look like a single text field, but we're about to change that.
Now we want to change the Z coordinate of each of our Movie Clips. The Z coordinate determines how far the text is away from our virtual camera, or how far back it is in 3D space. For our purposes here, we want each successive Movie Clip to be a little further back in space.
Start by selecting all of your Movie Clips, and the use the Distribute to Layers command in the Modify > Timeline menu. This will send each copy of your text to its own layer, which will make it easier to edit individually.
Lock the topmost text layer–this one is going to remain as is. Then, one layer at a time, starting with the second text layer, change the z-coordinate so that each successive layer is 10 pixels further back than the one in front of it. The z-coordinate can be changed in the Properties panel under the "3D Position and View" settings. So your topmost text layer will have a z-coordinate of 0. The second layer will have a z-coordinate of 10. The third will be 20, and so on. When you're done, your stage should look something like this:

Not quite what we're going for, but we're getting much closer.
Step 5 - Use Brightness to Add Depth – Do the following for all of your text Movie Clips EXCEPT FOR THE ONE ON TOP:
  1. Select the Movie Clip
  2. In the Properties Panel, under Color Effect, change the Style from "None" to "Brightness."
  3. Drag the brightness slider to the left to darken it. I've chosen a value of -33%.
  4. Repeat for the next Movie Clip.
Once you're done with this step, your text should look like this:

Much better!
Step 6 - Movie Clipify – Unlock all of your layers, select all of your text Movie Clips, and hit F8 to convert all of your Movie Clips into one container Movie Clip. Once you do this, you'll see a little bit of magic occur. After everything has been placed into this container Movie Clip, select the Movie Clip and start dragging it around the stage. You'll see that no matter where you move it, the text seems to be disappearing towards the center of the stage. To customize this look further, select the Movie Clip, go to your Properties Panel, and under the 3D Position and View section, you will see options for changing the Vanishing Point (highlighted in the picture below).
By default, the vanishing point is in the center of the stage, but if you play around with these values, you can change the way your 3D text is displayed. In the following animation, I've simply increased the y-coordinate of the vanishing point and then tweened the container Movie Clip across the stage. Not bad for a quick hack job!

Note: If you notice a stair-stepping effect on the "extruded" text, you can smooth it out by decreasing the z-distance between each Movie Clip. Instead of increasing each z-coordinate by 10, try 5 or even less until you get the effect you're looking for.

Credit : School Of Flash

0 komentar:

Posting Komentar

 
Design by Wordpress Theme | Bloggerized by Free Blogger Templates | coupon codes