Register | Login
BootSkins XP
Cursor FX
Dream
Icon Packager
LogonStudio XP
LogonStudio
Object Dock
Sound Schemes
Suites
WallPapers
WindowBlinds
All

Search
Forum Home | Login
We have re-enabled logins for the forums, please be aware that you may need to reset your password or register for an account again while we continue to restore full functionality.
artweasloh
artweasloh
Join Date 08/2004
+2

How to make transaparent "bitmap128" in Photoshop

for the newbies in Logons skinning...

August 4, 2005 10:27:04 PM from JoeUser ForumsJoeUser Forums
Creating a Bitmap_128

This tutorial is made to help understand how transparency and per pixel alpha blending is applied in bitmap_128 using Adobe Photoshop. To illustrate this, we will be using the bitmap_128 used in the Windows Vista Logon version 1.2 which can be downloaded here Link . Remember that in alpha channels or layers, black means transparent and white means solid. Any color between white and black would be semi-transparency of different levels.

1. First, create a new document with sufficient dimensions to hold all logon elements to be contained in the center panel. The commonly used dimension is 612 x 501. The background could either be white or any color or even transparent depending on your discretion.

2. Create a new layer and name it “Glass”. Press U to activate the shape tool . Choose the round rectangle tool and set it to 20px radius . Set your foreground to white and then draw your shape to the size you like onto the document.

3. Ctrl+click on the thumbnail of your “Glass” layer on the layers tab to make a selection exactly like the shape you just created. Go to the channels tab and create a new channel (its default name will be Alpha 1) .

4. To create a subtle shadow effect around your glass, set your foreground color to #636363. Press ctrl+alt+d to open feather selection window, set feather to 3 and press enter.

5. On your “Alpha 1” channel, press alt+backspace to fill the selection with the foreground color. Press ctrl+d to deselect.

6. to create that semi-transparent outline of the glass, go back to the layers tab and ctrl+click on the thumbnail of your “Glass” layer to select it. Return to channels tab, set your foreground this time to #c8c8c8. Press alt+backspace to fill the selection with the foreground color.

7. With your selection still on, go the Select menu, click modify, choose contract and set it to 1. Press ok.

8. Set your foreground color to #484848 and your background color to #282828. Press G to activate your gradient tool. Set gradient filling to Reflected Gradient and apply it on the image like here. Press ctrl+d to deselect.

That basically covers the main steps in creating transparent, per-pixel blended, glass-like bitmap_128. If you want to add more objects into the image, you can do so. Just go back to the layers tab and add your stuff there. But make sure that in your alpha channel, you specify whether these will have solid colors or semi-transparencies. To continue

9. In the Vista logon, notice the solid colors of the logo. It also has shadows. To accomplish that, you have to make another layer for the logo. Then Ctrl+click on its thumbnail to select it.

10. Go to the alpha channel and follow procedure #4.move your selection 4pixels left and 4 pixels down. Press alt+backspace. You will get something like this.

11. Now, go back to the layers tab and reselect the "logo" by control clicking on its thumbnail. Again return to the alpha channel; this time set the foreground to white. Press alt+backspace to fill the selection with white.

the complete alpha channel will look like this:

The actual image will look this way.




13. Finally, save the image bitmap_128 as 32-bit bitmap.

Last tip, if you would like your centerpanel images to have shadows, I suggest you use black as background color of your bitmap_128. However, if shadows are not included, then any background color can do. I hope this simple tutorial helped.


//The Sphynx//
tutorials
Locked Post
Search this post
Advanced Search
Subscription Options
Reason for Karma (Optional)
Successfully updated karma reason!
artweasloh
Black Xero
Join Date 10/2001
+21
Reply #1 August 5, 2005 2:55:07 AM
from WinCustomize ForumsWinCustomize Forums
Really nice and helpfull ...
Reason for Karma (Optional)
Successfully updated karma reason!
artweasloh
Tweety78
Join Date 01/0001
+13
Reply #2 August 5, 2005 4:32:17 AM
from JoeUser ForumsJoeUser Forums
Excellent tutorial, easy to follow and exactly what I needed since my logon's background isnt a solid colour so I dont have to match it to the background image like I did before. At first when I saved it I thought I did something wrong because in PS it shows it like your image with the black background and that glass box but when I viewed the saved bitmap, it was all white! but then I applied it to the logon and it was just fine and transparent. now that I get how to do it, I'll make a new one, this time with the glass box wider. Thanks a lot!
Reason for Karma (Optional)
Successfully updated karma reason!
artweasloh
StephenXP
Join Date 03/2007
0
Reply #3 March 27, 2007 9:41:20 PM
from WinCustomize ForumsWinCustomize Forums
My Photoshop (Photoshop 5.0) doesn't have the channels tab. . .or at least its not open. . .and i cant serach it in help because its the trial.
Reason for Karma (Optional)
Successfully updated karma reason!

Sign Up or Login and this ad disappears!
There are many great features available to you once you register. Sign Up for a free account and browse the forums without ads.

artweasloh
Double Zero
Join Date 07/2004
0
Reply #4 March 27, 2007 10:10:08 PM
from WinCustomize ForumsWinCustomize Forums
Yeah..32bit BMP's with Alpha can be a pain, or worse..LoL..

There are some apps that will convert your BMPS...do a google search... I think Aha View is one...there are others...

Good Luck..
Reason for Karma (Optional)
Successfully updated karma reason!
artweasloh
StephenXP
Join Date 03/2007
0
Reply #5 March 28, 2007 5:14:18 PM
from WinCustomize ForumsWinCustomize Forums
ok nvm my last post. . .i save as a bitmap (32bit) and then it just looks like the "actual image". . .when i make it as a splash does it look like the alpha?
Reason for Karma (Optional)
Successfully updated karma reason!
artweasloh
boss0190
Join Date 09/2005
+58
Reply #6 March 28, 2007 5:20:20 PM
from WinCustomize ForumsWinCustomize Forums
The black that shows in the alpha channel will not show when you use it as a splash....it will be transparent.

Anything white in the alpha channel will show fully opaque. Shades of gray define the level of transparency....closer to white...more opaque.

Closer to black, more transparency.
Reason for Karma (Optional)
Successfully updated karma reason!
artweasloh
StephenXP
Join Date 03/2007
0
Reply #7 March 29, 2007 9:20:50 PM
from JoeUser ForumsJoeUser Forums
thanks boss.
Reason for Karma (Optional)
Successfully updated karma reason!
View all recent posts
Mark all posts as read Delete cookies created by the forum Return to Top
Stardock Forums v        Server Load Time:   Page Render Time:


Home | About | Privacy | Upload Guidelines | Terms of Service | Help
WinCustomize © 2025 Stardock. All Rights Reserved.