ICONS by Crazyrussian

[CRAZYRUSSIAN]

I got lots of requests from people to show them how I make my icons, so here, I took lots of time to make this just for you guys, hope this is useful and instructional.

I use photoshop and a wacom tablet. However I did a tutorial using a mouse to show couple tricks.

Of course you can paint icons by hand, scan them in and make icons that was, but it takes too long, working with mouse is long but it works, working with a wacom tablet is 5 seconds.

first Example is how to make an icon Using a mouse.
The second example is how I paint an icon with tablet.


UPDATE - (Jan 2012)
New video made, using wacom tablet, photoshop, and wc3 image converter.
New tutorial video for http://www.hiveworkshop.com/forums/icons-541/btncrflamez-209982/


Uploaded with ImageShack.us
http://www.youtube.com/watch?v=4RfpvK8OCa4

 

[CRAZYRUSSIAN]

Using a mouse

Using a mouse.

Just remember this, paint image bigger, downsize it later, and it will looks very good.

 

[CRAZYRUSSIAN]

You also need some training with value and light, and drawing will be easier.

 

[CRAZYRUSSIAN]

Icon using tablet

Now I'm using the tablet to paint.

 

[CRAZYRUSSIAN]

finished icons can be downloaded here.

http://www.hiveworkshop.com/forums/resource.php?t=93863
http://www.hiveworkshop.com/forums/resource.php?t=93861

 

[Jack_Sparrow93]

This is so great! I just wich that I got photoshop...

Could you make a wand to? Like them in Harry Potter. I would be very greatful if you did!

Thanks in advance!

 

[D a w n]

looks very useful

good job

 

[Huurka]

I don't understand...

 

[Zeverens]

Awsome.. I just know how to make the BLP file work.. I try the regular way and name the file BTN<Something> and DISBTN<Same Something as BTN>
Edit:-I just don't know-

 

[StaberFire]

I never knew it could be so simple.

 

[CRAZYRUSSIAN]

I don't understand...

Why?

 

[Jack_Sparrow93]

Could you make an tourial from to get it from your photoshop to get it in a game, so you can import the icon, I mean to make them to BTN, DISBTN etc.

 

[CRAZYRUSSIAN]

Jack_Sparrow93 - my friend, those tutorials are already done, search for them. I dont have free time to do that.

Creating and Importing Custom Icons


I'll give advice for something specific no problem, but I just dont have time to make a whole tutorial, I fell back by making this one already.

 

[Hawkwing]

The results are nice but the lack of detailed explaination makes this hard. Also, it would be nice if you could merge these into one post and write the steps in your post versus on the image. To put the attached images in the location you want use the [attach][/attach] tags. In between the tags enter the ID of the image. Right click on the image and press properties. Look at the URL. The ID of your first image in the second post is "34841". Everything after the "/" and before the "d" is the ID of the image.

 

[Jack_Sparrow93]

Jack_Sparrow93 - my friend, those tutorials are already done, search for them. I dont have free time to do that.

Creating and Importing Custom Icons


I'll give advice for something specific no problem, but I just dont have time to make a whole tutorial, I fell back by making this one already.

Thanks! I forgot that side, now when I use hive more!

 

[Devine]

Hahaha now that he finally gave out his secret il be the most wonderfull Icon Creator EVER! great that you show how you work ... however you work with dodge and burn ... wich is totaly rejected by the professionals. The secret is just to start big and resize ...
Great i could have comen up with that

maybe you could merge those posts into one big tutorial.

anyway +rep

I vote for instant approving

 

[ANdROnIQ]

cool. I want to learn this. Really, shape can be created by shading, and the colors - by recoloring, filling and brushing. Nothing other required.

 

[SkriK]

I'm surprised how well it works with downsizing a big document. Giving this a go, will post result later on.

 

[CRAZYRUSSIAN]

The results are nice but the lack of detailed explaination makes this hard. Also, it would be nice if you could merge these into one post and write the steps in your post versus on the image. To put the attached images in the location you want use the [attach][/attach] tags. In between the tags enter the ID of the image. Right click on the image and press properties. Look at the URL. The ID of your first image in the second post is "34841". Everything after the "/" and before the "d" is the ID of the image.

Just say "thank for your precious time"
Because for people who are using the programs it is detailed enough.

- "... however you work with dodge and burn ... wich is totaly rejected by the professionals."

What professionals? I'll tell you that a professional use anything when the professional is using a MOUSE to paint. So you can say that if a person doesn't have the wacom tablet, then that person is not professional.

 

[SkriK]

Ugh, this is hard, my drawings end up too messy, you can barely make out what it is. (Got a wacom bamboo, might be overusing it )
How many tries it take before you settle with a "drawing"?

 

[CRAZYRUSSIAN]

Video

Movie.rar
http://www.filefactory.com/mupc/c86949/

this is a short video I made making this icon. hope it works and is useful. Enjoy.

Btncrlll - The Hive Workshop - A Warcraft III Modding Site

 

[CRAZYRUSSIAN]

Ugh, this is hard, my drawings end up too messy, you can barely make out what it is. (Got a wacom bamboo, might be overusing it )
How many tries it take before you settle with a "drawing"?

Usually I don't do the drawing, I just start painting the light and the shadows, then refine the drawing.

If Drawing...
Just One. If the drawing doesn't work out then I start over a new image.

