Grafpedia

Sleek Portfolio Layout

If you are looking for a sleek and modern portfolio layout this is the right place to learn how to create one. This clean layout has a nice area for a sideshow, where you can feature your best artwork.
In this tutorial I will show you how to create a nice looking portfolio layout in a few steps.

This PSD layout can be used for a clean shopping cart.

Preview full size layout

Create a new document with the following size: 960×900 pixels. Please use a light gray as a background color: #ecebeb
Select Ellipse Tool, and draw a simple shape at the top of the website

Go To Filter > Blur > Gaussian Blur. You will be asked if you want to Rasterize the Shape. Please click on OK, and in the Gaussian blur window use the following values

Then change the opacity value to 50 % for this layer

This is my result

Select Rounded Rectangle Tool, and create a navigation bar

Duplicate this layer, and then drag it under the original one. Please note that I have used a white color for this shape

For the red shape I will add the following layer styles

This is my result

On the left side of the layout I will create a button with Rounded Rectangle Tool.

Then I will rasterize the layer, by right clicking on the layer, and I will choose Rasterize Layer. I will select Rectangular Marquee Tool and I will draw a selection

With the button layer still selected, I will hit on my Delete key , and then I will press on CTRL+D to deselect

With Pen Tool, I will create a triangle

Then I will select both layers: the small triangle the red button. After I will have both layers selected in my layer palette I will merge the layers (CTRL+E), and then I will add the following layer styles

This is my result

I will select Pencil Tool, and I will create a thin line with the brush size of 1 pixel

With Eraser Tool, I will delete some parts of this line. Please use a smooth round brush

Repeat the steps from above, and add another black line near the original one

This is my result

I will create a new shape with Rounded Rectangle Tool, and with Ellipse Tool I will create 2 circles. You will see the result on the following image

Select all these three layers in your layer palette, and merge them ( CTRL+E ). The next step is to add a simple layer style

This is my result

I will create another circle with Ellipse Tool, and in the same time I will add a arrow

On the bottom part of this layout I will create other shapes

In the middle of my layout, I will create a nice slideshow. I will add there some images from my previous tutorials

Then I will duplicate all this layers, because I want to create a shadow, under each image. I will explain how to create for a single image
Duplicate each image you want by pressing on CTRL+J , then with Move toll I will place it under the original one

With my copy layer selected, I will go to Edit > Transform > Flip Vertical

With Eraser Tool I will start erasing the bottom part of the layer

I will do the same for all my images, and then with Horizontal Type Tool I will add some text

On the top of the website I will add two more shapes. I want to create a login system for each client.

I will add other images from my last tutorials on the right side of the layout. This is my final result

Want access to the full PSD files for all our last tutorials, including this one? Register as a VIP member for only 49 $.

Be sure you will subscribe to our RSS feed, or follow us on Twitter to be notified instantly when we release something