Tutorial: Create an ATS Avatar - by Im A Marty

I was asked by someone if I could write a tutorial for creating Avatars for ATS. So I came up with a basic one - hope you like

1 - Load images in Photoshop.

ATS Logo
Background Image




2 - Go to the toolbar - click on "Image -> Image Size"

Resize the background image to a Height of 320 or a width of 160.

For good quality - type "150" for resolution, however "72" is fine for the web.



3 - As you can see, this resizes the image to 100%, approximately to the size of the avatar



4 - Go to the toolbar - click "Image - Canvas Size". Resize the canvas to exactly "320" height and "160" width if it hasn't been done so already. This allows for for the canvas to be the exact dimensions, without making the image any smaller.

5 - Go to the "Layers" box, and "Create New Layer" by clicking the second Icon from the right.



6 - This creates a Layer "Above" the background image. Cut and Paste the Background image so its the highest as a layer. On the layer below, colour it in black (or the colour of your mini-background). You can click on the "eye" to hide or show each layer.



7 - Now that you have the background as the highest layer and the Black on the layer below, do the following.

Go to "Select -> Modify -> Contract".



8 - Contract by "6" pixels, press OK.



9 - As you can see, the marque has shrunk, by exactly 6 pixels.



10 - Go to "Modify -> Feather". You can also do this by hitting "Alt + Ctrl + D" on the keyboard.



11 - Feather the Radius by "3" pixels.

This allows a smooth transition between the top layer and the layer below.



12 - Go to "Select -> Inverse". You can also do this by hitting "Shift + Ctrl + I" on the keyboard.



13 - The marque now has selected the space "around" the image. Its basically a border.

14 - Now press "Delete" 3 times. This will make the border black. You now have a smooth transition from the background image to the black layer below.



15 - Now load the ATS Logo. Make sure that its just the "Black" area that is selected.



Cut and Paste the Logo onto the main canvas. Press "Ctrl + X" to cut, select the main canvas, and press "Ctrl + V" which pastes it. It should load as the 3rd layer above the Background Image.

Now right click on the "ATS Logo" Layer on the main canvas, and select "Blending Options".

16 - Select the "Bevel and Emboss" Blending style on the far left column. Now this changes the effects of the ATS logo. Outer Bevel, Inner Bevel, Emboss, and Pillow Emboss. There is a fifth, however I can't get good effects from that one yet.



17 - Now select the "TEXT" tool, Its the "T" on the column below.



Type your name, or whatever you wish to write. Select the Font on the toolbar Above - along with size and other properties.

(I recommend downloading fonts from DaFont Website and installing in the "Windows\Fonts" directory)

18 - Right click on the Font Layer, and Select "Blending Options". Go to "Color Overlay", select a plain color to fill in the Text. You can also play around with "Gradient Overlay", "Pattern Overlay", "Drop Shadow", "Inner Shadow", "Outer Glow", "Inner Glow", and even "Bevel and Emboss". All the features of "Blending Options" allows for cool text manipulation.

"Stroke" outlines the text. I have selected Black for this tutorial.



19 - You now have a basic design, so now its time to save it for Web viewing.

Click on "File -> Save for Web & Devices..." or click on "Alt + Shift + Ctrl + S".



20 - Select the quality to "70" as this allows for highest compression without loss of quality to the image. The file size is suitable for the Avatar.

This is the final image.



That concludes a basic ATS Avatar.

Thx

[edit on 7/2/2008 by Im a Marty]

Good stuff, I'm sure this will help many people.

reply to post by Im a Marty


Starrrrred and f f f f flagged.

Excellent stuff my good man...

MonKey

Great tutorial man. This just what I have been looking for.

Again, starred and flagged!

Glad you liked it Was a tad time consuming, taking snapshots of menus' were a nightmare (Holding mouse button, whilst at the same time hitting the keyboard combinations).

Hope some people can create some cool avatars from this

Thx

Originally posted by Im a Marty
Glad you liked it

Was a tad time consuming, taking snapshots of menus' were a nightmare (Holding mouse button, whilst at the same time hitting the keyboard combinations).

lol I know what you mean, I've done several of these photoshop tutorials for BTS and it's very time consuming.

Excellent tutorial! Saved to bookmarks on my comp. Star and flag to you.

Now what if I cannot afford photoshop? Are there any free programs that I can do the same with? Please help me I really need to make a decent avatar and dont want to take up too much time from any members to do it for me. Thanks so much!

You can learn and download GIMP. It's a an open source (free) program that can do most all photoshop functions. From what I understand it doesn't operate exactly like PS but it can be learned like anything else.

Hmm i can't get the ats logo bit to work at all, any tips?

Wow!

So there's nothing to this!!!!

Originally posted by Smugallo
Hmm i can't get the ats logo bit to work at all, any tips?

I see that you've managed to work it out? All OK???

Originally posted by dgtempe
Wow!

So there's nothing to this!!!!

*removes dgtempes' avatar* hehe joking! It is quite easy once you get used to it. I need to work out now how to make actions and other 'layer' type manipulation. Not bad for self taught I thought

PS... Your new avatar is ready

reply to post by Im a Marty


Dude, I meant to ask you...
Where did you find the pics you used for my avatars?
That is incredible!

Originally posted by wu kung
reply to post by Im a Marty

 

Dude, I meant to ask you...
Where did you find the pics you used for my avatars?
That is incredible!

I used Deviant Art.

Heaps of cool artwork there

Thx

Hi there.

Just a quick line to say nice job with the avatars.
Also i was wondering if you could help?

I am having a crack at creating my own avatar,but i am having difficulty finding the ATS logo to use on photoshop.
Could you point me in the right direction?

Any help greatly appreciated.

Thanx.

reply to post by scobro


I've asked for the logo to be put up in PSD format (photoshop) however many just save the image that appears on the top left corner of the forums. If you want a bigger version (I had to re-draw it) let me know and i'll post a link to it.

Thx

reply to post by Im a Marty


If you could post a link that would be awesome.

Thanx for your quick response,and thanx for all the info
regarding the avatars.Can't wait to have a crack at it.

Here's the image..



If you can't save it - here's the link to it instead.

ATS Logo

Thx

Nice one.

Thanx very much.

Thanks dude, I may or may not make an avatar but I know a little more about photoshop now.

Star+Flag for you .

-Will

Originally posted by Basilis
Thanks dude, I may or may not make an avatar but I know a little more about photoshop now.

Star+Flag for you

.

-Will

Thanks Basilis! Much appreciated

Heaps of Photoshop tutorials on the web - explains a lot of features which are duley ignored sometimes! Give it a whirl

Thx