Photoshop cs5 tutorials for Web Layout Part 6(C)

Part 6

Photoshop cs5

WEB LAYOUT AND OPTIMIZATION

CUTTING A ZIGZAG EDGE Part (C)

STEP : 6

Photoshop cs5 tutorials.To add the new pattern to your original file, use the Rectangular Marquee tool to drag out a 960×7 px sized rectangular shape across the top edge of the maroon colored section in your file. (Th is size is important so make sure you rectangle is exactly 960×7 px.) For help making precise selections, look to the Width and Height fields on the Info panel (F8). Aft er releasing your mouse, click the Create New Fill or Adjustment Layer button at the bottom of the Layers panel and select Pattern from the context menu. Your new zigzag pattern should automatically fill your selection, however it might not fill the space as cleanly as you’d like it to, as illustrated in Figure 6-3.

Figure 6-3

Figure 6-3

With the Pattern Fill dialog box still open, adjust how the pattern sits within the layer mask by clicking and dragging on the pattern within your document window until the bottom of the pattern is aligned within the mask space, as shown in Figure 6-4. When you have the pattern aligned properly, click OK to close the dialog box.

Figure 6-4

Figure 6-4

 

STEP : 7

Use the Move tool (V) to position the pattern layer at the top edge of the maroon section. Etvoila! You have a fancy zigzag edge. To further enhance this design element, merge the maroon rectangle and pattern layer by selecting both layers in the Layers panel and pressing Ctrl+E/Ô+E, and then apply layer styles through the Layers panel, such as a Drop Shadow, Stroke, and Gradient Overlay, for added definition and fl air. Figure 6-5 shows an example of the zigzag design.

Figure 6-5

Figure 6-5

 

 

email
GD Star Rating
loading...
GD Star Rating
loading...

Posts You May Also Like to Read:

About shakil .

Shakil . is a Founder and Web Designer, Ahoban Network of Ahoban Network (আহবান নেটওয়ার্ক). Google+ | Twitter | Facebook | LinkedIn | Pinterest | YouTube | Email me



             

Speak Your Mind

*

CommentLuv badge
This blog uses premium CommentLuv which allows you to put your keywords with your name if you have had 3 approved comments. Use your real name and then @ your keywords (maximum of 3)