In this tutorial we will walk through the process of creating a grunge poster. We will cover techniques like creating diamond shaped patterns, knocking out white backgrounds and keeping layer transparency. This tutorial includes a text version as well as a video version. Both cover the same techniques so take what you prefer and enjoy!
Final Image Preview
This video tutorial covers everything in the text version below but as a neat video.
Open up Photoshop and create a New Document. Make the size 2846 x 4267 at 300 ppi.
Change the foreground color to a nice blue. For the color type in #4DC8F0 and click OK.
On the toolbar select the Rectangle Marquee Tool. Now select about half of the document and fill it by pressing ALT + Backspace or use Edit > Fill.
With the Rectangle Marquee Tool still selected, select the other half (the white area) and use the color #505050 to fill that area.
Open the resource support files for this tutorial and open the Render.png file in Photoshop. Edit > Copy and Edit > Paste this file into your main document.
Double click on this Render layer. This will bring up the Layer Styles window. Click on the checkmark for Color Overlay. In the Color Overlay options click on the color picker and type in the color #F1496D
Now we are going to make our own pattern. Create a new document and make the size 400 x 350 at 300 ppi.
Click and hold on the Lasso Tool to bring up the Polygonal Lasso Tool.
Now make a cool looking shape. Try holding down SHIFT while using the Polygonal Lasso Tool to create perfect straight lines. When your done with your shape make sure you connect it at the end. It will show an O next to the Polygonal Lasso Tool icon.
Now create a new layer. Press D on your keyboard to reset your colors to the default White and Black. Now fill your shape with black. You can do this by pressing ALT + Backspace.
Duplicate this layer and then press CTRL+T to bring up the transform box. Now right click on the transform box and choose flip horizontal. Using the Move Tool, move it to the right until it looks good.
Choose Image > Trim. Then make sure Based On is set to Transparent Pixels, and all of the Trim Away checkboxes are checked. Click OK.
Go to Edit > Define Pattern. Name the it Pattern One and click on OK.
Now go back to your main document and create a new layer. Don’t close this new pattern document, we will use it later.
Name this layer Pattern One. Choose Edit > Fill. In the Use drop down box, click on Pattern. Then click on the Custom Pattern drop down arrow to select the Pattern we just created. It will be the last in your list. Then click OK.
Double Click on the Pattern One layer. This will bring up the Layer Styles dialog. Click on the checkmark for Color Overlay. In the Color Overlay options click on the color picker and type in the color #505050
Take the Rectangle Marquee Tool and make a selection around the inside of the pattern. Right click on the selection and choose Layer via Cut. This will create a new layer with only that selection.
Now shrink the pattern down. Press CTRL + T to transform and drag the bounding box down to make it 25% smaller.
Create a New Layer and choose Edit > Fill and use the same pattern to fill it.
Double Click on this layer to bring up the Layer Styles dialog. Click on the checkmark for Color Overlay. In the Color Overlay options click on the color picker and type in the color #4DC8F0
Press CTRL + T to transform and rotate it -30 degrees. Move it down as pictured below.
Now go back to the pattern document. Go to Image > Canvas Size and increase the size by 100 pixels on the height and the width. This will add some padding to the pattern. Click OK.
Now that you have the padding, go back to Image > Canvas Size. Increase the width and height by 200 Percent. Change the Anchor position to top left. Click OK.
Duplicate the pattern layer and move it to the bottom right. Make sure it has about the same padding as the top left pattern.
Now make a smaller pattern. Go to Image > Image Size and make the width 104 pixels. and click OK
Go to Edit > Define Pattern and name your pattern Pattern – Small – Diagonal. Click OK
Go back to the main document and create a new layer. Then go to Edit > Fill and select Pattern from the Use drop down box. Choose the last pattern we created in the Custom Pattern drop down. Click OK.
We want the pattern white, the easiest way to accomplish this is to Invert it. Press CTRL + I to invert.
Press CTRL + T and rotate this layer -30 degrees.
Make sure the layer is selected and click on the Add Layer Mask button at the bottom of the Layer panel.
Now click on the Gradient Tool and make sure the gradient is a black to white gradient.
Drag the Gradient Tool to create a mask. This will fade out the pattern. You will have to experiment.
Open Eat_This_And_Die_Vectors.eps from the Resource Support Files inside of Illustrator. Using the Select Tool, select the circles and drag them into your Photoshop document.
Note: If you don’t have Illustrator, you can open it inside of Photoshop and then manually copy and paste it in. Secondly, if you don’t have Illustrator, you should get it! 🙂
Press CTRL + T and increase the size. Then move it into place. Press the checkmark on the top or hit Enter.
Name this layer Circles. Double Click on this layer to bring up the Layer Styles dialog. Click on the checkmark for Color Overlay. In the Color Overlay options click on the color picker and type in the color #4DC8F0
With the Rectangle Marquee Tool, Select an are in the bottom right of the document. We will be adding some text there.
Fill that rectangle black and lower the opacity to 15%.
Using the Type Tool, type in some text over the box. I typed in MAKE ART.
Open the Brushstrokes.jpg image from the resources folder into Photoshop. Press CTRL+A to select all and then press CTRL+C to copy layer. Now open the Channels panel and click on Create New Channel button.
Press CTRL+V to paste the data into this Alpha Channel.
Press CTRL + I to invert the alpha layer. Now CTRL Click on the Channel thumbnail to create a selection. Copy and Paste this into your main Photoshop document.
Make sure the border layer is on the very top of the layer stack.
Double click on the layer to bring up the Layer Style dialog. Check Color Overlay box and change the color to #505050.
CTRL Click the layers thumbnail to create a selection and fill this selection with black a couple times to make it darker. Name this Layer Border One.
Duplicate the Border One layer and press CTRL + T and scale in the right side to fill the screen. Name this layer Border Two. Created a mask on Pattern Two and masked out a few areas so it doesn’t look so boxy.
Set the Opacity for Pattern Two to 37%
From the resources folder, open the Eat_This_And_Die_Vectors.eps. Select and drag the arrows into the Photoshop document.
Name the layer Main Arrows and scale it up a bit and place them in the center. Move the Main Arrows layer to the top, below the Border and set the Layer Mode to Saturation.
Copy and paste the Flare.jpg into your document and center it. Name this layer Flare and set the Layer Mode to Screen.
Copy and paste the Clouds.jpg into your document and put them into the bottom left as pictured below.
Set the Layer Mode for the Clouds to Luminosity at 27% opacity. Now create a Layer Mask for the clouds
With a soft brush, start masking the edges of the clouds so they blend in with the other layers.
Copy and paste Stained_Paper.jpg into the main document. Set the Layer Mode to Multiply.Make sure it is at the top of the layer stack.
Double click on the Make text layer and set the Color Overlay to a turquoise color. I used #40968d
Right click on the layer and choose Copy Layer Style. Then right click on the ART text layer and choose Paste Layer Style.
Now for the main text we are going to use HelveticaNeue LT 63 Medium Extended. Type out the words EAT.
Move the EAT layer above the the borders and set the Layer Mode to Overlay.
Type out the rest of the text and use CTRL+T to rotate and flip the text to your liking.
Open Drips_and_Spray_Paint_V1_1006.jpg. Select all using CTRL+A and CTRL+C to copy.
Create a new channel in the Layers Panel and Invert the layer (CTRL+I). Now CTRL Click the channels thumbnail and copy the selection.
Paste it into your main Photoshop document and scale it down. Put it over the DIE text layer.
Set the Layer Mode of the spray paint to Overlay.
Duplicate the Main Arrows layer and move/rotate into the top left hand side.
Double click on the layer to open the Layer Style and choose Color Overlay. Choose a nice dark brown color.
With the Main Arrows Copy layer still selected CTRL + Click on the Border One layer thumbnail. Then click on Add Layer Mask.
Open Oriental.JPG and copy and paste it into your document.
Go to Edit > Define Pattern and name your pattern Pattern – Small – Diagonal. Click OK and set the Layer Mode to Linear Dodge (Add). Set the opacity to 54%. Make sure the layer is just above the Clouds layer.
Copy and paste This_Guy.JPG into your document just above the oriental.jpg. Set the Layer Mode to Soft Light.
Change the Main Arrows Copy to a dark gray or black color using Color Overlay.
Create a new layer called Gradient Top. Make sure it is at the top of the layer stack and choose the Gradient Tool.
In the options bar click on the down arrow and choose the Violet, Green, Orange gradient. Also make sure the Linear Gradient button is selected.
Drag the Gradient Tool from the top left to the bottom right. Experiment with this.
Now set the Gradient Top Layer to Color Dodge at 69% opacity.
Create a Layer Mask for the Gradient Top layer. Click on the Gradient Tool and choose the black to white gradient. Make sure to select the Radial Gradient.
Play around with masking out areas while focusing attention to the type layers. Change the Opacity to 62%.
Finally, create a layer called Shadows on the very top of the layer stack and choose a nice soft brush at 1100 pixels.
Paint in all four of the corners. Drop down the opacity if your think it is too much.
You final design should look similar to this. In this tutorial we used elements from our Arrows, Brushstrokes and Drips and Spray Paint pack. Check them out and create something awesome!
Wow.. Just wow! Awesome!
Great tutorial! Very nice output. i’ll definitely use this later.
thanx alot .. it’s really owesome 🙂
Wow! Very nice!
WOW! great i added a little to the text to add some personalizations to it but all aside… amazing tutorial!
I love the detail in this tutorial! Can’t wait to see some more……
i used this .. and its awesome .. 😛
I can’t seem to open the .eps files…does anyone have any advice? I have PS Elements and also tried Typepad, Vista Word.
Thanks for any advice. I really want to make this cool graphic!
Cool tut. really simple to follow and clear all throughout, thank you, hope to see more soon.
I so badly want to try this out but Im having trouble in downloading the Support Files. Anyone Please help 🙂
Well explained tutorial. Result really cool. Thanks for sharing this nice tutorial.
Hey!Thanks for the great upload.This one is very helpful.Your site rocks!
Amazing! Jeya Congratulations.
Well thank you very much for detailing the steps.
am I able to use this with photoshop elements 8? Having trouble getting the download file
really beautiful poster designs, we can learn many techniques about that grunge design tutorial.
Making poster in Photoshop is easy and enjoyable ….
Nice Job you have posted!!!!
Thank you, you are a master teacher and a great designer
Hey! ABSOLUTELY AWESOME TUTORIAL!!
I’ve used here, with a few changes. Hope you like it! http://mathan552.deviantart.com/#/d2rewcy
i wouldnt say it is the koolest thing i’ve ever seen but you did good……..
So colorful creation! I am trying to create as like as this one. Thanks for sharing this tutorial.
Amazing tutorial, I have came across 47 steps tutorial in some website, but you have crossed that too. you have 74 steps, step by step explanation is wonderful.Thanks for sharing
Really love this design!
I will definetely have to try this one out =D
nice tutorial. attractive, and coool design
Wow!! great tutorial I will try to it. thanks for sharing
toooooo good! 😀
love the detail in this tutorial! Can’t wait to see some more……
Really a creative, useful and excellent full tutorial. Keep it up. Thanks to share with us this amazing tutorial.
oh my you’r so kind!! and angel baby!!!! ^^
Great tutorial and nice design I am try to as like this one design.
Really awesome tutorial. It is useful tutorial for us. Keep it up. Thanks for sharing.
Excellent tutorial, thanks for share.
A good sharing with well explanation that will help everyone to practice it.
Really it’s a amazing professional tutorial. Thanks for sharing.
Amazing tutorial. Thanks for sharing.
Great tutorial. Really helpful. Thanks for sharing such a awesome post
Really great & colorful creation. I’m loving it. Thank you very much for sharing
this is really nice tutorial, it would be helpful for people, its actually save time that’s the main thing, thanks for sharing, nice work.