Designing Using the Perspective Tool

This tutorial is not ment to teach you how to design a gameboy but it is ment to teach you how to design using the prespective tool.

1. First start with a new canvas, mine measures 640*480.

2. Now on your first layer fill your canvas with a color that is not black or white or close to that, as it will be harder to design with those types of colors. I will be using #6f92fa. Now make a new layer and get your rectangular marquee tool (m) and make a rectangle with the height of it more than the width and fill it with white like this:

Click to enlarge

3. a) This is the hard part if your a beginner to the prespective tool. So pay close attention, now de-select your rectangle and go to Edit > Transform > Prespective. Next squares and lines will show up around the object. Holding Shift click and move your mouse to the right on the far bottom left side of the square. I have marked the square that you need to do this to with red.

Click to enlarge

b) And try to make your square similar to this:

Click to enlarge

4. a) Now holding shift again on the following (marked red) square:

Click to enlarge

b) Pull it outwards to your left like so:

Click to enlarge

5. a) Hold shift again on the following red square:

Click to enlarge

b) Pull it upwards just a little bit, about 5-10 pixels up will do:

Click to enlarge

6. a) Holding shift again on this square this time:

Click to enlarge

b) Pull it downwards about 5-10 pixels.

Click to enlarge

7. Now add a simple stroke to that layer with the following settings:

8. Next make a new layer and using the rectangular marquee tool, make a rectangle with the width longer than the height and fill it with white like so:

Click to enlarge

9. a) Now lets at some prespective into it, go to Edit > Transform > Prespective. And hold shift and pull the following square (marked red) to your right 10-20 pixels:

Click to enlarge

b) Somewhat similar to this:

Click to enlarge

10. a) Again like the steps above, the same technique except on a different box this time:

Click to enlarge

b) Move that box Downward until the bottom line of the transform outline meets the stroke of the first white box we made

11. a) Same technique but a different box

b) Move it leftwards abit until you get a similar result:

Click to enlarge

12. a) Now go to Edit > Free Transform or ctrl+T and size it like to following:

Note: The red boxes point to where you should stretch the rectangle from. The red arrows point to where the edge of the white rectangle should meet, the cyan lines show the same thing too.

Click to enlarge

b) Now after your done sizing it, move it so t fits right in place on top of the bigger rectangle and give it a stroke with the same settings as the first rectangle we made.

This concludes our tutorial. Now you can go ahead by testing yourself and adding a black screen to it like the following result i got:

Click to enlarge