Vectorials
Flash Perfection
3D Lessons
Tutorialkit
Markup Tutorials
Learn PHP
network
adv banner
Photoshop  Home Photoshop Drawing Techniques Wire Frame Background
rss

Wire Frame Background

Author: Sandy More by this author


Step 1.

Open a new document in photoshop of any size, I am using a 400x400 document for this tutorial.

Get out the custom shape tool ( image 1 )

Set the custom shape tool up as I've done here:

Make sure the "Shape Layers" option is checked

image 2

Now select the 'arrow 6' from the shape menu:

image 3

Go ahead and draw this custom shape near the center of the canvas as I've done here:

image 4

Now select the arrow path using the path selection tool ( image 5 ).

Press Ctrl + J on your keyboard to duplicate this layer.

Go to Edit->Transform Path->Flip Horizontally.

image 6

Step 2.

Select both of the paths, by holding the Shift key on your keyboard, and clicking each layer. Press Ctrl+ J on your keyboard to duplicate.

Press Ctrl + T on your keyboard, Right-Click anywhere on the canvas, and choose "Rotate 90°".

Result:

image 7

Step 3.

Select all of the paths, and click "Exclude Overlapping Shape Areas" from the top tool bar:

image 8

Result:

image 9

Step 4.

Double click this layer, and apply the following blending options:

Bevel & Emboss:

image 10

Stroke:

image 11

Result:

image 12

Step 5.

Duplicate this layer several times by pressing Ctrl + J on your keyboard, and position the images similar to what I've done here:

image 13

image 14

Step 6.

Fill the background with black as I've done here:

image 15

Step 7.

Select and merge your shape layers by holding Shift and clicking on each layer. Now merge these layers by pressing Ctrl + E on your keyboard.

Press Ctrl + U On your keyboard and apply the following settings:

Note: Make sure "Colorize" is checked

image 16

Result:

image 17

Step 8.

Press Ctrl + I (i) on your keyboard to invert the colors.

Press Ctrl + J on your keyboard to duplicate the layer, and go to "Edit->Modify->Flip Vertically".

Change the blending mode of this layer to "Vivid Light":

image 18

Result:

image 19

Step 9.

Select each layer by holding the Shift key and clicking on each layer, and then merge these layers together by pressing Ctrl + E on your keyboard.

Press Ctrl + T on your keyboard to get out the free transform tool, and slightly scale the shape down in size by placing your cursor near the top right corner of the shape, and dragging your mouse inward as I've done here.

image 20

Move the resized shapes near the center of the canvas:

image 21

Step 10.

Press Ctrl + J on your keyboard to duplicate this layer.

Go to Filter->Artistic->Plastic Wrap, and apply the following settings:

image 22

Result:

image 23

Step 11.

Change the blending mode of this layer to "Difference":

image 24

Result:

image 25

Step 12.

Press Ctrl + J on your keyboard to duplicate this layer.

Press Ctrl + U on your keyboard to bring up the Hue/Saturation window.

Apply the following settings:

Note: Make sure Colorize is checked

image 26

Step 13.

Finally duplicate this layer once more by pressing Ctrl + J on your keyboard, and change the blending mode of this layer to "Color Burn":

image 27

Result:

Wire Frame Background Tutorial: Final Result

I sure hope you've enjoyed learning this technique, and you should now be able to create very nice backgrounds for your signatures, and web pages.




Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Wire Frame Background"