We got a surprise snow on Monday that caught most people off guard. I think it only snowed an inch or so in the Denver area, but we got at least eight inches up here in the foothills (which is at least 500 feet higher in elevation).
I tried a couple of new editing techniques on these sets of photos. The first involves how I adjust the exposure and black settings to maximize the contrast ratio. Ideally, there is at least one black pixel and and least one white pixel. I also tried using a new workflow process where I export from Lightroom into Photoshop and then use Smart Sharpen in Photoshop to, uh, sharpen the image smartly.
In a few short days, I’ll be releasing the next step in my photographic endeavor: my official photography website. I’ve spent about two weeks working on the site, which, for me, is quite a bit of time. But I wanted to get it right. Every one who I’ve showed it to thus far has said that it look very professional. I thought I would spend some time discussing how I went about developing the site, in the hopes that it might be interesting to someone.
For a while now, I’ve maintained a Portfolio Set on Flickr. Recently, I used some slick software from Airtight Interactive called SimpleViewer, combined with a PHP script called FlickrViewer (which makes API calls to Flickr and creates the necessary files SimpleViewer needs), to launch a cleaner version of my portfolio: https://andrewferguson.net/portfolio/.
After my Photographer for Hire post from a couple weeks ago, I wanted an even slicker site that was dedicated (in part) to the type of photography I was targeting (i.e. portraits). Originally, my first though was to use this awesome WordPress theme that I’d recently heard about: Monotone. In a nutshell, the color of the site is based on the first picture of the blog post. There were a couple of issues with this method, however. First, the theme was really only designed to handle one image per a blog post (seriously, all the other images were stripped out). Second, I didn’t want to divide my blogging between two sites. Third, I had to manually upload photos that I had already put on Flickr; I wanted to be able to just pull them in from Flickr. So after about a week of messing around, I decided to abandon the WordPress-based site and go home brew.
I already had SimpleViewer working with Flickr, and I knew that Airtight Interactive had another similar program called AutoViewer. So I decided to use that as my starting point. I took my current portfolio viewer…
…and designed a main page around that. I got out a piece of paper and drew the following:
Three boxes. But what about content? I took a quick trip around some of my favorite photo sites and wrote down all the links they had, then dutifully narrowed them down to three categories: photos, about me, and cost. I decided that I’d divide photos into portraits and landscapes (although really it should be “pictures of people” and “pictures not of people”). From three boxes to four boxes: Portraits, Landscapes, Rates, Andrew.
Using Photoshop, I mocked up the following:
I really wish I had screenshots of all the interim steps. Instead, you’ll just have to trust me that this wasn’t a straight forward processes.
With a design in the bag, I started the process of converting image to code. First I coded the main page. It’s all done with DIV tags and CSS. It was really just a matter of specifying the size of each element box and then making the whole thing float in the middle with some margin-left: auto; margin-right: auto; magic. I created a couple of PHP functions to distribute common code elements, primarily the XHTML above and below the BODY tag. And that was pretty much it.
From that, I coded the rates and about me page. The portraits and landscape page was pretty much already in the bag, I just had to tweak the FlickrViewer code (which took longer then anticipated and involved a pretty heavy rewrite of the existing code, but that’s another story). I showed it to some people and got some feedback, incessantly tweaking every little detail until I finally had something that I thought was good:
I think it’s rather remarkable how close the final design is to the mockup. I’ve tested it across several browsers and everything seems to be in order, including fully XHTML 1.0 Transitional and CSS compliant.
There’s just a couple more things to wrap up before I officially launch, so check back on Saturday for the official launch of Andrew Ferguson Photography.
Regular viewers of AFdN might have noticed a Ron Paul button show up many months ago. However, I’m guessing only really observant readers might have noticed that they haven’t seen the Ron Paul button anywhere else on the Internet. Robert did and even sent me an email asking if he could use it. So here’s the skinny for everyone.
I’m releasing the Ron Paul Button image I designed:
Additionally, I’m waiving the “By attribution” requirement since Creative Commons doesn’t have a CC NC-SA license. Although if you’d like to attribute me, that would be nice as well.
You can either host the button on your site or feel free to hotlink to it using this code:
<a href="http://www.ronpaul2008.com"><img src="https://www.andrewferguson.net/wp-content/images/ron-paul-2008.png" alt="Ron Paul 2008" /></a>
A little bit of history on the button. I created it because Ron Paul’s campaign site doesn’t have any buttons that I liked. So I designed one that I did like, using colors from the Ron Paul site. All the work was done in Photoshop and I still have the PSD if you really want it.
If I remember correctly, this 37Signals post was a big influence in my decision to make the button.
As a side note, I discovered that Robert Rodriquez also runs http://www.yourip.us/, which has immediately become by new favorite address for when I’m looking for my address. It’s fast, slick, well layed out, and some rather obscure, but potentially useful information.
