A very common task among the many people out there who are starting up projects or companies; well that’s what I’m going to teach you how to do in this very simple tutorial! No special jargons or lingos to confuse you but good ol’ English so that everything’s crystal clear.
First of all, we’ll set up a 512 x 512 canvas (it should be big enough for most logo applications) with a 72 dpi (dots per inch) setting and an 8bit RGB color mode with a transparent background.
With that up, what we should consider next is the theme of the logo. Is the project or company professional/corporate-like, creative or perhaps energetic? This has to be addressed to be able to convey the most appropriate way the project’s/company’s mission can be visualised.
For example, in this tutorial, I want something that conveys something interpersonal (perhaps something related to the services industry) and also expressing creativity. Things that come to mind are people, art, music, the internet, etc. For this tutorial I’ve picked a humanoid-inspired design using curves to convey that.
Select the Ellipse Tool (Shortcut key: U) and drag out a circle while holding the Shift key for a perfect sphere. In the Layers window (Shortcut key: F7), double click the Layer thumbnail (the square on the left) and choose a colour that you like – I chose a blue color (#3BCCF0).
Next, we’ll simply rasterize the layer by right click on the layer and select the Rasterize Layer command. This ‘cements’ the shape and color we want for the ellipse.
Select the Eyedropper tool (Shortcut key: I) and sample your chosen color on the circle. You’ll notice that the foreground color has been set to the sampled color; this will be convenient when we create more shapes later on which will use the sampled color by default.
Next, we’ll want to continue the curvy theme and stick with the Ellipse tool for a bit more.
Drag out a bigger circle this time, approximately 4 times the size of the original circle. You’ll notice that the new circle already uses the color you chose earlier on.
With that draw, rasterize the new circle the same way you did with the smaller circle. The next part will get a little tricky in order to get the desired shape.
Select the Elliptical Marquee tool (Shortcut key: M) and drag out a rough oval so that about ¾ of the circle sits within the selection area of the elliptical marquee (you might want to increase the size of your window size of your canvas). Feel free to reposition the selection so that it’s somewhere in the middle (horizontal-wise) of the circle.
Once that’s done, hit the Delete key and you should get a shape roughly resembling uplifted arms. Deselect the selection marquee by locating it in the menu bar – Select > Deselect or simply using the shortcut keys Ctrl + D.
Next, select the Move Tool (Shortcut key: V) and activate the Free Transform tool (Shortcut key: Ctrl + T) located in the menu bar, Edit > Free Transform. A rectangle with squares around should appear; now right-click within the rectangle and you should be presented with several transform choices. We’ll be using the Skew transform for this.
In the parameters, set a vertical scale of 150% and a vertical skew of 10 degrees with rest of the parameters left at 0. Confirm the transformation by hitting Enter.
You should get something resembling an arm lifted higher than the other.
Next, make a duplicate of the ‘arms’ layer either by locating the Duplicate layer command in the menu bar, Layer > Duplicate Layer ..., or simply by dragging the ‘arms’ layer over the icon resembling a curled paper in the Layers window.
With the Move tool still selected, use the Free Transform tool and right click on the duplicated layer. Select the Flip Vertical command and you should get an inverted set of ‘arms’. Move the shape by click on it and dragging it down so that it roughly resembles ‘legs’ (You might want to hold the Shift key while moving the shape to lock the movement in a single axis for greater precision).
With the ‘legs’ layer and Move tool selected, activate the Free Transform tool and set the parameters to a horizontal scale of 75%, vertical scale of 120% and the rest of the parameters left at 0. Confirm the transformation once that’s all set and feel free to reposition the legs to get a proportionate overall look.
If everything went well, you should get something resembling a humanoid figure.
At this point, you might want to position this ‘character’ in the middle so that there’s a balance in empty space in the canvas. To select multiple layers, while holding the Ctrl key, select the non-highlighted layers.
Now, with the Move tool selected, drag your ‘character’ upwards so that it’s positioned somewhere in the middle. Again, you might want to hold the Shift key for precision purposes.
If you’re happy with the shape of the logo, you’re all set to merge the layers! To do that, simply right click on any layer (while the wanted layers are highlighted) and select the Merge Layers command ... Voila! You should have a single layer in your layer window now.
Here comes the fun part: the ‘special effects’ to spruce up the flat image. Assuming your logo is following the Web 2.0 style, this part would prove both useful and relevant for other web elements that you’ll want to create.
We’ll start off with a typical glass shine. Firstly, create a new layer (Shortcut key: Shift + Ctrl + N) by locating the new Layer command in the menu bar, Layer > New > Layer. A new layer should appear in the Layers window. Now, using the Elliptical Marquee tool, drag a rough circle on the upper region of the ‘character’.
Once that’s done, fill the selection with a white color using the Paint Bucket tool (Shortcut key: G) or the fill with background (Shortcut key: Ctrl + Backspace), assuming the background color is white.
An extra tip: the Alt + Backspace does the fill with foreground command.
Deselect the marquee; you should now have a white circle (it doesn’t need to be perfect). The next part may get a little tricky, so pay attention to the steps.
With the white circle layer highlighted, while holding the Ctrl key, and click on the ‘character’s’ Layer thumbnail (it’s the little preview square beside the layer’s title). If done correctly, you should get a marquee outline around your character on the canvas.
Next, inverse the marquee selection (Shortcut key: Shift + Ctrl + I) by locating the inverse selection command in the menu bar, Select > Inverse, and hit the Delete key. If everything went well, you should get something like this:
Next, right click on the ‘white’ layer and select the Blending options command. This should bring up a new window presenting you with various ways to modify the layer. Check and select the Gradient overlay section. Set the parameters as such:
Gradient (by clicking on the drop-down arrow): Foreground to Transparent
Style: Linear
Angle: 120 degrees
Scale: 100%
Within the canvas (with the Blending options window still open), you may drag around the gradient to achieve the desired look. You should get something resembling a smooth sheen over the ‘character’.
To refine the Web 2.0 look further, open the Blending options window for the character layer.
Check both the Inner Glow and Stroke sections. Select the Inner Glow section and adjust the choke and size parameters to your preference. The color should be a lighter shade of your character’s color. For mine, I’m using a light blue (#BEFFFE) and a size of 10 px.
Next, select the Stroke section. Reduce the size to 1 px and Inside position. I chose a gray color to minimize the contrast yet adding a subtle border to the character.
With those blending options adjusted to your desired looks, your logo is as good as complete!
Should you want to add text (Shortcut key: T), you can get creative by positioning them at interesting spots on your logo. Here are a few ways:
So that concludes this tutorial on logo creation! Many of the methods mentioned in this tutorial can be applied to different situations, so get creative, create your very own shapes and all the best!
Source: iGuides.org Webmasters Talk