Greyscalegorilla.com

SEARCH FROM OVER 250 CINEMA 4D TUTORIALS

Seven Rules for Building Online Portfolios 49 Comments


Your site is a frame
A frame exists to hold its art. It should compliment your work, but never overshadow it. Think of your portfolio site as a frame for your work. Keep it clean and easy to navigate. Don’t let your site get in the way of letting me see what I really came for.

Make every project a link (AKA: Don’t use Flash)
Make sure I can link directly to a project. The best thing about using the web to promote yourself is the ease of how a link can be shared with people. If I want to show someone some cool piece you did, I should be able to copy the URL and send it. “Go to thiscoolsite.com and click on project number four” doesn’t cut it, yet this is exactly what I need to do with most Flash based portfolio.
This is mainly a problem with flash sites, but it can also happen with some php sites.

Make it simple
Potential employers aren’t coming to your site to see your fancy drop down menus or see a long flash splash page. You want to impress them? Show them your work. Whether you’re a web designer or not, your online portfolio is NOT the place to show off your new flash skills or that new javascript hack. Your portfolio exists to show off your projects, not to be a project in itself. You want to play around? Make a PERSONAL site and link to it in your PORTFOLIO.

Don’t be clever
Don’t make me learn a new system just to use your site. Use web navigation standards like putting your navigation on the left of the page to make me feel in control. Mystery meat (link) navigation is for entertainment sites, not your portfolio. Don’t make me think, just show me your work.

Make it easy for us to contact you
This is a no brainer, but some sites overlook it. Make your email address easy to find. Especially if you’re a freelancer or looking for a job. Think about adding a “hire me for freelance” button.

Make it easy to update
A simple design also makes it easy to manage and update on your end. Many people I talk to have a portfolio, but they say “I really need to update it.” They are ashamed to show it because it’s not current. You’re too busy making more cool stuff to worry about making thumbnails, adding new html, and changing that complicated navigation system to include your new project. Make it simple and you can update with ease.

SIMPLIFY!
It’s the bottom line. Your site only exists to show your work. Your portfolio is a frame used to feature your best work. That’s it. It’s not fun, it’s not fancy, it’s not clever. It is a tool to show off work. It’s your work that should be the fun part. Don’t over think it. Put your best work in a frame and hang it on a wall for everyone to see.

Light Kit Pro
Texture Kit Pro

Comment Rules

This is a friendly community. Please treat everyone with respect. We don't all have to agree, but we do have to be nice. Criticism is fine, but rude comments and name calling will be deleted. Use your real name and don't be spammy. Thanks for adding to the conversation.

