A guide to WindowBlinds fonts in SkinStudio

How does one define a font to use for WindowBlinds.

Originally posted on Wincustomize.com

I find a lot of users having problems with how fonts are defined in a WindowBlinds skin. It’s quite simple once you understand it how it’s done.

WindowBlinds bases on the premise that most of the skins use just a small number of font variants but use them in a number of places, meaning that one font setting will be used in a number of places like a push button, a tab, a status bar.

A font setting in SkinStudio is called “font preset” and is a set of font name, size and formatting as well as its shadow settings. When you think of it in the terms of any word processor a font setting is not different from “styles” used e.g. in Microsoft Word. And they are equally as useful! in contrast to MSStyles where you define the font for every control or its sub style in WindowBlinds you only define it a few times and then use them in multiple places.

What’s better… if you decide to change the font in a style, do it only once for the style and WB will change it everywhere the font is used! Let me show you how it’s working on a sample skin for a push button.

Every control section has a font setting (at least one) in most cases grouped in the “Fonts” subgroup in its section section.

Read the rest of this article »

Posted in Skinning, SkinStudio, WindowBlinds
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 15 Comments »

Where’s that “File dialog… *something*” section?

Another feature that you may find helpful in your day to day skinning.

Originally posted  on Wincustomize.com

It all started with another brain-freeze today. I just couldn’t find a section that contained the File Dialog places bar images. You know the bar on the left on the File->Save and File->Open dialogs? I bet you’ve been cursing more than once searching for a section like that. SkinStudio will help you with searching for a section if you know it’s UIS name or its part AND if such section actually exist. But in my case it didn’t.

Wouldn’t it be great if I could just lookup the section by it’s name or a part of it?

So I’ve added a tool button like you can see on the image below.

Read the rest of this article »

Posted in Skinning, SkinStudio, WindowBlinds
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 6 Comments »

Make a translucent start pane like a pro

As all problems this one appears to obvious when you know the answer.

Originally posted on Wincustomize.com

Little I knew that I will be involved in it, when I was posting a while ago on Neowin and WinMatrix about the cool Warcraft skins available on Wincustomize. Blizzard is offering a World of Warcraft suite now for download on their  US and European pages pages and upon their request we needed to swiftly modify the Apocalypse‘s great World_of_Warcraft skin to meet Blizzard‘s request to match the game GUI more closely. I was assigned to the task so I went swiftly to the local store with the perfect excuse to get myself a new toy!

– Honey, but I need it for work…
– Sure you do!
– but really, darling… look…

… so I started hacking the game files to get some artwork out of it. As it appears there’s a lot of people looting the game resources than one could expect… a bi-product of it you can find in my previous article here.

But to the point….

Out of the game files I got some cool graphics, now I’m not really good with with design but equipped with some original artwork I can be pretty dangerous. So I got some artwork out of the game and started cutting and pasting this auction window:

as you can notice the frame drops a nice shadow and I wanted to reflect that in the skin. To make the long story short I ended up with  this design:

Read the rest of this article »

Posted in Skinning, SkinStudio, WindowBlinds
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 6 Comments »

Put your Blog Navigator on a stick!

On how to make Blog Navigator store it’s data on a USB dongle or wherever you want it to be.

Originally posted on Wincustomize.com

I’ve seen some requests recently to make Blog Navigator run from a flash dongle or any mobile drives in our newsgroups lately. I was not quite comfortable with the inability to change the storage path by the user myself for a while, not to say that the data is stored in a wrong place, on the contrary, this default behavior does not change. But to make it confined to a Local Application Data folder was a bit too harsh. for my taste.

So, for Blog Navigator 1.2, I went ahead and made it totally customizable for the user to define where does he/she want to store the files. Currently there are 3 definable folders in Blog Navigator:

  • <repositoryFolder> is the place that Blog Navigator stores its repository to it’s the file that contains all the knowledge and articles stored in your Blog Navigator
  • <keepSafeFolder> is the folder that will be the default folder for keepsafed articles, unless the user defines differently globally in the Blog Navigator preferences or locally for a particular folder, and finally
  • <temporaryFolder> this is pretty much where all the dynamically generated stuff goes, it’s the Blog Navigator working folder.

Read the rest of this article »

Posted in Blog Navigator, Blogging, Web applications
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 18 Comments »

