Introduction
Causecast transitioned from a cause marketing agency to a product-focused company, and with that transition came an idea for a platform that could serve as a donations and volunteering service for companies that wanted to provide this as a perk for their employees. The product that was born was the Community Impact Platform. The platform was a very large product-driven project that was immensely complex in functionality; it included a dashboard system for the nonprofit, the employer, the employee, as well as the Causecast admin.
Challenges
The biggest challenge for this project was designing something that was flexible enough to reflect varying functionality (modular design). The design also had to be customizable, as it was a white label product that other businesses could adapt and apply their own branding.
Process & Responsibilities
The UX designer, product manager, and I spent months collaborating with the product and engineering directors to hash out the details of this new product, with some loose directions given by the CEO. I was on point for visual design, so I worked closely with the UX designer, having conversations and working sessions to figure out sticky points in a particular flow, or to work out contentious layouts and visual awkwardness, churning out designs for each and every screen, including all the states. I also created the mobile web experience, and the style guide for the platform.
Desktop Web Experience
The landing page for a user after they've logged in. This is an example of what a regular user (non-administrator) might see; this includes a banner for active campaigns, a tabbed summary of good work the user has done so far, an administratrive panel for a current fundraiser a user might have, and an activty stream.
The landing page for a campaign. Users would access this page if they were interested in participating in the campaign.
The volunteer opportunity search page. Features a "List" view and a "Map" view. This is the list view.
The map view of the opportunities. The blue state represents the active opportunity that the user is viewing on the map (as reflecd by the blue pin); the grey state is a hover state to indicate interactivity.
One example of a report we'd generate for the employer.
Style guide for the Impact Platform that I created to help keep our designs consistent as we added more features.
Mobile Web Experience