I have been featured in Smashing Magazine’s latest article “How To Create A Great Web Design CV and Résumé” by Kat Neville of safetygoat.

Kat devised a CV design challenge/ competition in which ten Web designers had to design the same résumé in only a few hours. Each designer had to translate a fictional character, Steve Stevenson’s work experience, education and interests into their own unique style. A summary of good tips for Web designer résumés is featured at the end of the article. If you’re interested in taking the challenge yourself, visit misterstevenson.com for all the rules each of the designers followed and the chance to add your own entry.

If you are interested in learning about my design methodology, please continue reading below.

Design Methodology for the Steve Stevenson CV Challenge:

When I finished my undergraduate degree I went to my college’s careers advisor with a customised CV that I had designed. She suggested that I tone down the “need to design it”, which at the time confused me a little. I mean, I was a multimedia designer after all! I would be seeking design-related employment with creative types in design-related companies. Anyway, I put my ego back in its box, went home and thought about what the careers advisor had said.

What is the role of a designer? To design, to engage, to be creative, to innovate, to inspire, to break conventions, to think outside the box? Actually, no. Certainly, we should aspire towards and challenge ourselves to do some, if not all, of the above but at the end of the day we are providing a solution to a problem. We are helping people in some way. Simply put, design comes down to basic principles such as clear communication and problem solving. There may be many more media to design for than in the past but the principles still continue apply.

Screenshot 01

When it came to this challenge, I set myself a couple of restrictions – I wouldn’t spend more than 3 hours on it, I would only use three colours and a maximum of three fonts. Initially, I decided that the CV should be black because I wanted it to be different and who said CV’s had to be on a white background anyway? (See screenshot 01). The thing is, no one decided that a CV had to be on a white background. However, this didn’t add any value to the design and think of how much ink would be wasted. So, scratch that idea.

During the process I found myself going off on another tangent (see screenshots 2 and 3 below to see what I mean). I tried to introduce an element of “fun” by presenting the cover of the CV as a “fold, cut and paste” DIY business card. I asked one person what they thought of this. On first glance, they couldn’t understand what they were looking at. After I explained it to them, they started to get it. But, therein lies the problem. I shouldn’t have had to explain this to them. User testing is clearly as important for CV creation as it is for website creation! The design of the CV should be clear and intuitive. With this idea, I was trying to be too clever. Unsuccessfully, as it would have made a lousy business card anyway and who was going to bother to make it in the first place! To echo the career’s advisors words, I had to tone down the “need to design”.

Screenshot 02

Screenshot 03

At this stage in the process, I had to remind myself of some of the principles that I strive to design by; namely, clear, simple, minimalist, clean designs that are usable and functional. And as designers should know, simple design doesn’t mean simplistic, simple is hard to achieve. In the words of Leonardo da Vinci – “Simplicity is the ultimate sophistication”.

Another query made during the “user testing” phase related to the fact that the words “CV”, “Resume” or “Curriculum Vitae” were not included. A fair point but I decided to omit them as this document would be presented to the reader/ viewer as a CV i.e. they would receive it attached to an e-mail indicating that a CV was attached or they would be handed it/ presented it as a CV. I’m open to debate about this decision, however.

Why would I design a CV – a document that is intended to clearly communicate a person’s education background, employment history and skills – any differently? I shouldn’t. I have no doubt that other people would approach this challenge as a way to be very creative and to showcase the fictional designer, Steve Stevenson’s design skills. But again, where should Steve’s design skills really stand out? They should be showcased in his portfolio – the work there should speak for itself. In the same way that when I go to a restaurant, I want to be able to read the menu without being distracted by how well (or in the case of being distracted, how badly) designed it is. I read the menu to decide what food I want to order. I would read a CV to decide on whether a person was the right fit for a job.

At the same time, I didn’t want my contribution to resemble another CV template that someone could easily choose from Microsoft Word, for example. So, it had to be somewhere in between – a clean, simple, functional design but that added a some personal branding for Steve to set him apart from the crowd and from commonly used CV templates. I also wanted to incorporate something into the design that would hint at his web design experience.

My solution?

A landscape-layout of 3 columns, which borrows the commonly used web layout. Sure, this 3 column layout has long been a ‘norm’ in web design and no one is really breaking conventions or thinking outside the box when they design a web layout with a header, 3 columns of content and a footer… but what if this layout is applied to a CV? I used the header area for Steve’s logo/ personal branding and for his contact information. I used the 3 columns for his education, experience and skills, left to right. And finally, I used the footer as the location for some information about his interests.

I used 3 fonts:

- A beautiful font called “Nevis” for Steve’s name and the main headings (available for free download from Ten by Twenty/ Ed Merritt.)

- Helvetica Bold for titles

- Helvetica Regular for all other text

To create the “SS” logo, I used a variant of the shape of the Bauhaus font.

I used 3 colours:

- Orange (technically I used two different shades of orange… so I broke my own rules slightly but then again you’re allowed to break the rules now and again!)

- Black

- Grey

I stopped designing before my 3 hours were up.

My aim was to design something in which each element served a function; every shape and line, the colours and their use, the font variations and text sizes were chosen to communicate something to the reader. For example, each orange line serves a purpose by separating the areas of content from each other. Similarly, the word “freelance’ is in orange to highlight where Steve’s “work” experience ends and his “freelance” experience begins. One mistake that I made when I first started designing years ago was that I had too much going on in my designs. Once I learnt how to eliminate unnecessary elements in my designs they became much clearer and usable – Don’t decorate, communicate!

I welcome your comments and feedback. If I had more time, I would have made the links in the PDF document clickable and perhaps tried to refine the design a bit more (maybe swapping the location of the ‘education’ and ‘skills’ columns to give his skills more prominence) but I figured that you should be able to design a one-page CV within 3 hours!

So without further ado, please see below for my attempt at a clean, simple and functional CV design that isn’t a word template but that isn’t trying to be overly clever or too “design-y” either!

Final design (click image to enlarge)

Read the article “How To Create A Great Web Design CV and Résumé” or download the PDF (PDF, 56kb).

I have had a few requests for the original source file for the CV and I am happy to release this under a Creative Commons licence, which means that you are free to download, share, copy, distribute, remix and adapt the work provided that you attribute the work to me.

Download the original source file (Illustrator .EPS file, 516kb).

- Niamh.

@nredmond

  |   Tweet this!   |   Digg it!   |   Del.icio.us   |   reddit   |   Stumble it!   |   E-mail it   |   Subscribe via RSS or via Email.
This entry was posted on Wednesday, April 1st, 2009 at 6:48 pm and is filed under Design, Portfolio, User Experience. You can keep updated on the conversation by subscribing to the comments feed. You can leave a response, or trackback from your own site.