Collect, Manage, and utilize the knowledge you’ve acquired with ease and grace.

Originally posted on Wincustomize.com

What we really intend to make for you with Blog Navigator is to create a robust and efficient way to manage all your on-line knowledge. You know how hard it is to actually find something useful on the Internet at times, right? That’s where our “Web Search Folders” come to help. You could already organize your knowledge into baskets, but we’ve decided that it’s not enough. While baskets were a great way of organizing your findings and keeping them for later reference, there were a couple of deficiencies of baskets.

To address that we’ve added two things to 1.2 version of Blog Navigator:

  • you can easily put one basket into one another to make your knowledge more hierarchically organized, just like you can organize your Internet Explorer favorites.
  • you can manage Internet Explorer favorites within Blog Navigator! (Firefox users, consult the final paragraph to learn how to import your bookmarks into Blog Navigator).

Read the rest of this article »

Posted in Blog Navigator, Blogging, Web applications
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 3 Comments »

How dare you, touch my alpha channel!

Why can’t graphic applications get their channels right?

Originally posted on Wincustomize.com

[Updated 11 May 2005] Read at the end of the article.

I’ve been on a quest to improve a skin today and to do so I needed to extract a big archive in a proprietary and not widely supported format and get the images out of it and into the skin. Turned out the first part was not as bad as I expected as I’ve found some tools on the net to do this and Kris helped with the tool to convert the images in the proprietary format into TGA’s. Now here’s where the pain begun.

I needed to have my alpha channel kept in the files but I also wanted to process the files before making them into the skin.

Read the rest of this article »

The most common problems with skins we find on Wincustomize

Originally posted on Wincustomize.com

Browsing the WindowBlinds skins on Wincustomize and applying them is a source of a lot of joy, but there’s also a drop of frustration. There are some common problems with the skins that skinners notoriously forget to check for. Perhaps my working environment is not typical but since you’ve went all the way to create a skin it’s relatively easy to make it a perfect skin for everyone. So here are the 10 things I find most common to be wrong with a lot of skins:

    Read the rest of this article »
Posted in Skinning, SkinStudio, WindowBlinds
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 111 Comments »

Birthday cake for a geek

How to make a nerd happy for his birthday.

Originally posted on Wincustomize.com

So Saturday was my birthday. I’d rather not think about which one (it was round). And today I’ve gotten a little late email from my sister with 2 photo’s of a neat hardware she’s found on the Internet … (I think she actually got them through email)

I was tempted to post it in “Gadgets & Electronics” category, but finally decided against… I think they actually pre-date their era and may be too revolutionary for our times. We all know what happens to products like that developed by some unknown startups… they become absorbed by the market leaders and disappear in their bowels without any trace.

So first is an ultra slim notebook. Made of fully biodegradable materials. Dear sis knows how I despise touch-pads so she grabbed a nice mouse with it :)

Hewlett-Packard Notebook

And another piece of hardware… Fully equipped ITX form factor computer… I just need to find a case for it. Just to cut off the speculations about the cards. The first one from the left is a network card, then we have a video card, and the right most in the AGP slot is the sound card… that’s quite innovative approach. All components are the state of the art, top models available in the confectionery industry. Equipped with a whole KG of Ginger2RAM for your gaming pleasure. And Menthos-the-fresh-maker cooling system with a sugar-pipe for better heat transmission. I’ll have to examine if it won’t have to be water-cooled, but unless I use some other materials it may become a bit muddy.

Bare bone

Posted in Lifestyle
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 81 Comments »

Did you know that…

A few of Blog Navigator tips

Originally posted on joeuser.com

I really find the “Did you know that…” dialogs showing when an application is running quite hilarious.

They provide no solution or enrichment whatsoever, because some random tip at the program startup is highly unlikely to help me with the task I am about to perform with the software. It also is completely stripped off wider context and random as it is, serves exclusively as an annoyance and the first thing user has to turn off in the application.

That said, user still may find some tips and tricks usefully, if provided in a proper form and time. So here are some of them to read at a time of your convenience…

Did you know that….         ;)

Read the rest of this article »

Posted in Blog Navigator, Blogging, Web applications
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 60 Comments »

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?

Posted in IconDeveloper
1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading...
| 24 Comments »