Signatures and Banners
Signatures and Banners are similar in nature, so I figured that this tutorial would be best together. This is probably going to be one of my longer tutorial lenses here at squidoo that I have made.
You Need Photoshop
In order to follow along, you need photoshop
Adobe Photoshop CS4
Amazon Price: $642.49 (as of 12/27/2009)![]()
List Price: $699.99
Used Price:
Release Date: 10/31/2008
Usually ships in 24 hours
Step 1: Open A New Document

- Opening up a new document in photoshop is real easy.
- File
- New
- Then choose your settings.
Name: Whatever you want to call the file if you choose to name it.
Width: at least 200 Pixels
Height: at least 200 Pixels
Resolution: 72
Step 2: Choose A background Color

All you have to do is choose your color by clicking on the square boxes on the left where it looks like colors or on the right with the eye dropper. Then click on the paint bucket button on the left. Then go ahead click on your document with your paint bucket.
Step 3: Choose Your Rectangle Marquee

Make sure you choose the rectangle marquee and then click layers on the left and click create new layer icon.
Step 4: Drag Your Marquee

Drag your marquee across your screen. The example is shown above.
Step 5: Add Color

Now its time to add color. Choose any color you want. I'd suggest a color that is on the dark side though. Use paint bucket to add color to that area. As long as the marquee is still highlighted when you add the paint bucket to the square, the color will go inside of the box.
Step 6: New Layer

- Create a new layer and then go to
- Select
- Modify
- Select and then choose 8px as the option and then click okay.
- Then choose a color. I would choose a color that is on the yellow or bright side. Do not use white though.
Step 7: Another Layer

- Create a new layer and then go to
- Select
- Modify
- Select and then choose 5px as the option and then click okay.
- Then choose a color. I would choose any color you want.
Step 8: Add Bevel and Emboss to the 1st layer

- Lets take a look at the very first layer that we added. That is the bottom blue layer in the picture above.
- Go to layer
- layer style
- play around with your settings. What I have here is:
Style: inner bevel
Technique: smooth
Direction: up
Depth: 100%
Size: 5px
Soften: 0px
Now you can see the bottom layer is raised against the background.
Step 9: The Yellow Layer

- Select the yellow layer
- Go to Filter
- Blur
- Gausian blur
- Play around with the settings until you find the right look. Mine is around 1px.
The picture above is what you should have. It does not mean it will be exact.
Step 10: Add Bevel And Emboss To The Yellow Layer

- Make sure you still have the yellow layer selected
- Go to layer
- Layer style
- Bevel and emboss
- Choose the settings:
Style: inner bevel
Technique: chisel hard
Depth: 1000px
Direction: up
Size: 5px
Soften: 0px
Step 11: The Bottom Layer Again

- Its time to make the bottom layer to look like it merges with the yellow layer.
- Go to image
- Layer adjustments
- Hue/satuation and then play around with the setting until you get the right look.
You can merge it down if you want. It does not matter if you merge it down or not. Every time you create one of these, it may not come out the same exact way. I remember the first time I created this. I first created this in photoshop 5.0 LE. It has never ever came out the same exact way that the original one had come out, but it has come pretty darn close like the one above, but not 100%. The example of the originals are actually placed on my main website's forums.
Step: 12: Filter
- All I did is:
- Make sure that you have selected the top layer.
- Fillter
- Noise
- Choose your settings: monochromatic and gaussian. Play around with the amount. I currently have it at 30.
- Once that is set, then go to filter
- Blur
- Motion blur
- Settings should be:
Angle: 60px
Distance: 11
If it does not work right, play around with the settings until it does.
Make sure you click the eye on the background layer (thats on the left side) so that the background does not show. Remember that you can play around with hue/satuation on any layer you work with. Make sure you save your file as both psd and png file.
Did You Like This Tutorial?

Feel free to leave your comments here.
-
Reply
- Cynergy_Diva Cynergy_Diva Sep 10, 2009 @ 8:21 am
- Hi Melissa, I met you at myLot.
This is fascinating You have some great lenses Melissa. I'm interested in this kind of stuff specifically though. I can't afford Photoshop so I downloaded the GIMP software. Will these tutorials help with that?
xoxo
Cyne
-
Reply
- Janusz Janusz May 10, 2009 @ 5:18 pm
- Cool! well done on a nice & easy to follow Tutorial .. Certainly gets my Blessing :)
-
Reply
- Trekkiemelissa Trekkiemelissa Apr 16, 2009 @ 8:18 pm | in reply to Jimmie
- It can, but it may not come out the same. Things are in different spots. When I had originally made the original design of this, I did it in photoshop 5.0le which I got for free many years ago.
-
Reply
- Jimmie Jimmie Apr 16, 2009 @ 7:49 pm
- I don't have Photoshop any more. I want to learn how to use Gimp.I've gotten so far as downloading it! I'm sure this tutorial would work with it as well.
-
Reply
- 0ctavias0fferings 0ctavias0fferings Apr 16, 2009 @ 2:46 pm
- Very nicely done, clear and easy to follow 5* for sure
- Load More
by Trekkiemelissa
Hello my name is Melissa. I also love Star Trek and used to be addicted to star trek simming. With the writing of articles online, that addiction has...
(more)




