Yes, when you are thinking at logos, put on the top of needs the usability. On web design you need to think at usability like a face of accessibility, but when is talk about corporate identity, this affect just the client use, the owner of logo. Along with the final logo images, you should be able to provide the resource file of logo, for future editing. A logo resource isn’t a png or a big resolution image (like many clients discover that after a while). Depending on how your contract was negotiated, the client can pay an extra amount for full logo resources. Paths are the heart of logos, because those give you possibilities to engrave a logo on a pencil or to make a billboard on the block without to lose quality.
In this tutorial you can learn how to use the Path Tool and shapes to make resizable logos (path / shape) in Adobe Photoshop. Because of monogram logo tutorial done in Adobe Illustrator i had many visitors coming from search engines looking after “monogram logo” keyword, what show that are a many peoples around looking for monogram ideas. So, let’s make another monogram logo, but with a different software and style.
For this tutorial i will use an idea developed for a client some time ago. Instead his original company name, use now a generic Clock Starter company name, from where i isolate the CS characters for monogram. The CS letters will incorporate a clock look. To achieve that, i am using simple paths like circles or rectangles with “substract” and “add to area” options.
For beginning, start in your Photoshop a new document 640 x 480 px. Set the background color to #202020. Add a noise effect as it is shown bellow:

Make a new layer and apply a soft brush with 675px diameter, opacity to 76% and a light grey color. Then, set the blending mode of the layer to “screen”. You can play here with layer opacity. Mine is set at 70%.

Your background should look like in this image:

Before to start the play with paths, make 2 guides on horizontal and vertical positioned at 50%, what mean the perfect middle of the work area.

Now, select the Ellipse Tool and draw a shape of circle with 375px diameter and #505050 like color.

Select the “substract from shape area” option for shape, and draw another circle with 319px diameter.

Align the circles. To do that, use the Path Selection Tool (A – same key like in Illustrator), and select both shapes while you press the shift key. Align the circles to center.









Tweets that mention How to make a monogram logo in Adobe Photoshop | reADactor -- Topsy.com
How to make a monogram logo in Adobe Photoshop | reADactor | PhotoShopped
How to make a monogram logo in Adobe Photoshop | reADactor « Web Templates
Crear un logo con Photoshop | VisualXtudio
Great tutorial, but why would you create a logo in Photoshop? You could do the same thing in Illustrator.
Thanks.
Yes, in Illustrator you can do the same. But then, why? From same reason that almost all the png icons are done in Photoshop and not in svg softwares. For web uses, at small sizes, standard vectors don’t look so nice like paths / shapes from Photoshop (even you import a vector like smartobject).
On the other hand, for a Photoshop user, a svg software isn’t quite handy. And not in last, are clients who ask about psd resource file and not ai, eps, cdr etc.
In fact, this tutorial was just a reason to talk about path tool from Photoshop.
I have never had a client as for a logo as a .psd that is retarded. you should never make a logo in photoshop it’s a waste of time.
You must not know much about Photoshop.
You should take a better look at photoshop. Pretty dumb thing to assume everybody -who know more about photoshop then you- is retarded
You should not make a pixelbased logo, good thing you can create vector files in photoshop;)
How to make a monogram logo in Adobe Photoshop | meshdairy
uberVU - social comments
60+ Fresh News for Web Designers and Developers | tripwire magazine
Great Tutorial.
many thx
Nice tutorial… but it could have been finished in Illustrator in a few steps.. at least the circular logo. Then it can be exported to PS as a smart object and done the extra effects… so u have the psd file as well
but yeah… path tool neatly used.. i agree..
thanks to both.
Richie, do not forget that a vector smartobject isn’t quite a “resource” because is pasted with the paths “combined”.
I agree with everyone. Do it in Illustrator first and then bring it into Photoshop via smart objects or paths. There, you will have a vector version and a web/pixel version and can produce high resolution versions later on in the future.
Great article.
Thanks.
Regards,
logo design services
Very nice tutorial.clearly explained.thankyou
I am grateful for this clear tutorial. Now I know how my son can create a logo in Photoshop while I can’t get beyond resizing an image.
As a relative beginner in Photoshop this tutorial was spot on. I was attempting to create a very simple monogram style logo which I have now managed to do. Thanks for the clarity.
Nice tutorial. I like that you were so clear in the instructions.