Hello

This is the Tutorial number 68 from the 100 Marathon Tutorial
As i have told you i will try to add a tutorial each day.

Today i will show you how to create a Game Layout

Open a new document in photoshop
Size: 760x770 pixels
Background color: #333333

Select rectangular marquee Tool and create a big rectangle like in my following image



Go to Edit > Transform > Warp

And use the following settings:



After you will hit enter this will be the result



Now i will create a carbon fiber pattern
( To learn how to make a pattern please visit this link:
Professional Patterns for General Use )

To create a new pattern please open a new document in photoshop ( 4 x 4 pixels )
Zoom this document to 1600 % and with the pencil tool create small dots with the colors you will see i the next image



Then Go to Edit > Define Pattern...
Chose a name for your pattern and press Ok

Close this document and let's go back to our template

We will add now some layer styles for the white shape





Now you have to use the carbon fiber pattern




This is my result



Duplicate this shape, and change the size with the transform tools
Set the vertical scale to 90 % , then hit Enter



This is the result



We have to change the layer styles for this layer. So please add the following layer styles















This is my result



Now we will add more details.

I will add a stock image



Now create a new document
The size must be 350 X 1 Pixel with a transparent background


Select Gradient Tool, Set the following gradient



A few Thousand Gradients you can find in Talk-Mania Big-Pack

Create a new layer ( press CTRL+Shift+ALT+N )
Then with the gradient Tool Make a line from Left to right while you keep the SHIFT key pressed

this is the result



Now drag this layer on your game layout
Duplicate a few times , and place it like me



Now we will add the same lines on the right side of the layout but with a different technique

Create a new layer ( press CTRL+SHIFT+ALT+N )
Select rectangular marquee tool , and make a thin selection
You can use the fixed size



Then make the selection on the layout



Select Gradient Tool ( set to reflected gradient ) and draw a line from the middle of your selction to bottom
Then press CTRL+D to deselect and this will be your result



Add as many lines you want. I will add another one on the right side
Then i will add also some text buttons on the left side



Now you can add a text logo
On your text logo you can add the following layer styles





This is the result



You can add as many details as you want. This is my final result

Attached Files

	layout68.zip (708.3 KB, 1069 views)
	fonts.zip (37.0 KB, 731 views)

3D Logo Creator + Mega Pack + Photoshop Designer's Pack = Only 148$ ( save 150 $ - use coupon code: talk )

wow cool tank you so mutch

Really nice... and plzz keep making Game Layout.. like Counter Strike Source and more ^^ Thx Alot .. keep up the good work

Very nice, i was searching for a tut like this.
Only the font in the menu isn't a good choice.

very nice indeed

I have to try this one, ill be posting my result later

that is BLOODy AWESOME its Simple yet effective

it is really amazing


thank you mr.admin

i am trying this layout but could you tell me wich font you used for the buttons because its a nice font

thanks looolllllllll