But for 10 years art is my profession, and 12 years of education. So you can start with the drawing or as many drawings as you want to make everything EASIER for your self.

 

[Kwaliti]

Hmm, what an innovative and surprising way to use smudge, dodge and burn

 

[Hawkwing]

I wont approve this if it stays how it is. Right now it's really unclear as to what you're supposed to do and what exactly you're trying to accomplish. Also, you aren't really teaching how to make icons, you're teaching them how to draw metal weaponry in photoshop.

Tell us how to use tools within the program properly, not how to make your image look like a blade and whatnot, the majority of the tutorial is like this.

 

[CRAZYRUSSIAN]

Btncrlll - The Hive Workshop - A Warcraft III Modding Site

this is a video of how to paint an Icon by ME. Enjoy.

 

[Anachron]

GReat, thanks CR!

 

[Serbianbeast]

Could you tell me at which image size do you start creating your images? I mean what's the pixel size of your images before you reduce it to whatever it is for wc3 icons.

btw

How am I doing so far? I'm at ... let's say 5-6th step at the moment.

 

[Anachron]

Could you tell me at which image size do you start creating your images? I mean what's the pixel size of your images before you reduce it to whatever it is for wc3 icons.

btw

How am I doing so far? I'm at ... let's say 5-6th step at the moment.

I'm taking 512*512px and it works great..^^

 

[Kwaliti]

512x512 is an overkill. 256x256 is better.

 

[Devine]

I make icons 500x500
according to his video, CR makes icons 6x6 inches

oh and serbianbeast,
i really like the handle on that sword. the rest needs a tad more detail.

 

[Anachron]

I make icons 500x500
according to his video, CR makes icons 6x6 inches

oh and serbianbeast,
i really like the handle on that sword. the rest needs a tad more detail.

agreed. and 512*512 is good I think.

 

[donut3.5]

I make icons 500x500
according to his video, CR makes icons 6x6 inches

oh and serbianbeast,
i really like the handle on that sword. the rest needs a tad more detail.

500 is a weird number. Use 64, 128, 256, or 512, since those can evenly reduce to 64, and PS wont have to interpolate as much messy blurring due to reduced pixels.
--donut3.5--

 

[Serbianbeast]

I used 512 for the sword you see since it's related to standard computer numbers...

here's the progress:

 

[TheBlooddancer]

Now I'm using the tablet to paint.

You miss a 't'

Neat tutorial, and its somehow the same way as i do, other than i just dont use tablet. But its nice to see, that you can work with mouse too.

 

[Devine]

500 is a weird number. Use 64, 128, 256, or 512, since those can evenly reduce to 64, and PS wont have to interpolate as much messy blurring due to reduced pixels.
--donut3.5--

I don't think it matters
a square is a square.

 

[HappyTauren]

It does matter, you need to get even number when you divide, so that it doesn't blur... some basic math, man.

 

[t3h b055]

Those are some ballin icons Rushn!

 

[Serbianbeast]

Don't use 512x512, I've just finished and uploaded that icon and it looks blurry. I suggest you people use 256x256, 192x192 or even 128x128

 

[Anachron]

Don't use 512x512, I've just finished and uploaded that icon and it looks blurry. I suggest you people use 256x256, 192x192 or even 128x128

But I think CR does it with 512x512. It looks really like that in PS in his videos.

 

[Pyritie]

Approved. People who know how to use photoshop will appreciate this tutorial.

 

[Thorneon]

man i wish i could make icons like that. Good tutorial too.

 

[Koromaru]

Thanks for the tutorial, CR! I've always been a fan of your icons.

 

[Anachron]

man i wish i could make icons like that. Good tutorial too.

Well then just do it and do it again. With time you will become better and better and finally. You gonna make those icons.

 

[Airandius]

Because of you I will create icons now! =

 

[CRAZYRUSSIAN]

I used 512 for the sword you see since it's related to standard computer numbers...

here's the progress:

Hello, sorry I wasn't here to answer on time.

All thank you for for replies, thanks you moderator for approving, I am honored to be in aid.


Serbianbeast - Another thing, Now you know how to use photoshop tools, but you need to know the visual rules in order to make fast and right decisions.

Here are couple things to keep in mind.

1 Because the image is so small, try to make more contrast, bright colors, and shiny glows. And most of ,Magic the gathering cards, for example, are very colorful just because the image is so small.

2 Also, If the object is dark, then make the background light! And if the object is light, then make the background dark! It is simple concept that can be proven by placing an object on the table and moving the light source around to FRONT, BACK, SIDE of the object, and record the relationships between the object and the background at 3 different scenarios.

3 And when glow is added, make sure it fades in or out slowly. Because it the glow stops sharply, then it is not a glow anymore.


Looks good. Keep working. Everybody else, Good Luck.

 

[Davdav2]

Great! All i need now is... Photoshop...

 

[SkriK]

Forgot to say: i based this drawing on the methods of this tutorial. (And did some improvising of my own )

Image

 

[Avex]

Engraving looks different than the bigger/smaller image.

 

[SkriK]

Sorry about that.

 

[Luckerguy]

Hey, sorry for posting here on this old thread, but i really need help.

I want to watch the video from CR but the dumb FileFactory says :

"Sorry, there are currently no free download slots available on this server.

Please try again later, or you can upgrade to FileFactory Premium below for instant access."

If anyone could upload this video on rapidshare or somewhere else i would be so happy!

Thanks in advance.