 |
|
| This Photoshop tutorial will show you how to create a portfoliol layout with 3 main colors. Click on the image below to see the whole layout. |
 |
|
|
| |
|
|
| |
First of all create a new Photoshop document with dimensions 740x470 and then fill the background layer with light grey (image a). Make new layer and then, using the rectangular marquee tool, make selection covering almost the whole document (image b), apart from a small section at the bottom. Fill the selection with white and then choose the rounded rectangle tool. Make a rounded rectangle, covering the empty space at the bottom (image c).
|
|
| |
 |
|
| |
| a) Click to enlarge |
|
b) Click to enlarge |
|
c) Click to enlarge |
|
|
 |
|
 |
|
|
|
|
|
| |
|
|
| |
Next, using the rectangular marquee tool, create a maroon rectangle, as shown in image a). ON a new layer above that create a light blue rectangle, leaving a pixel wide border left of the maroon rectangle. Image b shows the result zoomed in to 200%. Furthermore, create a dark blue rectangle on top of the light blue one, leaving another pixel wide border (image c).
|
|
| |
|
|
| |
| a) Click to enlarge |
|
b) Click to enlarge |
|
c) Click to enlarge |
|
|
 |
|
 |
|
|
|
|
|
| |
|
|
| |
Now, using the rounded rectangle tool create a rectangle, like the one in image a) and then a white one, like in image b)
|
|
| |
|
|
| |
| a) |
|
b) Click to enlarge |
|
|
 |
|
|
|
|
|
| |
|
|
| |
Select the rectangular marquee tool again, create a new layer, and then make a green/grey rectangle over the white rounded rectangle (image a). Make a selection out of the image, by pressing control and then right clicking on its layer in the layers panel. Contract the selection by 1 pixel, by going to select > modify > contract, and then delete the selected area, leaving a border behind. Next, using the rectangular marquee tool delete the top part of the white layer, as shown in image b). |
|
| |
|
|
| |
| a) Click to enlarge |
|
b) Click to enlarge |
|
|
 |
|
|
|
|
|
| |
| Create a rounded rectangle, like in the image below, and then go on to part 2. |
| |
| Portfolio Layout Part 2 |
| Click to enlarge |
 |
|
|
|
|
 |
