The Competition
Picking back up on my personal development, the next four months are going to be very important for me. During this time I will be project managing a team of my peers on professional projects. I also need to create my own personal portfolio and a presentation to showcase my work at the end of the course.
The first thing I need to carry out in the process of producing my portfolio is to carry out some competitive analysis. This week I will be looking at a recent graduate’s portfolio.
I have chosen to look of Danny Blackman, according to his portfolio he graduated from the University of Leeds with a BA in Communications & New Media in 2007.
Why Danny?
When leaving the course like most others I will be looking for employment within the industry. My preferred place of work would be Leeds. For this reason I have chosen a Leeds based designer, with a site that I found visually appealing.
I found this site on a showcase of inspirational portfolios from German based web design blog Smashing Magazine. This in itself suggests that other people also rate this site.
First Impressions
The first words that popped into my head when looking at the site were clean, striaght to the point and effective. The links are clearly obvious with their contrast from the body text.
My initial thoughts with regards to weaknesses of the site are that there doesn’t appear to be a lot of impact on the home page. The navigation also isn’t immediately obvious. Also there is a sticker on the website advising Danny will graduate in 2007, with it now being 2010 this seems to make the ste a little out of date.
Layout
On a laptop with a screen resolution of 1280 x 800 the site displays fine with a maximised browser. When the browser gets smaller it is obvious there is no padding on the left of the content as the image becomes flush to the window. This could cause issues on mobile devices with small viewports.
The information “above the fold” is all consise and gives a clear indication as to who Danny is.
The next thing to note is that all the information is laid out on a single page. Normally this would be a chore to navigate, through the use of a little bit of javascript and some text anchors the page is made easily navigable.
As oppose to trying to cram all the information as high up the page as possible Danny has given the information room to breath by using his illustrative skills to provide interesting artwork inbetween the portfolio pieces.
The illustrations all stick with the minimal colour scheme and help to provide consitency throughout the different projects.
Typography
A consistent approach to typography throughout the page shows a clear understand of a requirement for a visual hierachy and structure. The use of black text on the white background aids readibility although the size of the text could be classed as a little on the small side.
This said Danny has thought of accessibility with the inclusion of links to increase and decrease the text size on the page. This does however cause issues with the layout moving the content down the page. Realistically though once someone has resized the text they are unlikely to keep doing this after they have made the text readable.
Danny has used his own logo and icons to personalise the site, with the icons being used to describe the skills used within the project pieces.
The Pieces
By using not too many and not too few this portfolio has a nice number of pieces and doesn’t seem to drag when viewing. What it does do is make me want to see more of the work, which is surely the intention of a good portfolio.
By giving brief descriptions of the work Danny provides the visitor with just enough information to understand the brief without making it too much. The language used is also very universal to appeal to a broad range of visitors.
Where links to the work have been provided only 2 out of 5 actually link to the expected work. This is one of the only weaknesses to the site.
The Footer
With such a deep page the footer helps to signify the end of the visitors journey with a nice summary of Dann’y skills and the tools he is able to use. Once again the information at the top of the page about Danny is repepated to confirm who he is and what he does.
There was only a one thing I would have liked to have seen in the footer which would have been a link back up to the work. Another issue with the footer was at the very bottom of the page there had been added a white block about 10 pixels high which didn’t seem to fit with the design.
Under The Hood
With a high graphical content and high quality imagery the page size is quite large at just over 1MB. Any slow loading however is cleverly hidden by the very simple initial page containing mainly text right at the top whilst the pictures load lower down the page.
The code is both sematic and valid to W3C standards. It is also well strucutred with indenting for ease of use. The commenting also makes for easy updating in the future.
The navigation still works with the Javascript turned off and you only lose the animated sliding effect.
With the CSS turned off the site also still makes sense. However should the CSS and the images be turned off you lose the links between the different pieces of the portfolio, which would make navigation quite difficult for someone reliant on a screen reader.
Summary
A bright and colourful portfolio provides visitors with a high quality visual finish. Thoroughly thought from a design point of view the site is only let down by a number of out of date links and a image that could do with updating.
The interesting use of javascript provides a truly interactive site in a different way from the normal lightbox solution. This portfolio helps to show that Danny has a very particular style.
To Learn From This Portfolio
The following are some of the things I can learn from looking at the portfolio.
- Information doesn’t have to be spread over a number of pages.
- Links should link to up to date work that is still there.
- Out of date images should be updated where possible.
- Use of minimal colours helps to create consistency.
- Use of Javascript doesn’t have to mean lightbox clones.
Next time The Creative Professional . . .