Archive for the ‘CSS’ Category

CurtainsCouture.com

Saturday, October 12th, 2013

Small project for a local home designer here in Chicago. What’s fun about these projects is that I can play more with patterns and color. I never get to use repeating brocade patterns or rich purples in my day job!

These are early mockups. I think the final live version will end up being better. My developer friend and I are planning on coming back to it every once in a while to add functionality and content.

Total Attorneys Dashboard

Sunday, May 19th, 2013

The project was to add in some useful high-level reporting to the Total Attorneys CRM dashboard. Users log in and get some quick, visual stats for how the have been using the platform.

Chicago Low-Income Housing Trust Fund

Wednesday, September 12th, 2012

I came across this project through a great non-profit organization called the Taproot Foundation. Taproot puts together small development teams and pairs them up with non-profits that need work done but don’t have the staff or funds to make it happen on their own. I was teamed up with a project manager, developer, content writer, and marketing specialist.

Chicago Low-Income Housing Trust Fund (what a mouthful) needed a basic website that showcased all the great work they do finding and distributing low cost housing to families in Chicago. This was a very interesting exercise for me because I’m used to working in Lead Gen and attention-hungry startups, while CLIHFT is basically a city government entity that operates in pretty much the opposite way. They don’t really want or need attention from the public, as they don’t have the staff to field calls or answer emails all day. This site is just so they have a resource to show people what they do and what they stand for. I tried to go for something fairly warm, yet sober and informative.

Kitchens.com homepage sliders

Sunday, March 4th, 2012

For this project I was tasked with updating the interactive slider or “TV Screen” that lives on the homepage of Kitchens.com. For the past few years this animated slider, which promotes new and recently updated content, was created in Flash. This presented a few problems for us. First, every time we needed to make a change, I had to manually open up the project and make changes to the images and the animation. Second, because it was written in Flash, anyone who was viewing the site with an iPhone or iPad would just see a static image pointing to a single section of the site. And third, we weren’t using the power of our CMS, having content updated daily and keeping the site “fresh.”

With these new versions of the homepage slider and the photos page slider, all three of these concerns have been addressed. These were created using JQuery and the content is being dynamically pulled from the Ektron CMS that Kitchens.com uses. Additionally, to give the pieces a little more of a designed feel, I used a unique font, hosted by Google Fonts and some CSS3 tricks, like text-shadow and opacity.

It may not be obvious from the pictures below, but users can use the numbered buttons to navigate between slides or can over over the main image to see arrows that take you back and forth. The slides automatically advance every 4 seconds or so, but if the user interacts, the animation stops.

To see the live version of these sliders, see these pages: Kitchens.com homepage and Photos homepage