Astheria.com is now an archive and is no longer updated, you can find new writings at kylemeyer.com →


03 05 2008

In response to a few comments on ‘My Last Portfolio Sucked, Yours Might Too’ I’ve done some more digging and have come up with a short list of portfolios that I feel cover the right bases. They may not be completely perfect, but if you’re looking for an example of the right direction, hopefully you’ll find it here.

Designed By Anderson

Up first we have shining example of excellent navigation. None. Anderson’s single page portfolio is great at making an initial visual impact, being concise about background and contact information, and even offers up PDF of his curriculum vitae.

Designed By Anderson
Figure 1: Clean. Usable. The work speaks for itself.

The only problem with this site is that it still has some lightboxed thumbnails. However, the logos are plenty big even in thumbnail form to be visually appropriate. I would perhaps simply link the website thumbnails to their respective sites rather than launch huge lightbox images that take over my screen. Even still, the fault is rather minimal in comparison to how well the rest of the portfolio works.

Sofa

While not a personal portfolio, but a business one, Sofa does a great job of saying their piece and getting out of the way. They create software applications, and the three items of most visual interest on the page are the icons for each application. Each links to its respective website.

Sofa
Figure 2: Here’s who we are, here’s what we’ve made. Any questions?

My problems here are mainly aesthetic, the badge in the upper left is insanely distracting because the heart contains more red than anything on the page and the contrast makes it hard to pull my eye away from. The other being the size of the header graphic. Sofas, I know, I get the reference, but that’s not why I’m visiting your site.

Feed the Creature

Invisible Creature is a firm that does some great illustrative work, just check out the posters on their site. While they may use thumbnails, they are plenty large enough that you can get a sense of detail prior to taking a closer look. Unfortunately, that closer look isn’t quite as close as I’d like to see, given that people would simply print them off rather than purchasing a poster it’s an understandable compromise.

Feed the Creature
Figure 3: Thumbnails? Yes. Appropriate size? Yes.

The real issue here is the horizontal scrolling, while it remains intuitive here, I really want to be able to use my scroll wheel rather than having to click and drag on my browser’s scroll bar. But for some reason I can overlook this shortcoming because of how awesome their work is. I wouldn’t have been able to make that judgement if it weren’t for decent size thumbnails.

Sreski

Mark Dormand’s Sreski is a prime example of how to abolish the need for annoying thumbnails — at least on the home page. Unfortunately, upon navigating into ‘my work,’ I was treated to the same old cropped thumbnails, moderately sized, but not large enough to be representative of the work.

Sreski
Figure 4: Why must you change on internal pages when you’ve hit it out of the park on the home page?

Clicking on one restores the enjoyment of large images with a left hand navigation, but why the thumbnails at all? This is an example of where the portfolio could use some trimming to just his best work. There are a few items that seem to be under his current abilities, and people remember you for your best and worst work. Removing these would reduce the number of pages making the textual navigation acceptable since there would be a slimmer amount of pages to click through, and the my work section’s home page could make better use of screen real estate and use some larger images.

Proud Creative

Last, but not least, Proud Creative. They’re damn proud of their work, how do I know? Because the rest of the portfolio is as minimal as possible. The fixed position left column is great for keeping contact and other information in view while browsing the portfolio.

Proud Creative
Figure 5: Who put the sun on a website?

Not much to complain about here, just get rid of that blinding yellow circle that keeps distracting me from all the awesome work.

Conclusion

It certainly didn’t help that Smashing Magazine’s article stole a few of my favorite portfolio sites, and rather than retread old ground I’ve done my best to illustrate what I feel is solid portfolio design direction. Agree? Disagree? Make your opinion known.

Forty-seven

