Photoshop Tutorial: Make a 'DEVPPL' avatar

An avatar is a little image for your profile in forums. Here on DEVPPL, the avatar is displayed below the username to the left in every thread. I'm going to show you how to make a simple, but nice avatar that you can use there in the DEVPPL forums. If you aren't a member already, click here to register.

Most avatars are 80x80 pixels, so I will use that format when I do this avatar. First of all, make a new image in Photoshop (ctrl+n), set width and height to 80 pixels and click OK.


Click on the foreground color and enter EFEFEF in the # -field, then click OK.



You should now make the whole image in that color, press CTRL+Backspace to do that.


Press on the Rectanguar Tool (Hotkey: U), then select the Rounded Rectanguar Tool form the top of the screen.


Then set radius to: 8px
You will find the radius field right next to the Rounded Rectangular Tool which you just clicked on.


Click and drag to draw an rectangle in your image, try to get only one pixel on every side of the rectangual (press CTRL+Z and do it again until you are pleased). Your image should now look like this:


Now click on Layer > Layer Style > Stroke (or doubleclick on the layer and click on Stroke)
Set size to 1 px and set hte color to black, then click OK.


You should now have black border around your rectangular. If the border looks wierd, is it probably Photoshpo that is showing the outlines of the rectangular, press CTRL+H to get rid of it.


We should now do a box that you can write your name in. Click on the Rectangular Marquee Tool (Hotkey: M). Click, drag and release so you get an area like this selected:



Add a new layer by clicking on the little 'Create a new layer' -icon down right:



Press 'D' to reset the colors (black/white), press CTRL+Backspace to fill your new selection with black.


CTRL+Click on the layer with the rectangular box in to select it, press CTRL+SHIFT+I to inverse the selection, press DELETE to delete the black color that's outsite the rectangular box, press CTRL+D to deselect. You should now have an image that looks something like this:



You can find a Opacity field in the top-right cornor of the layer-window that you can find in the bottom-right cornor of your screen, set the opacity to 33% and press ENTER.


We will now make a border in the top of the grey field we just created. Right-click on the layer you just changed the opacity for, click on Duplicate Layer then OK.


CTRL+Click on the new layer to select it, press DOWNARROW once to move the selection 1 pixel down. Press DELETE. Your image should now look like this:


Add some text (for example your Username here on DEVPPL) in the grey field and maybe some image above that, and you're done.


Here is my final result:



IF YOU LIKED THIS TUTORIAL, PLEASE REGISTER AND HELP DEVPPL GROW

sweet man!

but i like the picture of me better!

lol.. yeah, that hair is pretty sweet i must admit

- pure -

it has gotten a lot bigger too!! i will try and upload a new one soon!

Cool...

I'll be doing one too

Edit: Razz, you made a mistake. You said CTRL+I to inverse selection. It should be CTRL+SHIFT+I.

You're right, its fixed now, thanks.

Made two new images, isn't this what you are looking for =)



Or if you really want to keep that photo:


But I think that smilie looks like you

Razz, could you find me a matching smilie as well?

Well, we got ReFredz the Modder:


And we got ReFredz the Lover:

LOL! Where do you find high quality icons like that?

The same guy that made the icons for the menu here on DEVPPL. www.rokey.net

I must admit, he's pretty good! Does he use anything else besides Photoshop?

I don't know what program he uses, but he's good =)

awesome man!!!!

im gunna use the first one!



EDIT:::::::::
for some reason i have the option to make this thread "solved"
bug webmaster?

It kind of looks like you Phate =)