Trace and Draw an Image in Fireworks

In this tutorial we are going to learn how trace and draw an image using Fireworks. You will learn how to draw a Panda in Fireworks by tracing an image. The source .png file can be downloaded at the end of the tutorial.

Tutorial Details

Program: Adobe Fireworks CS4

Estimated Completion Time: 30 Minutes

We have selected the below "Panda" picture to trace and draw. You can copy this image to Fireworks and start tracing the image as shown in the steps below.

Draw a circular object with the stroke color #0000 above the ear of the panda using the Ellipse tool. Make sure that the Stroke Category should be Basic > Soft Rounded and size > 2px. Next select the drawn circular object and clone (Ctrl+Shift+D) it. Then move the selected cloned object to the other ear of the panda picture.

Now maximize the screen size using the "Set magnification" to 300%, so that It will be easy for you to draw the details of the picture. The maxzimize option will be present in the bottom-right of the screen.

By using the Subselection Tool you can modify the anchor points of the object. Here using the Subselection tool select the circles that you have drawn and adjust the lines according to the ears of the Panda picture.

Draw an ellipse for the head portion of the Panda. Then using the Pen tool create some bezier points and adjust it, so that you should end up like a Panda image. Follow the image guidelines below. (Note: Pen tool is used for all kinds of options like creating, removing and tweaking bezier points and curves.)

Next step is to draw the eyes of the Panda. The same way you should follow to draw an ellipse object using the Ellipse Tool as described above. Select the Scale tool or Modify > Transform > Scale. Then rotate(i.e, Move the pointer outside the object until the rotation pointer appears) and resize the ellipse object to match with the eyes of the Panda.

Similar to the steps above draw the eyes, nose and mouth parts of the panda picture. Finally select all the objects which is on the face of the Panda such as eyes, nose & mouth parts and go to Modify > Group (Ctrl + G) to group them.

Draw the legs and remaining portion of the panda by plotting points with the Pen tool.

Now go to Modify > Combine Paths > Union(Ctrl+Alt+U) to combine all the selected paths of the image.

Now draw the stomach part of the Panda through the pen tool. Hence we have completed the drawing of the entire Panda.

If we delete/remove the original Panda image from the screen of the Adobe Fireworks, then the outlines drawn by us can be seen clearly.

After that, set the Fill Color to #F2F1EC for head and stomach, eyes - #97946B, nose - #4D4948 and for rest of the body #1E1A17.

According to the picture, you can make the shape of the object to be placed front or back. Go to Modify > Arrange > Bring to Front

The final output of the Panda image drawn by us will be as below.

If you wish, you can set some colorful Fill Color to the image. Here I have given an example of using different color for the same Panda.

Download Source File

Source File ( .png )

---