Online portfolio thumbnails

[hipp5]

I've been spending the last two weeks working on an online version of my portfolio. I've put my work in a gallery with a "filmstrip" of thumbnails (72px x 72px for you design nerds) along the top. I really like the result, but I've been doing a lot of reading today about portfolio design and a lot of the stuff I read rags on thumbnails for not giving the viewer a good idea of what they about to see. Problem is, none of these sources suggest a better way to do it.

So my question is: how can I present a number of my visual work examples in a compelling manner without creating crazy download times from having them all on one page?

[Hink]

I am still somewhat confused by these digital portfolios. Are you in planning or design?

With that said, what are you using to create the portfolio? Flash? Html5? It really depends on how you build it to answer the question.

If you go with Flash you will need to just create separate .swf files and load them into your portfolio .swf. You can load all of the kids while the parent is distracting the person looking at it.

In html5 is it much easier, but more complex to explain, so I won't.

Good luck.

[nrschmid]

I've been spending the last two weeks working on an online version of my portfolio. I've put my work in a gallery with a "filmstrip" of thumbnails (72px x 72px for you design nerds) along the top. I really like the result, but I've been doing a lot of reading today about portfolio design and a lot of the stuff I read rags on thumbnails for not giving the viewer a good idea of what they about to see. Problem is, none of these sources suggest a better way to do it.

So my question is: how can I present a number of my visual work examples in a compelling manner without creating crazy download times from having them all on one page?

I use thumbnails for everything in my portfolio (writing samples, research/analysis, GIS, renderings, Sketchup). I did my portfolio in Flash, and each link is a button (which is a combination of a thumbnail and a label). When you rollover the button the text and thumbnail change color. There really isn't a shortcut do doing these. There are a couple of projects where did I designed a huge number of trail signage, and each sign has it's own link, so I have about 13 buttons (13 labels and 13 thumbnails).

My thumbnails measure 70p x 70p using a standard 1024x768 resolution. As I mentioned I have a rollover effect so there are actually two different images. I also use a freeware screen capture program called MWSnap, which takes a picture of the computer screen. I set the parameters to 70p x 70p. I open the full graphic or writing sample in Photoshop or Acrobat or Acrobat Reader and zoom out until the entire graphic fits within the 70p x 70p, which can be 500-1000%. I take a snapshot of the computer screen (with Photoshop, Acrobat, or Acrobat Reader open) using MWSnap and then it as a TIF or PNG. This is the rollover image. I then grey out the same 70p x 70p graphic in Photoshop and save it. This is the non-rollover image (what will appear when the cursor is NOT over it). I then load both of these images into my Flash Library to create the thumbnail graphic. I add the text label (two different colors) and combine both to make ONE button. Actionscript is VERY choosy so you HAVE to be meticulously organized with naming buttons or it won't work.

Yes, it's a lot of work but when you combine it with a VERY subtle animation scheme it looks very professional. Granted it took 2 years to design my portfolio so it may not be something you can do in a hurry.

[hipp5]

I'm doing my online portfolio in HTML and CSS. I'm trying to avoid Java as much as possible because a lot of people these days use NoScript. The back end side of things is working out for me so far. I guess this is more a question of design taste. I've heard a lot of people ragging on thumbnails recently, but none of the complainers seem to give any alternate solutions to presenting various works in a comprehensive manner. I was just wondering if anyone had thoughts on an alternate way to present things.