The Blur feature and effecting Shadows

A must read for WindowBlind skinners!!

Wednesday, July 30, 2008 by SKoriginals | Discussion: WindowBlinds Tutorials

Ok so your a skinner, you make a skin with transparency and you've added a shadow to your frames and such. Now you want to add the blurring feature to your skin but you get something like this...

hum... now we have a problem cause that looks like hell.

But take notice, the image is square but the blur is effecting only SOME of the whole image area for that part of the frame. So whats happening here? This didn't just hit me till last night even though I've been dealing with it personally ever since the blur feature was added. After some discussion with another Master (Lasse, aka PixelPirate) skinner it dawned on us and here are some 'test' results for my working theory on this 'discovery'.

The Theory

The blur effect has a threshold point. At some point in the opacity of the image the blur feature no longer effects the image being used.

The Tests

I'm going to test this as I write this post so bare with me. For the test I'll make a white wallpaper with a 2 pixel stroke on it, make a 100 pixel long frame section gradiented with a 100% to 0% opacity set with a blur and at true size. This should give a 1% opacity change per line of pixels on the frame and we'll see where the blur stops taking effect. Here goes...

ok here is test 1... first is our 'control' (the plain stroke, no frame) then blue, red, green, black and last white. As you can see pure black has no blur effect at all. This isn't exactly what I expected. Lets try different shades of grey because it seems white does have an effect where black doesn't. there must be some point at which this changes.

Test 2... I'm not going to post the pics of this but oddly enough black up to 3,3,3 does not blur and anything lighter does. The odd part is the white gradient (used as the inactive part) also did not blur at the same time. Need to run some different tests...

Test 3... Here I made something like a frame and added a pure black gradiented outer glow in frame 1. This blurred the frame but not the outer glow. In frame 2 I added a dark blue shadow to the outer glow as you can see where the dark blue shadow appears so does the blur. Additionally even though the inactive frame did NOT have the dark blue shadow it also blurred the same area. In frame 3 I changed the dark blue shadow to pure black and again the blur effect did nothing to it. See the image below.

 

My Conclusion (updated Aug. 2nd '08)

Window Frames - You must use pure black (or RGB 3,3,3 and lower) for the shadows to not blur. Blur will effect anything with color. Image for the frame must have a clear line of pixels on the outter rim for the widnow frame. Blurr effect is square, it does nto support odd shapes, you can use the settings under the 'Extras' tab to round off the corners.

Taskbar - untested

Start Menu - Not fully tested. Blur effect looks odd when 2 transparent parts are touching in XP, Vista is uneffected by this.

_________________________________________________

Now you might ask why I went through this trouble and why the big write up. As a skinner and an advocate to 'pushing limits' and finding out what those limits are these sort of things help both me and all you other skinners. Currently there is no 'Mask Layer' for the blur effect but this might be one way to (in some fashion) create one to an extent.

My conclusion is based solely on the above testing plus comments and further testing below. Please if you find some variation or the like, feel free to post your results here for others to see and read.

Thanks and happy skinning as always 

NightTrainthedark
Reply #1 Wednesday, July 30, 2008 6:10 AM
If pure black is used (or very close, RGB: 3,3,3 or lower) you will not have that area effected by the blur feature.


Great tip.. Thank you!
WeatherBound
Reply #2 Wednesday, July 30, 2008 1:42 PM
Very interesting Read.   
I.R. Brainiac
Reply #3 Wednesday, July 30, 2008 3:27 PM
vStyler and I had been noticing wierd incongruities in blurring...and they go beyond even this great explanation. I had heard hints that the color used was affecting blurring...something Stardock insiders were aware of but also the kind of thing they usually fail to clue the rest of us in on...thanks for making it clearer SK.  
TYCUS
Reply #4 Wednesday, July 30, 2008 4:13 PM
great article!
SKoriginals
Reply #5 Wednesday, July 30, 2008 8:00 PM
vStyler and I had been noticing wierd incongruities in blurring...and they go beyond even this great explanation.

Please by all means explain, share and show what you have noticed and seen then. Maybe we can resolve and/or figure them out.
SKoriginals
Reply #6 Wednesday, July 30, 2008 8:06 PM
Great tip.. Thank you!

Very interesting Read.

great article!

Thanks just hope it helps to prove useful in future skin development and leads to a 'full' understanding of the inner workings of this feature and its oddities.

Again, if you know 'anything' more on the subject then share it   
bk13GarbageMan
Reply #7 Wednesday, July 30, 2008 8:46 PM
thanks for making it clearer
I think this kind of talk is a little out of place for an article about blurring !        sorry, I can't help myself sometimes       
danioc
Reply #8 Wednesday, July 30, 2008 9:13 PM
Extra Tips:

1 - Always leave a empty pixel at the end of the shadows when slicing the skin frames, this will help to prevent painting problems (blur and transparency problems).

2 - Frames have dimension limits too, if you experiencing strange problems and your frames images are too big or too small, try change 'em, may help too.

3 - Per-pixel frames now support layers (images that load over the base frame image), you can use it to make better textures tiles, floating elements/details/decorations, etc. For now the layers can't pass out of the frames area, it's basically a glyph with margins. Please look for the article about layers in the forums, there's a example of how you can use 'em.
I.R. Brainiac
Reply #9 Thursday, July 31, 2008 12:26 AM
1 - Always leave a empty pixel at the end of the shadows when slicing the skin frames, this will help to prevent painting problems (blur and transparency problems).
Thanks for that one Dani...never knew this could be an issue.  
SKoriginals
Reply #10 Thursday, July 31, 2008 3:15 AM
2 - Frames have dimension limits too, if you experiencing strange problems and your frames images are too big or too small, try change 'em, may help too.


Lasse and I briefly discussed this too.. he thinks 40 pixels is the widest that can be done on per pixel frames for the sides and the top and bottom are limitless. I havn't tested this (like I'll make anything THAT big anyway, not my style) but, this could be very true. I don't tend to question Lasse to much on some things (like this) heh

