Day Two- My Windowblinds Anti-tutorial Tutorial
All Is Not Well
Wednesday, January 4, 2006 by PoSmedley | Discussion: WindowBlinds Tutorials
So I have begun with the Start Menu and Task Bar.
This is my final Draft of the START MENU. This is at the size I want it to ‘appear’ in the finished blind. (I have no idea if this is a mistake or not.)
Next, we have the Start Menu in slices. (Each one saved as a separate bitmap.)
Now, in my final draft, I added the so-called ‘magic pink’ to the background. Why? Because after an initial test, I found that my ‘corners’ were showing white where I wanted nothing.
When starting in SkinStudio, you have the option to create from a New Skin or from a Template. I chose the first, which opens up a default skin similar to WinXP Blue. With each graphic, you have the option of editing each individually…or…you can open up your own graphic. This is done from the tabs in the preview window. However, when you open your own graphic you will be expected to ‘cut’ what you need from it. Follow? Well, I found out that opening the ‘entire’ start menu draft I had done and trying to cut the required slices from it was impossible for me. That is why I created slices in Photoshop and opened each one individually..THEN cut from each. (Which basically meant making sure each was the ‘exact’ size I needed, as I had layed out.)
What I did was cut them to the size I had saved them at, which meant just tightening up the edges, so to speak. After applying them all for the ‘START MENU’…this is what I got. I have the original intent nest to it.
My original is W300 x H457. What SkinStudio created from my input is W359 x H 768. I tried messing with the ‘tile, stretch’ controls, etc…but it either got worse or totally whacked. Obviously, what I got is NOT what I intended. I am currently going over my BMP’s and settings.
Of note is the ‘MAGIC PINK’ that is not all that magic. (For any unfamiliar…WB should read it as transparent….however….anti-liaising and shadow effects and Bevel and Emboss effects will do things to the edge of your graphics that will change what WB reads…should it OVERLAP the magic pink. Magic Pink should be set at 255/0/255. The slightest variance will make it visible.) I noticed this right away and had gone back and THOUGHT I had made clean copies of all the bitmaps and then re-applied the Magic Pink, but apparently not.
Finally…if you look at what SS created…you will see ‘white lines’ that outline my slices. I have NO idea why.
Problems.
1. Sizing
2. Magic Pink
3. Slice borders
4 months is starting to look like a possibility.
AND…just for laughs….the practiced/achieved skinners will get a laugh out of this. This next pic is a vector of what I really wanted. It actually worked better than this one, with the exception of the bottom bar..it refused to conform in any way…and the magic pink. No matter what I did I could not make it ALL go away.
I would have liked to go with this one, but it is way beyond me. It was something special I wanted to do for Valentines Day that would have made it possible to personalize the skin in a way I have yet to see it done. Oh, well.
Final Note: The Icon Pack to match the blind that doesn't exist is complete. 140 plus icons that I refuse to let see the light of day until this *@!$#@ blind is done.
This is my final Draft of the START MENU. This is at the size I want it to ‘appear’ in the finished blind. (I have no idea if this is a mistake or not.)
Next, we have the Start Menu in slices. (Each one saved as a separate bitmap.)
Now, in my final draft, I added the so-called ‘magic pink’ to the background. Why? Because after an initial test, I found that my ‘corners’ were showing white where I wanted nothing.
When starting in SkinStudio, you have the option to create from a New Skin or from a Template. I chose the first, which opens up a default skin similar to WinXP Blue. With each graphic, you have the option of editing each individually…or…you can open up your own graphic. This is done from the tabs in the preview window. However, when you open your own graphic you will be expected to ‘cut’ what you need from it. Follow? Well, I found out that opening the ‘entire’ start menu draft I had done and trying to cut the required slices from it was impossible for me. That is why I created slices in Photoshop and opened each one individually..THEN cut from each. (Which basically meant making sure each was the ‘exact’ size I needed, as I had layed out.)
What I did was cut them to the size I had saved them at, which meant just tightening up the edges, so to speak. After applying them all for the ‘START MENU’…this is what I got. I have the original intent nest to it.
My original is W300 x H457. What SkinStudio created from my input is W359 x H 768. I tried messing with the ‘tile, stretch’ controls, etc…but it either got worse or totally whacked. Obviously, what I got is NOT what I intended. I am currently going over my BMP’s and settings.
Of note is the ‘MAGIC PINK’ that is not all that magic. (For any unfamiliar…WB should read it as transparent….however….anti-liaising and shadow effects and Bevel and Emboss effects will do things to the edge of your graphics that will change what WB reads…should it OVERLAP the magic pink. Magic Pink should be set at 255/0/255. The slightest variance will make it visible.) I noticed this right away and had gone back and THOUGHT I had made clean copies of all the bitmaps and then re-applied the Magic Pink, but apparently not.
Finally…if you look at what SS created…you will see ‘white lines’ that outline my slices. I have NO idea why.
Problems.
1. Sizing
2. Magic Pink
3. Slice borders
4 months is starting to look like a possibility.
AND…just for laughs….the practiced/achieved skinners will get a laugh out of this. This next pic is a vector of what I really wanted. It actually worked better than this one, with the exception of the bottom bar..it refused to conform in any way…and the magic pink. No matter what I did I could not make it ALL go away.
I would have liked to go with this one, but it is way beyond me. It was something special I wanted to do for Valentines Day that would have made it possible to personalize the skin in a way I have yet to see it done. Oh, well.
Final Note: The Icon Pack to match the blind that doesn't exist is complete. 140 plus icons that I refuse to let see the light of day until this *@!$#@ blind is done.
 |
