Create a Resume with Adobe Photoshop

In this tutorial, you’ll learn how to create an astonishing resumé with Adobe Photoshop. The final resumé design can be used for print as well as sliced into xhtml and css for creating a website.

This will be the final result:

1 - Create a new document. The example dimensions are 1000*1024 pixels, but you can easily change 1024 by the desired height. Fill the background with white (#FFFFFF)

2 - Create a new layer set, named “left sidebar”, and create a new layer (name sidebar) within this layer set.

3 - Pick up the Rectangular Marquee Tool, and create a 352 pixels wide rectangle on the left part of the document. Fill the rectangle with dark grey (#21211F)

4 - Time to write your name. I have picked a fake name “Eddy Thoreau”, for the example. For the font, I have used Futura. As this font isn’t open source, I can’t give it to you in this tutorial. However, the same design looks very good with other fonts as such as Helvetica or Myriad Pro.

The color used is #1CB7EA and font size is 72pt. If you have (as me) a long name, you should consider reducing font size.

5 – Once you wrote your name, open a picture of you and scale it to 147*197 pixels. Integrate it on the design, just below your name.

6 - On the layers window, right-click on the picture layer and select blending options. Use the following parameters to add a white stroke around the pic.

7 - Time to add your info. In the example, I have added website, email adress, street adress, telephone, fax and social websites urls.

Pick up the text tool, set a white (#FFFFFF) font size of 14pt and write your infos. Don’t forget to justify the text on the right. Font used is Futura.

8 - Below the contact informations, we have to insert a nice separator. Select the sidebar layer, pick up the Single row marquee tool and click on the design, below the contact info. Fill the selected part with grey (#454544).

9 - Now, let’s talk about your skills. Pick up the text tool, select the Futura font in 36pt size and #1CB7EA color. Write “What I do” or whatever text you’d like to use to introduce your skills.

10 - Pick up the text tool again and set font size to 14pt, color to white (#FFFFFF). Type your skills. Once you’re done, select the whole text and justify it to the right.

11 - To note my skills, I have used a star icon found on IconFinder.net. You can grab it here, but it is also inclued in the psd.

12 - Duplicate the star icon as many times as necessary to achieve a similar result:

13 - Repeat steps 8 and 9 to create a new separator below the “skills” part, and a title for your latest designs.

14 - Take some screenshots of your latest designs, and scale it to 285*152px. Once done, right click on the screenshot layer in the layer window and use the following settings to add a white stroke around the screenshots.

15 - We’re done with the left part of the document. At this point, your design should look like this:

16 - Now, let’s populate the main content area. Create a new layer set named “main content”, and another layer set named “experience”. This layer set should be placed inside the “main content” layer set.

I have divided the main content area into 3 parts: experience, education, and others. Let’s start with the experience part. Pick up the text tool, set the Futura font with a size of 36pt and #1CB7EA as text color. Write “experience” or whatever else.

17 - I have choosen to display my past work experience with the following format: Company, date/position, descriptions of tasks.
The font used is 14pt Futura. Colors goes as follow:
Company: #1CB7EA (Bold)
Date/Position: #6B6B6A
Tasks: #21211F

Type your previous work experience and use the above settings to style it. Once done, your design should look like this:

18 - Time to create two new layer sets, one named “education” and the other “others”. For the titles, pick up the text tool, set the Futura font with a size of 36pt and #1CB7EA as text color.

For the texts, use the following settings:
Title lines: Futura font, bold, #1CB7EA 14pt.
Texts: Futura font, normal, #747473 14pt.

19 - We are done with the content. The resumé looks great, but we still can do better. Create a new layer set, name it “right bar” and create a new layer inside it. Select the rectangular marquee tool and draw a 83px wide rectangle on the right side of the document. Fill the shape with #21211F.

20 - The last part of the tutorial is to add a good looking vector attach to our resumé. Download the attach icon fromIconFinder and paste it on the upper right part of the design, with the right bar layer set. Name this layer attach.

21 - Make sure the attach layer is selected, then grab the Polygonal Lasso tool and select the part of the icon we don’t need (as seen in the screenshot below) and finally erase the selected part.

You’re done! Look how stunning your resumé is. Do you thing that guys with Microsoft Word made resumés can still handle the competition?