Web Design Tutorials osCommerce Template Tutorials
New osCommerce Templates osCommerce Specials osCommerce Forums Search Our Site Contact Us Resources Web Design Tutorials
Web Designers Library- Tutorials and Articles
Tutorial Search
  Advanced Search
 
Tutorial Menu
 
 Video Tutorials
  · Dreamweaver
  · osCommerce
  · Installations
 
 Photoshop
  · Tutorials
  Photoshop Basics
  Special Effects
  Text Effects
  3D Effects
  Textures & Patterns
  Web Layout
  Drawing Techniques
  Color Management
  Photo Editing
  ImageReady Animation
  Miscellaneous
  · Articles
 
 Web Design Basics
  · Design Principles
  · Website Usability
  · Color Theory
  · Templates & Tuning
 
 osCommerce
  · osCommerce Knowledgebase
  Catalog Area
  Installation and Upgrades
  Administration Tool
  General Information
  Developers Section
What's New
Latest Tutorials and Articles
Video Tutorials
osCommerce Tutorials
Template installation with cPanel and Ipswitch
Photoshop
Photoshop CS3: Output Sharpening
Change Color on an Object
Sunlight Effect
Autumn Effect
Eyes in Green Pea Pod
Web Design Basics
A To Z About RSS
Elements of Great Websites
The Next Generation Website Model
Why Use a Web Design Template?
Web Site Templates and Their Benefits
osCommerce
SSL - This page contains secure and non secure items
Post-Installation
Security - .htaccess
SSL - This page contains secure and non secure items
Tax Proposal
Photoshop : Tutorials : Special Effects Last Updated: Apr 15th, 2008 - 18:38:37


Basic Grunge Sig
Author: Kevin
Authors Website: www.sigtutorials.com
Oct 18, 2006, 19:56

Email this article
 Printer friendly page
In this tutorial I will teach you how to make this signature:
Web Designers Library- Tutorials and Articles
Basic Grunge Sig


First create a new document, I did 300 X 140. Filter>render>clouds get out some grunge brushes and brush with black on a new layer. Now make a new layer and do the same with in white. Do this after 2 times each. Now keep alternating from black and white but switch the blend mode to overlay or soft light. -->Make sure you switch brushes often and do not brush to many times on the same layer. So far I have this:
Web Designers Library- Tutorials and Articles
Basic Grunge Sig


Now you want to pick a render, for this tutorial I will use this render: Render

Now free transform (Ctrl + T) and make it fit into the sig. Then duplicate it, make it soft light and reduce the opacity to about 40%, and merge (ctrl + e). This will give the render a slightly better looking colour imo.

Now duplicate the render once again and go filter>blur>motion blur. I have angle -27 and distance 92 pixels. Now duplicate this layer about 4 times. Move the layers on different parts of the sig so you get a result similar to this:
Web Designers Library- Tutorials and Articles
Basic Grunge Sig


Set the layers to soft light and move the render above all the layers.

Now what I like to do is brush a little bit more with grunge brushes above the render, still using black and white, setting the layers to soft light or overlay. This is my result so far:
Web Designers Library- Tutorials and Articles
Basic Grunge Sig


Now you want to colour the sig, to do this take the eyedropper tool and click the render.
Web Designers Library- Tutorials and Articles
Basic Grunge Sig


This will give you the colour of the render. Now make a new layer above everything, select some grunge brushes and colour the sig, setting the layer to soft light or overlay. Do this with different colours of for each layer, using the eyedropper tool to select different colours. I have 4 layers of colouring. Now I will go layer>new adjustment layer>colour balance.

Midtones: 26, 0, -30
Highlights: -43, 4, 14
Shadows: 0,0,0

Filter>render>clouds if you want on this layer.

Now layer>new adjustment layer>brightness/contrast. Brightness +5 and contrast +12 Result so far:
Web Designers Library- Tutorials and Articles
Basic Grunge Sig


Now what I like to do is merge all the brushing layers, including the motion blurred render, and duplicate the layer when it is all merged. You should have a background layer, background copy, then the render layer above that. Take the Background copy layer and go filter>blur>gaussian blur between 3 and 4 pixels.

Edit>fade gaussian blur, i set it to lighten, then i lowered the opacity to 75%. Then i duplicated that layer and set it to soft light, lowered the opaticy to 35 and set it above the render layer.

Now add a border, new layer above everything, ctrl + a, edit>stroke 3 pixel white, set it to overlay. Then new layer, ctrl + a, edit>stroke 1 pixel black.

Add some text, I'm awful at text, so i have no hints for this Final Result:
Web Designers Library- Tutorials and Articles
Basic Grunge Sig


Using the same method I also created this:
Web Designers Library- Tutorials and Articles
Basic Grunge Sig



Top of Page

 
Level Ten Hosting