How big should the slider button be?

In a custom GUI I’m replacing the buttons on the horizontal slider with a new image. I’ve prepared 16x16 pixel images but they seem incredibly small. How big should the replacement images be to be larger than the vertical height of the slider itself?

I’ve found 18px for the Thumb and 22-26 for the Bar are pretty usable.
Here’s a screenshot below using those values - it’s pretty easy for users to find IMO :slight_smile:

Cheers
Shaun

Sorry - I just realized I never answered your original question (was a bit busy that day) :slight_smile:

For Slider Thumbs, abt 24x24 seems reasonable. Heres a shot to give a feel for the scale.

58076--2110--$picture_2_212.png

Nice GUI design Shaun!

Thanks Big Kahuna - and thanks to Apple for the background :wink:

For the slider image, a PNG file or Photoshop with alpha channel?

What I’ve done when doing skins is to have a photoshop file with all the images in it, then sliced it up and used PS’s Save For Web to export all the bits at once as pngs

Nicholas I don’t know if you’ve heard of this, but Save for Web has some machiavellian machinations going on the background :slight_smile:

I’ve just spend a good hour trying to remove the color profiles that Photoshop puts in the PNGs.
I thought I’d be tricky and use lots of small PSD’s for each GUISkin element, but that didn’t work either - for some strange reason, PShop makes the default matte color white, which is giving me glow instead of shadows on transparent areas. PNG’s can have black as their default matte background, which solves that problem.

I’ve still not fully solved the problem, but here is a bit more info on it. I don’t know if it affects CS2 - but its an arse in CS3 and very confusing.

For those of you making skins here are the correct config’s for Pshop and Illustrator. (The Get infos - Left is a good PNG, Right is a bad one - note the More Info sections).

Hope this helps - If anyone knows the solution to the PShop white matte problem, I’d love to know.
Posted to this thread: http://forum.unity3d.com/viewtopic.php?p=59427#59427
Thanks.



58333--2126--$picture_2_931.png

Mostly, I just work with “proof colors” on - CMD-Y in photoshop. Then I get what I see - both in browsers and Unity…