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

Sport Layout


I will start this layout with a blank document with the following sizes: 760x770 pixels.

I will place a image from my personal stock photo collection:

Sport Layout image 1

Then I will download the following set of brushes stars flower brushes and I will load this set of brushes in photoshop.

I will create a new layer ( to create a new layer you can press in the same time on (Ctrl+Shift+Alt+N).

With Brush Tool:

Sport Layout image 2

and with the following brush. I will add some details with this great brush:

Sport Layout image 3

I will grab Eraser Tool and with a soft round brush selected.

Sport Layout image 4

I will delete the edges of the sun rays.

Sport Layout image 5

After that I will use another brush from the same package.

Sport Layout image 6

and on a new layer I will add another details.

Sport Layout image 7

With Rectangle Tool I will create a navigation bar:

Sport Layout image 8

I will create the following layer style with the following proprieties:

Drop Shadow

Sport Layout image 9

Inner Shadow

Sport Layout image 10

Inner Glow

Sport Layout image 11

Gradient Overlay

Sport Layout image 12

And this is my final navigation bar:

Sport Layout image 13

With Line Tool I will create a 1 pixel vertical line. I will place this line right above the navigation bar:

Sport Layout image 14

Now you have to right click on the line layer in your layer palette, then choose Rasterize.

With Erazer Tool selected, and with a smooth round brush, please delete the top part and the bottom part of the line:

Sport Layout image 15

I will duplicate this layer several times, and I will place it like in the following image:

Note: To duplicate a layer you have to select the layer first in your layer palette, then you can press on Ctrl+J.

Sport Layout image 16

With Rectangle Tool I will create another shape with the following color #f1f1f:

Sport Layout image 17

I will rasterize this shape too by right clicking on the layer, and choose rasterize shape:

With Eraser Tool I will delete one more time some parts of the shape. I will use one more time a smooth round brush:

Sport Layout image 18

and this is my result:

Sport Layout image 19

I will download one more time a set of great brushes from Blue abstract brushes and from this set I will choose the following brush.

Note: set your foreground color to #cdcccc.

Sport Layout image 20

This is my brush ( on a new layer of course ):

Sport Layout image 21

I will create another rectangle with Rectangle Tool:

Sport Layout image 22

Rasterize this shape, then with a smooth round brush and with eraser tool selected, you can delete some parts of the rectangle.

Sport Layout image 23

I will create some dotted lines with Horizontal Type Tool:

Sport Layout image 24

I will write some dots (.........).

Sport Layout image 25

As you see I have a few lines on my layout. There are done the same with Horizontal Type Tool.

Sport Layout image 26

After that I will create a new layer (press Ctrl+Shift+Alt+N) and with the Brush Tool, and the following brush selected.

Sport Layout image 27

I will add some details to my layout. You can use different layers for each detail you add on this layout.

Sport Layout image 28

With Rectangle Tool and the following color #dcdcdc I will create a rectangle and I will place this rectangle like in the following image.

Sport Layout image 29

With Brush Tool and the following brush selected. I will add a splat on this rectangle (do not forget to create another layer).

Sport Layout image 30

I will download a great set of people custom shapes from People shapes - Silhouette shapes. I will load this set of custom shapes in photoshop, and I will select the following custom shape.

Sport Layout image 31

With a black color #000000 I will place the shape like in the following image.

Sport Layout image 32

I will select a different shape:

Sport Layout image 33

and I will place it on the left side:

Sport Layout image 34

Then with Type tool I will add alone some text. Please use different fonts, and at the end you will have something like mine.

Sport Layout Tutorial: Final Result



Author's URL: victor
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Advance your current skills or acquire new skills in Photoshop by creating projects using our step-by-step tutorials. More Tutorials: Most Popular Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

Add comments to "Sport Layout"

Only registered users can write comment

No comments yet...