As another note to the blur feature. The above conclusion does NOT seem to hold true with the Start Menu. Also after conversing with vStyler, there are some oddities on XP when 2 semi-transparent parts are side by side on the start menu as well. They tend to not blur the background in the same manor even if it is the same transparency level and color. This does not seem to be the case on a Vista start menu however.
Island Dog
Reply #11 Thursday, July 31, 2008 9:58 AM
Fantatsic article SK.  Thanks for writing this! 
I.R. Brainiac
Reply #12 Thursday, July 31, 2008 10:59 AM
there are some oddities on XP when 2 semi-transparent parts are side by side on the start menu as well. They tend to not blur the background in the same manor even if it is the same transparency level and color. This does not seem to be the case on a Vista start menu however


Yeah we talked about this too...its an XP bug of some sort...hard to spot to the casual view but the v-man has sharp eyes.  It will look as tho the blurs dont line up.So you either tolerate it,design start menu to NOT have translucent areas touching or cut and design in a way that disguises it.    
SKoriginals
Reply #13 Saturday, August 2, 2008 7:09 AM
ok update

Tim (2of3) was having a problem with the blur and using shadows. Even though his shadows were pure black they were still bluring the background. I played around and this is the new conclsion...

On one of the frame sections there was not a pure clear line of pixels. So the perpixel fame sections need to also have a 'clear' line of pixels (like on the otter edge). Also, the blur will still try to work in a square so you must adjust the 'roundness' of the blur in the extra tab. This also means that odd shaped frames that are more then just rounded off are going to have problems with the blur effect.

I still say a 'blur mask' layer would be a fantastic idea if it can be done.
ArileenDesign
Reply #14 Sunday, August 3, 2008 4:16 AM
Great Article and Dicussion   
ThoriumKnight
Reply #15 Sunday, December 20, 2009 8:24 AM

WB really should use masks to tell the DWM where to blur, like Ave's glass toasts.

Please login to comment and/or vote for this skin.

Welcome Guest! Please take the time to register with us.
There are many great features available to you once you register, including:

  • Richer content, access to many features that are disabled for guests like commenting on the forums and downloading skins.
  • Access to a great community, with a massive database of many, many areas of interest.
  • Access to contests & subscription offers like exclusive emails.
  • It's simple, and FREE!



web-wc01