Posts by PSwish

W

Start off by creating a new canvas,  and fill it with a nice blue colour, we used #a4cbd9.

Using the free “Fertigo” font, write anything in white (#ffffff) colour.

Go to Layer >> Layer Styles >> Drop Shadow and apply these settings:

and, to outline the text a tiny bit, add stroke..

That’s it, really! Just press “OK” to apply your settings.

This was easy, wasn’t it? And if you want to shorten the way and learn directly from the PSD file, download it right HERE.

T

Again a very easy and basic tutorial that doesn’t require much knowledge and experience with photoshop.

Create a new layer, dark brown or any hue. Select the typing tool and type any word / letter on it. I have chosen to use the #d99003 colour for my text, font called ‘Ballpark Weiner’ (available for a free download : http://www.dafont.com/ballpark-weiner.font ) However, if you select any other orange hue, it would still be great.. dont forget that in order to achieve “gold”, you need to start off with orange color.

Click on Layer >> Layer Style >> Shadow.
Apply the following settings:

Go to Bevel and Emboss tab and apply the following settings:

Now, for the final touch, click on Filter >> Render >> Lightening effect. Apply these settings on the background layer (not to the text!) in order to give your canvas a little bit more depth. Naturally, this is an optional step, but is highly recommended in order to make your final result look truly polished.

There are so many tutorials and guides online that teach you how to make effective use of the web 2.0 design. While most these tutorials are useful, at the same time they kill the originality in web design. For example, most “guides” tell you that web 2.0 is about having a glossy badge, stripes background, and bold fonts. Result? There are countless hundreds of designs with badges, stripes and bold big letters… and they are no different from one another. It does not matter if you make a web 2.0, web 1.0, or web 75.0 design, it all comes down to being original and memorable.

However, if can’t really find anything particularly original to symbolize your design, it’s “safer” to go with the current trends of web design. So here is a very small fragment of web design layout, and how to turn a regular layout into a web 2.0 layout.

This is what we had…

And this is what we are going to do…

We are going to work in Photoshop, using nothing but layer styles; focusing on mild gradients and shadows.

Start off by using the Rectangular shape with rounded corners, and drawing a… rectangle.

What we need to do first is give our rectangle some depth and life. Following the principles of web 2.0 design, only shadows, outlining and light gradients will give us this effect. So go to layer styles, and drop a little mild shadow. We used #96aed6 for this purpose.

To give the shape a little depth (so it won’t look like a flat object), add mild inner shadow, with darker tone (we used #304f82 )

Lastly, its important to add a little outlining. We will use the #FFFFFF white color, since our shadows from both sides are darker, we want to have a light and semi visible line that will contour the shape.

After the successful release of “Precious Heart” on my other blog,

I decided to make a sister icon with a clover leaf. When I was in Prague last time I saw such an impressive variety of Swarovsky glass and it inspired me to make a graphic with similar structure, deep and subtly sparkling. Anyway, the download is free and you can use it any way you like The preview image is desized, otherwise blog template gets reformatted, you can previous the full version here.

Download FREE

A

(100 kb, zip folder with the 3 icons in PSD format)