Whenever I’m designing an interface for a new site, i always like to have my safe starting points to build upon. Ill do a quick design of some general elements so that they are there for me to see, then ill go about detailing everything.
Good button design can be crucial to a good usable site so here’s my 60 second button design in Photoshop to give a good base to build on.
Here’s what you’ll end up with in next to no time by using these Photoshop layer styles. Simply use the rounded rectangle tool with a slight border-radius and add the following layer styles with the related settings to give you a cool button base to get you started.
Using these styles will give you the cool gradient effect and border. I added a shadow effect by duplicating the rectangle layer, applying a dark grey colour overlay with a Gaussian blur and warping it with the warp tool.
To give the text a letterpress effect i used a darker blue colour, added a 1px black inner shadow and a 1px white drop shadow. I also applyed a slight texture using a pattern overlay on the button rectangle.
This leaves you with a cool little button that can be further detailed later as your new website design takes more shape. Hope this helps you with your button design.