Photoshop Tutorial – Design a Simple Yet Effective, Clean and Shining Button for Your Website

In this tutorial, I will show you the method I use to create a stylish, clean and shining button for your website in Photoshop. This method is extremely simple with no more than five steps, yet it’s very effective since you can use the button for a wide range of occasions. Along the way, the tools we will be using include the shape tool, layer blending options, brush and eraser tool. This tutorial is suitable for...

Photoshop Tutorial – Create Clean and Fresh Call-to-Action Button + Embossing Text Effect

In this tutorial, I will show you how simple it is to create effective, clean and fresh call-to-action button that will surely attract visitor’s attention, plus a super quick way to create this trendy Embossing text effect in Photoshop. Very easy tutorial, have a try! For those who haven’t yet came across the idea of “Call-to-Action” button – basically they’re buttons that you would want all your users...

Photoshop Tutorial – Draw a Rather Cute, Unique Style “Play” Button

In this tutorial, I will show you the process I took to create this rather cute, unique Style “Play” Button in Photoshop. It’s a simple (aimed for PS beginners) but fun tutorial, have a try The primary goal for this tut is to show you the functionalities behind the draw tools, selection tool and the use of layer blending options. I also added my own design ideas to make this play button a bit unique. Hope...

Photoshop Tutorial – Mac style web button

1. Create a rectangle with the Rounded Rectangle Tool using 12px as Radius then click over the layer and Raterize it.   2. Now add a Gradient Overlay: #e6e9e2 to #ffffff 3. Then a Stroke with #b7b7b7 as color 4. You should have something like this: 5. Now while pressing Ctrl, click over the thumb of the layer and then go to Select/Modify/Contract and put 1 px. Fill with any color and go to...

Photoshop Tutorial – Basic Sleek Button

Step 1 First up create a new document – I’ve made sure that I have lots of room to work with so I chose 540 by 440 as my size. Fill the background with a dark gradient or just a solid colour (Edit > Fill and use a colour like #262626) if you don’t know how. Step 2 Create a new layer (Layer > New > Layer). Select the rounded rectangle tool and use the settings below. Left click somewhere in the...

Photoshop Tutorial – Multicolored Menu Bar

Step 1. Start off by making a new Photoshop document. Choose the rounded rectangle tool, set the radius to 12 pixels, and create a wide rounded recntalge, as shown below, It doesn’t matter what colour it is because we’ll be creating a gradient with the shape next. Step 2. Choose dark maroon (6f1300) for the foreground color and a lighter shade for the background color (c82e00)....

Photoshop Tutorial – Awesome Gel Buttons

For something different, here is a try at a Photoshop tutorial. I haven’t done one of these since 2001 or so, but I figure I’d share this little trick for making cool gel buttons in Photoshop. I originally used some tutorials to learn this then made some tweaks and tricks of my own which I will share here. Here is the gel button: 1. File -> New Create an image that’s 250px wide and 250px tall. The size...

Photoshop Tutorial – Create a glossy button

Use Adobe Photoshop and tehniques like layer styles and blending modes to create a funky glossy button in very few steps. Step 1. Start with a new document sized 400×125 and fill it with a grey color. Create a new layer and name it “button”. Grab the Rounded Rectangle Tool 6 pixels roundness and create a shape like below using an orange colour #f98315. Step 2. On this step you will add a shine to the button....

Photoshop Tutorial – Classic glossy button

In this tutorial first launched in 2001 shows you how to create a glossy button that was used frequently in webdesign. Step 1 Open a new document that is 200x50px, 72 DPI, and White Background. Set your foreground color to any color I used #0F10A0A , grab the Rounded Rectangle Tool, and on a new layer make a body that will soon be the button.: Fill the shape with any color you desire. I filled it with a dark...