top of page
Meeting the Needs of Multiple Users
Dress for Success wanted to update their on-
line presence. They have three primary users.
Donors, volunteers, and clients need to navigate
the platforms easily.
Solo UX/UI Designer
May - July 2023
Website & Mobile
, Excel, Word, JamBoard, Illustrator
Adobe XD
Triangle Dress for Success leadership offered their website as a final capstone for my Google UX Design Certificate. I met with leadership to learn their three biggest challenges:
Three main users
Website confusion
Updates
Three main users
1/3
Triangle Dress for Success did not have a working mobile solution and were excited to learning more.
How do I understand the users needs?
EMPATHY
Dress for Success sent me user emails for research from the three user groups. The seven questions I asked focused on tasks, experience, frustrations, and pain points.
As I conducted interviews, I learned a user could fall into all three groups - client, donor & volunteer. Donors had no issues with the website, so I narrowed the user groups to two.
How did they rate the website?
What tasks were important to users?
Users rated their website experience high (7.5 out of 10). They reasoned the current website is better than the last one.
When asked about the tasks, clients and volunteers expressed the need to accomplish
tasks that they often found frustrating on the current website. Top tasks:
Top rated tasks rated tasks in interviews
What is the users journey?
A user journey was conducted to establish easy navigation. The analysis relied on the top tasks users identified in interviews to pave the way for an easy-to-navigate site map.
Client Journey
Volunteer Journey
Site Map
Client Journey
1/3
DEFINE
What are the users pain points?
User comments were gathered in JamBoard and analyzed for themes. The two groups agreed on items in the middle. Each group had their separate needs in the outer circles.
Top pain points from interviews. Items in middle are shared concerns.
What are the problems I am trying to solve?
To get job information, coaching, and courses for a good job, Clients wanted:
To give coaching, services, and clothing so clients can land good jobs, Volunteers wanted:
Both Clients and Volunteers wanted to website with a Search Bar & Events and be:
Houston, we need to solve a big problem fast!
IDEATE
A big problem was that users clicked on the National Dress for Success website thinking they were on the Triangle Dress for Success website.
I substantiated the problem to leadership after seeing the problem in user research and offering solutions.
Website Confusion
Presentation listing options
Outcome
Website Confusion
1/4
What were my design choices?
In sketches, a lively homepage included a bright photo. Based the Dress for Success Corporate Guidelines, I used maroon and added large white spaces to simplify the design.
1st iteration
2nd iteration
3rd and final interation
1st iteration
1/3
Two wireframe iterations and final website service section.
Words were included in wireframes. The main website had little description so I added UX wording and asked volunteers and clients to offer edits and corrections.
How did I meet the users needs?
PROTOTYPE
Easy navigation
All services one-click from home
Quick sign ups & sign ins -
Updated condensed forms
Easily found contact & hours -
On footer, menu, and under service
LinkedIn teachings
Search bar & course details
Bright, welcoming design
Updated photos, colors, and design
Prototype of Triangle Dress for Success Mobile App
How did I conduct the Usability Study?
TEST
The users who offered insight on website & mobile needs in research agreed to participate in usability studies. The two user groups were clients and volunteers.
3
Iterations
7
Tasks to Complete:
1-3
Ratings
Users competed 7 tasks:
Find phone number & email (1),
Find Wilson Career Coaching hours (2),
Sign up for a Going Places Course (3),
Record Volunteer Hours (4),
Find Boutique Sales (5) & Send to Friend (6),
Use Search to find LinkedIn Webinars (7).
Users rated each task 1 (easy),
2 (difficult),
3 (couldn’t complete).
of interviews
on website
and mobile
Highlights of solutions after three iterations?
Clients wanted a search bar to find the webinar topics they wanted. The menu bar was wide due to a home icon and large logo for accessibility. When the search icon is clicked, a drop down search field appears.
Volunteers voiced the tedious, long
process of filling out the form to log their hours. Analysis of categories, helped whittle the list to three drop down with minimal choices and a calendar for simplify date entries.
Screenshot 2024-01-25 at 2.52.40 AM
Screenshot 2024-01-25 at 2.52.04 AM
Screenshot 2024-01-25 at 2.58.55 AM
Screenshot 2024-01-25 at 2.52.40 AM
1/4
As a growing nonprofit with three locations and multiple services, the contact info and location needed to be clear and easy to find. The info is now found on the footer, each service page, and on the menu.
Screenshot 2024-01-25 at 3.17.16 AM
Screenshot 2024-01-25 at 3.02.59 AM
Screenshot 2024-01-25 at 3.07.46 AM
Screenshot 2024-01-25 at 3.17.16 AM
1/3
It was important to everyone to represent diversity in photos of empowering women.
Users were delighted with the final product after giving a wealth of ideas and feedback through the iterations. Here is what users said of the final product:
Screenshot 2024-01-25 at 12.18.34 PM
Screenshot 2024-01-25 at 12.19.39 PM
Screenshot 2024-01-25 at 12.23.37 PM
Screenshot 2024-01-25 at 12.18.34 PM
1/8
FINAL
Dress for Success plans to include my design in their new website released later this year.
Watch the completion of the seven tasks.
What lessons did I learn?
The big lesson I learned is users blame themselves for my bad design. I created a photo display at the top of each page in the first iteration that distracted users from going further down on the page. They ended up looping over the same page looking for an item. Instead of blaming the design, they often berated themselves for not looking further down.
Meeting the Needs of Multiple Users
Dress for Success wanted to update their on-
line presence. They empower women through
classes, clothes, and career coaching. To run
well, all three users - donors, volunteers, and
clients - need to navigate technology easily.
Solo UX/UI Designer
May - July 2023
Website & Mobile
, Excel, Word, JamBoard, Illustrator
Adobe XD
Triangle Dress for Success leadership offered their website as a final capstone for my Google UX Design Certificate. I met with leadership to learn their three biggest challenges:
Three main users
Website confusion
Updates
Three main users
1/3
Triangle Dress for Success did not have a working mobile solution and were excited to learning more.
How do I understand the users needs?
EMPATHY
Dress for Success sent me user emails for research from the three user groups. The seven questions I asked focused on tasks, experience, frustrations, and pain points.
As I conducted interviews, I learned a user could fall into all three groups - client, donor & volunteer. Donors had no issues with the website, so I narrowed the user groups to two.
How did they rate the website?
What tasks were important to users?
Users rated their website experience high (7.5 out of 10). They reasoned the current website is better than the last one.
When asked about the tasks, clients and volunteers expressed the need to accomplish
tasks that they often found frustrating on the current website. Top tasks:
Top rated tasks rated tasks in interviews
What is the users journey?
A user journey was conducted to establish easy navigation. The analysis relied on the top tasks users identified in interviews to pave the way for an easy-to-navigate site map.
Client Journey
Volunteer Journey
Site Map
Client Journey
1/3
DEFINE
What are the users pain points?
User comments were gathered in JamBoard and analyzed for themes. The two groups agreed on items in the middle. Each group had their separate needs in the outer circles.
Top pain points from interviews. Items in middle are shared concerns.
What are the problems I am trying to solve?
To get job information, coaching, and courses for a good job, Clients wanted:
To give coaching, services, and clothing so clients can land good jobs, Volunteers wanted:
Both Clients and Volunteers wanted to website with a Search Bar & Events and be:
Houston, we need to solve a big problem fast!
IDEATE
A big problem was that users clicked on the National Dress for Success website thinking they were on the Triangle Dress for Success website.
I substantiated the problem to leadership after seeing the problem in user research and offering solutions.
Website Confusion
Presentation listing options
Outcome
Website Confusion
1/4
What were my design choices?
In sketches, a lively homepage included a bright photo. Based the Dress for Success Corporate Guidelines, I used maroon and added large white spaces to simplify the design.
1st iteration
2nd iteration
3rd and final interation
1st iteration
1/3
Two wireframe iterations and final website service section.
Words were included in wireframes. The main website had little description so I added UX wording and asked volunteers and clients to offer edits and corrections.
How did I meet the users needs?
PROTOTYPE
Easy navigation
All services one-click from home
Quick sign ups & sign ins -
Updated condensed forms
Easily found contact & hours -
On footer, menu, and under service
LinkedIn teachings
Search bar & course details
Bright, welcoming design
Updated photos, colors, and design
Prototype of Triangle Dress for Success Mobile App
How did I conduct the Usability Study?
TEST
The users who offered insight on website & mobile needs in research agreed to participate in usability studies. The two user groups were clients and volunteers.
3
Iterations
7
Tasks to Complete:
1-3
Ratings
Users competed 7 tasks:
Find phone number & email (1),
Find Wilson Career Coaching hours (2),
Sign up for a Going Places Course (3),
Record Volunteer Hours (4),
Find Boutique Sales (5) & Send to Friend (6),
Use Search to find LinkedIn Webinars (7).
Users rated each task 1 (easy),
2 (difficult),
3 (couldn’t complete).
of interviews
on website
and mobile
Highlights of solutions after three iterations?
Clients wanted a search bar to find the webinar topics they wanted. The menu bar was wide due to a home icon and large logo for accessibility. When the search icon is clicked, a drop down search field appears.
Volunteers voiced the tedious, long
process of filling out the form to log their hours. Analysis of categories, helped whittle the list to three drop down with minimal choices and a calendar for simplify date entries.
Screenshot 2024-01-25 at 2.52.40 AM
Screenshot 2024-01-25 at 2.51.46 AM
Screenshot 2024-01-25 at 2.52.26 AM
Screenshot 2024-01-25 at 2.52.40 AM
1/7
As a growing nonprofit with three locations and multiple services, the contact info and location needed to be clear and easy to find. The info is now found on the footer, each service page, and on the menu.
Screenshot 2024-01-25 at 3.17.16 AM
Screenshot 2024-01-25 at 3.02.59 AM
Screenshot 2024-01-25 at 3.07.46 AM
Screenshot 2024-01-25 at 3.17.16 AM
1/3
It was important to everyone to represent diversity in photos of empowering women.
From their initial needs and ideas for an updated Dress for Success website, users gave a wealth of ideas and feedback that continued through the iterations. Here is what users said of the final product:
Screenshot 2024-01-25 at 12.18.34 PM
Screenshot 2024-01-25 at 12.19.39 PM
Screenshot 2024-01-25 at 12.23.37 PM
Screenshot 2024-01-25 at 12.18.34 PM
1/8
FINAL
Dress for Success plans to include parts of the design in their new website later this year.
Watch the completion of the seven tasks.
What lessons did I learn?
The big lesson I learned is users blame themselves for my bad design. I created a photo display at the top of each page in the first iteration that distracted users from going further down on the page. They ended up looping over the same page looking for an item. Instead of blaming the design, they often berated themselves for not looking further down.
bottom of page