This site will look much better in a browser that supports web standards, but it is accessible to any browser or Internet device.
In this tutorial, I will show you how to create realistic 3D crystals using simple techniques and built-in filters in Adobe Fireworks CS3. You will learn how to use the Inner Bevel, Inner Glow, Brightness/Contrast and Hue/Saturation filters to create crystals as beautiful as those found in nature. Inner Bevel helps give the crystals a 3D appearance, Inner Glow gives the impression that the crystals are glowing, and Brightness/Contrast and Hue/Saturation give the final touch.
This tutorial has been released in Adobe Fireworks Design Center
To create a crystal, follow these steps:
Create a new document that is 500 x 300 pixels.
With the Pen tool, draw a crystal shape (see Figure 1).
Give the shape a light-colored stroke and then fill it with a darker shade of the same hue. In my example, I used #B5DBFF for the stroke and #0061A0 for the fill.

Figure 1: The basic crystal shape with a fill and stroke.
Give the crystals their 3D appearance by alternately applying the Inner Glow and Inner Bevel filters to the shape. To add the filters, select the shape and then click the Add Filters button in the Property inspector and choose Shadow and Glow > Inner Glow and Bevel and Emboss > Inner Bevel, respectively (see Figure 2).

Figure 2: The Live Filters panel.
Create the 3D effect by clicking the filters you added in Step 4 in the Live Filters panel and giving each filter the following settings (Figure 3):

Figure 3: Creating the 3D effect.
The result is an obelisk-shaped crystal, and although it looks too regular to be natural, we are getting close to a crystal shape.
Note: You might need to adjust the shape if you have a "flat" area in the middle of the crystal. Use the Subselection tool to move the four outer corners of the shape in towards the center to remove the flat area.
To enlarge the crystal without distorting it, select it and choose Scale Tool > Draw and then drag the left or right handle outwards (Figure 4). Or, to decrease its size, drag the handles in toward the crystal.

Figure 4: Crystals of different sizes.
Now, to change the height of the crystal without distorting the pyramid shape at the top. Select the Subselection tool, and then select the bottom of the crystal and press the Up arrow on your keyboard to increase its height, or press the Down arrow to decrease its height (Figure 5).

Figure 5: Changing the height of the crystal.
To makes copies of the crystal in different sizes, choose Duplicate > Enlarge or Reduce and drag the handles of the shape as described in step 4.
To rotate a crystal, select it and use the Scale tool as described in step 7, or choose Modify > Transform > Numeric Transform > Rotate (Figure 6).

Figure 6: Rotate a crystal using the Scale tool.
Note: To create the most realistic crystal layout possible, check the Internet for /pictures of real crystals to use as reference.
Finally, to give the crystals a bright, shiny look, you will apply two more Live Filters, Brightness/Contrast and Hue/Saturation. Group all the crystals, click the Add Filters button in the Property inspector, and then choose Adjust Color > Brightness/Contrast (Figure 7) and Adjust Color > Hue/Saturation (Figure 8). For each filter, apply the settings shown in the following images.

Figure 7: Brightness/Contrast filter.

Figure 8: Hue/Saturation filter.
The crystals now look quite realistic (Figure 9).

Figure 9: A group of crystals with Brightness/Contrast and Hue/Saturation applied.
Now that you understand the basic method for creating realistic crystals with Fireworks, the possibilities are endless. You can create countless variations by using different colors, background, or effects. For example, use Flat Inner Bevel instead of Sloped, or try omitting the Inner Glow filter, or adding textures, patterns, and blend modes.
Have fun experimenting! You can use the technique described in this tutorial to build Egyptian obelisks, wooden posts, or rooftops.
Here are just a few examples with different layouts, colors, and backgrounds:




Write for us
Adobe Links
Recommended sites
Resources
Adobe User Groups
Sponsored
Sponsored
Sponsored