Home » Tutorials

Recreating The Rise Of The Planet Of The Apes Poster [Photoshop Tutorial]

12 September 2011 One Comment

A great thing I love to do whenever I have a bit of spare time is to open Photoshop and try to re-create the latest big movies post. There’s tonnes of great movie posters out there so you will never run out of subjects to re-create and doing so is great for practicing any new techniques!

So lets have a go at the new Planet of the Apes movie: Rise of the Planet of the Apes (what a mouthful that is!). First you’ll want to gather resources. We need the movie poster to refer to, it can be found here. A similar font to the planet of the apes one can be found here but we may still need to adjust that font later on.

Now lets open a new Photoshop document with a width of 640px and 900px with a solid black background (#000000). Grab the text tool and write out the title of the film, we are going to try and position it the same as it is in the original so I recommend writing each word on a separate layer.

As you can see from what we have in the picture above, our font doesn’t really match up with the posters, some of the spacing is off and a couple of letters are overlapping that shouldn’t be, so lets fix that!

Go to the layers window and select all your text layers (Shift + Click to select multiple layers), then convert these layers to shapes (Layer>Type>Convert to Shape).

All the text has now been converted to shapes and are now fully editable, so we can start trying to get the font to match the original. Select the Path Selection Tool (Shift + A) and with this tool we are going to sort out some of the spacing between layers. This isn’t usually the ideal way to space text, but with the odd spacing in the poster and the odd spacing in the font we acquired it’s the quickest and most accurate way.

As seen above you can click on any letter and it will select just that letter and you can also shift click to select multiple letters. We can start off by spacing the ‘of the’ better. Use the tool we have selected already and try to match the spacing in the original poster. Here’s the changes we made with it:

Next we are going to use the direct selection tool (Shift + A), with this we will be able to select the vertices of a shape and change it. So select the tool and we will start to edit the ‘L’ in planet so that it lines up with the ‘R’ in rise. All you need to do is click on the ‘L’ then click on one of the white corner boxes (vertices) as seen below, you can then drag or use the arrow keys to move the vertices and manipulate the shape.

You hopefully will end up with something similar the below changes.

Now we will edit the bottom of the ‘L’ so that it slants parallel to the ‘A’ as in the original. Use the same technique as in the previous step, use the direct selection tool to manipulate the vertices. Once you’ve done this, carry on using the direct selection tool and the path selection tool to edit and space the text until you have something similar to what you can see below.

Once you have finished editing the text you can select them all (not the BG layer) and merge them (Ctrl + E).

For the next step we need the full picture of the ape we can see in poster. You can get the image here and all we need to do is copy and paste it onto a new layer in our document. Scale the image (Edit>Transform>Scale) so that the size and location of the eyes will be the same as in the original poster, you can temporarily lower the opacity if you wish to make it a bit easier as seen below.

Go to the layers panel and control click on the thumbnail for the merged text layer. You should see that the outline of the text has been selected as I has in the below image.

Once the outline of the text is selected, click on the ape picture layer in the layers panel and then on ‘Add Layer Mask’ button.

This should get rid of all of the ape image that is not within the text selection we made earlier. Hide or delete the text layer and you should end up with something like this:

We’re nearly finished now, but you may notice that the ape we used and the one in the poster don’t have different contrast and colours. So to change this adjust the brightness and contrast to start with (Image>Adjustments>Brightness/Contrast) using the following settings:

The adjust the hue and saturation (Image>Adjustments>Hue/Saturation) and the colour balance (Image>Adjustments>Colour Balance) with the following settings or similar:

It should now look a bit more similar to the original poster. If your not happy with it, then have a play with the settings and tools within the ‘Image>Adjustments’ section, you’ll be amazed at what you can do colour wise within just these tools.

The final step is to add the date at the bottom of the poster. Grab the text tool again and type out ‘8.5.11’ with whatever font you like, I’ve used Arial in this example. Then open up the character window (Windows>Character) select your text and adjust the tracking as seen below, doing so allows you to change the amount of space between each character.

That’s it! You’ve done, you’ve replicated the poster and ended up with your own raw version of something very similar to the Planet of the Apes one. Along the way you’ve learnt and practiced a number of techniques that you can use in other projects. Something I often do is try to improve or add to the poster afterwards, try this as well as it’s a great way to add some creativity to the process.

Author Bio:
The author is a web developer for a shop that sells ink cartridges online. Follow them on twitter.

One Comment »

  • BiRju Patel said:


Leave your response!

Add your comment below, or trackback from your own site. You can also subscribe to these comments via RSS.

Be nice. Keep it clean. Stay on topic. No spam.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

This is a Gravatar-enabled weblog. To get your own globally-recognized-avatar, please register at Gravatar.