Elegant Layout photoshop tutorial

	Flash Game Design

Tutorials

Articles

Step 8.

This is part 2 of the Photoshop tutorial to create an elegant layout. Continuing the creation of the header, we're going to use another “ornament” shape. So, select the shape circled in the image below.

Step 9.

Create the next shape to the right of the first one we created, leaving a gape either side.

a) Click to enlarge

Step 10.

Now select the floral ornament shape, circled below

Step 11.

Create a small flower shape below the first shape we create and then rotate it, by going to edit > transform > rotate.

a)		b)

Step 12.

Move the shape like in the image below.

Step 13.

Create another floral shape to join the 1 st 2 larger shapes.

Step 14.

Again, we're going to create another one, working towards joining the pattern with the right side border.

Step 15.

Create the final shape, and the header is nearly finished.

Step 16.

Next we're going to layout the content. For the header text font I've used “Feena Casual”, which can be downloaded as a shareware font from 1001fonts.com. For the body text I've used verdana. You can see how I've layed out the content in image b).

a)		b) Click to enlarge

Step 17.

For the navigation text choose an elegant but readable type font like the one I've used (giddyup std).

Step 18.

Next, create your logo and place it where we create a gap in the 1 st shape in the beginning. I've used Arial black for “art” and “gaming” and Arial Narrow for “of”.

And so that's the end of the elegant layout tutorial!

Click to enlarge

Elegant Layout Part 1