|
Page 2 of 2 | |
|
|---|
PoSmedley
Reply #22 Friday, January 13, 2006 5:18 PM
Reply #22 Friday, January 13, 2006 5:18 PM
I'm trying. Honest. Fun, fun, fun. See, I'm smiling and evrything. Smile, smile, smile.
*Ignore the hostage negotiators in the background.
*Ignore the hostage negotiators in the background.
boopish
Reply #23 Saturday, January 14, 2006 12:46 AM
Reply #23 Saturday, January 14, 2006 12:46 AM
Chocolate and lots of it helps!! 
(and possibly distract those hostage negotiators back there!)
(and possibly distract those hostage negotiators back there!)
tameddragon
Reply #24 Monday, January 16, 2006 10:45 PM
Reply #24 Monday, January 16, 2006 10:45 PM
For those that have trouble seeing the images, right-click on the "x" where the pic would be, click Properties, then copy the url to a separate window. Once I opened each image separately, I refreshed this window and all was as it should be.
tameddragon
Reply #25 Monday, January 16, 2006 11:01 PM
Reply #25 Monday, January 16, 2006 11:01 PM
Po', thinking about it a bit, what I've done to get small parts of a larger image is to use the rectangular marquee tool in Photoshop in conjunction with the Info palette window. This lets you drag open an area exactly the size you need. Move the marquee to cover the area you want to use then copy. Open a new image using the clipboard preset and paste in your selection. You can then save it as a .bmp, .png, .tga, or whatever format you prefer. It's worked for me and is non-destructive to the original image.
pailhead
Reply #26 Thursday, January 19, 2006 11:04 AM
Reply #26 Thursday, January 19, 2006 11:04 AM
Nick, can I see your template for PHotoshop? I'm currently working on a concept for a skin, almost done. You can see it at my wc site (http://pailhead.wincustomize.com). But I'd like to see how you did everything if that's ok.
Thanks...
Thanks...
seldomseen
Reply #27 Thursday, March 2, 2006 12:22 PM
Thanks for the tip!
Reply #27 Thursday, March 2, 2006 12:22 PM
| For those that have trouble seeing the images, right-click on the "x" where the pic would be, click Properties, then copy the url to a separate window. Once I opened each image separately, I refreshed this window and all was as it should be. |
Thanks for the tip!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!
|
|
Page 2 of 2 | |
|
|---|
Reply #21 Friday, January 13, 2006 5:04 PM
I always do the start panel first...don't know why...just do. You'll see that the start panel is mostly square. I liked that but wanted it a bit softer so I made an image of what I would like the window and frame to look like:
basically I used the rounded rectangle tool, drew a rounded box of approx 400 by 400 px on a transparent background: then I added a "stroke" to outline it, then tinkered with the transparency slider until I liked the way it looked..then added drop shadow, inner shadow and inner glow. I saved it as a .png then opened SS, imported it and began "cutting" the per pixel frame: I moved the sliders at the right side until my image was 400px wide, then moved the bottom slider up until the size was 35 px. Then when I chose cut frame - choose "single image, multiple ...." This gives the proper image states.
I did the same for the bottom...but this time I moved the bottom and the right slider until my image said 400 x 400...then moved the top slider down until I was at 15 px. Cut the same as for the caption.
sides are easy for WB5....take the same images move the slider 35 down from the top and 15 from the bottom...now move it all the way left until you get to 15 px. Cut using same settings as above. For the right side, so the same...just remember to start with your image at 400 x 400 px and move the sliders accordingly until the right image is now 15 px wide. Cut and import.
The same basic rules apply for the start panel,especially if you want it to appear as one seamless unit. If you want it different images, make the header approx 380 w by 64 h (I usually use 35 h, because I like smaller user panes). I use .png's because I like the transparcy to be at about 95% for my programs and 85% for places image.
With WB5 if you are using ,png's there is no need to use magic pink. It changes the image to a .tga for you.
So if you want a "seamless" start panel...make a single image like I did for my window frames. Just make it approx 380 x 240. Import adjust the margins and get ready to cut.
Remember that the more programs pane comes into play....and when you "Cut" your programs image, make it the section below the user panel, and approx 190 px wide ... but approx 35 px above the bottom of the image to leave room for the more programs section (just remember where you stopped...and start there when you cut your more programs panel. The places panel is similar, but this time you cut to the bottom and move the left margin in so that the final image is 190 x 240.
Your image should match up...if not, check your "Sizing Margins" adjust so that they are all the same and you should be good to go!
Don't give up...keep a good sense of humor about the whole shebang and have fun!!!