Creating shaped based wallpapers / images

Author	Newanz
Date	Apr 03rd, 2008
Status	Done [?]

Create great looking wallpapers and images using abstract shapes.

Welcome

In this tutorial for Adobe Photoshop we are going to create a wallpaper or image (for any size) from an abstract shape.
We will use the Warp tool and styles, get comfy and I will explain you how to make this in 9 steps.

Jump right ahead and look what the result of this tutorial could be!

The above result is a quite basic result, some more advanced results will be what we, at Newanz, created in the Shaperz Wallpaper Series.

Step 1: Creating a psd file

Now we will begin the tutorial. Let's start of with creating a new PSD file. Because this is probably your first try at this give the psd a width and height of 500 pixels. Any other size is good too! Some like to set the background to default white, but I always leave it transparant. If I need a color background I will create it myself, but for this tutorial you can leave it white.

Step 2: Finishing up the psd file and layer order

Alright lets continue. Now make a new layer (Layer » New » Layer), so you have a (white) background layer and an empty second layer above it.

Step 3: Drawing a line!

Alright we have two layers, select the top layer, that's empty, and grab the Brush Tool and make the following changes to the settings. Set the color for your line to black or a good contrast to your background color.


Continue by holding shift button on your keyboard and click on your image, hold the button and make a small straight line like this.

Your result will be something like this.

Well that was not difficult at all, no that's the next step!

Step 4: Creating the shape

Alright, you could ask yourself right now, how on earth is that little line gonna be that thing I just saw in the beginning!? Ah well your not the first to ask. Select the layer which contains the line you just draw and go to Edit » Transform » Warp. You might not know this tool, but you can do amazing things with it!

Now you return to your psd file and see your line has just been fitted with new selection points. These can be used to change your line to become something like the result of this tutorial.



If you haved done the How-To and don't know how the Warp tool works I recommend you will look at the How-To first before you continue.
Now create a shape you want using the warp tool. I will use the "simple" shape in the image below.

Press the accept button when you are happy with your shape. When you are not happy and want to start over again press the Cancel button, that's left of the accept button.

You can be busy with your shape for hours... Well only if you are a real annoying perfectionist like me.

Step 5: Coloring your shape

Now we got ourselfs a great shape only a little boring because it's only black or the color you choose. But we can change that!
Go to the layer palet and open the Blending options window. How? Well by double clicking on your layer icon or right click on your layer and then click on Blending options.



Now set the following settings in the Blending options window. To know what these settings do, read the section above.







Now we got that done, we can be glad it's almost done. The shape itself is now done, in the following steps we are gonna add some effects to make it stand out more.

Step 6: Top effect layer

Create a new layer (Layer » New » Layer) and make sure it is the top layer in your layer palet. While selecting the new layer go to Filter » Render » Clouds then go back to Filter » Render » Different clouds untill you get a patern of white and black that's evenly spread around your entire workarea (500 pixels x 500 pixels, or what you have selected). What you should see is:

Now we return to the filter section, Filter » Artistic » Cutout and apply the following settings:

Click ok and now go to Filter » Brush Strokes » Dark strokes and apply the following settings.

Now your result could look something like this:

Back in the main screen your shape will be invisible, oh no! But wait, we will return it.
Go to your layer palet and change the Blending type to overlay. No don't return to the Blending options. Look in the image to see how to get the option.

Change the opacity (the textbox next to the Blending type) to 40%.
Your result will be a darker shape then you had before with some random shapes floating through it.

Step 7: Stripes

As you can see in the result image there are some stripes in the shape, how to make them? Grab the Erasor tool and apply the following settings.

Select the "shape layer" and use the erasor tool to "cut" away some "stripes" of the shape, as the opacity is only 10% it will not cut everything away. Letting you end up with something like this.

Step 8: "Extra!" layer

If you download the PSD file you will notice that there is a layer called "Extra!". (The download section is at the bottom of the page)
What is it? Well at first even I was not sure, I just randomly created this in class one day, but if I remember correctly I went a little something like this.

Create a new layer (Layer » New » Layer), then grab the Brush Tool, again, and apply these settings.
[quote]I you do not have the Starburst (Small) type of brush; click on the arrow to the right so a dropdown appears, then click on the Assorted brushes option. In the pop-up press Append, so you will not loose your current brush set.[/h3]


Now create a straight or curved (along side your shape) line line over your shape. This will add the figure from the Extra! layer. Now what you can do is use the Disort, Edit » Transform » Disort , or of course the Warp Tool, Edit » Transform » Warp, to twist your shape line.
The last thing you should do is to change the Blending Type to Linear Dodge (or for pre-CS3 users: Screen or Color Dodge, what you think is best for you image).

Step 9: Finishing up

What bugs me the most and you might have noticed is that the edge of the shape (the more abstract the more it's there) is really ugly.

• Use the Erasor tool at around 20% opacity to gently erase to edges and make them smooth.
• Or do what I do and make the shape at a size 2 or 1,5 of the size you actually want to create. Then shrink the shape (with all layers that you made) to the right size. Most of the times this works fine.

Your done!

Well that is it. We are done. I hope you like it and I hope you keep experimenting with these tools. The results can be amazing!
There is always the option to download the PSD file used in this tutorial, so you can see for yourself what we did.

Result

Downloads

Click on the link(s) below to download the selected file.

• Tutorial PSD, so you can look deeper into the settings.

No comments placed yet, be the first!