Search Example: Orb, Oman3d, Adobe Photoshop or Picture Editing
Writing Text - Learn how to create this writing text effect using a pen with Flash 8.
Introduction: In this tutorial I will teach you how to create a Writing text effect using a pen that follows the text. It is a very simple affect no action scripts, all I used it one layer. Its a nice affect you can add to an into to your flash projects.
Learn how to create the flash text effect above
Part1: Setting up the workspace.
Ok, let us get started. Create a new Flash Document, Click ModifyDocument, here is where you can change the background color, and the dimensions of your movie. Since I am creating this for explanation I sat the size to 477 x 200 to fit into my page. However, you can create any dimension you need.
This is the settings I used, as shown below
Part2: Adding the text Effect and setting up the Layers. Click ok, when you are satisfied and lets get started. Click on the text Tool and write something in the middle of your work space. I typed P D using the Kunstler Script font, the size I used was 196. This will be different for you depending on the font and content you want. With that you should just have the letters shown below.
Click on the Subselection Tool select the text and Break it Apart
With the Subselection Tool selected, right click on the text and select Distribute to Layers this will create two layers with the letters P and D on its own layer.
At this point you should have the layers shown below.
Using the Selection Tool click on the Letters P and D and Break it apart once. This will allow you to erase parts of the letters. I did a search on google for pen and I found the image below that I will be using.
Create a layer and name it pen, place this layer below the P and D layers as shown below. You can also delete Layer 1.
Click on the P layer and add a Motion Guide. When you do this you will have the layers shown below.
Right Click on the P layer, select Properties, and select Guided as shown below. Repeat this for the Pen layer.
With that your layers should look similar to the image below
Part3: Adding the Guides Click on the Guide Layer select the pen tool using the setting below.
Still on the Guide Layer using the pen trace the First letter as shown below.
Still on the Guide Layer use the penand trace the other part of the letter as shown below. The trace does not have to be perfect, just make it close as possible.
Click on the Pen layer, with the Feather on it. Right click on the feather and convert it into a Graphic
Using the Selection Tool double click on the feather, this will allow you to edit the position. Still using the Selection Tool move the feather to where the feather point is on the X ash shown below.
Use to go back to the previous frame. Lock all the layers except the Pen layer
Using the Selection Tool drag the (X) over to the starting point, it should lock it self into the line
Click on frame 20 and press F6 to insert a keyframe on all of your layers.
Click on Frame 20 and move the pen over the End point as shown below. This should also lock it self into the line.
Press Enter and it should follow the path you created. If not Go back and find something you probable missed. Ok now we will do the other part of the P, Click on Frame 22, and press F6 to insert a keyframe of each of your layers as shown below.
We will follow the path you created, same as you just did, click on the pen and drag it to the point shown below.
Click on frame 40 and press F6 to insert a keyframe on all of your layers. Drag the pen over to the End point.
With that you should have the effect below.
Part4: Adding the Writing Effect to the letter P.
Lock all the layers except the "P" Layer, select frames 1 to frame 20 as shown below.
Right click and convert this into Keyframes
At this point you can Hide the guide layer to allow you to edit the Letter better. Click on frame one, select the "P" layer and using the Erase Tool erase from where the point of the pen is. Repeat this from frame 1 to frame 20. With this you should have the effect below.
Repeat step 4, to add this effect o the other part of the Letter P. Once you get this part down it should be ease. You movie should look like the flash file below at this point.
Part5: Adding the Writing Effect to the letter D. Frame 40 should be the last frame, click on Frame 42, and press F6 to insert a new keyframe on each layer. Click on the Guide Layer select the pen tool and trace the letter "D" as shown below.
This is just like the previous steps. Click on the Pen, unlock the layer, and move the pen to the start point. Click on Frame 60, press F6 to insert a new keyframe and move the pen to the end point. Make sure to remove the Letter "D" from frame 1 to frame 41. This will give you the effect below.
From here you can follow step 4 and you will be able to add this effect. It is the same steps so I think its redundant for me to say the same thing over again. Click here to download the flash (.fla) file.
Note: The example that I created, the pen is shown below the text. To fix this move the Pen layer above your text, not above the Guide Layer. In doing this you will have to use flash to cut the pen out of its background. If you break your image apart twice, it will allow you to use the erase to do this.
Finished:
Well that is it. Hope it is what you expected.
I also created a video tutorial for this example. The file is a 16.63 MB flash file. I have the link up on the video section on the forums. Users have to register to view the file, because of spam after you register. Email me at markc1822(at)pixeldigest.com with your user name and I will activate your account. Click here to register.
Updated the Forum, Unfortunately i could not use the same link as the old forum for the update. For the new link click Here. All the post and user name are still usable. So, if you previously registered you can still use the old username and password. Some accounts that was not used were deleted.
News Update [10/16/07]
Yesterday on the 15th of October my gallery went down for some unknown reason. I was able to get the backup of the images, i just lost all the users. The gallery was not that active but i am sill pissed about what happened. I am in the process of reloading the gallery. Just give me some time and it should be up and running.Yesterday on the 15th of October my gallery went down for some unknown reason. I was able to get the backup of the images, i just lost all the users. The gallery was not that active but i am sill pissed about what happened. I am in the process of reloading the gallery. Just give me some time and it should be up and running.