Loading...

Search Results in category “Web Layout”

Creating a Micro Button
in Web Layout
Creating a Micro Button

This tutorial will show you how to make a nice micro button like the one shown above. Also, feel free to download the .psd-file for this tutorial. Link can be found at the bottom of this page. Create a new transparent image, 150x50 pixels should be more than enough. ...

read more
Making a Website with Photoshop - Version 2
in Web Layout
Making a Website with Photoshop - Version 2

This tutorial will take you through the steps of making some graphic elements, slicing them, and saving for use on a website. After that I will show you how to position the elements using CSS - no tables, woho! Let's get started.. The website we're ......

read more
PhotoShop - Interface
in Web Layout
PhotoShop - Interface

Here you will be taught how to make tables for your interface. 1)Open a new file, around 300 x 250pixels, with any background color. I used black. 2) Make a white square on a seperate layer. Set the opacity to 45-55%. 3) Click on the Polygonal Lasso Tool. 4) Now cu...

read more
Gel Button
in Web Layout
Gel Button

It seems that as time goes by, the gel effect is becoming more popular on everything, now we will create a round button 1. Make a new image, we find about 100 x 100 px is fine, with a white background 2. Fill the background...

read more
Faded Background for Shout Boxes
in Web Layout
Faded Background for Shout Boxes

In this tutorial I will explain the simple steps for a faded background color for a shout box. I wasn't sure whether or not to put this under HTML or Photoshop, so I put in under Photoshop. 1) Open Photoshop and create a new image. The width and height should be ...

read more
Braille Dots
in Web Layout
Braille Dots

Make some small dots to use on you interface. 1. Star by creating a new canvas, any size you want. Fill the canvas with...

read more
Nice Content Boxes
in Web Layout
Nice Content Boxes

1. Create a new canvas Size: 160x160, Background: white Resolution: 72 pixels/inch 2. Set your foreground color to #F2F2F2. Radius: 15 px Paths (see second image below) Exclude to overlapping areas (see image below) 3. Now drag out a rounded rectangle that takes up most of th...

read more
Content Bars
in Web Layout
Content Bars

Today we will learn how to create content bars , and make them look very spify instead of plain and boring. Open a new document any size as long as it large enough for a content ...

read more
Beveled Button
in Web Layout
Beveled Button

Step 1. Start of by creating a new document (ctrl+n) with a white background. It should be width-100px height-50px Step 2. Alright, here we go. First you need a picture as a background for your button. I have preselected an image that you can use, or you can use your own. Next thing you ne...

read more

Copyright © All Rights Reserved