PSD to Pro Photo 4 Conversion – Amy Kimball Photography

Seth Kimball Designs contacted us looking for some help getting his wife’s design setup in the latest version of Pro Photo. An experienced designer, Seth hadn’t spent a lot of time under the hood of Pro Photo and looked to us to convert the design and give him a brief tour of the ins and outs of using the built in functionality within PP4.

PSD to Pro Photo 4 Conversion - Amy Kimball Photography

PSD to Pro Photo 4 Conversion – Gina Smith

This was a challenging theme to code. As many developers know, Pro Photo can be a pain when it comes to ordering content in the way you want it to appear, and since there’s no real hooks system in place you can’t force things to order the way you want them to. What you can do, though, is throw a ton of custom CSS at it and hope it sticks :)

The big challenge on this theme was the fact that there wasn’t a header/logo/menu layout built into Pro Photo to accommodate the layout the client (Tiffany Kelley Designs) was going for. So instead we had to choose the closest fit we could find, wrap and break and position and pad the content until it looks like it does now, seamlessly wrapping around the masthead area.

The bio area was also a lot of fun to work on. Again, lots of custom CSS and a dash of absolute positioning to get all of our elements where we want them on the page.

PSD to Pro Photo 4 Conversion - Gina Smith

PSD to Pro Photo 4 Conversion – Aubrey Marie

This was actually one of the more straightforward PSD to Pro Photo conversions we’ve done in a while.

Still, if you look close enough you’ll see a lot of custom backgrounds using advanced CSS positioning to place them in the correct spot in the Pro Photo theme. Pay close attention to the footer areas, content borders, date background and the masthead. Lots of really small elements that bring together a wonderful design without being too in your face with colors and textures.

Once again, this is a Tiffany Kelley Designs custom theme we were lucky enough to be asked to code into Pro Photo 4 and WordPress.

PSD to Pro Photo 4 Conversion - Aubrey Marie

PSD to Pro Photo 4 Conversion – Table for Two

This design was interesting, as we had to use a lot of absolute and relatively positioned background images through Pro Photo. Pay especially close attention to the ribbons in the sidebar, the comment count bubble and the sticky-note/paperclip on the left with rotated text. 100% CSS, baby.

PSD to Pro Photo 4 Conversion - Table for Two

PSD to Pro Photo 4 Conversion – Becca Wood

PSD to Pro Photo 4 Conversion

This was a particularly interesting design to work on. Because of the limitations in Pro Photo, we had to use a lot of custom CSS to manage the mis-aligned navigation menus and social media tag.

In either case, we had lots of fun, as we always do, when working on designs with Tiffany. She’s a real superstar and is a blast to work with.