SpoonGraphics • Portfolio of Graphic Designer Chris SpoonerThe site I have chosen to look at this week is that of professional freelancer Chris Spooner. I chose Chris as I have been following his blog since early in the first year and feel he is someone within the industry I could aspire to be like. Like Danny he is also based relatively locally in Sheffield.

Initial thoughts

The big image on the home page grabs the attention, this then provides a nice “in” to the portfolio as it switches between a number of selected works. The water colour effect that has been used to blend this out to the background is also a nice touch.

The header of the site follows popular standards with the logo/brand name being top left and the navigation top right. This continues throughout the site.

The colour scheme used for the site is subtle enough to let the work stand out, and doesn’t compete for attention. Bright colours are used on the home page through a variety of different pieces of work.

Navigation

Throughout the site links of different kinds are used to provide the user with both internal and external content. Text links are easily identifiable and also have a clear hover state.

Images are used in a number of places in the site as links and these again are identified with specific hover states.

Social media icons have also been used on the site to provide visitors with easy acknowledgment of where else Chris exists on the web.

Overall the navigation is easily identifiable and hover states are used throughout. Active states are also used on the main navigation to signify the section of the site.

The sections

Although there are only four pages the site feels quite large due to the amount of information contained.

Home is where the heart is. . .

This page has a brief description but uses enough technical information to baffle the uneducated whilst at the same time impressing those in the know. Chris has used a 1 and two column layout where necessary to make the text readable where possible.

All about Chris

The about page provides plenty of information on Chris and a number of links to various different areas of Chris’ web life. The hover effect on the photo shows a willingness to have a bit of fun and also serves as a link to his twitter account.

Unlike most Chris has steered away from including a live feed to his twitter account which seems to be a wise choice as I feel this is fast becoming overused by everybody.

With the large amount of typography on this page readability has been maximised through the use of good line length and a wise choice of line height to go with the font size. The images used in the text also help to break up what would otherwise be a large block of text.

Where the magic happens

On the portfolio page twenty seven pieces of work seems a little bit like overkill, but I suppose I would love to be in a position where I had this much strong work to show.

I’m not sure about the modal windows as some of the content in the case studies doesn’t fit into the page. On these case studies however, Chris has provided a large amount of information for the visitor to get a good understanding of the work.

Although it seemed a lot at first the amount of work was soon over when I got clicking through the pieces. This was because some of the work was purely graphical with no text to support it. These were then broken up with the aforementioned case studies which now seem to be well thought out.

Having these in the modal window saves having the user navigating to a different page of the site just to read about that one piece of work.

The portfolio page is a neat and individual way solution to the whole work displaying problem. At first twenty seven seems a lot of work to look through but once you realise there are only a few which have written content it takes no time what so ever to browse through them all.

Contacting Chris

The friendly approach to the site is continued on this page with the introduction and use of the emoction to show whether Chris is currently taking on freelance work.

The contact form is well laid out and easily identifiable. The active state however is a little too subtle I feel.

A nice inclusion on this page is what I would call the FAQ’s at the bottom of the page. They seem to be thought out through previous experience and also provide someone starting out on a freelance career with some pearls of wisdom completely free.

In my opinion they seem to be sensible statements however may scare off some clients due to their assertive nature [although I think this is partially the point of them]. I think Chris is probably a position in his career where he can pick and choose which clients he would like to work with.

So in summary

The level of finish and detail that has gone into the site leads me to believe clear planning and forethought was present when Chris created the site.

A little wordy at times I think the visual style and and appeal more than make up for this. The pages make it easy to understand; who Chris is, what he does and the style of his work.

Overall the site design comes across as fun and playful but is definitely backed up with the professional know how to show that Chris is serious about his job.

For the future

Detailed below are a number of things I have picked up from the last couple of posts in my journal with regards to things I need to be aware of when building my portfolio.

  • Let the work do the talking.
  • Only have a minimal number of “full explanations” coupled with a sprinkling of pure imagery.
  • Play to my strengths.
  • Show my style.
  • Make sure all the links work.
  • Make links easily identifiable through the use of contrast.
  • Javascript doesn’t have to be used in the same old boring ways.