|
|
|
Photoshop Tutorial: Masthead Tutorial - Smashingly Fabulous
Here is a step-by-step tutorial on how I create my monthly mastheads. Sometimes if I’m stuck for a theme, I just start throwing random things together and eventually it morphs into a creative visual narrative. I have a tendency to go overboard and create a dozen different versions of a masthead, so quite often I need to remind myself that keeping it simple works best.
This is the masthead of which this tutorial is based on. Of course you will want to select your own colours and images to suit your own creative style.
Step 1: In Photoshop, create a new document the size of your masthead (my mastheads are 750 pixels wide by 100 pixels high).
Step 2: Start with the background layers and name the first layer “gradient”.
Using the Paint Bucket Tool  , fill the area with white (we will create a gradient using a layer style instead of the gradient tool, which allow us to easily make changes later on). Double click the “gradient” layer to open the layer style window. Apply the settings as shown below, picking your own gradient colours (double-click on the gradient slider and then double-click on each coloured square to choose colours.)
Step 3: Create a second layer and name this “halftone dots”. Press “D” on your keyboard to reset colours. Go to Filter > Render > Clouds.
Then go to Filter > Render Difference Clouds, repeat the difference cloud until you are satisfied with the results.
To add a pattern, go to Filter > Sketch > Halftone Pattern and select the settings shown below.
Click OK, then press Ctrl+F on the keyboard to repeat the process for added depth.
Next, press Ctrl+U on the keyboard to pull up the Hue and Saturation window. Check the Colourize box and move the sliders to select a colour for your pattern, similar to the settings below. You may need to play around with settings to get the results you want.
Change the blending mode of the layer to “Linear Light”. Go to Filter > Stylize > Emboss and change the Angle to -166, Height to 2 pixels, and Amount of 50%. I also changed the layer opacity to about 60% and duplicated the layer. If you want the dots to stand out more, duplicate the layer by dragging it to the “Create New Layer” at the bottom of the layers window near the trash can.
Step 4: Next, determine where your key elements such as the logo, the date, and caption or slogan will go. Hint: If you keep everything on separate layers, you can shift things around as you add more graphics.
Logo – depending on your background colours, you may want your logo in reverse (i.e., white text), so it will stand out.
Date – if you plan to update your masthead by the month or season, you may wish to date it; for example, “March 2007” or “Spring 2007”. The font I used for the date in this masthead is High Tower Text.
Caption – you may have a slogan you wish to place here, if not, you can add a caption that will emphasize or help describe the theme of your masthead. I chose to add a dripping effect to my text to mock the drippy smashed tomatoes (see tutorial for “Dripping Text Effect”).
I also added a few star shapes above the caption, using the Custom Shapes Tool  , and a radial starburst effect (see tutorial on “Radial Starburst Effect”).
To add depth I added a drop shadow to the date and logo.
Step 5: Next, find some images that will work with your theme or inspire one. I found a few images of tomatoes on iStock  but you can also use clip art or even your own artwork or photos, if you prefer.
Duplicate and resize some of the images and scatter them around. You can rotate images for variation but pay attention to where the shadows fall on each image and keep the direction of light source consistent.
Step 6: After I figured out were my images and other elements should go, I used the custom shapes tool to create splatter shapes in a rust colour. Place the shapes above the background layers so that the shapes are behind everything. Set the splatter layers to “Colour Burn” or “Overlay” and reduce the opacity to about 30% to 100% -- play around with the layer settings until you are satisfied with the results.
Step 7: After a bit of fine tuning and tweaking, you’ll have a masthead for your website. These are just a few techniques to help inspire the creation of your own masthead so experiment a bit and have fun creating your own combination of textures, shapes, images and creative taglines.
|
|
|
|
