The online proofing gallery layout that I have been using for the past 5+ years is the HTML gallery that can automatically be generated within Lightroom under the “Web” section.
I decided it was time to give the online proofing gallery a makeover so that it is 100% responsive, thus, allowing clients to view the online proofing gallery from a laptop, desktop, tablet, smartphone, etc.
I came across Pixieset.com, which is an online service that allows photographers to share, deliver, proof and sell their photos online.
I looked at one of their example galleries and I immediately knew that I wanted to replicate the layout. I then searched through the source code of the example gallery and found that they were utilizing Gamma Gallery which creates the responsive Pinterest-like grid layout.
After a weeks worth of work and some help from Jeff @ Quantastical.com, I have a new online proofing gallery that is 100% responsive allowing my clients to view their online proofing gallery from a desktop, laptop, tablet, smartphone, etc. and not have any issue with the layout of the gallery.
Click the image below to open the new online proofing gallery.
Click the image above to open the new online proofing gallery.
As you scroll down through the gallery, new photos load in batches of 15. Once you reach the bottom and there are no more photos to load, a “BACK TO TOP” button is presented so you can click and be taken back to the top of the gallery without having to scroll all the way back up using your mouse.
When you hover over a photo, you are presented with the filename of that photo. My clients use that to provide me a list of filenames for me to edit once they have made their selection.
When you click on a photo, you are presented with a larger version of the photo. The filename is also presented below that larger image. You can also navigate through the photos on this specific screen by either clicking the arrows to the left and right of the larger photo, or by using the left and right arrow keys on your keyboard.
To escape the larger photo and go back to the gallery, simply click the “X” in the upper right hand corner of the screen.
You can even play a slideshow by clicking the “play” button in the upper right hand corner of the screen when you are viewing a larger image.
Obtaining feedback on this new online proofing gallery is a must!
Please provide your feedback by using the feedback form below.