Hey guys this is snowleopard2008, Jack here. And this tutorial is on how to make a Adobe CS4 Icon in Photoshop. I am going to be showing you how to make a Photoshop icon in Photoshop and the finished product will look like this. This is what it will look like in the end and so yes, get started.
Now I know this has been done may times but I just want to do it again for those who that need clear instructions or whatever. So what we want to do is go to File New, name it CS4. Make it—make, so everything the pixels and make everything 100 x 100 pixels resolution, everything else, let’s just leave it the same, click OK.
Now you can get this white box. Change your Gradient tool to a Photo bucket tool by holding down here and then selecting and then go to this block box, type in 2F64AA as a color code or hash. And this is for Photoshop, it’s kind of blue but you can also get like a design, illustrator, flash and other icons. Make it blue and we want to do next is get a new layer. Make a New Layer, sorry my mouse is too fast. New layer called Layer1, leave everything on the same, just make them bode, overlay and if you want just make it simpler, use that. This gray color, if you don’t choose to use this, it’s the same thing, just use the hash code here, fill it in with 808080 as a hash code for the color. And now you have this neutral gray. As you can see you can not really tell a difference between the color did not change and that so is supposed to happen because it’s a neutral gray, so it won’t do anything to the color.
Now what we want to do is morph is manipulate this grayish color and overlay on top of the background to get your like lighting effect on the CS4 icon. An example of this, see this kind of like colliding effect here? What you want to do is emulate that using in the Filter Render, make sure you have the layers one that you like by the way and go to lighting effects. And from there, just manipulate these little—I’ll manipulate it a little bit and I should reverse this.
And we want to do—have something like this. Something like this, maybe a little bit less white at the top, so, you can just play around with it. You do not have to go with the way you have the first time. I will be going with this, this looks like a nice combination, so click OK. Now you have this kind of, gives you more of the gray layer, so the gray layer is now partially a gradient, it’s like whites, a little of on whiter here and a little gray have done there. So it kind of, so the first layer filters as upon the top layer or the bottom layer which is a background layer which still unchanged.
So what you want to do now is make the text. Go to Text tool, click anywhere opps, okay type in p—Capital p and lower case s, it’s really small because you can’t see because it’s a size12 font, make it myriad pro, bold; make it bold and make size 72 which is the biggest if you make it.
And then now, what you want to do is you want to go to the; select it, oh wait! We have to change the color. Can’t forget to do that. Select the text, go in here and make the color in this hash, make it 28201D, again, I will have these annotations on the video or at the video after. So you do not have to go scrambling and see what’s on my screen. I think you can see it since I’m recording in HD. So it is 28201D and it’s kind of blackish, brownish, well not brownish but blackish, brownish, really black color, I do not know what you call that. And yeah I just wanted to that. You do not want to make it bold. Semi-bold, semi-bold looks good. Okay, so yeah, semi-bold. And then, now you what you want to do is align it. So go back here and click it and press command all, command A for all and then go here and select this one which is, which is a line in the middle horizontally and then they are aligned vertically. There you go, this—then the letters is snow perfectly aligned within the whole thing.
So, now we want to do is give the text like a; some subtle layer effects of text and we want to do is right click the text layer and go to Blending Options, getting Inner Shadow and Bevel and Emboss. Inner Shadow make this 108º and make this 53 for Opacity. You can also drag the sliders but I think this is more precise and then we want to do is on the Bevel Emboss, you want to make the Depth 1, this is 1, this is—Size is often are both 1. 108º here, 32º here. Sorry, I‘m reading from this, I want a tutorial to give me the exact values here. Opacity, make it 18 and Opacity down here, make it 8. So you see I have all that, press OK and there you go, you have this, a very close reconstruction of the Photoshop icon.
I am not shy to make it 5.12 version because you have more pixels and definitely you text needs to be bigger and I do not think Photoshop supports text bigger to size 72. So you might have to make a 72, make it drag—shows the Transform tools and drag the text just a little bigger.
Now what you want to do is kind of save it. I already have a copy over. I have copies of it. I think this one looks better, so I am going to save it CS4.psd and I am going save another copy as a png so I can use it. You can use these icons for pretty much anything like buddy icons, Avatars, you can make them a little bigger, add the lighting effects, add some text and you have your own—make yeah—you have your own iphone wallpaper. You can do it for a lot of things. It’s a great tool and the color like the background of it, it just looks really nice. Really nice lighting effect and it looks great almost in any occasion. Let me save it.
And that is it. So I am done and thanks for watching this video. I have more videos for you guys up soon. Please also internet my—and my giveaway for two Apps, you can only enter for one, Please just write as followed, please watch the videos for more information. Also follow me on twitter, I am twitter.com/snowleopard2008 and on Facebook, the snowleaopard1, so yeah. Thanks for watching this video and I hope you all have very nice day.
Transcription by:
Scribe4you Transcription Services