adv banner
Photoshop  Home Photoshop Web Layout Soccer / Football Template
rss

Soccer / Football Template

Author: amitk More by this author


Create a new document in photoshop

Size 760 X 770 pixels
White background

We have to create a new grass pattern . maybe someday i will show you how to create patterns from scratch

Today we will use the following image

image 1

Open this image in photoshop

Click on Ctrl+A ( this will select your image )

Go to Edit > Define Pattern...

Chose a name for your pattern and press ok

Now let's come back to our soccer template

Create a new layer ( press Ctrl+Shift+Alt+N )

Grab Paint Bucket Tool

Select your grass pattern

image 2

Then click one time on your canvas. I will not show you my result because this is a very simple step

Then Go to Filter > Render > Lightning effects and use the following settings

image 3

This is my result

image 4

Create a new layer ( press Ctrl+Shift+Alt+N )

Now grab your Rounded Rectangle Tool and create a shape on your grass

Set the radius to 15 pixels

image 5

Then apply the following layer styles for this rectangle layer

image 6

image 7

image 8

This is my result

image 9

Now Hold The Ctrl key pressed and with the left mouse button click on the layer thumbnail

image 10

This will create a selection

image 11

Select Elliptical Marquee Tool, press on Subtract from selection

image 12

Then start subtracting from your initial selection like in the following image

image 13

When you will release the mouse button you will have this result

image 14

Now Create a new layer ( press Ctrl+Shift+Alt+N )

Select paint bucket tool , and fill your selection with white

image 15

Then press on Ctrl+D to deselect

And change the layer opacity

image 16

This is my result

image 17

Now you have to add some text buttons on your layout

image 18

Then select Rounded rectangle Tool ( set radius to 5 pixels ) and create a new rectangle

Be sure you will drag this layer under the big shape layer

You can add the same layer settings as above

image 19

Now select this 2 layers ( first layer is the text layer with buttons , and the second one is the shape you have already created )

image 20

Duplicate this layers, ( to duplicate this layers you have to drag them to the " Create new layer " button

Then be sure you have selected this 2 new layers ( copies ), and press on Ctrl+E ( you will merge the layer into a single one )

Then drag the new merged layer to the top of your layer palette

image 21

With this layer selected go to Edit > Transform > Flip Vertical

Then move down your flipped layer with your arrow keys ( keyboard keys )

image 22

Now press on Add layer mask

Select Gradient tool and make a small line like in the following image ( from top to bottom )

image 23

This is my result

image 24

As you see we have created a nice reflection but our initial buttons are hidden . We will fix this problem right now

image 25

Select Eraser Tool , Chose a square brush , and start deleting ( you can hold down the Shift key when you will delete with Eraser tool )

Click to enlarge
Click to enlarge

This is my result

image 27

Now we will add some text. You can add your text alone. it is not so hard

You have seen that in the next images i have added another rectangle

You know already how to add a rectangle

Click to enlarge
Click to enlarge

Now i will add also some images , and also a text logo.

Click to enlarge
Click to enlarge

Of course we will add another details

For example i think it will look very good with a nice shadow under the big shape

Select Rounded Rectangle Tool . set your foreground color to a dark grey and make a simple shape like in the following image

Click to enlarge
Click to enlarge

With this layer selected go to Filter > Blur > Gaussian Blur ,

Photoshop will ask you if you want to rasterize the shape. Press OK

and use the following settings

image 31

This is the result

Click to enlarge
Click to enlarge

Now let's add also some shadow for the big ball

Select Ellipse Tool and create a shape ( place this layer under the ball layer in your layer palette )

image 33

Then go to Filter > Blur > Gaussian Blur and use the same settings as above

this is my result

image 34

Now you can add also some simple details. For example i will select my Type Tool and i will write on my canvas some simple minus signs " --------- "

image 35

Then i will add alone another details. This are only stock images.

This is my final sport template

Soccer / Football Template Tutorial: Final Result (Click to enlarge)
Click to enlarge

I hope you like it.



Author's URL: www.talk-mania.com

Rate this Material: Bad 1 2 3 4 5 Excellent
print this page tell a friend subscribe to newsletter subscribe to rss

Add comments to "Soccer / Football Template"