Simulating a Windows Vista Interface

Here’s a quick tutorial that will definitely come in handy in a lot of situations. I’ve had to simulate this in this in the past when one of my clients started a blogging site about Windows Vista, and they wanted a Wordpress theme that looked like Vista. I’m also providing skins for some of my PHP applications, and having a Vista clone is always a plus.



null

To start out, let’s use the Rounded Rectangle tool with the Radius set to 10px.

null

We’ll give this box a black outer glow with the Blend Mode set to

Normal, and the size set to 13px. We’ll also add a slight white inner glow, and dark gray 1px stroke, a light gray color overlay set to 90% and a default gradient overlay.

null

Now to add the body of the window, we will use the Rectangle Tool to create a white box in the center of our window. Once again, we’ll use a slight outer glow, this time with the default Screen blend mode, and a white color. We’re also going to use a dark gray stroke similar to the color we used for the outside of the window.

null

To create the side buttons, our first step will be to use the Rounded Rectangle tool in the upper right hand corner of our window. We’ll rasterize the layer and then use the Rectangular Marquee Tool to delete the area of the shape which extrudes from the window.

null

To draw the window icons, I used some of the default Custom Shapes, and set the stroke to 1px with a light gray. For the red overlay, I simply made a rectangle over the area and then rasterized the layer, deleting the small portion sticking out of the bottom right corner.

null

Finally I added a rectangle as seen in the picture above. I set the fill color to white and the opacity to around 15%. I also turned on a white Outer Glow at 10px size.


null
Here’s our end result, both quick and effective:
null

 

 

Comments for Simulating a Windows Vista Interface

  1. HAROLD Says:

    < blockquote >< a href=”http://cheaptabletsonline.com/”>CheapTabletsOnline.Com. Canadian Health&Care.Special Internet Prices.Best quality drugs.No prescription online pharmacy. Online Pharmacy. Buy drugs online< /a >…

    Buy:Nexium.Valtrex.Petcam (Metacam) Oral Suspension.Zyban.Prednisolone.Lumigan.Human Growth Hormone.Accutane.Arimidex.100% Pure Okinawan Coral Calcium.Actos.Synthroid.Prevacid.Retin-A.Mega Hoodia.Zovirax….

Leave a Reply