If you have any questions or comments about this tutorial, please post them here.
Things you will need for this tutorial:
Fonts: FFF Galaxy and FFF Sailor Fonts can be found at Fonts For Flash
Go to this link: VC 3d Render Save the render on your computer.
Now go and open up Photoshop, and go to File/New and make a new image 635 X 150. Make sure the mode is set to RGB Color then you are all set. Now this brings up a white banner image. Now to bring up the render you saved. Go to File/Browse and find where you saved your render to bring it up. Once you have it up, then hold down the Ctrl + A to Select All, then hold down the Ctrl + C to Copy, then minimize that screen to get back to your blank banner image. Then hold down the Ctrl + V to Paste the render onto the banner. The render will take up the whole blank image, but what we are going to do is play with the Transform tool to get it to where we can work with it. Go to Edit/Free Transform. What I done with mine to get it to look like this was to scrunge it up a bit and moving it over using the Free Transform tool. Hint- You can achieve different versions by duplicating the render and using transform and playing with the eraser tool and blending tools as well.
Now to make some techno lines and cuts. I made a new layer then used a font called FFF Galaxy set at 4 pt, just type in 4 in the box, and using the color white, make a few rows of jibber jabber. I just type all crazy like, example would be dksjfniruetrijfn then hit the enter and type in mcyxmcmweiofjien, etc. to get the look that I wanted. I done this because I thought that things were too shaded in one area so I chose that area to stick this on to break it up a bit. Make sure you rasterlize the layer. You can do this by left clicking the text in the layer palette and choosing rasterlize layer. Then I faded it in by using the opacity in the layer palatte to 26%. Using your Eyedropper Tool, (HINT - If you right click you have the option of using the The Color Sampler Tool and The Measure Tool, and vice versa) you want to choose a color from your render image, I chose #717171. Right below the text, I made two more lines, one white and the other grey (#717171) and then faded both lines to 53%. Using your selected color go and make a new layer. Now if you do not have your layer window open, you can open it up by going to Window and clicking on Layers. Now that you have your Layer window open click on the Create New Layer button, and create a new layer it will looks like this:
With that empty space at top, use your Rectangular Marquee Tool, (HINT - If you right click you have the option of using the Elliptical Marquee, Single Row Marquee and Single Column Tools and vice versa).
Once you have your Rectangular Marquee Tool Selected, then make a new layer. Draw a box at the top of the banner and use your Gradient Tool. Then fill in the box by placing so that you are filling up and down. Using your Polygon Lasso Tool (HINT- Keep your shift button held down when using the Polygon Tool to make straight lines), draw a design like I have shown below in the gradient box, then hit delete. Then go to Edit/Stroke and then with the grey color you used previously, make the width 2 and hit ok. Now go back and do the same thing but this time, change the width to 1 and the color white. After that you will have something to look like this:
Let's clean things up a bit, in the left hand corner we want to delete out the lines where the deleted space is. I know that sounded confusing, but refer to the screenshot to see what I am trying to say. Use your Rectangular Marquee Tool over what you want deleted and then hit the delete button. Mine looked like this:
Now hit Deselect or Ctrl + D. Then make another layer and add the same grey color to make a pencil line over on the right hand side and then under it make another layer to make a white line underneath it. Mine ended up looking like this:
Awww details details, but they are all necessary to your design. Make a new layer. Using your Rectangular Marquee Tool go to the bottom of the banner, but leaving a little space at the bottom. Draw a box and use your Paint Bucket to fill in a pattern of your choice. If you have any questions about patterns, please refer to the pattern tutorial. Make another layer then right below it, fill in a solid color, I chose #320000. Make a new layer. Then using your Rectangular Marquee Tool again go to the middle of the banner. Draw a box and switch to your paint bucket and fill in a color of your choice, I chose #C1C1C1. Using your Polygon Lasso Tool (HINT- Keep your shift button held down when using the Polygon Tool to make straight lines), draw a triangle like I have shown below in the black box, then hit the delete button on your keyboard:
Now hit Deselect or Ctrl + D. Then go to Edit/Stroke and then with a grey color (#717171) and make the width 2 and hit ok. Now go back and do the same thing but this time, change the width to 1 and the color white. Now go over to add your site name. I chose FFF Sailor at 8 pt. Color white. Make sure to rasterlize the layer. You can use the move tool to position it where you want it. Then go back and retype the text again as before but this time make it black lettering. Make sure to rasterlize that text too. Now you are going to position the black text over the white and you can do this easily by using the Move Tool. Select the move tool and then on your keyboard, use the arrows to move the text up or down or left or right as needed. Hint- Then to make things easier on you later, in case you need to move the text around some more, once you have your text as you want it then go to Layer/Merge Down, this now makes the white and black text as a one. Mine looked like this when I was done:
Now we need something going on over in that grey area on the right hand side. Find the layer of the grey box, and this is where naming your layers comes in handy, but if you didn't name your layers then do this, on each layer hold down the Ctrl button and click on the layer. This will then show you what layer is what by showing the squiggly lines on that layer. Try it and see what I am trying to explain and probably not doing a very good job at. Once you have found that grey box layer then go over and use your Rectangular Marquee Tool again and draw all long rectangle then use the delete button and then go to Edit/Stroke and then with a white color and make the width 2 and hit ok. Now go back and do the same thing but this time, change the width to 1 and the grey color. Now I made some small gradient boxes at the bottom of that. To get them all the same size. Make your first box and then duplicate your first box and using the move tool, nudge them into place by using the right arrow key. I didn't like the plain grey box so I went back and found the grey box layer and then gradient filled it. This is the joy of making things up as you go! I also went back and done some cleaning up of the banner, such as the two lines in the beginning that we drew, it went overtop of the grey box with our text, I went and used the eraser tool on the left hand side and erased some of the two lines. Just to clean things up a bit. And then I merged down on the white and the grey line and duplicated it and moved it overtop of the dkfjdifjdksj text. I done this several times and placed them beside the text as well. Also, I added some more text underneath the site name, like a description of the site. I used FFF Galaxy set at 8pt. And typed in Graphic Resource Site. I also added two lines, color #320000, in the big grey box above and below the text. Also I added a thin black border around the banner. To do this, make sure you merge all layers then go to Select/All and then go to Edit/Stroke and I set my color to Black, and Width 1px. To get a better understanding what I done look at the screenshot:
Well I hope that I didn't make things too complicated for ya! But once you get the hang of it, abstract banners are not so hard to make afterall!
No comments:
Post a Comment