[Mw] Icon making guide

[xchaosdragon666x]

just got bored and decided to make my first tutorial for morrowind
A transparent icon guide
Just becuse it took me forever to remember out how to do transparency's so i made my self a private guide
and thought i would share the information
And dont know how to uipload it to the site here so is it okay if i post it here? if not i will remove the guide

Xchaosdragon666x's Small icon making guide
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Legal info
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

This document is copyright ©2005 by Don Vanderwater, AKA "Xchaosdragon666x's" and
"Xchaosdragon999x." However, all trademarks and copyrights found in this document are
Owned by their respective copyright and trademark holders. No infringement of
Copyright is intended. This document may be printed, in part or in whole, for
Personal use ONLY. You may not take any part of this document and display it
Anywhere without written consent from me, in the form of a e-mail. My e-mail
Address is at the top and bottom of this document. The following sites have my
Permission to post this Guide:

Silgrad's Tower - http://www.silgrad.com


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

The Guide
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


All these steps refer to Photoshop CS.
And can be done easily to my knowledge in Photoshop 7-9. Any thing that uses the magic

Wand tool.
They can be made without the tool but it makes it a lot easier.

Okay first try to take a good screenshot of what you want to make an icon for
I.e. Say you want to make a icon for a axe you just made.
Make sure when taking the screen shot from the TES CS. Or the modeling program.
What ever you want to be transparent should be filled in with gray, blue. Or what ever

Color your modeler uses for empty spaces.

In milkshape it's blue since that's what I use. I'll refer to blue as the blank space.
Take a screen shot of what you want the icon to look like. Take into account that the

picture will be small. And most likely wont capture to many details.

So take the screen shot so that there is a good amount of blue around the item.

Now that that's is done I'll explain what to do in Photoshop.

Start Photoshop.
Then File> open the name of the picture you just made.
Now go to the magic wand tool. And select your blank space Blue in my case.
Now rightclick> similar.
Repeat till all of your blank space is selected I.e. What you want to be transparent.
Now rightclick>select inverse. Then rightclick> Layer via copy.
When you are happy with what you want as the icon. And that it has it's own layer.
Delete the back ground layer,
Now the last few steps are. Image> image size.
Then make it 24x24 pixels. You may have to unselect Constrain size.
Now the last steps are. File> save as> targa .tga. And then name it what you want the

Icon to be.
Example
Don_DAxe_01.tga

Congrats you made your first alpha enabled icon. AKA transparent icon

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
INFORMATION
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
I know that this is not the best written guide in history. Considering some of the

puncuations are off. And contains some spelling errors.

But if someone else wants to spell check and punctuate. This guide feel free
to email the new version to xchaosdragon666x@gmail.com
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

CONTACT ME
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Xchaosdragon666x@gmail.com
Xchaosdragon666x@hotmail.com
Xchaosdragon666x@yahoo.com
Xchaosdragon999x@aol.com
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

PERMISSION'S
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Silgrad's Tower http://www.silgrad.com

Edit: some minor spelling and puncuation repairs

[Razorwing]

If you flesh it out and make it easier to read we might be able to feature it in the Guides & Tutorials section on our website. I'm sure it would be handy to have a Photoshop tut as opposed to my Paintshop Pro tut I wrote last year.

[xchaosdragon666x]

Yes sir i think i can do that for you guys as my controbution to silgrad


But what do you mean by fleshing it out
extending it?
or more detail?

[Razorwing]

Originally posted by xchaosdragon666x
Yes sir i think i can do that for you guys as my controbution to silgrad


But what do you mean by fleshing it out
extending it?
or more detail?

A paragraph-style text is easier to read. Pictures help immensely too. Explaining a step thoroughly and giving examples can make it more easily understood too, as you're communicating to someone who knows less than you. Writing it in Word and using its excellent spellchecker might also be a good idea.

[xchaosdragon666x]

But then i would have to make it html and i dont think i can upload that here and i dont know html but i could take all the ref pic's and edit them to show what i mean but would need some one else compile it i dont have my adobe golive anymore lol


But do you know a easy html building program? that i could use to make the guide

Edit: NVM im downloading the adobe golive trial and ill use that but any recomendation's on where i can host the html guide?

And if i have to ill pay some one to paragraph it and spell check it maybey my brothers girlfreind she transcripes stuff for hospitals

[Razorwing]

xchaosdragon666x: If you want you can start up an account on gallery.silgrad.com and upload pictures there; perhaps to the Faq album, or to a new personal album that all users can create themselves if they want. Those are auto-thumbnailed and can then be included in your forum posts where you want them to go (more info here). There's a tutorial on how the system works on the Faq board. Here's a direct link to it. But if you've used Coppermine before I'm sure you'd feel right at home there.

If you want I can also set up an account in our content manager system so you can add your tutorial directly to the website. Those articles uses full, raw html, so it's not very user-friendly, but on the up side if you can write a html-formatted text by hand you can make an article look any way you want. All the page header and other stuff are added automatically so you'd just need to format the article text.

Good luck!

[xchaosdragon666x]

Thats what golive is for its kinda drag and drop web builder and once you hapy with how the page looks you can click the html tab and see that raw html code

Edit i got all the pictures taken just gota wait till golive is downloaded lol

And it's step by step so any "moron" no offense can understand it

[xchaosdragon666x]

Okay got the html completly done the back ground could be better so could the font

but this is what i came up with and not sure how long this link will work
http://photobucket.com/practice.php?id=42gbt
plz keep in mind this IS the first html i ever made so let me know what you guys think

[xchaosdragon666x]

can some one recomend where i can host the html where i can update it when i want with out going through some one?

[Razorwing]

I've PM'd you info about our Content Manager system now. Good luck! :goodjob: