Posted: July 15th, 2010 | Author: admin | Filed under: Book V Macromedia Flash MX 2004Contents at a Glance | Comments Off
In This Chapter
Understanding when to use the Flash tools
Creating shapes and text
Modifying shapes and text
Working with colors
T his chapter shows you how to use the drawing and editing tools in
Macromedia Flash MX 2004 to create graphics and text. To produce
Great animation, you need great graphics, so read on.
Choosing When to Use the Macromedia Flash Tools
Book V, Chapter 1 explains the difference between vector and bitmap graph -
Ics. You should use the Macromedia Flash drawing tools when you want to
Create vector graphics for fast download times.
To create more detailed graphics, you may want to use Fireworks MX 2004
Or FreeHand MX, because they have more advanced creation and editing
Tools. You may also want to use these programs to edit existing bitmaps. On
The other hand, you may have bitmaps, such as a photograph or complex
Logo, that’s only available as a bitmap. To use any bitmap, import it. (See
Book V, Chapter 3 for the scoop on importing graphics.)
Creating Shapes and Text
You use the Tools panel to create shapes and text in Macromedia Flash. See
Figure 2-1 for the details of the Tools panel. The Tools section of the Tools
Panel offers many tools for creating and editing images. Most tools have
Options that specify how the tool works. Creating Shapes and Text 508
When creating shapes in Macromedia Flash, you need to keep in mind what
Happens when two or more shapes touch, as follows:
✦ If the shapes are the same color, they combine. You can use this tech -
Nique to create complex shapes.
✦ If the shapes are different colors, the top shape replaces and cuts out
The bottom shape.
✦ If you use the Pencil or Line tool to intersect any other shape, the line
And other shape are cut at their intersection.
If you don’t see the Tools panel, choose Window➪Tools to make it visible.
Line tool
The Line tool draws straight lines. You can continue to draw connected lines
To create any shape you want.
To draw a line, follow these steps:
1. Choose the Line tool from the Tools section of the Tools panel.
2. From the Properties panel, choose a color by clicking the Stroke
Color box.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
Subselection tool
Lasso tool
Text tool
Rectangle tool
Brush tool
Fill Transform tool
Paint Bucket tool
Eraser tool
Zoom tool
Stoke color
Fill color
Swap colors
Arrow tool
Line tool
Pen tool
Oval tool
Pencil tool
Free Transform tool
Ink Bottle tool
Eyedropper tool
Hand tool
Black and white
Figure 2-1:
The Tools
Panel
Contains
Graphic
Creation and
Editing
Tools. Book V
Chapter 2
Using the
Graphics Tools
Creating Shapes and Text 509
You can also find the Stroke Color box in the Colors section of the Tools
Panel. A stroke is another word for a line or the outline of any shape in
Macromedia Flash.
3. Type a stroke weight (width) in the Stroke Height box of the
Properties panel, or click the arrow next to the point size box and
Use the vertical slider to choose a stroke weight.
4. Choose a stroke style from the Stroke Style box of the Properties
Panel.
To create a custom stroke style, click the Custom button in the
Properties panel.
5. Click the Stage where you want to start the line and drag (while hold -
Ing the mouse button down) to the ending point.
6. Release the mouse button.
To constrain the line to multiples of 45 degrees, press Shift while dragging.
Oval tool
An oval has both a stroke (outline) and a fill color. Use the Oval tool to draw
Ovals and circles, as follows:
1. Choose the Oval tool from the Tools section of the Tools panel.
2. From the Properties panel, choose a stroke color by clicking the
Stroke Color box and choosing a color.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
You can also find the Stroke Color box in the Colors section of the Tools
Panel. As with the Line tool, you can also set a stroke weight and style.
3. From the Properties panel, choose a fill color by clicking the Fill
Color box.
4. Click the Stage where you want the upper-left portion of the oval to
Be, and drag (while holding the mouse button down) diagonally to
The lower right.
5. Release the mouse button.
To create a circle, press Shift as you drag the mouse.
Rectangle tool
Like an oval, a rectangle has both a stroke and a fill. You can draw rectan -
Gles and squares with the Rectangle tool as follows:Creating Shapes and Text 510
1. Choose the Rectangle tool from the Tools section of the Tools panel.
2. From the Properties panel, choose a stroke color by clicking the
Stroke Color box and choosing a color.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
You can also find the Stroke Color box in the Colors section of the Tools
Panel. As with the Line tool, you can also set a stroke weight and style.
3. From the Properties panel, choose a fill color by clicking the Fill
Color box.
4. To draw a rectangle with rounded corners, click the Rounded
Rectangle Radius button (the button with the curved black line and
The little blue semi-square underneath it) in the Options section of the
Tools panel, type a radius, and press Enter.
The larger the number entered in the Corner Radius field, the softer the
Curve in the rectangle’s edges.
5. Click the Stage where you want the upper-left corner of the rectangle
To be, and drag (while holding the mouse button down) diagonally to
The lower right.
6. Release the mouse button.
To create a square, press Shift as you drag the mouse.
Polystar tool
In addition to the Rectangle tool, Macromedia Flash MX 2004 includes a tool
For creating other kinds of polygons. To use the Polystar tool, follow these
Steps:
1. Click and hold down the Rectangle button in the Tools section of the
Tools panel.
2. Select the Polystar icon from the menu that appears.
3. In the Properties panel, click the Options button.
This opens the Tool Settings dialog box, as shown in Figure 2-2.
4. Select a style of polygon from the Style drop-down list.
The Polygon option creates a true polygon, while the Polystar option
Creates a multipointed star. Book V
Chapter 2
Using the
Graphics Tools
Creating Shapes and Text 511
5. Enter the number of sides for the polygon or polystar.
The larger the number of sides, the closer to a circle a polygon will be.
For the polystar, more points creates a starburst-like effect.
6. Enter a value for the star point size.
The larger the star point size, the more dull the polystar will be, making
It look closer to a circle.
Pencil tool
The Pencil tool is somewhat like a real pencil. You can draw artistic shapes
With it. To draw with the Pencil tool, follow these steps:
1. Choose the Pencil tool from the Tools section of the Tools panel.
2. From the Properties panel, choose a stroke color by clicking the
Stroke Color box and choosing a color.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
You can also find the Stroke Color box in the Colors section of the Tools
Panel. As with the Line tool, you can also set a stroke weight and style.
3. Click the Pencil Mode button in the Options section of the Tools
Panel, and from the pop-up menu, choose one of the following:
• Straighten: Straightens wiggly lines and changes sloppy rectangles,
Ovals, and triangles to perfect ones.
• Smooth: Smoothes out curved lines.
• Ink: Slightly smoothes and straightens, but mostly leaves your draw -
Ings the same.
Figure 2-2:
The Tool
Settings
Dialog box
Allows you
To customize
The look of
Your
Polygon. Creating Shapes and Text 512
4. Click the Stage where you want the drawing to start and drag on the
Stage.
You can draw angles and curves.
5. Release the mouse button.
To constrain each line segment to 90-degree angles, press Shift as you drag
The mouse. To refine how the options work, choose Edit➪Preferences and
Click the Editing tab. Use the Smooth Curves and Recognize Shapes drop -
Down lists. When you’re done, click OK.
Pen tool
You can use the Pen tool to draw straight lines and curves. The Pen tool
Offers the greatest editing control and the most control over curves. Using
The Pen tool takes some practice, but soon you’ll find it to be very flexible.
To better see how a Pen tool drawing will look, choose Edit➪Preferences
And click the Editing tab. Select the Show Pen Preview check box. Click OK.
Follow these steps to work with the Pen tool:
1. Choose the Pen tool from the Tools section of the Tools panel.
2. From the Properties panel, choose a stroke color by clicking the
Stroke Color box and choosing a color.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
You can also find the Stroke Color box in the Colors section of the Tools
Panel. As with the Line tool, you can set a stroke weight and style.
3. You can draw either straight segments or curves, as follows:
• To draw a straight segment: Click the start point, and click the end
Point. Do not drag. Click additional points to add segments. Double -
Click to finish.
• To draw a curve: Click the start point and move the mouse in the
Desired direction; then click and drag in the direction of the curve.
Continue clicking and dragging to create additional curves. Double -
Click to finish.
To close a figure, place the cursor near the start point until you see a small
Circle, and then click. Press Shift as you draw to constrain the lines or
Curves to 45-degree angles. Book V
Chapter 2
Using the
Graphics Tools
Creating Shapes and Text 513
Brush tool
The Brush tool fills areas with a brush-like effect. You can vary the shape
And width of the stroke. The Brush tool creates fills, so you use the Fill Color
Button to set the color. To draw with the Brush tool, follow these steps:
1. Choose the Brush tool from the Tools section of the Tools panel.
2. From the Properties panel, choose a fill color by clicking the Fill
Color box and choosing a color.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
You can also find the Fill Color box in the Colors section of the Tools
Panel.
3. Choose a brush mode by clicking the Brush Mode button in the
Options section of the Tools panel and choosing one of the following
Options:
• Paint Normal: Paints wherever you brush, including over other
Objects on the same layer. (See Book V, Chapter 4 for more details on
Layers.)
• Paint Fills: Fills enclosed and blank areas, but doesn’t cover strokes.
• Paint Behind: Paints blank areas of the Stage, but doesn’t cover fills
Or strokes.
• Paint Selection: Fills in a selected area.
• Paint Inside: Paints inside any enclosed area where you start your
Brush or on the Stage if you don’t start in an enclosed area. Doesn’t
Cover strokes.
4. Choose a brush size by clicking the Brush Size drop-down list in the
Options section of the Tools panel.
5. Choose a brush shape by clicking the Brush Shape drop-down list.
If you have a pressure-sensitive pen and tablet, you see a pressure
Button in the Options section. You can then dynamically vary the width
Of the brush according to how much pressure you put on the pen as you
Draw.
6. Click the start point, and then drag to draw with the brush.
Press Shift as you draw to constrain your shapes to 90-degree angles. Creating Shapes and Text 514
If you want your gradient fill to be independent of the background, make
Sure that the Lock Fill option button is not selected. If, however, you’re cre -
Ating more than one stroke and you want it to appear as if the gradient is in
The background and being applied to both strokes, select the Lock Fill
Option button.
Paint Bucket tool
The Paint Bucket tool fills enclosed shapes. You can create the enclosed
Shape with many of the other tools in the Tools panel. You can also use the
Paint Bucket tool to change the color of existing fills. To fill an enclosed
Area, follow these steps:
1. Choose the Paint Bucket tool from the Tools section of the Tools
Panel.
2. From the Properties panel, choose a fill color by clicking the Fill
Color box and choosing a color.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
You can also find the Fill Color box in the Colors section of the Tools
Panel.
3. Click the Gap Size button in the Options section of the Tools panel,
And from the pop-up menu, select an option if you need to fill in a
Shape that is not completely enclosed.
You can choose from Don’t Close Gaps to Close Large Gaps.
4. Click inside the enclosed area to fill the shape.
Ink Bottle tool
The Ink Bottle tool outlines an existing shape or changes the color of an
Existing stroke (outline). Follow these steps to use the Ink Bottle tool:
1. Select the Ink Bottle tool from the Tools section of the Tools panel.
2. From the Properties panel, choose a stroke color by clicking the
Stroke Color box and choosing a color.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
You can also find the Stroke Color box in the Colors section of the Tools
Panel. You can set a stroke weight and style as well. Book V
Chapter 2
Using the
Graphics Tools
Creating Shapes and Text 515
3. Click anywhere on the shape.
If the shape has no stroke outline, Macromedia Flash adds a stroke.
Otherwise, Macromedia Flash changes the shape’s color, width, and
Style to the settings that you choose.
Text tool
Sooner or later, you may need to explain what all those animations you have
Created mean, so you’ll probably need some text. Macromedia Flash offers
Many text options, both simple and advanced. To create text, follow these
Steps:
1. Choose the Text tool from the Tools section of the Tools panel.
2. In the Properties panel, shown in Figure 2-3, specify the font, size,
Color, and other properties.
If the Properties panel is not visible, choose Window➪Properties to
Make it appear.
3. Click the Stage and start typing, as follows:
• To specify the width of the text (when creating a paragraph), click at
The upper-left corner where you want the text to start and drag to
The right margin.
• To create text that expands as you type (for a single line of text), just
Click.
You can specify the following text properties in the Properties panel:
✦ Text type: Use the Text Type drop-down list to specify one of the follow -
Ing types of text:
• Static: Regular text.
• Input: Text that users type in their browser. Input text is one way of
Making your Web site interactive. Use input text for forms or to
Enable users to set values that affect the animation.
Figure 2-3:
Use the
Properties
Panel to
Set the
Properties
Of your text. Modifying Shapes and Text 516
• Dynamic: Text that is displayed from another source, such as
Another Web site, another movie (SWF) file, or an external file. This
Is great for weather, sports scores, and so on.
✦ Font: The font or typeface. Select from the drop-down list.
✦ Font size: Type a number or use the vertical slider to choose a size.
✦ Color: Click the Text (fill) Color box to choose a color.
✦ Bold/Italic: Click the Bold button or the Italic button to make the text
Bold or italic.
✦ Justify: Click one of the Justify buttons to make the text justified to the
Left, center, or right, or full justified (justified to reach both the left and
Right margins).
✦ Character spacing: Adjust the tracking, which is the spacing between a
Series of letters.
✦ Character position: Select Superscript to create text above the normal
Position or Subscript to create text that is below the normal position.
For normal text, just keep it at Normal.
✦ Auto Kern: Kerning is the spacing between two specific letters. You may
Adjust the kerning of certain letters, such as A and V, that appear to be
Too far apart. Select the Auto Kern check box to turn kerning on; dese -
Lect it to turn kerning off.
✦ Aliasing: By default, all text is aliased, or smoothed. If you want the text
To appear anti-aliased, or jagged, click this button.
✦ Format: Click the Format button to open the Format Options dialog box,
Where you can set paragraph formatting, as follows:
• Indent: The indentation of the first line of a paragraph.
• Line Spacing: The spacing between lines, measured in points. If your
Text is 18 points, for example, set a line spacing of 18 points to
Double-space the text.
Click the Expand/Collapse arrow at the lower-right corner of the Properties
Panel for more advanced text options.
Modifying Shapes and Text
If you create something on a computer, you’ll inevitably have to change it.
Sometimes you change your mind, and other times you just need to make
Adjustments to get the effect that you want. Book V
Chapter 2
Using the
Graphics Tools
Modifying Shapes and Text 517
Selection tool
The first step in changing an object is to select it. To select an object or
Group of objects, choose the Selection tool (the dark arrow at the top left of
The Tools panel) and use one of the following techniques:
✦ To select one object, click the object.
✦ To select several graphic objects that touch each other, double-click
One of the objects. (This doesn’t work with symbols. See Book V,
Chapter 3 for more about symbols.) To select a rectangle’s stroke and
Fill, double-click the fill.
✦ To select several objects that do not touch, click away from the objects
And drag diagonally to create a bounding box around the objects that
You want to select. Macromedia Flash selects all objects that are com -
Pletely inside the box.
See the section, “Reshaping with the Selection tool,” later in this chapter, for
Information on reshaping objects using the Selection tool.
The Selection tool has a Snap button in the Options section of the Tools
Panel. When you click this button, objects that you move snap to other
Objects so that you can attach two objects precisely. The Snap option also
Snaps new objects that you create to existing objects.
Lasso tool
Another way to select your objects is to lasso ’em. Use the Lasso tool when
You want to select a number of objects but can’t get them in a rectangular
Bounding box. You can drag the mouse and create a free-form shape or use
Straight-line segments, as follows:
1. Choose the Lasso tool from the Tools panel.
2. Choose the type of lassoing you want, as follows:
• To lasso free-form: Click anywhere on the Stage, drag around the
Objects that you want to select, and then release the mouse button.
• To lasso with straight-line segments: Choose the Polygon button
From the Options section of the Tools panel. Click anywhere on the
Stage, and continue to click at each segment’s end point. Double -
Click to finish.
Moving and copying objects
You can move and copy objects on the Stage in many ways. The best
Method varies with the circumstances and your personal preferences. Move
And copy objects using the following methods:Modifying Shapes and Text 518
✦ Select and drag: Use the Selection tool to select an object. Then move
The cursor over the object until you see the four-arrow cursor. Click and
Drag to move the object. Press and hold Ctrl while you drag to copy the
Object.
✦ Arrow keys: Select an object and use the arrow keys to move the object
One pixel at a time in the direction of the arrow.
✦ Properties panel: Select an object and open the Properties panel.
Click the Expand/Collapse arrow at the lower-right corner to display
The expanded panel. Use the X and Y text fields to set a new location
For the object.
✦ Cut, copy, and paste: Select an object; then press Ctrl+X to move (cut)
It or Ctrl+C to copy it. If you want, click another layer or frame. Then
Press Ctrl+V to paste the object.
Eraser tool
To delete any object, select it and press Delete. However, to erase part of an
Object, use the Eraser tool, as follows:
1. Choose the Eraser tool from the Tools panel.
2. Select the eraser size and shape from the Eraser Shape pop-up menu
In the Options section of the Tools panel.
3. To specify how the Eraser tool works, choose an option from the
Eraser Mode pop-up menu:
• Erase Normal: Erases anything that you drag across.
• Erase Fills: Erases only fills.
• Erase Lines: Erases only strokes.
• Erase Selected Fills: Erases only selected fills.
• Erase Inside: Erases only fills where you first click. Use this option
To erase only fills inside an enclosed area, but leave other fills alone.
4. With the Faucet option (in the Options section of the Tools panel)
Deselected, click and drag to erase.
To erase an entire fill, select the Faucet option (in the Options section of the
Tools panel) and click the fill. This method is equivalent to selecting a fill
And pressing Delete, as if the faucet washed away all the color.
Reshaping with the Selection tool
You can reshape and modify objects using the Selection tool when the objects
Are not selected. You can reshape both end points (including corners) and
Middles (whether straight or curved), as shown in Figure 2-4, as follows:Book V
Chapter 2
Using the
Graphics Tools
Modifying Shapes and Text 519
✦ End points: Place the cursor over the end point of a line or curve seg -
Ment. You see a small corner shape near the cursor. Click and drag to
Change the location of the end point.
✦ Middles: Place the cursor over the middle of any line or curve segment.
You see a small curved shape near the cursor. Click and drag to reshape
The segment.
Subselect tool
The Subselect tool looks like the Selection tool, but the Subselect tool is a
White (instead of black) arrow. Both the Selection tool and the Subselect
Tool reshape objects, but the Subselect tool uses a more sophisticated tech -
Nique. When you are using the Subselect tool, the shape displays anchor
Points that you can move or delete. When you click an anchor point, tangent
Lines — lines that are parallel to the curve at the anchor point — appear and
Enable you to change the direction of the curve. You can reshape strokes or
Fills that were created with the following tools:
✦ Pen ✦ Oval
✦ Pencil ✦ Rectangle
✦ Line ✦ Brush
To reshape objects with the Subselect tool, follow these steps:
1. Choose the Subselect tool from the Tools panel.
2. Click a stroke or the edge of a fill to display the anchor points.
3. Drag any anchor point to modify the shape.
4. To change the direction of a curve, select its anchor curve and then
Drag the tangent line’s handles (the dots at either end of the tangent
Line).
Figure 2-4:
Reshape
End points
And middles
Of fills
And lines
With the
Selection
Tool. Modifying Shapes and Text 520
To delete an anchor, select the object and then click the desired anchor
Point. The anchor point then turns dark. Then press Delete.
Free Transform tool
The Free Transform tool is the heavyweight of editing tools — it can
Do almost anything. To use this tool, choose the Free Transform tool
From the Tools panel and select an object. The object displays a special
Bounding box that includes handles and a central transformation point, as
Shown in Figure 2-5.
You can use the Free Transform tool in the following ways:
✦ Move: Place the cursor over the object. When you see the four-arrow
Cursor, click and drag.
✦ Rotate: Place the cursor just outside (but not on) any corner handle.
When you see a circular arrow cursor, click and drag.
✦ Scale while maintaining proportion: Place the cursor on any corner
Handle. When you see a broken two-arrow cursor, click and drag inward
Or outward.
✦ Scale either the height or width: Place the cursor on any side handle.
When you see a two-arrow cursor, click and drag inward or outward.
✦ Skew (slant either horizontally or vertically): Place the cursor any -
Where on the bounding box, but not on a handle. When you see the par -
Allel line cursor, click and drag in any direction.
✦ Move the transformation point: Place the cursor on the transformation
Point at the center of the bounding box. When you see a small circle
Cursor, click and drag in any direction. The transformation point is used
As a base for rotation and scaling.
Figure 2-5:
The
Bounding
Box of
The Free
Transform
Tool. Book V
Chapter 2
Using the
Graphics Tools
Modifying Shapes and Text 521
✦ Taper: Choose the Distort option of the Free Transform tool from the
Options section of the Tools panel. Place the cursor on any corner
Handle, and press Shift as you click and drag inward or outward. (See
Figure 2-6 for an example of tapering.)
✦ Distort: Choose the Distort option of the Free Transform tool from the
Options section of the Tools panel. Click and drag any handle to distort
The bounding box. (See Figure 2-7 for an example of distortion.) Note:
The Distort option works on shapes, but not on symbols (see Book V,
Chapter 3 for more on symbols), text, or groups. (Groups are explained
In the “Grouping” section, later in this chapter.)
✦ Warp: Choose the Envelope option of the Free Transform tool from the
Options section of the Tools panel. Drag any anchor point or tangent
Line handle to warp the bounding box.
Figure 2-7:
Distort the
Upper-right
Corner of
The goldfish,
And it looks
More like a
Shark.
Figure 2-6:
Tapering the
Fish makes
Its back end
Wider. Modifying Shapes and Text 522
The Envelope option, shown in Figure 2-8, works on shapes, but not on sym -
Bols, text, or groups.
When you select an object — for example, a circle — with the Free
Transform tool, you’ll notice that the tool selects the object, but not the
Stroke around the object. To select both the object and its stroke, click the
Free Transform tool and drag it around the entire object. This creates one
Bounding box for both the fill and the stroke.
Straightening and smoothing with the Selection tool
You can straighten lines and smooth curves with the Selection tool. Both
Processes reduce the number of changes in direction. You can repeat the
Process until Macromedia Flash can’t straighten or smooth anymore. Follow
These steps to straighten lines and smooth curves:
1. Choose the Selection tool from the Tools panel.
2. Select the shape that you want to modify.
3. To straighten, click the Straighten button from the Options section of
The Tools panel. To smooth, click the Smooth button.
4. Continue to click the Straighten or Smooth button until you like the
Result.
Optimizing curves
A process called optimizing curves is similar to smoothing curves.
Optimizing a curve reduces the number of individual elements that the
Curve contains and can help reduce the size of your Flash document file.
Follow these steps to optimize curves:
Figure 2-8:
Fine-tune
Shapes
Using the
Envelope
Option of
The Free
Transform
Tool. Book V
Chapter 2
Using the
Graphics Tools
Modifying Shapes and Text 523
1. Choose the Selection tool from the Tools panel.
2. Using the Selection tool, select the object that you want to optimize.
3. Choose Modify➪Shape➪Optimize.
The Optimize Curves dialog box appears, as shown in Figure 2-9. You
Can select Use Multiple Passes for a slower, more thorough approach. If
You select the Show Totals Message check box, the amount of optimiza -
Tion displays after you close the dialog box.
4. Choose the amount of smoothing by using the slider in the dialog
Box.
5. Click OK.
Carefully check the results after optimizing. Sometimes small objects disap -
Pear! If you don’t like the results, choose Edit➪Undo and try again with a dif -
Ferent Smoothing setting.
Softening edges
To create a soft look around the edges of a shape, follow these steps:
1. Choose the Selection tool from the Tools panel.
2. Using the Selection tool, select a shape.
3. Choose Modify➪Shape➪Soften Fill Edges.
The Soften Fill Edges dialog box opens, as shown in Figure 2-10.
Figure 2-10:
The Soften
Fill Edges
Dialog box.
Figure 2-9:
The
Optimize
Curves
Dialog box. Modifying Shapes and Text 524
4. In the Soften Fill Edges dialog box, set the distance.
The distance is the width of the softened part of the edge, in pixels (by
Default).
Macromedia Flash uses the units that you set in the Document
Properties dialog box to measure the distance. Choose
Modify➪Document to change the measurement units.
5. Enter the number of steps, that is, the number of concentric rows in
The softened edge.
6. Select Expand or Inset.
The Expand option creates the softened edges outside the shape. The
Inset option creates the softened edges within the shape.
7. Click OK.
Flipping
A great way to make symmetric shapes is to draw half the shape, copy it, and
Flip the copy either vertically or horizontally. You can then move the two
Shapes together, as shown in Figure 2-11. To flip an object, follow these steps:
1. Choose the Selection tool from the Tools panel.
2. Using the Selection tool, select the object.
3. Choose Modify➪Transform➪Flip Vertical or Flip Horizontal.
Transferring properties with the Eyedropper tool
The Eyedropper tool transfers stroke and fill properties from one object to
Another. To transfer properties, follow these steps:
Figure 2-11:
Create this
Shape by
Copying the
Crescent,
Flipping it
Horizontally,
And then
Moving the
Two shapes
Together. Book V
Chapter 2
Using the
Graphics Tools
Modifying Shapes and Text 525
1. Choose the Eyedropper tool from the Tools panel.
2. Select a stroke or fill.
If you select a stroke, the Ink Bottle tool is activated. If you select a fill,
The Paint Bucket tool is activated.
3. Click another stroke or fill.
Macromedia Flash transfers the properties of the stroke or fill to the
Second object.
Grouping
You often want to work with several objects at one time. Instead of having to
Select all the objects each time you want to move or copy them, you can
Group them and work with them as one object. To group objects, select
Them and choose Modify➪Group.
You can edit one element of the group by following these steps:
1. Choose the Selection tool from the Tools panel.
2. Double-click the group.
Macromedia Flash dims other objects on the Stage.
3. Edit any element of the group.
4. To return to regular editing, double-click any blank area on the Stage
With the Selection tool.
Alternatively, you can choose Edit➪Edit All.
To ungroup objects, select the group and choose Modify➪Ungroup.
Breaking objects apart
You can break apart text into letters, and then break apart the letters into
Shapes. After letters are broken apart into shapes, you can edit them like
Any other shape. You can also break apart symbols (see Book V, Chapter 3),
Groups, and bitmaps. (See the section, “Working with bitmap fills,” later in
This chapter, for more information.)
Aligning objects
To get a professional look, you may want to make sure that objects are prop -
Erly aligned and equally distributed. To align and distribute objects, follow
These steps:Working with Colors 526
1. Choose the Selection tool from the Tools panel.
2. Using the Selection tool, select the objects.
3. Choose Window➪Align.
The Align panel, shown in Figure 2-12, appears.
4. Choose the options that you want in the Align panel, as follows:
• Use the top row to align the selected objects horizontally or vertically.
• Use the middle row to evenly distribute objects horizontally or verti -
Cally by their edges.
• Use the Match Size buttons to match the size of selected objects by
Width, height, or both.
• Use the Space buttons to distribute objects by the spaces between
Them.
• Use the To Stage button to align or distribute objects relative to the
Stage.
To center an object on the Stage, click the To Stage button on the Align
Panel. Then click the middle Align Vertical and Align Horizontal buttons.
However, if you haven’t panned or scrolled your display, you can use a
Quicker method — cut and paste the object. Macromedia Flash pastes the
Object at the center of the display.
Working with Colors
By default, Macromedia Flash works with a Web safe palette of 216 colors.
These colors are likely to appear the same in all browsers. However, you can
Figure 2-12:
Use the
Align panel
To align and
Equally
Space
Objects,
Such as
Buttons for
Your Web
Site. Book V
Chapter 2
Using the
Graphics Tools
Working with Colors 527
Create your own colors. You can also design gradients that vary from one
Color to another. Another technique is to fill objects with bitmap images.
This is explained in the “Working with bitmap fills” section, later in this
Chapter.
Creating solid colors
You can create a solid color when you need to take more artistic license
Than the standard Web safe palette allows. Follow these steps to create a
Solid color:
1. Choose Window➪Design Panels➪Color Mixer.
The Color Mixer panel, shown in Figure 2-13 with the Solid option active,
Opens.
You can specify colors using the RGB (Red, Green, Blue) or HSB (Hue,
Saturation, Brightness) systems. You can see the current system by the
Letters that are next to the text fields in the panel. In Figure 2-13, you can
Tell that the RGB system is active because the text fields are labeled R,
G, and B. To choose a different system, click the menu icon in the upper -
Right corner of the panel to open the panel’s Options menu and choose
The color system that you want. You can also use the color space in the
Panel to specify a color.
2. Select Solid from the Fill Style drop-down list.
3. Click the Stroke Color or Fill Color icon (to the left of the Stroke or
Fill box), depending on whether you want to change a stroke or a fill.
You can use this color later for either a stroke or a fill if you save the
Color as a swatch, as outlined in Step 6.
4. Type the color specifications in the text fields, or click a color in the
Color space and use the slider to make the color lighter or darker.
Figure 2-13:
The Color
Mixer panel
Is the place
To create
New colors. Working with Colors 528
5. Use the vertical slider next to the Alpha field or text field to set the
Transparency of the color.
A higher alpha percent is more opaque.
6. To save the color, create a color swatch by clicking the Options menu
Icon in the upper-right corner of the panel and choosing Add Swatch.
Your new color is now displayed in the Stroke Color or Fill Color box in the
Properties panel and in the Colors section of the Tools panel. You can use
Any of the tools to work with that color. If you add a color swatch, you can
Continue to use that color later by choosing it from the color palette that
Opens when you click the Stroke Color or Fill Color box.
Creating gradients
Gradients blend one color (lighter with darker) or many colors in either a
Linear or radial (circular) pattern. Gradients give the appearance of shading
And three dimensions. To create a gradient, follow these steps:
1. Choose Window➪Design Panels➪Color Mixer.
The Color Mixer panel opens.
2. From the Fill Style drop-down list, select Linear or Radial to specify
The type of gradient that you want to create, as shown in Figure 2-14.
3. Choose a pointer underneath the horizontal gradient bar.
The pointer becomes black when you select it so that you know it is
Active.
4. Use one of the following methods to select a color for that pointer:
• Click the Fill Color box and choose a color.
• Specify a color using one of the methods of creating a new color that
Were described in the previous section.
• Use the color space to specify a color.
Figure 2-14:
Use the
Color Mixer
Panel to
Create
Gradients. Book V
Chapter 2
Using the
Graphics Tools
Working with Colors 529
5. Repeat Steps 3 and 4 for all the pointers.
You add a pointer when you want to add a new color to the gradient.
Three pointers result in a three-color gradient. To add a pointer, click
Just beneath the gradient bar where you want the pointer to appear. To
Delete a pointer, drag it off the gradient bar.
6. To save the gradient, click the menu icon in the upper-right corner of
The Color Mixer panel and choose Add Swatch from the Options menu
That appears.
Editing fills
After you create your gradient or bitmap fills, you may decide that you want
To change them. (Bitmap fills are explained in the next section.) To edit a fill,
Follow these steps:
1. Choose the Fill Transform tool from the Tools panel.
2. Click a gradient or bitmap fill.
Macromedia Flash places a boundary and editing handles around the
Fill, which varies with the type of fill, as shown in Figure 2-15.
3. Make one or more of the following changes:
• Move the fill’s center: Drag the small circle at the center of the fill.
• Change the fill’s width or height: Drag the square handle inward or
Outward.
• Rotate a fill: Drag the circle on the editing boundary (the endmost
Circle for a radial gradient).
• Scale a bitmap fill: Drag the corner square boundary inward or
Outward.
Figure 2-15:
When you
Edit a fill,
You see
An editing
Boundary
Around
The fill. Working with Colors 530
• Scale a radial gradient: Drag the middle circular handle on the edit -
Ing boundary inward or outward.
• Skew a bitmap fill: Drag a circular handle on the top or side.
Working with bitmap fills
You can create a fill with a bitmap that you have imported. (See Book V,
Chapter 3 for more on importing bitmaps.) To create a fill with a bitmap
Image, follow these steps:
1. Choose File➪Import.
The Import dialog box appears.
2. Choose the bitmap file that you want, and click Open.
The bitmap appears on the Stage.
3. Choose Modify➪Break Apart.
This action selects the entire image as a fill rather than as a single color
When the eyedropper is used (in the next step).
4. Choose the Eyedropper tool from the Tools section of the Tools panel.
5. Click the bitmap image.
The Paint Bucket tool is activated, and the Fill Color button (in the
Colors section of the Tools panel and in the Properties panel) displays
The bitmap image.
6. Click the object that you want to fill.
You may have to move the bitmap image that you imported if it covered
Your object. Notice that the bitmap is tiled — that is, repeated through -
Out the filled area.
Posted: July 15th, 2010 | Author: admin | Filed under: Book IV FreeHand MX | Comments Off
In This Chapter
Working with color
Creating a color palette
Mixing a color
Using the Eyedropper tool
Modifying strokes and fills
W hen you create a FreeHand MX illustration, you can work with as
Much or as little color as you want. You can use color sparingly if
You’re creating an illustration for the Web, or you can use lots of color if
You’re creating illustrations for print. FreeHand gives you a wide variety of
Color tools to work with. You can mix colors, create color palettes, load
Color palettes, and more. If you like bright, vibrant objects that look three
Dimensional in your illustrations, you can use the Fill options in the Objects
Tab of the Properties panel to create a gradient fill (a gradual transition
Between two or more colors).
In this chapter, we show you how to use the FreeHand color tools to add
Vibrancy to every illustration you create. We explain how to work with the
Different color models to mix up colors, as well as how to use the Swatches
Tab of the Assets panel to create a color palette for your document. If you
Prefer to stick with a given color, but want lighter variations of it, we detail
How to do this with the Tints tab of the Mixer and Tints panel.
Before you begin creating an illustration, consider its final destination. Are
You creating an illustration for print or for the Web? If you’re creating an
Illustration for print, choose colors from the CMYK palette. If you are having
A service center print the illustration, find out what system they use for
Color matching and choose all your colors from that color system. We show
You how to choose from a color system in the section, “Using the Swatches
Tab of the Assets Panel.”
If you’re creating an illustration for viewing on a computer, use colors from
The RGB color model. If you’re creating a document for Web viewing, remem -
Ber the old Zen maxim: Less is more. If your viewing audience accesses the
Internet using dial-up modems, the fewer colors you use, the smaller the file
Size, and thus the quicker the download time. Using the Mixer Tab 450
Using the Mixer Tab
You use the Mixer tab of the Mixer and Tints panel to mix up any color of the
Rainbow for your objects. You can mix a color using one of three color
Models, or you can use the System Color Picker to add a splash of color to
Your illustration (Mac users can select colors from Crayons, a Spectrum, and
More). The neat thing about the Mixer tab is that you’re dealing with values.
If you have a set of values for a color (say that lovely chartreuse your client
Uses for a logo), you can match that color exactly by entering the values in
The appropriate section of the Mixer tab. In the next few sections, we explain
How to use each color model to mix up a shade of chartreuse, or whatever
Other color you fancy for your illustration. To open the Mixer tab, shown in
Figure 6-1, choose Window➪Color Mixer or press Shift+F9.
After mixing a color, you can apply it to an object or add it to the Swatches
Tab of the Assets panel. We cover these colorful tasks in the upcoming sec -
Tion, “Working with the Mixer Tab.”
Mixing a CMYK color
When you mix a color using the CMYK color model, you mix percentages of
Cyan, Magenta, Yellow, and blacK. If your document is destined for print,
This is the color model you should choose. Follow these steps to mix a color
Using the CMYK color model:
1. Choose Window➪Color Mixer or press Shift+F9.
The Mixer and Tints panel, previously shown in Figure 6-1, opens.
CMYK
Add to swatches
Change attribute color
System Color Picker
HLS
RGB
Figure 6-1:
You can mix
A color
Using one of
The three
Color
Models. Book IV
Chapter 6
Exploring the Color
Management Tools
Using the Mixer Tab 451
2. Click the CMYK button, which is the top button.
The Mixer tab goes into CMYK mode.
3. Drag the sliders to mix the color.
As you drag the sliders, the color swatch on the right side at the bottom
Of the panel changes to reflect the current values, as shown in Figure
6-2. The values in each field update as well. Alternatively, you can enter
Known values in each field to match a known color, or click the arrows
To increment the values.
Mixing an RGB color
When you create illustrations that will be displayed on a Web site or as part
Of a CD-ROM presentation, you use the RGB (Red, Green, Blue) color model.
You have 256 values (values from 0 to 255) of each color to work with. For
Example, if you create an RGB color with the following values (R=255, G=0,
B=0), you get bright red; the following values yield bright blue (R=0, G=0,
B=255), the values for black are (R=0, G=0, B=0), and so on. When you com -
Bine the possible permutations, you end up with millions of colors. To mix
An RGB color, follow these steps:
1. Choose Window➪Color Mixer or press Shift+F9.
The Mixer and Tints panel opens to show the Mixer tab (refer to
Figure 6-1).
2. Click the RGB button, which is the second one from the top in the
Panel.
The Mixer tab is reconfigured, as shown in Figure 6-3.
Color component values
Original color
Color value sliders
Mixed color
Figure 6-2:
CMYK color:
A little dab’ll
Do ya. Using the Mixer Tab 452
3. Drag the sliders to mix the color.
As you drag the sliders, the color swatch on the right side at the bottom
Of the panel changes to reflect the current values. The values in each
Field also update. Alternatively, you can enter values in the text fields,
Which by the by, is the proper way to match a known color value.
Mixing an HLS color
FreeHand uses HLS (Hue, Lightness, Saturation) color; you may see this
Color model referred to as HSB (Hue, Saturation, Brightness) in other pro -
Grams. When you mix a color using the HLS color model, you choose a hue,
Specify the lightness of the color, and how saturated the color is. The HLS
Model is actually a color wheel. The hue is a value between 0 and 360
Degrees. Values for light and saturation vary between 0 and 100. To mix an
HLS color, follow these steps:
1. Choose Window➪Color Mixer or press Shift+F9.
The Mixer and Tints panel opens with the Mixer tab selected (refer to
Figure 6-1).
2. Click the HLS button, which is the third one from the top in the panel.
The Mixer tab is reconfigured, as shown in Figure 6-4.
3. Click inside the color wheel and drag to select a hue.
As you drag, the color swatch at the bottom of the panel changes to
Reflect the color your cursor is currently over. The values in the Hue and
Saturation fields update as well.
Color component values
Original color
Color value sliders
Mixed color
Figure 6-3:
A dash of
Red, green,
And blue. Book IV
Chapter 6
Exploring the Color
Management Tools
Using the Mixer Tab 453
4. Drag the slider to select a value for Lightness.
The values vary from 0 (black) to 100 (white). Alternatively, you can
Enter a value in the Lightness field.
5. To specify saturation, enter a value in the Saturation field.
You can enter a value between 0 and 100. Low values create a grayer
Variation of the color; higher values increase saturation, creating a more
Vibrant color. Alternatively, you can drag the point in the color wheel,
Towards the center to decrease saturation, or away from the center to
Increase saturation.
After you mix up a color, click the button for another color mode to see the
Component values for the new color in that color mode.
Mixing a color from the System Color Picker
Your operating system uses specific colors to display the icons, buttons,
And text of the software you use. You can use a color from the System Color
Picker in your FreeHand illustrations (Mac users can choose a color from
Crayons, a Spectrum, Grayscale, CMYK, RGB, HSB, Web-safe colors, and
More). To mix a color from the System Color Picker, follow these steps:
1. Choose Window➪Color Mixer or press Shift+F9.
The Mixer and Tints panel opens to show the Mixer tab (refer to
Figure 6-1).
2. Click the System Color Picker button, which is the fourth one from
The top in the panel.
The Color dialog box opens, as shown in Figure 6-5.
HLS color wheel
Original color
Color component values
Mixed color
Figure 6-4:
You can mix
Colors form
The HLS
Color wheel. Working with the Mixer Tab 454
3. Click a color to select it.
Half of the bar at the bottom of the Mixer tab of the Mixer and Tints
Panel refreshes to show the color you select. The component values for
The color are displayed in the text fields for the color mode you choose.
If you want to see the values for the color in CMYK, RGB, or HLS, click
The appropriate button on the Mixer tab.
Working with the Mixer Tab
After you use the Mixer tab to mix the perfect hue, you can apply it directly
To an object, use it for the current fill color, or add it to the Swatches tab of
The Assets panel. We show you how to use the Swatches tab of the Assets
Panel to create a color palette in the upcoming section, “Using the Swatches
Tab of the Assets Panel.”
Using the Mixer tab to apply color to an object
When you mix a color with the Mixer tab, you can apply it directly to the
Stroke or fill of an object in your document. To apply a color from the Mixer
Tab to an object, follow these steps:
1. Click the swatch shown in the right half of the rectangular bar at the
Bottom of the Mixer tab.
A square appears at the end of your cursor.
2. While holding down the mouse button, drag toward the object you
Want to apply the color to.
3. Release the mouse button when your cursor is over the stroke or fill
Of the object, whichever you want to change.
The color is applied to stroke or fill of the object.
Figure 6-5:
You can
Choose a
Color from
The System
Color
Picker. Book IV
Chapter 6
Exploring the Color
Management Tools
Working with the Mixer Tab 455
Using the Mixer tab to change
The current fill or stroke color
If you’re getting ready to create several objects and you want to use the same
Stroke or fill color on these objects, you can replace the current stroke or fill
Color with one you mix in the Mixer tab and create away. To use a color
Mixed in the Mixer tab as the current fill or stroke color, follow these steps:
1. Click the swatch shown in the right half of the rectangular bar at the
Bottom of the Mixer tab.
A square appears at the end of your cursor.
2. While holding down the mouse button, drag towards the Fill or
Stroke color box.
You can find these boxes in the Colors section of the Tools panel.
3. Release the mouse button when your cursor is over the Fill or Stroke
Color box.
The swatch in the Fill color box or Stroke color box changes to the color
You mixed in the Mixer tab. If you have an object in the document
Selected, its fill or stroke color changes as well.
Adding a color to the Swatches
Tab of the Assets panel
If you mix a color you’re going to use repeatedly in the document, you can
Add it to the Swatches tab. To add a color from the Mixer tab to the
Swatches tab of the Assets panel, follow these steps:
1. Choose Window➪Color Mixer or press Shift+F9.
The Mixer and Tints panel opens.
2. Mix a color.
If you don’t know how to mix a color, read the preceding section, “Using
The Mixer Tab.”
3. Click the Add to Swatches button at the lower-left corner of the Mixer
Tab — it’s the one to the right of the Change Attribute Color button.
The Add to Swatches dialog box opens.
4. Accept the default name for the color or enter one of your own.
FreeHand uses the component values to name the color. When the color
Is added to the Swatches tab of the Assets panel, a small rectangular
Swatch of the new color is added as well. If you give the color a unique
Name, it will be easier to find if you’re creating an illustration with lots of
Colors. To give the color a unique name, type the name and press Enter. Creating Color Tints 456
5. Choose Process or Spot.
This option refers to how the color is separated for the output device.
Process colors are printed on four separate pages using the four
Process (CMYK) inks. Spot colors are not separated and are printed
On a separate plate.
6. Click Add.
The color is added to the Swatches tab of the Assets panel.
Creating Color Tints
When you create a color tint, you create a lighter variation of the original
Color. You create a color tint by varying the percentage of the original color
With the Tints tab of the Mixers and Tints panel. After you create a color
Tint, you can apply it directly to an object, add the tint to the Swatches tab
Of the Assets panel, or use it as the current fill or stroke color. To create a
Color tint, follow these steps:
1. Create a color using the Mixer tab of the Mixer and Tints panel.
2. Click the Tints tab on the panel.
The Tints tab opens, as shown in Figure 6-6.
3. Drag the slider to specify the percentage of the original color that will
Be used to create the tint.
As you drag the slider, the swatch at the bottom-right of the panel
Updates to display the new tint. Compare this to the swatch at the
Slider
Original color
Tint value windows
Tinted color
Figure 6-6:
To tint or not
To tint, that
Is the
Question. Book IV
Chapter 6
Exploring the Color
Management Tools
Using the Swatches Tab of the Assets Panel 457
Bottom-left of the panel, which is the original color. Alternatively, you
Can tint the color by clicking one of the squares (tints of the original
Color in ten percent increments) or by entering a value in the field.
4. After creating the tint, do one of the following:
• Click the color swatch shown in the right half of the rectangle at the
Bottom of the panel, and then drag and drop the color on an object
In the document.
• Click the color swatch shown in the right half of the rectangle at the
Bottom of the panel, and then drag and drop the color on the Fill
Color box to replace the current fill color with the tint, or drag and
Drop the color on the Stroke color box to replace the current stroke
Color with the tint. If you have an object selected while doing this,
The object’s stroke or fill color is changed as well. Note: The Fill color
Box and the Stroke color box are both found on the Tools panel.
• Click the Add to Swatches button to add the tint to the Swatches tab
Of the Assets panel. After you click the button, the Add to Swatches
Dialog box appears. For more information, read the “Adding a color to
The Swatches tab of the Assets panel” section, earlier in this chapter.
If the Mixer and Tint panel is open at the same time as the Swatches tab of
The Assets panels, you can click the color swatch at the bottom of either the
Mixer tab or the Tint tab in the Mixer and Tint panel, and drag and drop it
Into the Swatches tab, and the color is added to the palette.
Using the Swatches Tab of the Assets Panel
When you create an illustration that uses the same colors on each page or
For several objects, mixing the color each time you need it is time-consuming
And counterproductive. You can save a considerable amount of time if you
Add the colors you use frequently to the Swatches tab of the Assets panel.
You also use the Swatches tab to organize and apply colors from standard
Preset color-matching systems. This option is handy if you’re creating a
Document that will be printed by a service center. If you’re creating a docu -
Ment for a Web page, you can also choose a color from the Web safe color
Library. Another option you have with the Swatches tab is saving the current
Color palette for future use. To open the Swatches tab, shown in Figure 6-7,
Choose Window➪Swatches or press Ctrl+F9.
The Swatches tab shown in Figure 6-7 already has colors added to it. The
Default colors when you create a new document are None, Black, White, and
Registration. You cannot rename or delete these colors. Black is a spot color
That is used for the black separation plate when printing a process color.
The registration color, a combination of CMY and K, all at 100%, is used for
Crop or trim marks and prints solid on separations. Using the Swatches Tab of the Assets Panel 458
You can differentiate color types in the Swatches tab of the Assets panel as
Follows:
✦ Process colors: The names of process colors are italicized.
✦ Spot colors: The names of spot colors are displayed with plain type.
✦ RGB colors: RGB colors display a triangular icon with red, green, and
Blue spheres after the color’s name. Colors derived from the HLS color
Wheel or the System Color Picker are displayed as RGB colors as well.
✦ CMYK colors: CMYK colors are displayed with no icon.
After you open the Swatches tab of the Assets panel, you can do any of the
Following:
✦ Apply a color to an object: You can apply a color to the stroke or fill of
An object by selecting the color and dragging and dropping it on an
Object. Alternatively, you can apply a color by selecting an object, click -
Ing the Fill, Stroke, or Stroke and Fill button at the top of the Swatches
Tab, and clicking the desired color’s name in the Swatches tab.
✦ Modify a color: You can modify a color in one of two ways:
• Mixer tab: You can modify a color in the Swatches tab by opening
The Mixer tab and dragging and dropping a color from the Swatches
Tab to the left side of the rectangular color swatch at the bottom of
The Mixer tab.
• Tints tab: You can modify a color in the Swatches tab by opening the
Tints tab and dragging and dropping a color from the Swatches tab
To the left side of the rectangular color swatch at the bottom of the
Tints tab.
✦ Change the stroke color: You can change the current stroke color by
Selecting a color from the Swatches tab and then dragging and dropping
It on the Stroke color box on the Tools panel.
✦ Change the fill color: You can change the current fill color by selecting
A color from the Swatches tab and then dragging and dropping it on the
Fill color box on the Tools panel.
Figure 6-7:
You use the
Swatches
Tab to
Create a
Color palette
And more. Book IV
Chapter 6
Exploring the Color
Management Tools
Using the Swatches Tab of the Assets Panel 459
Adding preset colors to the Swatches tab
You can add a color to the Swatches tab of the Assets panel from either
The Mixer tab or the Tints tab, as outlined earlier in the chapter. If you fast -
Forwarded to this section and need to know how to add a color to the
Swatches tab from the Mixer tab, read the section, “Adding a color to the
Swatches tab”; to add a tint to the Swatches tab, read the section, “Creating
Color Tints.” In this section, we show you how to add colors to the
Swatches tab from preset color matching systems. To add a color from a
Preset color matching system to the Swatches tab, follow these steps:
1. Choose Window➪Swatches.
The Swatches tab of the Assets panel opens.
2. Click the Options menu (the bulleted list icon at the upper-right corner
Of the Assets panel) and choose one of the preset color matching sets.
If the document you’re creating will be printed commercially, find out the
System they use for color matching. For example, they may use one of
The PANTONE or Munsell matching systems. If the document you’re cre -
Ating will be displayed on a Web page, choose Web Safe Color Library.
When you choose a color matching system, a dialog box appears.
3. Select a color (or colors) from the Library dialog box.
You can select additional contiguous colors by clicking them while hold -
Ing down the Shift key and non-contiguous colors by holding down the
Ctrl key.
4. Click OK.
The Library dialog box closes and FreeHand adds the selected color(s)
To the Swatches tab using the color’s default library name.
You can also double-click a color to add it the Swatches tab, which will close
The dialog box.
Renaming a color
You can rename any color in the Swatches tab, except the default colors:
None, Black, White, and Registration. If you give a color a unique name,
You’ll have an easier time selecting it from the Swatches tab. To rename a
Color, follow these steps:
1. Choose Window➪Swatches.
The Swatches tab of the Assets panel opens.
2. Double-click the color you want to rename.
The color’s name is highlighted. Using the Swatches Tab of the Assets Panel 460
3. Type a new name for the color and then press Enter.
The color is renamed.
Exporting a color palette
When you create an ideal color palette, you can export the palette for use in
Documents you create in the future. This option is handy if you do work for
A client that uses specific color combinations for their text and logo. You
Create the palette by adding colors to the Swatches tab as outlined previ -
Ously in this chapter in the “Adding a color to the Swatches tab,” “Creating
Color Tints,” and “Adding preset colors to the Swatches tab” sections. After
You create the palette (also known as a Color Library), you can export it by
Following these steps:
1. Choose Window➪Swatches or press Ctrl+F9.
The Swatches tab of the Assets panel opens.
2. Click the Options menu (the bulleted list icon at the upper-right
Corner of the Assets panel) and choose Export.
The Export Colors dialog box, shown in Figure 6-8, opens.
3. Select the colors you want to export.
To select a color, click it. Hold down the Shift key to add a selection of
Contiguous colors to the selection, or hold down the Ctrl key to add
Individual noncontiguous colors to the selection.
4. Click OK.
The Create Color Library dialog box appears.
Figure 6-8:
You can
Create a
Custom
Color
Library
From the
Swatches
Tab. Book IV
Chapter 6
Exploring the Color
Management Tools
Using the Swatches Tab of the Assets Panel 461
5. Enter a name in the Library Name field.
Choose a meaningful name that describes the type of colors in the
Library, or enter the name of the client you use the colors for.
6. In the Filename field, accept the default name of CUSTOM, or enter
Another name for the library.
If you intend to store more than one library, change the name to one
That reflects the contents of the library. When you import the Color
Library into a future document, this is the name you look for.
7. Click Save.
FreeHand saves the library in the Colors folder (in FreeHand’s Settings
Folder) and the colors in it appear on the Swatches tab.
Adding custom colors to the Swatches tab
After you save a color palette as a library, you can use any or all colors from
The palette in new illustrations by adding them to the Swatches tab of the
Assets panel. To add colors from a custom library to the current Swatches
Tab, follow these steps:
1. Choose Windows➪Swatches or press Ctrl+F9.
The Swatches panel opens.
2. Click the Options menu (the bulleted list icon at the upper-right
Corner of the Assets panel) and select the custom color library by
Clicking its name.
The Library dialog box opens.
3. Select the colors you want to add to the Swatches tab.
Select an individual color by clicking its swatch. To add contiguous
Colors to the selection, hold down the Shift key and click the top and
Bottom colors you want to add. To add noncontiguous colors to the
Selection, hold down the Ctrl key and click the individual colors you
Want to add.
4. Click OK.
The colors are added to the Swatches tab.
You can also copy and paste or drag and drop named colors from one open
FreeHand document to another. The colors will be added to the Swatches
Tab automatically. Using the Eyedropper Tool 462
Using the Eyedropper Tool
You use the Eyedropper tool to sample a color. You can sample the color
From an object in your document, the Stroke color box, the Fill color box, or
From the following panel tabs: Mixer, Tints, and Swatches. To sample a color
With the Eyedropper tool, follow these steps:
1. Select the Eyedropper tool from the Tools panel.
It’s the tool with an eyedropper for an icon.
2. Sample a color by doing one of the following:
• Click an object in the document window.
• Click a color swatch in any of the following panel tabs: Mixer,
Swatches, or Tints.
After you sample a color, hold down the mouse button and drag and
Drop the color to any of the following:
• A different object in the document: Do this when you sample a
Color from one object that you want to apply to another.
• An object in the document: Do this when you want to sample a
Color from a panel tab.
• The color swatch in the Mixer tab: Do this when you want to modify
A color using the Mixer tab.
• The color swatch in the Tints tab: Do this when you want to tint an
Existing color.
• The Swatches tab: Do this when you want to add a sampled color to
The Swatches tab.
3. Release the mouse button.
The sampled color is applied to the object or added to the tab you
Dropped it on.
Modifying Strokes
You use the Object tab of the Properties panel to change the color of a
Stroke, its width, and other parameters. If the stroke is a single line, you can
Add arrowheads to the head and/or tail of the stroke. The Object tab of the
Properties panel has enough options to fill up a whole lot of pages. You’ll
Never use many of the options, so we spare you a lot of excess verbiage by
Showing you how to modify a basic stroke in this section. To modify a stroke
Using the Object tab of the Properties panel, follow these steps:Book IV
Chapter 6
Exploring the Color
Management Tools
Modifying Strokes 463
1. Use the Pointer tool to select the stroke you want to modify.
You select a path, or modify an object’s stroke (outline) by selecting the
Object.
2. Choose Windows➪Object or press Ctrl+F3.
The Object tab of the Properties panel opens, displaying the Stroke
Tools, as shown in Figure 6-9.
3. Click the stroke in the list of Object properties to show the options for
The stroke you want to edit.
4. To change the stroke’s color, click and drag a color from the Swatches
Tab of the Assets panel onto the box to the right of the stroke indicator.
Similarly, you can also click the Stroke color box on the Tools panel and
Select a color from there.
5. Select an option from the Width drop-down list.
Alternatively, you can enter the desired value in the Width field.
6. Click a button in the Cap section to determine the path end.
The available options are Butt, Round, or Square.
Stroke color
Butt
Round
Square
Mitered
Round
Bevel
Stroke type
Figure 6-9:
You can
Modify a
Stroke’s
Appearance
With the
Object tab
Of the
Properties
Panel. Modifying Fills 464
7. Click a button in the Join section to determine how path ends join.
The available options are Mitered, Round, and Bevel.
8. Enter a value in the Miter field.
This value is applicable if you choose a miter join. Enter a value
Between 1 and 57. If the line length exceeds this value, it will be squared
Off instead of mitered.
9. To have a dashed stroke, select an option from the Dash drop-down list.
10. To apply an arrowhead to an open path, select an option from each of
The Arrowheads drop-down lists.
Use the left Arrowheads drop-down list to select an arrowhead for the
Start of the path; use the right Arrowheads drop-down list to select an
Arrowhead for the end of the path. You can select different arrowheads
For each end of the path. You can also have an arrowhead at one end of
The path and no arrowhead at the other.
The settings you specify are applied to the selected stroke. When you
Create a new stroke, the stroke is created using the previous settings.
You can use the Object tab to set stroke settings for all future strokes you
Create. Deselect all objects in the document, select a non-drawing tool, such
As the Pointer tool, and then set stroke characteristics as outlined in the
Previous steps. The characteristics will be applied to all future strokes until
You modify the settings in the Object tab.
If you like artistic brush strokes, select a path, open the Object tab, and then
Select Brush from the Stroke Type drop-down list. (Refer to Figure 6-9.) You
Can make the stroke look like it was painted with an artist’s brush or an
Airbrush.
Modifying Fills
When you add color to a shape, you give it a fill. You can modify the fill at
Any time using the Object tab of the Properties panel. The Object tab is
Filled with all manner of different fill options. In fact, it has so many options;
It would fill a chapter of its own. In the upcoming sections, we show you the
Most commonly used fill options.
Creating a basic fill
You can create or modify a basic fill through the Object tab in the Properties
Panel. A basic fill is pretty simple; it only has one color. When your design
Calls for a basic fill, here’s how you create one with the Object tab:Book IV
Chapter 6
Exploring the Color
Management Tools
Modifying Fills 465
1. Use the Pointer tool to select the object whose fill you want to modify.
Alternatively, deselect all objects in the document, select a non-drawing
Tool, and the fill you create is applied to all future shapes you create.
2. Choose Window➪Object or press Ctrl+F3.
The Object tab of the Properties panel opens.
3. Click Fill: Basic beneath the object box in the list area of the panel.
By default, fills are defined as Basic and are colored black, as shown in
Figure 6-10.
4. Choose a color from the Fill drop-down list.
These are the colors currently in the Swatches tab of the Assets panel.
Alternatively, you can select a color by clicking the swatch in the Mixer
Or Tint tabs of the Mixer and Tints panel and dragging and dropping the
Color on the current color swatch in the Object tab.
After you select a color, it is applied to the selected object, or if you
Have no objects selected, the fill will be applied to all closed paths you
Create until you modify the fill.
If there is no default fill created for an object you’re working on, you can
Create one by clicking the Paint Bucket button on the Object tab. This will
Add a fill of the default color (which is usually black) to the object.
Creating a gradient fill
When you create a gradient fill, you create a gradual transition of two or
More colors. In FreeHand, you can create the following types of gradient
Fills: linear, radial, contoured, logorithmic, rectangle, or cone. Figure 6-11
Shows a comparison of the six gradient fill types.
Figure 6-10:
Basic fills
Are. . .
Basic. Modifying Fills 466
When you create a gradient fill, you specify each color in the fill and where
The color is blended. To create a gradient fill, follow these steps:
1. Use the Pointer tool to select the object to which you want to apply
The gradient fill. The object must have a closed path.
Alternatively, you can deselect all objects in the document, and the fill
You create will be applied to closed paths you create from this point
Forward.
2. Choose Window➪Object and, from the Object tab, select Fill: Basic
From the area underneath the object name in the middle list area.
3. From the Fill Type drop-down list, select Gradient.
The Object tab is reconfigured, as shown in Figure 6-12.
Fill type
Gradient type Color ramp
Figure 6-12:
You can
Create a
Colorful fill
By choosing
The gradient
Option.
Linear
Logarithmic Rectangle Cone
Radial Contour
Figure 6-11:
You can
Choose from
The six
Varieties of
Gradient
Fills. Book IV
Chapter 6
Exploring the Color
Management Tools
Modifying Fills 467
4. Select the appropriate gradient type from the drop-down list beneath
The Fill Type drop-down list.
You can choose Linear, Radial, Contour, Logarithmic, Rectangle, or
Cone. The default gradient fill blends black and white, but you can
Choose any color.
5. Click the color swatch at either end of the color ramp (the rectangle
At the bottom of the tab) and choose a color from the color picker.
The color swatch refreshes to show the color you selected. Alternatively,
You can click the color swatch in the Mixer or Tint tabs and drag and
Drop the color onto the color swatch on the color ramp.
6. To add additional color points to the gradient, click a color swatch
From the Mixer tab of the Mixer and Tints panel or from the Swatches
Tab of the Assets panel and drag and drop it to the desired position
On the color ramp.
You can add as many color points as needed to define your fill. After
Adding another color point, you can select a different color by using
Any of the methods outlined in Step 5. If you need to move a color
Pointer, click the color pointer and drag it to a different position on
The color ramp. To remove a color point, click it and drag it off the
Color ramp.
7. Set the options for the type of gradient you’ve selected.
Each of the gradients has slightly different options for tweaking the fill
Pattern. In general, though, they include starting points for the gradient,
The angle of the gradient, and the width of the gradient.
Creating a tiled fill
When you create a tiled fill, you copy a shape from within the document
And use it to create a fill that displays the copied object tiled within
Another object. You can specify how large the tiled object is and change
The fill’s position within the filled object. To create a tiled fill, follow these
Steps:
1. Use the Pointer tool to select the object (or objects) that you want as
The basis for your tiled fill.
2. Choose Edit➪Copy or press Ctrl+C.
The object is copied to the Clipboard.
3. Use the Pointer tool to select the object you want to fill. Modifying Fills 468
4. Choose Window➪Object and select Tiled from the Fill Type drop -
Down list in the Object tab of the Properties panel.
The Object tab is reconfigured to create tiled fills.
5. Click the Paste In button.
The copied shape is pasted into the window and is tiled within the
Object you are filling.
6. To resize the object, enter values in the X and Y fields.
Enter values lower than 100 to make the object smaller and values larger
Than 100 to increase the size of the tiled object. As you enter values, the
Object’s fill changes to reflect the new parameters. Enter the same value
In each field to resize the object proportionately.
7. Enter values in the X and Y Offset fields.
The values you enter move the fill within the object to which it is
Applied. Enter positive X values to move the tiled fill to the right,
And negative X values to move the tiled fill to the left. Enter positive
Y values to move the fill up, and negative Y values to move the fill
Down.
8. Drag the circular dial to set the fill’s angle.
Hold down the Shift key to constrain the changes to 45-degree incre -
Ments. Alternatively, you can enter a value in the Angle field. Figure 6-13
Shows the Object tab being used to create a tiled fill as well as the
Object the tiled fill is being applied to.
Filled object
Fill scale
Fill offset
Fill angle
Figure 6-13:
It’s not
Ceramic,
But it is tile. Book IV
Chapter 6
Exploring the Color
Management Tools
Modifying Fills 469
Using FreeHand’s other fill types
Getting into the nitty-gritty details of how to use FreeHand’s other fill types
Goes a little beyond the scope of this book, but we did want to at least men -
Tion what they’re used for, lest you see them in the Fill Type drop-down list
And think, “Hey, I got robbed! Nobody told me about these.” Briefly, here’s
What the other Fill types are designed to do:
✦ Custom Fill: Nine custom fills are available, and they include things like
Bricks, circles, and grass. Each of the fills is editable.
✦ Lens: The Lens fill allows you to set up your fill using common photo -
Realistic effects, such as transparency, lighten, darken, invert, and
Monochrome. Again, each of these effects is editable to your liking.
✦ Pattern: The Pattern fill is fun, because you can watch your object
Change as you click on little boxes in a grid in the Object tab.
✦ Postscript: Postscript fills are standardized repeating patterns. You
Won’t be able to see them onscreen — they only appear when you print
Your document on a PostScript printer. Onscreen (and when output
From non-Postscript printers) they show up as rows of the letter C.
Postscript fills don’t scale when you scale an object; they have set
Sizes. If you’re looking for a place to get started on understanding
Postscript, including links to other sources on the Net, check out
Www. postscript. org.
✦ Textured: Textured fills work almost exactly like the pattern fills, except
That the fills are more interesting. For this type, they include burlap,
Denim, sand, and coarse gravel.
Fun with color, FreeHand style
You can also modify colors in your documents
By choosing Xtras➪Colors and choosing a com -
Mand from the submenu. You can use these
Commands to lighten, darken, or desaturate
Process colors, as well as randomize colors,
Sort named colors, and more. We urge you to
Experiment with these powerful commands to
Further your use of color in FreeHand. Book IV: FreeHand MX 470
Posted: July 15th, 2010 | Author: admin | Filed under: Book VII Contribute 2 | Comments Off
In This Chapter
Introducing FlashPaper
Teaming Contribute 2 with Dreamweaver
Using the PayPal extension
C ontribute 2 isn’t really integrated into the Macromedia Studio MX 2004
Suite. It’s very much a standalone product created for people who need
To maintain Web sites but not build them. Contribute 2 for Windows comes
With its own standalone product: FlashPaper.
Introducing FlashPaper
FlashPaper converts any printable file (word processing document, spread -
Sheet, slide show) into an SWF file that can be viewed by anyone with the
Latest version of the standalone Macromedia Flash Player or a browser with
The latest version of the Flash plug-in.
Unless you specified otherwise, when you installed Contribute, you installed
FlashPaper also, and the FlashPaper icon was placed automatically on your
Desktop, as shown in Figure 4-1.
FlashPaper can be accessed from within Contribute (see the section on
Adding images, links, and more in Book VII, Chapter 2 for details). That
Means when you insert a document as FlashPaper into a draft, you might
Not even realize you’re using another application. But FlashPaper can run
Quite independently of Contribute.
Figure 4-1:
The
FlashPaper
Icon. Introducing FlashPaper 804
You can use FlashPaper as a standalone application to in two ways:
✦ By dragging a printable document onto the FlashPaper desktop icon.
✦ By selecting the FlashPaper printer when you print from within an appli -
Cation like Word or Excel. Figure 4-2 shows FlashPaper selected in two
Different applications; the Print dialog box on the top is from Word and
The Print dialog box on the bottom is from Internet Explorer.
Whichever method you choose, your printable document is cloned as an
SWF file.
Figure 4-2:
To “print”
To an SWF,
You can
Select the
FlashPaper
Printer
When you
Print from
Many
Applications,
Including
Word (top)
And IE
(bottom).Book VII
Chapter 4
Contribute 2 and
Other Macromedia
Products
Understanding Dreamweaver Templates 805
While you could theoretically “print” an image as an SWF, there’s no com -
Pelling reason to do so, because image formats like GIF and JPEG are nearly
Universally compatible with image display and editing programs as well as
Browsers.
There is one catch: SWF files generated by FlashPaper cannot be edited with
Macromedia Flash MX 2004. If you need to change a file you’ve converted
With FlashPaper, you have to change the original file, and then make a new
FlashPaper document from it.
As of this writing, FlashPaper is available only for Windows versions
After Windows 95; presumably Macromedia is at work on a Mac version.
(Contribute was originally available only for Windows, but with version 2,
It is now available for Mac users.)
Teaming Contribute with Dreamweaver
For Web developers who plan to hand off the maintenance of the sites
They’ve built to people who don’t know anything about HTML, FTP, or CSS,
Contribute represents a certain amount of peace of mind. Especially when
Combined with Dreamweaver templates, Contribute can make creating new
Pages with a consistent design faster and simpler for nontechnical people
Doing site maintenance.
Understanding Dreamweaver Templates
A Dreamweaver template is a special type of file (it uses the extension. dwt)
That may contain HTML, CFML, and other typical Web page code, and that
Also contains hidden instructions that tell Dreamweaver and Contribute to
“lock” certain portions of the code — basically making those chunks of code
Unavailable for editing.
Figure 4-3 shows a new page based on a simple Dreamweaver template. The
Template has three editable areas: the top navigation, the page header, and
The main text area. When the cursor is over any other area on the draft, it
Becomes a circle-slash, signifying that edits to the area are not permitted.
The page title, which you can see highlighted in the Pages panel as well as
Prominently displayed in the Contribute title bar in Figure 4-3, has been
Entered in the New Page dialog box that appears when a contributor creates
A new page. (See Book VII, Chapter 2 for details on creating a new page
Based on a Dreamweaver template.)Working with PayPal 806
For details about creating Dreamweaver templates, see Book II, Chapter 7.
For details about how to ensure that contributors use particular templates
To create new pages on your site, see the section on granting group permis -
Sions in Book VII, Chapter 3.
Working with PayPal
Contribute 2 includes an extension similar to the one available for
Dreamweaver that makes adding PayPal buttons to your page a snap.
(Note: You must have a PayPal Business or Premier account to insert the
PayPal buttons into your page, and your site must already have the code
For the shopping cart.) In order to use the extension, you have to select it
When you install Contribute, as shown in Figure 4-4.
If you have the PayPal extension installed, you see an extra button at the
Right side of the browser toolbar when you’re editing a page. When you click
And hold that button, you can select the following options from the pop-up
Menu:
✦ Buy Now Button
✦ Add to Cart Button
✦ View Cart Button
✦ Subscription Button
Figure 4-3:
Creating a
New page
From a
Dream -
Weaver
Template. Book VII
Chapter 4
Contribute 2 and
Other Macromedia
Products
Working with PayPal 807
Those same options are also available when you choose Insert➪PayPal.
A wizard guides you through the steps necessary to insert the buttons on
Your page — be sure to have your PayPal account information at hand.
Make sure that any contributor working on a page with PayPal buttons
Has the PayPal extension installed. Also, be aware that Contribute’s PayPal
Extension may have trouble with forms that use JavaScript validation, forms
Within <SPAN>tags in Dreamweaver templates, and more. See the Contribute
TechNote at www. macromedia. com/support/contribute/ts/documents/
Paypal. htmfor details on workarounds.
Figure 4-4:
Select the
PayPal
ECommerce
Toolkit when
You install
Contribute. Book VII: Contribute 2 808