Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Design a Creative Cosmetics Layout with Photoshop

Design a Creative Cosmetics Layout with Photoshop


I will start this tutorial with a new document with the following background: #ecece2
I will grab my Pen Tool and I will create 2 shapes like in the following image

Img

For both shapes I will add the following layer styles

Img

Img

Img

This is the result so far.

Img

I will duplicate the big shape, and I will resize it

Img

I will flip the shape horizontally (Edit - Transform - Flip Horizontally)

Img

I will place a stock image with a lipstick right under these shapes

Img

Create a new layer (press on CTRL+SHIFT+ALT+N) in the same time. With Brush Tool I will draw a strange drawing. Be sure you use a proper brush when you try to create this drawing.

Img

Now it is time to add some floral designs. If you remember a few days ago I have released a pack of vector swirls... You can download them from here: Vector swirls
Open the EPS file inside Photoshop, and then make a selection around the floral swirls you want to use. You can use Rectangular Marquee Tool.

Img

Be sure you have the layer selected, and then press on CTRL+J (this shortcut will create a new layer via cut). You will notice another layer on top of the original one. Please select it, and then drag it to the PSD layout. With the same technique you can add as many flowers you want over our beauty layout.
Please click on the image to see the full size beauty layout.

Img

Now it is time to add some text with Horizontal Type Tool

Img

Between text areas I will place some lines. You can use Line Tool

Img

On the bottom of the layout I will create some round buttons. I will create 4 shapes with Ellipse Tool

Img

You can see that I have used the same layer styles like I have used for the big shape. Over these circles I will add some icons

Img

On the right side (in the sidebar of the layout) I will create another shape with Pen Tool

Img

Here you can showcase some of your best beauty products. It will be a slide show. If you know something about jQuery I am sure you will not have problems to implement a simple
slide show.

Img

I will add another stock image with some make-up images. This is my final result

Img



Author's URL: grafpedia
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials


Like us to: