Here are some of the work I've done recently that I'm most proud of. Although these sites all look completely different, the one thing they all share is a modern code base. If you look under the hood, you’ll find lean, mean, standards-compliant XHTML and CSS. If you have any questions, feel free to email me.
Pop Art
When Pop Art decided to redesign in late 2008, it was an opportunity not only to update our design and messaging to better match our brand, but also an chance to turn the site into a showcase for our best coding practices. We rebuilt from scratch using .NET templates, jQuery enhancements, and a fully dynamic "river of information" on the homepage. With the support of the Pop Art creative and development teams, I guided our creation of a minimal content management system to handle our news and job postings, while keeping as much content in static files as possible to keep the site easy to manage in the future. Our focus was making a site that would not only effectively deliver our message, but also one that we could be proud of behind the scenes, and I'm happy to say that we accomplished that goal.
Dojo Wordpress Theme
In mid-2008, I began work on an ultra-minimal web-standards Wordpress theme. My goal was to create a theme that was flexible enough to allow me to use it on every wordpress blog that I manage. The finished product has two dynamic sidebars and an editable "about" blurb. An options page in the wordpress admin area allows the user to customize various aspects of the theme (such as copyright statement and byline placement), and support for several popular plugins was written into the theme. All the user has to do is enable the plugin, and it will automatically be used. Support for custom stylesheets was included, allowing the user to override the default minimal look with any design they like. This theme is currently in use on Space Ninja, using the custom stylesheet feature.
Detroit Diesel
The 2008 redesign for this site features a strong grid and an emphasis on images. I worked closely with the creative team at Pop Art to make sure that the code I wrote matched that grid and gave them the ability to easily add images to any page without having to write custom styles. We also approached this site with a “bottom-up” mentality by designing the inner pages first. This allowed us to focus on the little details that help every page, like consistent styles for headers and body copy, and a standard look and feel for elements like pullquotes or photos with captions. This library of core styles meant we had to spend less time on traditionally design-heavy areas such as landing pages.
Sara Ryan
Local Portland novelist Sara Ryan contacted me in early 2007 to design and build her a website. In addition to blogging and posting upcoming appearances, she wanted a dedicated section listing her publications, as well as a biography. Over the course of the next six months, I built her site in two phases. First, I set up a fully functional Wordpress installation using the default theme, so that she could start adding content while we worked on the design. Early on, I discovered her passion for old books and paper, and we agreed on a scrapbook theme for the site. Try resizing the page — there are several background elements that slide in and out under the main content well.
Pop Art Blog
As part of a larger branding effort at Pop Art in mid-2007, we merged several different unofficial blogs into a single official one. By providing one site for all employees to use, we could maintain effective branding and make it easier for readers to find us. Our goal was to give every employee their own blog, and also create an aggregate page that displayed the best posts from everyone. Using Community Server, I was able to set everything up the way we wanted, including features like individual RSS feeds and a global search function.
LP Field
For this 2007 redesign, the Pop Art creative team wanted to give the feeling of being in the stadium. In addition to using lots of big images throughout the site, the art director wanted the design to “pop” out of the browser by using a huge background image. Weighing in at nearly 100Kb by itself, bandwidth quickly became a concern. As a result, I had to use some interesting hacks and old-school techniques to reduce file size wherever possible without compromising the design. Even so, the markup is clean and standards-compliant, keeping the hacks in the stylesheet where they belong.
Space Ninja
In late 2006 I reworked my personal site for “widescreen” users. Previously, I had a two-column layout that was designed for visitors with small monitors. My logs showed me that visitors with 800×600 pixel resolutions or lower accounted for less than 5% of my traffic, so I changed the design to a three-column layout that would make better use of the available space. At the same time, I completely rewrote the markup in my Wordpress template to slim it down and be more standards-compliant.