How to do that in Stardock IconDeveloper?

Originally posted on Wincustomize.com

Disclaimer

Stardock IconDeveloper is a free icon creation tool available from Stardock Net,Inc. You can download it from here. Stardock also offers an advanced version allowing you to create icons of any sizeand other really cool things like recoloring icons or even whole icons packs as well as skinning them. But as long as you do not need the advanced features available in the Professional version, you’re more than welcome to use the free edition of IconDeveloper.

There was a real storm of posts on the IconDeveloper newsgroups recently asking about how to create icons from files in formats that does not suport transparency or generated by applications that does not support that feature in formats like PNG or TGA. I have decided to write a complete tutorial on how to create icons from images in IconDeveloper.

Easter is closing. So i decided I’ll lookup the WEB for something suitable. A few moments spent with Google releaved something quite appealing:

So I save the file as a bitmap and… well… bitmaps does nto support transparency, at least valid bitmaps that can be generated by generic image editing apps.So I have this gray background around the image I want to turn into the icon. That’s pretty unacceptable.

But I have two sollutions:

1. open the image in an image editong program and remove all the gray pixels, which can be tedious or even impossible with some image editors (like MS Paint for example)
2. open it in IconDeveloper and mark the gray as transparent and let IconDeveloper do all the hard work for you.

Number one is pretty aparent to those who know how to do this and it’s not a subject of this article, now the latter can be a real time saver for you.

So this is how I go about creating the icon from the image? I have just saved as a bitmap on my Desktop, now to turn it into the icon I just right click it and select the highlighted option from the menu:

Right after that Icondeveloper will open the image and offer you a dialog to create the icon from the image

The buttons in the middle allow you to select icon formats you want to create. The formats on the left are standard icon formats available for you to use instantly. The formats in the list on the right are the formats you have already decided to add to the icon you are creating. The buttons “add” and “remove” allow you to shift formats from one list to the other. You can add some odd or non typical formats (even non square ones) by clicking on the “Add custom” button.

On the screenshot above you see a “Select transparent color” button pointed at by the hand cursor. This button will ony be there if your image does not contain alpha channel in it in which case IconDeveloper can inherit the alpha from the original image. Otherwise it makes it possible for you to create a simple binary alpha channel by clicking on that button. Let’s do it:

as shown on the above picture you are shown a small swatch showing you details of the color that you hover over and a small zoom window showing a small part of the image you move your mouse over – magnified. Clicking in any place on the screen will make the color you clicked, thecolor that will be treated as transparent. Now the effect is as follows:

Ok, but what the other settings do. The “Constraint proportions of the original image” causes IconDeveloper to keep the image’s aspect ratio, meaning that the shape of the image will not be affected while it’s being stretched. This is there not to cause e.g. circles to become some weird ellipses or turning squared into odd nn squared rectangles and so on. Otherwise if your source image would not be perfectly square you would experience something like you do watching a widescreen movie or a regular TV set after the movie has been stretched to the TV’s full height. This can be funny at times, but must not always be intended.

Now as to the “Resample image”. If you turn it off or select the “Nearest Neighbor” entry from the combo box, The iameg can become choppy, just like you would be watching the bare pixels enlarged. The various settings in the combo are similar to what you can find in an analogous Combo while you resize your image in Photoshop. Those are Various techniques to make your image log good when resized. As Seen on the screenshots I prefer this setting to be set to “Laczos3” as it generally gives me the best results, but you may choose to experiment which one you find workins gest for you. Various images may look better with various settings in the combo, but Lanczos3 generally produces a reasonably good results.

The third option below the left list is only meaningfull for 256 colors, 16 colors and monochromatic formats. Dithering is a technique used in computer graphics to create the illusion of color depth in images with a limited color palette (quantization). Checkout Wikipedia for more details.

SkinStudio also offers you a various algorithms to check which looks best on your images. As shown on the images:

In most cases however, if I ever need formats of 256 colros or lower, I find “Floyd Strinberg” method to work the best for me. You could have already noticed the images in the list on the left being dithered. Otherwise experiment to see which settings works best for you. Dithering is meaningless for the “Windows XP” and “16,7M colors” formats.

Pressing the OK button now will give you a nice icon that you may then save to a file.

Now this is turned out quite nice, didn’t it?

Making sure everything in place, just where it should be.

Originally posted on Wincustomize.com

Implementing FireFox support in SkinStudio and having to calculate everyting carefully in the process I got pretty tired of being unable to tell how wide something is or having to run a separate app for it. Is there one actually? I guess there is… perhaps even skinnable. But being where I am – I wanted it integrated and easy to use for myself and for every skiner. available instantaneously. Seamlessly integrated into Skinstudio. (This will be available in the next SkinStudio release),

So here’s my attempt at counting pixels.

You probably already used Skinstudio zooming tool, and you’ve noticed that apart from magnifying the screen it also tells you the color of a pixel under the cursor.

now if you press the Ctrl key it will start to measure whatever you have highlighted

As you can see – additionally to the RGB values, now you also have the “Width” and “Height” values. Now, while still having the Ctrl key pressed, let me move the cursor down and right a bit…

as you can see, the Width and Height values show the difference between what was the mouse position when you pressed the “Ctrl” key and what it is now. The size is measured as long as you hol the “Ctrl:” button pressed.

Are there no limits to customization?

Originally posted on Wincustomize.com

Very important: Recoloring or skinning icons does not change the original author’s copyright, nor does it make such icons yours. If you recolor or skin an icon that has not been made by yourself you may not upload or share a recolored icon without the original author’s permission.

In the next few days Stardock is publishing the next component of it’s extremely successful ObjectDesktop. The new component is called IconDeveloper – the tool’s , I’m the developer of, main purpose is to make it easy for casual users to create icons and make it faster and more efficient for professional icon artists to do their work. Celebrating the event I decided to write a short article about going really crazy with icons and how to do it with IconDeveloper. What skinning means (but is not limited to) is changing the look of certain part of applications. The article will describe how you can change the appearance of an IconPackager theme or an Icl file (Icon library).

So you recolored your icons already? (If not checkout the article about mix matching your themes with your skins – the functionality described there is now a part of IconDeveloper). But it still isn’t enough? Why stop on recoloring? Why not make your icons exactly how you want them to be? Why not SKIN THE ICONS?

I have recolored according to my taste (or lack of it) the great Bant’s “Ciela” Visual Style (Please do not ask for the recolored skin. Curtesy of Bant, it’s available here for free and you can easilly recolor it with SkinStudio). It has a kind of toxic look now, which if you have seen the screenshots in some of my previous articles, you have probably noticed I’ve developed a taste for.

Since i can never get enough of the marvelous PixOs icons by Paul Boyer I have decided to recolor them to match the skin.

But since I’ve done the recoloring already, should I stop there? Let’s open the modded “PixOs Toxic”…

Select a new name for skinned theme and specify that I want to actually “skin” it…

Now what can we do here… I know! Let’s set it on fire!

Or make it suffer in a really polluted environment… sorry Paul

and actually make it ultimately match my skin of choice… and a bit smoked (Why? Why not?!). To do this I’ve had to edit an image from the Visual Style to create a bevel I can now use as a background (made for sake of this artticle only). You can actually use any image for either a background or overlay – just press the “Browse” button and select the image you want to use.

The possibilities are countless. IconDeveloper comes with a number of backgrounds and overlies for you to toy with, but the real potential is in your creativity. Make your own icon’s skins. The sky is the limit!