Challenge: Create a website to share and expand a small non-profit's work.

WAGES (Women’s Action to Gain Economic Security) contacted us in the spring of 2009 with an outdated website that needed an immediate overhaul. In order to beat the economic slump, grow their affiliated businesses, and launch new ones, WAGES required a sleeker and more sophisticated web presence. They needed a means of connecting to their donor base and reaching a broader audience―and they needed it soon. WAGES also sought a second website where their six affiliated co-ops could provide information and offer service estimates to potential clients. Both sites required a simple structure that could be updated by various people from various locations.

Concept
Design and implement two websites that communicate WAGES’ vision and integrate a content management system (CMS). Ensure that they can be easily maintained by non-designers and non-developers without affecting site functionality or look. .

Process
We began by investigating the relationships between the various keywords and themes that represented WAGES’ developing brand and assessing the effectiveness of their dissemination. Next we explored three design directions with the WAGES team before selecting a visual framework for best communicating the essential message. The final selection was a design we called “clean, green” comprised of an inspirational image framed by two main navigation areas. This layout used contrasting colors and prominent buttons to invite visitors to learn more and to visit donation and service-estimate request pages. In order to best utilize WAGES' small budget within the tight project timeline, development work began as soon as designs were approved. This meant that the guiding principle behind structure development was creating a system that WAGES' staff could seamlessly expand in the future. With Drupal, an open-source CMS, we avoided writing highly individualized code that only our team could understand. Using Drupal, we adapted modules for versatile features such as adjustable columns and expandable menus that editors would not have to configure. And, it was all done on an open source, non-proprietary platform.

At WAGES, non-developers perform web updates in-house. To accommodate this, we incorporated time-saving features at every level. For news updates, we set up all news sections to automatically fill from a central news page through an RSS feed. Inside the editing interface, we introduced a text editor that allows site editors to quickly format text, make links and bullets, crop images, and modify graphics. We also built pages on a 3-column layout where each column is treated as a distinct section: A text column, an image column, and a far-right link column for user initiated tasks such as donations, further simplified editing. This 3-column scheme allowed us to introduce news feeds and other automatically updating presets this allows users to be notified of breaking news without navigating away from their current page. In this way, we ensured that the site is never static and that it is intuitive for the visitor and editor.

To make the sites stand out, we designed visually appealing interactive pages. By using grey tone backgrounds and fonts contrasted with bright colored buttons and menus, we created a site that is visually crisp without becoming overwhelming. For the non-profit’s main site we created an interactive gallery carousel page: Stories of Hope, a page that highlights women whose lives have been positively impacted by WAGES. The non-profit now has a dynamic page to which it can point donors and increase site traffic. Through print and e-marketing materials, donors can be invited to a page where they can connect with the women whose lives their dollars affect. Additionally, this page links both sites and serves as one of three bridges for visitors to make the connection between the non-profit and the business network. Another special feature allows the second website to process service estimate requests based on visitor zip codes. For this feature we set up a scheme that allows visitors to easily submit requests into a database where requests can be tracked, analyzed, and downloaded as excel or text documents.

Results
SOMOS launched WAGES' (http://www.wagescooperatives.org) and the Eco-Friendly Cleaning Co-op Network's (http://www.ecocleaningnetwork.com/) new websites on July 22, 2009. The result was a developed online brand identity positioning WAGES as a leading, dynamic, competent organization that enables the Bay Area’s most successful social enterprises. Most importantly, both sites disseminate the non-profit's impact and related resources while growing the social enterprise network. By utilizing a scalable CMS, both sites allow for quick and easy updating and have built-in dynamic web presence features that can be leveraged (share links, e-news sign-up, search) with limited resources.

Technology Used
Photoshop
Illustrator
Drupal
Third party wireframe program