CHALLENGE STATEMENT
How can we provide a better user experience in Casa de Esperanza's website to help users navigate it with more ease? In this project, I served as the Information Architect lead of the team and as a User Experience Designer.
Team
Pamela Patton, Ashley Hehl, Guillermo Rangel, Valeria Obando, Tyler Luce.
In this project, I served as the Information Architect of the team and as a User Experience Designer.
BACKGROUND
Weekend For Good is a partnership between AIGA West Michigan and Code for Good that during one weekend comes together to serve non-profits. Casa of Hope is a non-profit organization that provides “medical, dental, and construction services" in Honduras. For this project, we had one weekend to improve their website with the restriction that we could not rebrand their logo.
Casa of Hope's website before the overhaul
Casa of Hope's website before the overhaul
Research
As the main members of the organization had little knowledge about websites but some experience using WordPress, we decided to keep this CMS. After conducting a heuristic analysis of the site we found that:
– The website theme was not responsive
– The website theme was not responsive
– The architecture of the pages was at times redundant and there was duplicated information.
– The content of the pages could be improved for a broader audience.
For this reason, one of our priorities would be that of rethinking the Information Architecture of the site to help users navigate it more efficiently.
Homepage
We started by brainstorming what the main purpose of the organization was and how to structure the homepage in a way in which users would get their purpose in the first seconds of visiting the site.
For each of the sections of the homepage, we established a purpose and a way to achieve it. The order is as follows:
1. What we do › share a success story and add a call to action to donate
2. Why Honduras › Add a map to give context and data
3. The issues we try to tackle › communicate the importance of education, health issues, and job opportunities
4. How is Casa of Hope unique › Transparency is prioritized, show how donations are used
5. How did everything begin › Share the story and the evolution of the organization and add a call to action for people interest in joining it.
Navigation
We also revisited the current navigation system and found that it used too many links that took attention away from the Donation section which was the site’s CTA (call to action).
Initially, the architecture of the navigation bar was as follows:
The initial architecture of the navigation bar
While this structure encompassed all the information needed, it also contained duplicated information we wanted to avoid. Thus, we decided to unify all of the different kinds of help they provide in one page that would still be called “What We Do” instead of having it on four different pages. Under the “About Us” page, we consolidated the information that used to be under “Honduras” and kept the “Meet the Board Members” page. We also added the “News” and the “Contact Us” page under it to add more information on how to collaborate. As we wanted users that had just gotten to the page to be able to both Donate and Volunteer in just one click we kept these elements as they were in the navigation bar.
Moreover, we learned that the organization had several images that portrayed how they helped the community, we decided we wanted to have these images highlight the human aspect of the organization distributed throughout the site instead of only on the “Photos” page.
PROPOSAL
Based on the previous recommendations, we came up with this simplified design version of their website.
Additionally, the computer scientist in our team was able to create a Donation Calculator that would reflect the transparency of the organization by giving the user a clear idea of what their donation would provide.