PhoNuts

Pages: 1 2

Create a clean web 2.0 layout with some flowers on the background and a stylish grey menu.

1. Create a new document (800*600).

2. Fill the background with #ffffff and look at the guides I’ve created in the screenshot below.

3. Now create a new layer (layer – new layer) and select a rectangle using your selection tool like shown and fill it with #465d63.

4. Create another new layer and make a selection like shown in the screenshot below. Fill this one using your paint bucket with #52676c!

5. Now we’re going to create some bars to create individual buttons on the menu… So use your pencil with a square 1px brush and draw something like this on your menu (note that the left stripe is 2px longer than the other one). The left color is #6a7b82 and the right one is #43585d. Don’t forget to do this on a new layer.

6. Now duplicate that layer a few times (layer – duplicate layer) and position them like this to create some sort of a button for the menu on the top of your design.

7. Select a rectangle like this and fill it with any color you like because in the next step we will add a gradient overlay so it doesn’t matter.

8. Adjust the blending options of the previously created layer and add a gradient overlay like I said using these settings…

9. In this step I’ve just added a little bit of text to the menu (microsoft sans serif, 11px). And a title for the site (la bamba let, 25px) unsing these 2 colors (#434343 and #d35c00).

10. Select your brush tool (change your foreground color to white #ffffff and also create a new layer) and use this brush (it’s not the one I used because the deviant member who made them has been banned) to insert some vector flowers… After this step you normally should move the text layer of your title above the one you’ve just created.

11. Create a selection like shown below and fill it with #ffffff. This can be used as a search box or somehting else if you’d like to add such a function… I’ve already added some text so it looks more realistic!

Pages: 1 2