by the stash, for the stash

Guest Information

Reviewstash isn't just another technology review website - it's your review website! Registered members can submit reviews to be featured on the home page, participate in contests, and ask questions in the forums - register today to get started! Registration also removes interstitial ads.
Topic rating: 0

#1 3/17/08 10:40 AM

sdm's Avatar
sdm United States
Gender: male
From: California
Registered: 12/08/07
Posts: 7704
Karma: 85
Note: Border Zoned
Reputation :   173 

Tags: [2.0, guide, help, ps, tut]

Open up a new 800x600 document in photoshop, put that aside, then save this image to your desktop.

Open that pattern.png into photoshop, then select the entire image and go to Edit ---> Define Pattern

You can then exit out of this image, but you'll need to use that pattern / fill in just a little bit.

Click back into your 800x900 image

Navigate to Edit ---> Fill, then select the pattern you just made, and keep the settings at "Normal, 100%", make sure the box is unticked.

You should then end up with something like this.

Next, make a new layer, and click on the rectangular marquee tool.

Click style, then select Fixed Size, type in "443" for Width, and "797" for Height.

Click Anywhere on the document and try to center it the best you can, with an even amount of white on the top and bottom.

Right click on that layer, and open up the Blending Options.

Put a tick next to "Drop Shadow", and setup the menu as follow.

You should end up with something like this, albeit better centered.

Now, make a new layer, and again using the rectangular marquee tool as I explained, use "800" for the Width, and "196" for the height.

Fill it in white, or black, it's up to you, just as long as you have it.

You should then center this layer behind your main box like this.

Right click on the box you just made in the layers menu, and select blending options, you're going to use these settings, if you want specific colors or information, let me know, but I figure it's up to you to do that.

You should then end up with this.

Now, make a new layer, and put using the rectanglular marquee tool, select a portion at the top and leave a small gap in-between your other box, most likely 1 or 2px, just a helpful tip, zoom in as close as you can so you can move your box acurately, you should end up with this.

Now that you have created the basic framework for a web 2.0 blog, you can add extra features to your photoshop mockup, I added thinner lines behind the green bar, a green title header, fake bars depicting content, and an RSS icon at the bottom, if you need any information post and I'll be glad to help you.

My finished version looks like this.


3/17/08 10:40 AM

Advertisement Bot

#2 3/17/08 10:14 PM

Dwijesh Sheth's Default Avatar
Dwijesh Sheth China (PRC)
Gender: male
From: Antelope, CA / Tianjin, China
Registered: 12/10/07
Posts: 861
Karma: 3
Reputation :   


Wow, thanks.


#3 10/22/17 12:59 AM

ReidWebo's Avatar
ReidWebo Bulgaria
Gender: male
From: Bulgaria
Registered: 9/23/17
Posts: 1
Karma: 0
Reputation :   

Tell to me, please - where I can read about it?


Board footer

Optimized for 1280x1024 @ 32 bit
Fueled by FluxBB
Top 20 Posts
Who's Online
Index Map
About Us