With some thought, we were able to come up with a taxonomy of content photo sizing:

1. Constrained horizontally (e.g. in a sidebar):
   
   
2. Constrained vertically (e.g. to align alongside text):
   
3. Constrained both horizontally and vertically within a box:
   
4. Constrained both horizontally and vertically to fill the box, with the edges lobbed off automatically (e.g. when needed as specific design element):
   

I thought the fourth case would be the only troublesome one, but we knocked out uses 1, 2, and 4 rather quickly. Use 3, however, proved to be a problem; we just couldn’t get it to size appropriately for every test case. Unlike the others, it was unclear what dimension to constrain to: it varies not only for the same image placed in different spaces, but also for different images in the same-sized space:

It was one of those problems that is as easy to describe–”fit the image in the box”–but hard to wrap your mind around programatically. We knew there must be simple logic to it, but despite examples in Photoshop and repeatedly walking through the problem we were having trouble making sense of it. Finally, we realized that the key comparison is the ratios of the images: if height_original:width_original > height_target:width_target constrain by height; otherwise, constrain by width. We actually managed to make an educated guess at the solution before we fully understood the problem, but we did some old-fashioned pen-and-paper work to prove ourselves right.

The ins-and-outs of this backend code and logic no doubt are pretty dry to much of our audience. But this sort of problem is one of my favorite parts of my job: working through the logic of it is completely fun stuff to my inner geek, but more importantly there’s a great satisfaction in knowing you’ve found that killer solution. When you get home, it’s hard to explain to your significant other why spending the afternoon on this one simple function wasn’t a waste of time–heck, sometimes it’s tough to get that across to your boss. But here’s a case where, by taking that time, we were able to both clearly define all the ways we employ content photos on the design-side and create a single function that quickly fits any given photo to those uses. And that not only solves an immediate goal, but we can take that solution with us. We nailed it. And we may never need to think about image sizing again.