49 Comments

  1. More of a question than a comment but I currently have used flash for my website and after reading this I can understand how flash can possibly be not the best program to use. What do you suggest I use to build a better website considering I’m not an experienced coder? I could take the time to learn but then thats taking me away from other things to spend time on.

    Reply
    • I recommend looking into a CMS like WordPress that is very expandable, can be customized as much as you like, and is very easy to add content to.
      One can set up a WordPress site very quickly and easily using 1000′s of available free templates to skin it.

      Reply
  2. Gerard Ventosa

    Very useful!

    I’ve a flash website, and I’m agree with your points, I’ll try to create a new portfolio with your recommendations.

    Thank’s a lot for your help, and very congratulations for your job, that’s amazing.

    From Barcelona, I’ll continue reading you!

    Reply
  3. How did you go about creating your “Creamy Orange” site. I want to start a site, but I have no idea where to begin.

    Reply
  4. I think this is great advice, but I found it a little strange that your own portfolio fails the rule of “making it simple to link to a picture. If I wanted to tell someone about one of your photographs, I would have to tell them the row and column of say the portrait page. Or at least I didn’t see any way to link.

    Reply
    • Very true Jeremy, I am actually trying to replace the flash slide show with something else for that exact reason.

      Cheers!

      Reply
  5. Hi Nick, I recently made a flash portfolio which managed to get to the finals of the Young Northern Design Comp in the UK and after reading your 7 rules I have realised that to display my work, Flash is not a good idea! However, I do think that Flash creates a great and interactive experience for the viewer if done correctly.
    I am wondering what your views are on WordPress for displaying work? I am wanting to start customising my own WordPress site.

    Reply
  6. killernatch

    very good man! Thanks for doing this.
    I’m now a student and want to make my own website to present my works. It would be awesome if you make some easy making website tutorials like how to put the URL on the link and to upload the video to the site.
    by the way I love your works.

    Reply
  7. Hi Nick!
    Can u give us a small update on Contrast? Just a rough date or maybe year?
    Thanks

    Reply
  8. Nicop

    Regarding: Make every project a link (AKA: Don’t use Flash)
    This is old news, but SWFAddress makes it possible to link directly to subpages or to whatever you actually want and have these links/URLs appear in the address bar.

    Reply
    • Sure, links are possible if your willing to force it. But, there are so many other good reasons NOT to use flash. Not easy to update… Load times… Plugin support… Flash is good for a few things, but not for portfolios. Get me in and get me out.

      Reply
    • Montyoto

      I am not sure I agree on the non-Flash politics.

      You can quite easily add “frame anchors” in Flash that behave like links in URLs (check out http://www.adobe.com/devnet/flash/articles/deep_linking.html) – and they can be copied from the adress bar (and emailed to your client).
      And if you’re not into coding, Flash gives you some pretty intuitive ways of designing structure that works the same way across browsers (HTML+CSS doesn’t exactly do THAT)
      And if you ARE into coding Flash is able to control a full back-end (PHP especially) to upload and manage your content.

      I basically agree to all the simplicity rules – but it’s always a tug-o-war between too simple (boring) and too much work on coding. This greyscalegorilla-site is very attractive but also filled with xml, javascripts, css and reasonably complex html… I’m loving it but I wouldn’t ask a photographer to build it :)

      About loading times and plug-in’s; the time to load a black page with a photo on it is pretty much the same in- and outside of Flash – and how many browsers have issues with Flash/Shockwave-players these days? I give you the premise – it’s inarguable – but in reality it is often compromised.

      Just to make sure – I am not out to diss’ opinions! And on a 10-banana-scale I would rate this site to about a 9 :)

      Reply
    • Andrew Dobson

      Quite right.

      If your flash site isn’t providing the usability you seek, then you’re simply not building it properly.

      Flash has really moved on quite a bit since the skipintro days. It’s a programming framework for rich media applications, not just an animation tool now.

      Reply
      • True. There are workarounds and hacks for some of the issues with flash. But why bother? For a portfolio website, all that matters is the work, not the site.

        Reply
  9. Another rule that I would like to add or maybe just a tip is to use thumbnails instead of just using a simple text link.

    I always appreciate if they have a small thumbnail next to the title, because it gives me a preview what the video will look like

    Great list btw! Cheers! Markus

    Reply
  10. 2 questions-
    01. What do you think of having all the reels in QT??? Since all if not most of the worlds creatives are on Macs & iphones… it makes your reels visible on iphones???

    02. Since most freelancers have companies… do you think the marketing strategy should be as an individual or corporate??? i.e.- fielddominance vs. carlosprio.com???

    Reply
  11. I just redid my site. I transferred it to wordpress. Easy updating of projects and having an inclusion of a blog if you prefer with a pretty decent UI. When you’re sick of the design create a new theme (html/css). Also, using Vimeo’s new iframe embed, my videos show up on non-flash devices ie iphone/ipad. If they can’t see it, they’ll have the option to download it in mp4.

    Reply
  12. Giorgos

    I agree with all these Nick, except for flash.
    I prefer flash (my opinion).. I used blog before but people except from you to always update it.(not quite)

    Flash with xml are more easy to update without open the flash. With just a few clicks, you have updated your website.
    Plus, you can directly give and share links for people-clients with deeplinks.
    That’s how i made my site.

    Keep up the good work!

    Reply
  13. Halil

    As long as flash is not compatible with mobile devices it is no option for websites and portfolios.

    Reply
  14. I updated my website and it´s now running with WordPress. It´s the fastest way to keep website fresh without programming html as I did before. The portfolio page is fast to update just in few seconds.
    However not everybody, especially “clients from hell” should not always be able to comment works on portfolio.
    After this update I got such “client or designer from hell” feedback of my portfolio page so I removed the comment option just by removing comment box code in wordpress. Anyway one can have the moderation if the comment option is visible.

    Reply
    • I also use wordpress for my site. I love being able to update from my phone if I need to. I always customize the code when I use a wordpress template. I take out various parts (such as the comments altogether) so it doesn’t look so much like a template.

      Reply
  15. Awesome stuff! You always have the best and most useful things. I’ve been following your work for over a year, but I felt the need to comment now to let you know how much I really appreciate this post. Not sure if my website completely fits these rules, but I’m trying. Can anyone let me know what they think of my website? It’s still a work in progress.

    Reply
    • Wow, that Jessica Carter is hot!!!

      Oh ye, nice website too ;) I was very surprised after closer inspection that it isn’t all flash based (which I found doesn’t work on iPads, iPhones etc). Good job.

      Reply
  16. I’m glad to see this post. My site pretty much complies with all these points. My work is improving daily, and I find myself constantly replacing the older, less impressive art with my newer stuff. I still have a way to go to be considered a “professional”, but I’m headed that way. Check out the site if you’d like.

    Reply
  17. anonymous

    I strongly disagree with the notion that “all that matters is the work, not the site.” especially in this age of UI / UX / Interaction Design, I feel that creating interesting UI and Interactions can be a big plus. Even if you’re strictly a motion designer, motion skills are increasingly sought after in all disciplines.

    Reply
    • If you are a UI designer and want to show that off, than go right ahead. But for your motion portfolio, I would keep it simple.

      Reply
  18. Hehe, just noticed the link to this thread at the top of your page and after releasing my new website on the world this week, I thought I was going to spend the rest of the day sulking having read here that everything I’ve created is wrong.

    Thankfully I was pleasantly surprised. All 7 points satisfied :) Does this mean I have a good website?

    Reply
  19. hay hi … i m new to this motion Graphic world i saw ur single tutorial for AE and seen some helping tip.. i like it a alot .. i m from india ,,now i m just seeing all ur tuts and ol.. with in a week i hope i will finish it all………..
    bye

    Reply
  20. and and thanx for —–Seven Rules for Building Online Portfolios———

    i late but also very very useful ..

    thanx again

    Reply

Leave a Reply

Comment Rules

This is a friendly community. Please treat everyone with respect. We don't all have to agree, but we do have to be nice. Criticism is fine, but rude comments and name calling will be deleted. Use your real name and don't be spammy. Thanks for adding to the conversation.