Create a grungy background using patterns: Part 2
I’ve been asked to do a tutorial on how to do my end result for the previous tutorial, so the end of the week article will be a continuation of the pattern tutorial. There is a lot of different ways you can play with this to make it grungy and dirty, this tutorial shows you what I did.
If you haven’t done the first half of this tutorial, check it out!
Step 1
Color is key to creating a mood. So this is the first thing we are going to add. The original tutorial was a basic gray, so there was no color to warm or cool the image.
For my image, decided to give it more of a warm feel. To do this create a new layer and make it your very top layer. Grab a yellow color and fill the entire document. Now we are going to change the blending mode, you can play around with them. There are a lot that work well, but for mine I used multiply with an opacity of 9%.
Step 2
The next thing I did was to make my logo pop. This can change a lot depending on what you used for a logo/text/image. I think it’s probably good to give it a shadow, if you want it to have some kind of a 3D look to it. What I did was split up my logo into 3 different layers for each color. Then I gave layer styles to each color, as you can see below.
Dark Gray:
Light Gray:
Red:
And this is what it comes out as:
Step 3
I then used one of the negative textures from Zen Textures (The one I used is on the far right of that page).
Since these are negatives, I usually do an inverse (control + I), then fit it into your document (control + t to transform and rotate the texture). Change the layer mode to multiply and move the layer so it is just above the pattern layer.
Step 4
Now that looks good, but we can go a step further by adding some texture to the logo.
I am going to pull in that texture into the document again, so that it is the original size. Then get the inverse with control + I and change the blend mode to multiply. Now move it around the texture until you find an interesting texture over logo/text/image. If you don’t like anything in the texture, you can go and grab another one with a more interesting texture.
Step 5
We want to get rid of the excess texture, so go to your square layer and control + click to load the square. Then do control + shift + I to get the inverse selection, then delete.
Step 6
Create a new layer just below the logo texture, and load the square layer again, and then click on the gradient tool, make sure black is your foreground color. Click on the black to 0% opacity option. Click and drag a gradient from the bottom right corner to the top left, togive the logo a shadow. Play around until you get something you like.
Final
Here is the final outcome for both the patterns. The carbon fiber effect uses the same steps, but with its the carbon fiber pattern.
With the carbon fiber pattern:
With the metal pattern:
Our complete set of F50-531 practice questions and HP0-Y31 gives you a hand to success for pass4sure 70-518 exam.
This was very helpful. Learning how to use the texture will be huge. Thank you.
Awesome, thanks for following up the last tutorial. Thanks for the tips.
great tutorial, thanks!
published at http://www.psaddict.com
Great site this http://www.denisdesigns.com and I am really pleased to see you have what I am actually looking for here and this this post is exactly what I am interested in. I shall be pleased to become a regular visitor :)
[...] Create a grungy background using patterns: Part 2 [...]
Thanks for the Tut!!
I’ve made one for myself with a few adjustments!
http://alignwebdesign.nl/images/Playerz69.jpg
nice site this http://www.denisdesigns.com excellent to see you have what I am actually looking for here and this this post is exactly what I am interested in. I shall be pleased to become a regular visitor :)
Great! I’m glad you like it
[...] Want to know how I got that grunge effect? Check out part two of the tutorial. [...]
Love the metal pattern. It looks really cool. The overall effect is really cool, sleek and grungy. Awesome tutorial, thanks for posting this!
brill site this http://www.denisdesigns.com terrific to see you have what I am actually looking for here and this this post is exactly what I am interested in. I shall be pleased to become a regular visitor :)
[...] Want to know how I got that grunge effect? Check out part two of the tutorial. [...]
Simply great outcome
Thanks
Thanks Denis, Great tutorial
Hi, this one is indeed nice tut :)
Btw,
I made it to the step one but totally lost on step two.
Can this tutorial be applied to object or text? Because I made it on square and it looks like a mess :D
When you say ‘split up my logo into 3 different layers for each color’
Does it mean duplicate the layer and apply the style or make a new blank layer and apply the style? What do you do after that? Merge it?
How is the layer arranged (Dark>Light>Red? or merged?)
What is the layer type, opacity or fill? Is it default?
Sorry for the long question, thanks before & after!
@Arve
You can apply this to text but I would still add the gray box around it.
When I said that I split up the logo, I used the magic wand and clicked on each color and did control + J to duplicate it to a new layer. Then I added the layer styles shown above to each one. After I put them into a folder, I didn’t merge them.
The layer type on the logo parts is set at normal, 100% opacity.
Great tutorial. this is what I came up with
http://i614.photobucket.com/albums/tt228/Vigilante212/Meshbackground.jpg
waste of my time
Thanks for this, Featured in Tutorial King
A good tutorial, although I think sometimes you missed to explain everything and went on to fast.
My final result was okeyy :p
Nice tutorial with a beautiful example - thanks!
very nice tutorials, going……..
Very nice tutorial and logo =)
Nice effect
bravooooo
excellnt keep up the good work!!
Great stuff! Really easy to follow, and it taught me a lot about how to achieve some really nice-looking effects. Thanks very much for posting this tutorial!
[...] Create a grungy background using patterns [...]
Thanks so much. I used it to make an album cover.
http://s474.photobucket.com/albums/rr103/Captaincaption/?action=view¤t=ExperimentsInHardcoreAlbumCover.png
Thanks, Great tutorial
when I press ctrl + I to inverse, it turns into a darker blue color. And when I do the multiply,it changes to even darker blue with the metal pattern. Please help me. Also give me the exact link for your zen texture.
Will:
Make sure you have selected the texture layer first and then do Ctrl+I. It should still be black and white, just opposite. Here is the link to the right texture: http://www.unsigneddesign.com/film/3.jpg
Thank you Tyler =)
exelente tutorial muchas gracias x el aporte…
Muy bueno el tutorial, gracias, éste fue mi resultado :)
“Very good tutorial, thanks, this was my result:)”
http://pruebajoomladh.net63.net/dinhouse.jpg
Super tutorial! The result is really great.
It’s arduous to search out knowledgeable people on this topic, however you sound like you realize what you’re talking about! Thanks! I’ll surely come back and check for updates! Tschau
Useful information. Lucky me I found your website unintentionally, and I am surprised why this twist of fate didn’t took place earlier! I bookmarked it.
Excellent Tutorial. Thank you for this one! :-)
Generally I do not learn article on blogs, however I would like to say that this write-up very compelled me to check out and do it! Your writing taste has been amazed me. Thanks, quite great article.
Definitely worth the 3 hours I spent trying to figure it out… final product was a sick background for my website.
http://www.lazersaur.com
Writing could have been a lot better… there was a lot missing from the instructions. Thank you for sharing!!