I’d first like to take a look at what exactly web 2.0 means, and what the need for a “new” web is.

As found on Wikipedia http://en.wikipedia.org/wiki/Web_2

“Web 2.0 is a trend in the use the World Wide Web technology and web design that aims to facilitate creativity, information sharing, and, most notably, collaboration among users.”

The design aspect however is bubbly, shiny, and vibrant. Eye catching, attention grabbing and user generated.

So what goes into a web 2.0 graphic?

ü Reflections

ü Gloss

ü Lighting effects

ü Shadows

These are just some of the many techniques used to create catchy graphics. Now that you have a fair understanding of what web 2.0 is and about what it looks like, let’s makes a couple buttons and logos.

Gloss and shadow text

I’m going to start with a transparent canvas of 200×100.

Next I’m going to fill the first layer 6F450B.

Next let’s grab our type tool, and the color F7941D

I used Impact as my font, since it has a thick profile. I also centered the text so the focus is not the text in the center.

Now with the magic wand click the outside of the text, then right click “select inverse” this highlights the whole text selection.

Create a new layer keeping the wand tool active so the text shape is on a new layer. Now take the “Ellipse tool” and cover about the top half of the wand shape.

Now set the master opacity 25% making the white section look like gloss.

Let’s put the shadow on now. Select the text layer, then go to the layer style options and select “drop shadow”

Here is the PSD file for this tut here.

Reflecting and lines inside text

Let’s continue with the same file but more editing.

We’ll start with the lines inside the text. Using the wand again, select the text, and then make a new layer.

Make sure the lines are beneath the gloss layer! I used 333333 for the color of the lines.

Reflection is fairly simple to do. Duplicate the text layer and the lines layer first.

Once duplicated go to Edit>Transform>Flip Vertical

Now we must tone these down put them both to 20% opacity.

That’s the tutorial. Here is the PSD for the lines and reflection.