liam2

As part of our feedback post, we promised to review one commenter’s site here on Pro Blog Design. Well, our winner was Liam J Moore, so we’ll be reviewing his site today.

A quick note to everyone who took part in the feedback post though, thank you for all of your suggestions! We’ve gone through every single one of them, more on that to come on Monday!

Now, to the review. Liam is a student completing his Masters project in Multidisciplinary Design this year. The blog currently serves a joint purpose; as a portfolio for his design work, but also as a progress log for the project.

The really interesting thing about Liam’s site is the style he has set it in, have a look:

liam1(click it to view in full size)

What Has Been Done Well?

The most obvious part of this site that has been done well is simply how it looks. The color scheme consists solely of yellow, grey and white, all across the site. There are very few graphical touches, just large blocks of yellow or gray, all laid out to give quite a memorable appearance.

The vivid yellow is one shade you rarely find making up the background of a website. Combine this with simplicity of the setup to get quite a bold feeling from the website.

That leaves a good message about being brave enough to try new things as a designer. Perfect for a portfolio site.

Another unique touch is the picture in the sidebar. You’ll notice I couldn’t resist putting it into the intro image for this post, just because it’s such a cool idea.

A regular picture with a “Hello” speech bubble to welcome you to the site. Another simple effect. Another effective one.

Even the typography on this site is nicely set. The large fonts are effective where they need to be, and reading off the vivid yellow background is a lot more pleasant than I expected it to be. I don’t think it’s a move that any newspaper websites will ever copy, but given that this site is primarily a talent showcase, it might just be worth any small usability loss.

What Could be Improved?

One question I had to ask Liam before I wrote this review was this, “is the site primarily a portfolio, or a blog?”

The answer was that it had become both, but in the long run, the real purpose was to be a portfolio. Sometimes it can be hard to choose between two goals for a website, but to get the most out of it, you will need to make that decision eventually. With that in mind, let’s look at how we could re-assess the homepage.

The two things you will be drawn to first when you load the homepage are the large messages on the grey background in the center, and the “hello” image to the right. That’s fine. The text introduces you to the site, and the photo is a great personal touch.

But underneath that, there’s a large empty space. The sidebar extends 2 or 3 more screen’s worth down the page, stretching out the homepage where it doesn’t need to be. All of the content in the sidebar is useful, but not an essential.

Given the purpose of the homepage to drive readers to particular aspects of your site, we can take out some of this sidebar content on the homepage, and only display it on the blog pages instead:

  • Hello – Introduces Liam. Given that this is a site about Liam, it’s obviously going to stay!
  • What Am I Twittering? – Twitter is great, but perhaps this would be more relevant to longer term readers? (i.e. the people who will be on your blog page)
  • Flickr – The Flickr photos here are great. There’s nothing wrong with keeping them here, or perhaps we could find another way of displaying them elsewhere in the site?
  • Archives and Module Blogs – Both of these sections are navigation for the blog. But the reader hasn’t gotten to the blog yet, so let’s take them out.
  • Search – Again, the reader hasn’t chosen to visit the blog yet, so a search engine may not be what they’re after. It’s a small part of the page though, so it won’t do much damage in staying either.
  • Contact details – Always an essential for a portfolio!
  • Blogroll – Nice to have on a blog, but it takes up a little too much room for the homepage.

 liam3

Now we’ve cut down on the space, how are we going to drive users to the portfolio page?

The first step is the simplest; in the welcome paragraph, link the words “portfolio website” to the portfolio. You could even link “Web & Graphic Designer,” and there’s no need to change the appearance of the text when it’s linked.

Another option would be to display pieces from your portfolio. Displaying the full images might be a little much, but smaller thumbnails of each could be effective.

 liam4

Some Usability Tips To Consider

Liam’s site looks great, but as I browsed around it, there were a few little things that bugged me occasionally. Nothing major, but when a lot of small things come together, it can make a difference.

  • Logo not linked to the homepage.
  • The logo shade of yellow is very slightly different to the shade of yellow in the rest of the website. It’s not something noticeable at first, but might be worth looking at.
  • There are very few rollover effects on the site. Both the navigation buttons in the header, and the post headlines in particular, would benefit from the interactivity. For the post headlines, some CSS could be used to make the entire grey block into the link, and the effect only needs to be simple. Changing the font color to white would do it.
  • White comment fields. Normally white is great to read and write off, but when the white is set against the yellow background here, the contrast turns it almost neon.
  • Location of the Earth Divided tweet in the header. This tweet is exactly where I would expect a slogan to be. I was able to work out what it was when I saw the “22 days ago” at the end of the message, but for non-Twitter-addicts, it may be a little confusing.
  • The social sharing links at the end of each post are in blue. Given how well the site sticks to the 3 tone color scheme, it would be nice to see these few links fall in line with the rest.
  • When visiting the blog, you’re greeted with a lot of titles like “Tutorial #17” and a lot of talk about the Masters project. Given that the Masters is the focus of the blog for now and the next while to come, it would be worth giving a quick overview of what the project actually is at the top of the blog page. That way, new readers won’t be lost when they start to dive in!
  • Bonus pointer; it still says copyright 2007 in the footer. Woops!

Conclusion

All in all, I think Liam’s site has a great style to it. It’s boldly different to the norm, which is a selling point for any graphic designer. The stark yellow may not be to everyone’s taste, but striking moves are what it takes to get attention in a crowded niche.

Now it’s your turn, what do you think of Liam’s site?

PS – I just wanted to give a shout out to one of Liam’s projects, Earth Divided. There are some great uses of graphic design in his logos (Plenty of people walking around Belfast will have spotted them before!), but for everyone else, you’ll find the Twitter profile is full of truly fascinating statistics.

Enjoy this post? You should follow me on Twitter!