Here is a Web page consisting of text.

Here is an illustration of a child.

Here is an airplane with a fish design (no special effects, BTW).

Here is a drawing (top hat? short Greek column?).

Adding a Gradient as a Design Element

A gradient can add visual interest. The Web page previously shown has just two colors: blue text on a white background.  By adding a gradient at the left side of the page, the page has more visual interest.

The gradient softens the previously monochromatic (one color) design. It acts as a kind of bridge that goes from dark blue (the text color) to white (the background color). The gradient also reinforces the page layout, acting as a vertical column that reinforces the invisible line formed by the left margin of the heading and text lines.

Using a Gradient to Simplify an Image

This was the photo I used as a basis for the illustration.

The piano and power cord distract from the main subject, so I replaced them with a background with a gradient that is brighter on the left and slightly darker to the right.

In this case, the gradient adds a visual hint that the objects are in a realistic space. A solid color background would make the illustration look flat.

Did you notice the gradient in the illustration before I described it?

The original picture of the airplane has a cloudy sky that competes for the viewer's attention, so I replaced it with a simple vertical gradient. This makes the plane more prominent. Addition by subtraction.

Using a Gradient to Give a 3-Dimensional Appearance

I added some rectangles with semicircles to the "side" of the cylinder and a rectangle with white rectangular dot on the "top" of the cylinder of the geometric drawing shown earlier in this post.

These added rectangles represent indentations for gripping and turning the plastic knob. The rectangle on top of the knob indicates where the knob is pointing.

The effect is convincing because the gradients used on the plain shape shown earlier trick the eye into thinking the graphic represents a three-dimensional shape with light reflected due to its curvature.

Summary

We've seen how gradients can be used as an element in page layouts, as a background that adds power to an image by eliminating unnecessary details, and as a visual device that suggests three-dimensional space.

There's lots more to cover. I know I didn't give any how-to directions or even suggest what techniques were used. I'll cover all that and plenty more. Stay tuned.