GrafpediaPremium graphics for smart webmasters

Home News Tutorials VIP Downloads

RSS Feed

About Us Advertise

Grafpedia » Tutorials » Create a beauty layout in 10 steps

Advertise Here

Create a beauty layout in 10 steps

in Tutorials, Web layouts by admin on May 3rd, 200913 Comments

Search

In this tutorial I will show you how to create a layout for a beauty salon in 10 simple steps.These types of layouts do not have too much text.One of the most important part is the stock image used in this type of layout. I will try to create this layout in a few simple steps.

When you create beauty layouts try to use round shapes.

Preview full size layout

I will start with a new document with a white background, and with the following size 960 x 900 pixels.

retweet

6tweets

Beauty Layout

I will add a stock image on my layout

Sometimes it is very good to place the image first and you can create the layout based on your image.I will select Pen Tool, and I will create a nice curved shape. I will use the following color #ff9300

Then with the same tool I will create another shape

For the last time I will create another shape with Pen Tool

I will select Ellipse Tool, and I will create a simple shape on the right side of the layout

I will select all layers with the curved shapes, and I will press on CTRL+E to merge them into a single layer.Over the ellipse shape I will add some text and lines

Then in the middle of the layout I will add another text buttons

Then I will add on the bottom of the layout some images and text

Then I will add some circles on the middle of the layout, near the text buttons

Then in the middle of these small circles I will add other ones  with a white color

This is my final result.  I wanted to show you that you can create a website in 10 steps, and sometimes the most important part when you create a layout is the stock image used

I am waiting tomorrow for another tutorial. As usual our PSD layout is available free for the next 24 hours. If you don’t want to miss our releases please subscribe to RSS or follow us on Twitter

Download PSD Layout - Free for the next 24 hours

Digg Del.icio.us StumbleUpon Technorati Reddit

Advertise Here

Responses to “Create a beauty layout in 10 steps”

1.Sandeep 4.05.2009 um 1:36 am

Really nice layout… thanks!

2.moih60 4.05.2009 um 10:53 am

great tutorial..great work …..thanks

3.Edward.H 5.05.2009 um 10:41 am

wow! this is great tutorial, thanks very much! I’v submitted a link of this article to our website WebmasterClip in order to share it with morepeople.

4.Shobhit 7.05.2009 um 3:45 am

NICE.. keep up the good work mate

5.Mohan Kumar 7.05.2009 um 4:23 am

It’s Great Thank for u r Tutorial

6.photo retouching 8.05.2009 um 8:00 am

A really beautiful result. Thanks for sharing this tutorial.

7.Shibi Kannan 9.05.2009 um 6:37 am

Great tutI like the stock photo very much - as you said it is the anchor for the whole page. It would be nice if you could come up with more detailed explanation like the fonts used and other tips in touching up the Pen Tool effects etc

8.

admin 9.05.2009 um 7:28 am

In my next tutorials i will write more detailed infos about how to use the Pen Tool

9.Phil 9.05.2009 um 8:52 am

Looks great!One thing I’m wondering (since I’m a greenhorn): how do you convert it into a website from here? Per “Cut and Slice”? Or maybe cuting out the elements as single images and positioning them with the help of using absolute positions?Sorry for the question since this place is meant to be for experienced professionals only…

ThanksPhil

10.Shyam Kumar 14.05.2009 um 12:27 am

Great Tut Mate,But It would be wonderful if you would also publish the coding (CSS, HTML) along with the PSD tutorial. Beleive me your site will be the most happing on web world by over night. Think ’bout it, mate!

11.mourya 13.06.2009 um 1:00 am

it’s a nice joband i want to ask same quastion of shyam kumari till wait for thato.k thanks………….

12.admin 13.06.2009 um 3:25 am

We have already a tutorial on how to transform a PSD to xhtml/css website :http://www.grafpedia.com/tutorials/design-and-code-a-layout-withouth-using-slice-toolThe coding part is available for VIP members only.Thank you

Trackbacks

1. Stwórz świetny layout od podstaw - 26 niesamowitych tutoriali Photoshopa | Webdesigner blog

Leave a reply

Name (required)

Mail (will not be displayed) (required)

Website

submit comment

Learn More | Sign up

Advertise Here

Login

Username

Password

Remember me

Register Recover password

Grafplus lates downloads

Vector missile launcher Vector bug - Vector grasshopper vector bombs - vector torpede Vector bilboard Old style retro car in vector file format Vector army tank ACrobatic vector plane Vector military tank Vector acrobatic plane Vector speed boat

Subscribe to Grafpedia

Subscribe to our RSS feed and you can download unique premium downloads

Login

gfedcb

Enter your email address:

Categories

Actions Brushes Contests Designing Drawing Gradients Icons Illustrator Layer Styles News Patterns Photo Effects Stock Images Swatches Textures Tutorials Vectors VIP Downloads Web layouts

Advertise here

Advertise Here

 

Subscribe

Recent Comments

steve on Draw Fairy Tale Characters in Photoshop oppeneer on Create an awesome black portfolio layout Wholesale Printing on Create an awesome portfolio layout Wholesale Printing on Draw Fairy Tale Characters in Photoshop Jza on Design a two color website layout in Photoshop

Pages

About Advertise Contact us Vip Membership

Most downloaded resources

27.000 Photoshop Gradients Last Posts

48 Decorative Vector Flowers 10 Hi-Res Blank 3D software boxes Draw Fairy Tale Characters in Photoshop Hi-Res Square pattern brushes Design a two color website layout in Photoshop

© 2008 | Grafpedia is proudly powered by Wordpress