Vectorials
Flash Perfection
3D Lessons
Tutorialkit
Markup Tutorials
Learn PHP
network
adv banner
Photoshop  Home Photoshop Web Layout Auto Layout
rss

Auto Layout

Author: amitk More by this author


Let's start with a new document
Size 760 x 780 pixels
Background color: #2b2b2b

Create a rectangle with a gray color and place it like me

image 1

Go to Filter > Noise > Add noise , and use the following settings:
You will be asked if you want to rasterize the layer ( press OK )

image 2

Then With Rectangle Tool , Create another rectangles with a yellow color. I have used: #e8b702
Place the shapes like me

Click to enlarge
Click to enlarge

Then for all this shapes, change the blending mode to Overlay

image 4

This is the result

image 5

Now i will give you 2 images, because we will need them.

Open the following images in photoshop

image 6

image 7

Then place the images like me

Click to enlarge
Click to enlarge

Then add the following layer styles for both layers with auto ( front , and back image )

image 9

This is the result

Click to enlarge
Click to enlarge

Select all the Yellow shapes layers

image 11

And press Ctrl+E ( this will merge all the layers into a single one , and in the same time all the layers will be rasterized )
Be sure that you still have the Overlay blending mode selected

image 12

Now let's add some details. Please find some crack brushes and add some details on your layout.
Soon i will release a Huge Pack for designers with styles, patterns, brushes, gradients, and all you need
Before you add this cracks in the asphAlt , you should create another layer ( press Ctrl+Shift+Alt+N )
This is my result

Click to enlarge
Click to enlarge

Create another layer ( Press Ctrl+Alt+Shift+N )
Load some Grunge brushes and add more details on your " Street "

Click to enlarge
Click to enlarge

Also a few Oil splats will be good.

Next step is to select The yellow shapes layer .
Grab Eraser Tool.
Use the following brush

image 15

And start Deleting parts of the yellow lines. This is my result

Click to enlarge
Click to enlarge

Now it will be good if you can add some stones on your layout. If you google a little i am sure you can find a lot of images, You can add also some grass if you want. this is only a idea

Now i will create another rectangles

Click to enlarge
Click to enlarge

For all this shapes, add the following layer styles

image 18

image 19

This is the result

Click to enlarge
Click to enlarge

Now add some text on your layout

Click to enlarge
Click to enlarge

Then Select Type Tool , Choose a small Font, and write some minus signs "-----" And place this layers like me, under the text

Click to enlarge
Click to enlarge

Select Ellipse Tool and make a simple shape

image 23

Then drag the shape under the car layer. It should be visible only a few millimeters

image 24

Then add the following layer styles

image 25

image 26

image 27

This is the result

image 28

Now Create a new layer ( press Ctrl+Shift+Alt+N ) , select A round Brush ( Soft Round 13 pixels ), and start creating some random lines with 3 different colors: #2e3136 , #434e5a , #ffffff

image 29

Next go to Filter > Blur > Gaussian Blur and use the following setting

image 30

This is the result

image 31

Now you can load a star brush, and make some simple stars with a white color

image 32

Now you can add any details you want. I will be happy to see more results
this is my final outcome

Auto Layout Tutorial: Final Result (Click to enlarge)
Click to enlarge

Thanks you very much for watching this tutorial.



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 "Auto Layout"