Responses

  1. Great selection Kyle. I hope you periodically do these posts about portfolios so I can keep up with what’s going on for when I do mine. Very well put and great things to point out.

  2. Nice to see this follow up on your previous article! Espcecially like Sreski, nice job on the portfolio there!

    With your recent posts on the subject in mind, I hope to launch a usable portfolio for myself very soon :) .

  3. Thanks for this article! Loved to read it! Don’t be to harsh on the smashing magazine, I actually found this blog by their article! They got you a new reader!

  4. @Guido: No ill feelings at all, I loved their post!

  5. Oh. Then maybe I miss understood that part of the article. English isn’t my first language!

  6. Love the post. Will remember it when it comes time to setting up my own portfolio.

  7. Good follow up post!
    No point in just highlighting the problems when you can highlight the way to solve the issue….

  8. Don’t rwally get how they “stole” seeing as they posted first but some great picks you have there and long time no talk kyle.

  9. Perhaps ‘stole’ was a poor choice of words, and was meant purely in jest. I just didn’t want to reuse the examples they had already posted. :)

  10. none the less good post its nice to see some good looking portfolios, also is there anywhere t see your work?

  11. @Nathaniel: Unfortunately at this time, no. Hopefully when things calm down (yeah, right!) I can update my portfolio and get it back online. :)

  12. I’m in love with the way 31three presents websites:
     http://31three.com/

    We’re redesigning our site and definitely think that thumbnails are not the way to go this way around. They just don’t have the visual presence like this site.

  13. Nice reviews all round, crushingly even handed ;)

    Re: thumbnails, I think that’s quite a personal issue, I like having tasters of projects, but they’re definitely not representative or intended to be :)

  14. Fantastic examples. Thanks

  15. I get the jest.

    I recently came across a cool portfolio http://www.designbum.net/portfolio.htm

    The photos on that site’s portfolio aren’t big, but great use of columns. It might make a good addition to your typography site.

    I wrote about the resources of the site here: http://aiburn.com/article/inspiration_designbum

    Thx.

  16. Question: While I do agree that you should provide a link to the actual websites from your portfolio, I am faced with a dilemma. Often a client will hire me to create a site that they can “maintain themselves.” As much as I try to confine them to text content and make an idiot-proof design, many of them add new pages that are badly done, or photo images that are amateurish or of a very low quality. The site is no longer representative of my work, though the original design is something that I’d like to showcase. What then?

  17. Great article, nicely detailed why something is pro or not. Thanks for your viewpoint on this!

  18. I agree with “Cool Whip ” I don’t provide the link to the actual website anymore. Clients can maintain the whole website and destroys website design they get. It happen to often.

  19. I really like this post.
    I’m going to take this in mind as I redesign my site.

    I also love how simple and clean you site is.

  20. Thank you so much for posting this. I’m currently unemployed & in the process now of trying to come up with an online portfolio. This and the previous article about bad portfolios were extremely helpful.

  21. Lightbox is bad? =] I used it in my folio http://www.k4lab.info but I got CV in PDF too =D

  22. Nice selection of sites there, lots of ideas to borrow and mix up a bit give a shake and make my own.

  23. Proud Creative- This is nothing but a list of thumbnails. Not that I think that is bad, but you have been ranting against how thumbnails are horrible. So, it doesn’t make much sense to then pull it out as your prime example of portfolio goodness. Especially in this case, considering that while the thumbnails may be large, they are as closely cropped in many cases that any smaller thumbnail would be. The lesson is contradictory, in that that thumbnails are okay, even if they are cropped tightly, as long as the thumbnail itself is large.

    Sreski- While you can use thumbnails to navigate the work, there is also textual navigation. would you rather the option wasn’t available? Do you just want a clusterfuck of everything on a single page?

    In fact, every single example on this page that you list as good examples all make use of a thumbnail system (except the programming example, which is more or less inapplicable when it comes to showcasing visual design). I find this odd, because you spent the entire last article grandstanding about how thumbnails are a poor choice.

    It seems the only true answer is to plaster a page in hi-res images, with no navigation or separation, as thumbnails or contextual links just aren’t good design. That sounds like a good way to enjoy getting carpal tunnel from scrolling, as well as a nonsensical approach to organizing and presenting a portfolio.

  24. This has come at a perfect time. Thanks.

  25. That’s a good idea.. but but need so much time. Great Work

  26. Good job on the research - the 3rd portfolio you mention “Feed The Creature” is NOT the name of the design firm - It’s “Invisible Creature” http://www.invisiblecreature.com/

    Feed the Creature is the store the sell junk at.

    Way to go kids! Maybe next time

  27. Wonderful post as usual, thanks for the great content!

  28. Very good post. The first one had some interesting insights. I was seriously considering changing my website from duotone-lightboxed-thumbs (gasp) to full color 600px wide images. But I cant seem to let myself do it. I fear most people would have left the site by the time it takes to load all the images. And the distance people will have to scroll to view them all doesnt seem all too user friendly - expecially for my portfolio’s format. I would love some advice.

  29. Fuck lightbox. Seriously.

    Nice post this one. :3

  30. Sofa has nicely made website. Aesthetic i simple, just like this site. I think minimalism will be popular this year.

  31. thanks, great article!

  32. This article is really inspiring. My site is booooring.

  33. Great article for us fellow photographers!

  34. Great post. Please keep them coming!

  35. Some great examples here. I think this guys portfolio is well done: http://www.arteye.com

  36. Great choices, great inspiration.

  37. Nice design, I like it.

  38. I loved the selection.
    Here it is why “less is more”.
    You don’t have to overuse special effects and images to grab attention.

  39. it is important to showcase the problems solved and the results generated by a design solution, not just merely trends. Trends do play a part but should not be a sole reason for a designer’s well being.

    good post btw. ^ . ^

  40. I had a horizontal version of my portfolio as Invisible Creature. And the problem with the scrolling is not on all browsers. For example in FireFox you can use your scroll wheel as well as on another browser (that I don’t remember). The browser you were using was probably not competative.

  41. Really nice portfolios! I personally like the Sofa portfolio specifically as the three items of most visual interest on the page are the icons for each application. That is a great feature.

  42. I loved the selection.
    Here it is why “less is more”.
    You don’t have to overuse special effects and images to grab attention…..thats all.very nice……………..

  43. Your main argument is “bigger thumbnails (if not thumbnails at all)”. Makes sense, but most of the websites are not fluid and most of the visitors don’t have a 30” display.
    Also, i very much prefear the zoom features in portfolios, if you merely link you may end up to a dead or renewed website giving your portfolio a zero value.
    So, even if i’m no one, i would rather suggest that an important thing for a successful portfolio is link the live site, but to have a few static pages showing your work, if pictures are not to be considered sufficient.

  44. Your site is great for freshers. I have read each word carefully and its a delight. I an just another new fan of yours!