Designing the wings

The first step to begin drawing your media player skin is to create the outside contours of the wings. Select the Pen tool from the Tools panel, or press the P key on your keyboard to access it (see Figure 5).

Figure 5. Select the Pen tool from the Tools panel

In Property inspector set the stroke options to Pencil > 1-Pixel Soft. Click the color chip to select black (#000000) from the swatches (see Figure 6).

Figure 6. The components involved in creating a LiveCycle PDF Generator 3D document

Draw a path as shown in Figure 7. As you refer to the screenshot, notice that only the anchor points marked with red circles have handles to create curved lines between them. Press and hold the mouse down to create the handles. In the Layers panel, double-click on the existing name and rename it Path 1.

Figure 7. Create a path as shown, adding handles to the points highlighted in red

Select the Subselection tool from the Tools panel, or press the A key on your keyboard to access it (see Figure 8).

Figure 8. Select the Subselection tool from the Tools panel

Adjust the handles of the points to edit Path 1 until it resembles the example in Figure 9. Use the Subselection tool and Alt-drag (Windows) or Option-drag (Macintosh) to adjust the highlighted anchor points.

Figure 9. Adjust the handles using the Subselection tool

Don't worry if your path looks different than mine. You can modify the wings however you prefer. However, to keep your design in line with these instructions, the path must have six points (and five of the points should have handles).

Copy the path and then paste it to create a duplicate wing. In the Layers panel, rename the new path Path 2. Select Path 2 with the Pointer tool and press Shift while pressing the Up Arrow on your keyboard. When you hold down Shift and press an Arrow key at the same time, it is called "nudging." Each time you press Shift-Up Arrow the selected object moves 10 pixels upward. If you need to move the path one pixel at a time, simply press the Up Arrow without holding down the Shift key at the same time (see Figure 10).

Figure 10. Press Shift-Up Arrow to nudge Path 2 above Path 1 by 10 pixels

Select Path 2 with Subselection tool, and then choose the Pen tool from Tools panel. Click at the bottom of the path to create one new point (see Figure 11). As you create the new point, press and hold the left mouse button to create handles for the point.

Figure 11. Create a new point at the bottom of Path 2 using the Pen tool

Adjust the handles of Path 2 using the Subselection tool, as shown in Figure 12.

Figure 12. Use the Subselection tool to adjust the handles of Path 2

Select the Pointer tool from the Tools panel. Select both paths and copy them. Then paste a new set of the two paths. While both of the new paths are selected, choose Modify > Combine Paths > Join (see Figure 13).

Figure 13. Select Combine Paths > Join to create a composite path from the two open paths

Select the new Composite Path you just created. In the Property inspector, set the fill color to Gradient > Ellipse. If you wish to follow along exactly, I used #FF8263 and #FF3300 (although you can choose any other color combination as desired). Set the edge to Anti-Alias. Set the texture to Line-Diag 2 at 9%. Set the stroke color to #B5BEC1 (or whatever you prefer), with a 1 pixel Basic > Soft Line. Set the Edge to 50, with no texture (see Figure 14).

Figure 14. Set the fill and stroke properties of the composite path in the Property inspector

Adjust the gradient handles to make your composite path look similar to Figure 15.

Figure 15. Adjust the gradient handles of the composite path

Select Path 2 in the Layers panel. Copy it, then paste it to make a duplicate. Rename the new copy Path 3. Move Path 3 in front of the Wings layer by selecting Modify > Arrange > Bring to Front (see Figure 16).

Figure 16. Select Modify > Arrange > Bring to Front to place Path 3 above the Wings layer

In the Layers panel, press the Shift key and select Path 3 and the composite path at the same time. Select Modify > Combine Paths > Crop (see Figure 17).

Figure 17. Select Modify > Combine Paths > Crop to edit the composite path

The goal of this skin is to end up with one red curve to the top and one at the bottom. As you create this composite path, you may find that you don't need some of the points. I discovered this as I designed my version, and so I simply removed the unnecessary point by selecting it with Subselection Tool and pressing the Delete Key (see Figure 18).

Figure 18. Select and delete any unneeded anchor points

Press Shift and select Path 1 and Path 2 from the Layers panel. Use the Property inspector to change the color of their strokes to #B5BEC1 (see Figure 19).

Figure 19. Set the stroke color of Path 1 and Path 2 to #B5BEC1

At this point, the left side of the wings is complete. To quickly create the right side, select all by pressing Control-A (Windows) or Command-A (Mac). Copy the left wing, and then paste it to create a duplicate. While the new copy is still selected, select Modify > Transform > Flip Horizontal (see Figure 20).

Figure 20. While the copy of the wing is selected, select Modify > Transform > Flip Horizontal

After transforming the new set of wings, your design should look similar to the example in Figure 21.

Figure 21. The two wings are arranged to face each other

While the new, right wing side is still selected, hold down the Shift Key and press the Right Arrow until the left and the right parts of the wings are just touching each other at the bottom (see Figure 22).

Figure 22. Nudge the right wings to the right until the bottom anchor points are touching

We've finished creating the wings. In the Layers panel, lock the Wings layer.

Page 3 of 7

Previous Page

Next Page