Best organization option for handling a multi-level gallery or portfolio?

Question

I am helping my cousin with a small web site for his custom upholstery business. On this site, there will be a portfolio section displaying images of his prior work.

His work typically involves vehicles (automobile interiors, motorcycles, boats), furniture, apparel accessories (purses, wallets), and custom leather artwork. Each project he completes typically has three to ten pictures associated with it. A project can take anywhere from a day or two, up to several weeks depending on the complexity and current work load.

I am trying to determine the best means of organizing the pictures to enable site visitors to quickly access examples of his work that match their current interest or need.

In my current implementation, a Portfolio screen is displayed where each project is presented as a link on the left hand side of the content area of the screen. Once the link is clicked, the page displays an auto-scrolling gallery of the images for that project. This implementation works OK for the existing projects, but as the number of projects continues to grow, having a single list will become unwieldy.

I am considering grouping/layout options to manage the current image supply, as well as scale to a larger set of project collections.

One option I am considering is something similar to the Lego Architecture page, where there is a top-level horizontal category list (Landmark Series, Architect Series), which then provides a left-hand menu for specific galleries, and selecting a gallery shows the images in that gallery (other than the top-level horizontal menu, this is how I have his page now). So in the case of my cousin's site, the top-level content menu would be categories such as "Vehicles", "Furniture", "Accessories", "Artwork", which would then bring up the list of galleries under each category.

A second option I am considering is to represent each gallery link as a thumbnail arranged in a grid layout (possibly sectioned by category headings). Something vaguely similar to the standard Google Images search results. Clicking on a thumbnail would open the auto-scrolling gallery in a lightbox.

My first option seems like a decent layout, but I am not sure it offers the best ux - there would be a fair amount of drill-down to get to something that may be of interest (Portfolio -> Category -> Gallery). Also, I think I still have a scaling problem if a particular category ends up with a lot of galleries.

The second option may scale a little better, but then the visitor is potentially presented with many more options than they necessarily need. If they are only interested in boat upholstery work, they don't want to have to scan through all the other thumbnails to find the boat images.

So I am throwing this out to the experts - are either of these options "good"? Are there other options I should be considering? Are there other factors I may be missing that would help inform my decision? Any example sites would be appreciated, and if there are tutorials for implementing the option, that would be great; I am a software developer, but my UX design skills are immature but growing.

Answer 1

im researching for the perfect portfolio layout/structure also for my web agency we have 100s of projects that currently arent displayed on our site as our current portfolio is not very well displayed and takes a while to add each project so looking to upgrade in coming months and want to do it right so it will last for a few years at least

came across this site the other day http://www.domain7.com/results/ its obviousoly a different industry to what your cousin is in but the principle is similar I think its pretty well done simple, minimal yet with two types of filters project type and industry do you think you could further classify your cousins projects aside from main categories? perhaps materials used could be another classifier? so people looking for past work on a vehicle could browse via that method or people looking for past work in leather could browse that way...

A project is generally assigned to at least one category from each "type"

As you can see all are listed on page load to display a wide variety of projects, this is good i think as it shows right away that a large number of projects have been completed, signifying experience, so even if the customers is only interested in a particular type of project they cant help but see a wide range covering a range of typpes..

the project detail page eg http://www.domain7.com/results/kyfa/ allows for as many images as you want and also a prject description which i think is important what was the brief, how you answered the brief, and results

maybe a bit more geared toward web agency but certainly should be able to see potential in this type of display and its a pretty simle design to emulate!

all the best!

Answer 2

I agree with you that long lists of work do become unwieldy. An option, already suggested, would be to provide top-level criteria where users can dig down into further work.

However, you have to consider whether you allow the user to navigate a long list of work (icons, images, etc.) AND have the option to filter this down - or whether you clean up the interface and simply present those criteria in a left hand box - or in the main content? The above 'domain7' portfolio tries the former way; and it's useful for casual browsing too.

Hope any of these considerations help!