A southern California nonprofit working to inspire public participation in the cataloging and preservation of local architectural gems and public spaces looked to overhaul its site as part of a major technological overhaul to address their website CRM, CMS, fundraising and advocacy infrastructure. Central to this effort was bringing a fresh new look to the site.
preliminary, rapid wireframes
Early on in the engagement, while still hashing out the full scope of work, I was asked to quickly produce some wireframes to demonstrate to the client how their current fragmented user experience for handling donations, membership, and event registration — each previously handled by distinct systems — could be unified into a more consistent interface. These wireframes — though not actually low-fidelity — were quickly produced in Whimsical to simply demonstrate potential user journeys before other efforts regarding the visual design or information architecture were addressed.
Research & planning
Other members of my team were involved in performing a content audit of the site, interviewing stakeholders, and planning, user testing, and refining the site’s information architecture, though I monitored this work to ensure it met our quality standards.
Another designer also put together the initial style tile the client approved, though that mostly involved production work as the client’s existing brand standards were reasonably well-established.
Once the visual vocabulary and sitemap were ironed out, I was brought back in to the project to produce additional, higher-fidelity wireframes for key pages of the site. These were done in Figma:
Design & Basic Prototype
The wireframing process was quite successful, allowing me to move into producing designs with few changes. Budget also allowed for implementing a basic prototype of the homepage to illustrate dropdown menus, a carousel and some hover states.
Unfortunately, this project is currently on pause, so final implementation is rather far off; the live website remains on the previous platform with the previous design and architecture. It may be instructive to compare the current site against these plans, particular the Explore Places page and the donation form to see how they compare with my wireframes and designs.