.png)
Amani Women Center
Amani Women Center provides culturally tailored programs and services that empower and contribute to the economic security, and spiritual, mental, and physical well-being of refugee and immigrant women.
Role
Duration
Team
UX Researcher, User Experience & User Interface Design, Interaction Design
2 Weeks
Jasmine Robinson, Laura Campos, Johnetta Dillard, Mary Early, Mary Proby
Tools Used
The Problem
The site needed improvements to their navigation, page content, layouts, and purpose.
The Objective
Amani Women Center aims to support & educate refugee & immigrant women through tailored programs that will empower them in their new journeys.
The Solution
Prioritize the mission statement and purpose of the organization. Card sort through the navigation and improve the overall layout and content to the site.
THE CURRENT SITE
A website redesign is needed to clarify the important service the organization provides and to motivate action from potential supporters. The site should be responsive and easy to navigate. It should be easier for people to donate and/or volunteer but also convey a strong sense of purpose, so visitors will fully trust that contributions will be fairly allotted and put to good use. The site should make good use of white space and colors that convey trust.
RESEARCH
Proto Persona
We wanted to form a deeper understanding of our users' goals, needs, experiences, and behaviors. So, we created a persona based on our initial ideas of our target audience.
Without any research, we anticipated the user to have certain characteristics:
A professional female in her mid 30s, who volunteers in her spare time and loves being with her family.
She is unable to contribute to the level she likes& wants to do more volunteering.
Competitor Research
User Surveys
We built an online survey and shared it in various relevant communities. In just a few days, we received 20 submissions. Based on these, we identified 5 common pain points, which lead us to the next step.
IDEATION
Tools used
User Persona
From the insights gathered from our surveys, we developed our ideal user. We used this persona whenever we wanted to step out of ourselves and reconsider our initial ideas.
Found the user to be a working professional with limited time but who is passionate about women in the local community.
She likes to volunteer because it makes her feel good, but when time is limited she will donate financially.
DESIGN
Desktop Mid-Fidelity Prototype
Throughout this process I speared headed building and connecting our mobile prototype, whereas my teammates worked thoroughly on the desktop version.
My teammates and I also made great contributions to the design and navigation to help our users flow easily through this journey.
As a group, we prioritized the most important information and features and incorporated it within our flow.
-
Home displays a primary header and info about the organization.
-
Donate and Sponsor are prominently featured, but changed them to "Donate" and "Volunteer."
-
Added above-the-fold "How You Can Help" section
-
Two info boxes link to secondary pages (Services and Program)
-
Added a graphic showing the impact of the effort, and a feature story
Mobile Mid-Fidelity Prototype
With my teammates working greatly on the desktop, I copied their ideas and created our mobile version.
While making sure our dimensions were aligned and using great spacing to help the user flow easily.
​
From user testing we learned:
-
The mobile version was built more in depth and our users preferred the mobile version
-
Aspects of main navigation unclear
-
Scannable
-
Consistency of confirmation and receipt pages
-
Button states
-
Footer Connection
Desktop High-Fidelity Prototype
Iterations to Desktop:
-
Implemented greens and blues to convey trust
-
Early versions had a Donate and Sponsor button in the header, Changed one of them to Volunteer
-
Made it easier to find the organization's mission statement on the homepage
-
Details about organization's impact on their clients visible on home page
-
Renamed "Meet Linlin" to "Success Story: meet Linlin" and made visible on homepage
Mobile High-Fidelity Prototype
Iterations to Mobile:
-
Less text & more scannable
-
Accessibility compliant color scheme
-
Eliminate check boxes with money selection
-
Progress bar (lets the user know how much they have to do)
-
Change (X) to left side of drop down menu
-
Fixed "Request Help" link
-
Receipt confirmation
PROTOTYPE
FUTURE RESEARCH
In the future, we would like to potential add a view the girls page or the ability to speak with women in the program.