Steamers coffeehouse & Wine Bar is a for-profit coffeehouse and wine bar in Arvada, Colorado, dedicated to hiring people with developmental disabilities.  They are expanding their facilities and operations and wanted to update their website as well.  We worked with Steamers to rethink, redesign and rebuild their website from the ground up.

Steamers Coffeehouse's previous website

We started out re-organizing the site’s information architecture.  The original site was flat — that is, the page hierarchy was only one level deep.  Since we were expanding the website and adding additional content, we couldn’t continue to use this site structure.  So we changed it to a two-level page hierarchy, with all the site sub-pages still easily accessible through drop-down menus and sidebar menus.  We consolidated the breakfast, lunch and coffee menus under a “Menu” tab, we expanded the content listed under “Services” to multiple pages, we added an “About Us” tab for content such as a staff gallery, company history, and company partners, and expanded the Location page into a “Contact Us” page, with sub-pages holding contact forms, address info and embedded Google maps.  We kept “In the News” as its own tab on the main bar.

The Steamers Coffeehouse facilities have wonderful interior design, utilizing a bright red/orange/green color scheme on the walls, natural materials for the furniture, and extensive framed pictures on the walls.  When we were building the website, we wanted to emulate the colors and textures of the coffeehouse itself.  Thus, you can see a similar bright-yet-mellow color scheme in the website’s visual design, along with extensive visual textures to add interest.  In fact, this is one of our favorite website visual designs to date.

The Steamers Coffeehouse facilities

A sample of some of the colors and textures used on the new website

Steamers Coffeehouse prominently features a “staff picture wall,” showing framed pictures of all of their employees, and they wanted to do something similar on their website as well.  So we designed a Flash-based picture slideshow to feature prominently on the website’s homepage, cycling through both formal portraits and candid shots of the coffeehouse staff.  The slideshow is powered by an RSS feed from Steamers’ Flickr Photostream, making it very easy to maintain and update.  We also designed the slideshow to look as if it were an actual picture frame hanging on the wall, to further match the visual motif of the coffeehouse facilities.

The Flickr-powered slideshow on the homepage

Finally, we built the entire website on a custom content management system.  Our content management system gives Steamers employees the ability to easily update the text and pictures on their pages, and to add, delete and re-arrange pages with a visual drag-and-drop editor.  This will give them the ability to maintain and manage their website long into the future.

It was a pleasure working with Steamers Coffeehouse throughout this project, and we’re very proud of the results.  Steamers has a great group of people, great facilities, and some of the best food and drinks around.  Working with them was a great opportunity to produce some very high-quality work, both on a visual and a technical level.  We wish Steamers the best of luck going forward in their business, hope that their newly revamped web presence serves them well.

You can find Steamers Coffeehouse’s new website at www.SteamersCoffeeShop.com.