Some research highlights that informed how the features were prioritized.
To understand the health and wellness space, we conducted a competitive and comparative analysis.
We found the competitors had many more features, thus more opportunities for engagement for their users.
There’s a niche opportunity to focus on black and brown men specifically since the other competitors do not.
To better empathize with the current and prospective members of the Healing,
we conducted interviews with BIPOC men
and surveyed BIPOC men and individuals who have a relationship with a BIPOC man.
person
5 User Interviews
list_alt
72 Survey Participants
Key insights that I learned from research coding:
Stigma around mental health and overall wellness as a black male
→ Can contribute to struggles in asking for help.
Would like maintainable self care routines, and accountability through social support. → Can struggle with motivation to maintain consistency.
Feels there’s a lack of accessible targeted information and resources for mental health.
The user wants a safe space community with access to self-care resources so they can have social support and guidance as they work towards their health and wellness goals.
In order to implement some of the features, we needed to take a step back and understand what SaaS and api's could be leveraged to bring more engagement and functionality to the site.
More information Coming Soon.
Our findings led us to prioritizing:
About Us → to continue to grow, they need to let visitors know what the community is about
Events → as their primary in-person connection to their community, we needed to prioritize this
(possible) Blog → source additional resources
Donation → Primary source of funding, wanted to expand on this from the original site
Design Challenges:
(Client was unsure about the technology constraints and platforms.)
Dark Mode UI →
• Obstacle, would this make for a jarring transition for users not using Dark Mode regularly.
One page horizontal Scroll →
• Obstacle, overwhelming the user with information, and making the user feel trapped.
• Would users understand how to navigate as it strays from conventional vertical scrolling.
I took these into consideration and began sketching out ideas.
(a) Concept: To ease the landing into a Dark Mode UI, I considered having a soft transition into Dark Mode upon landing on the site. It played off the idea of entering into a calm dark room.
(b) To prevent the user from feeling trapped in the continuous scroll, we needed to provide user control and freedom.
(c) To differentiate between main sections on a continuous scroll, the idea would be to have a consistent large image between the sections.
(d) To prevent the user from feeling overwhelmed by a new experience, I considered the addition of traditional vertical scrolling pages.
Coming Soon!
The typefaces used were Montserrat and Red Hat Text, both sans-serif typefaces. When looking at them side by side, they are similar with the obvious exception of a few letterforms. They also have a very similar x-height. When paired together, Montserrat looks like an extended (widened) version of Red Hat Text. We used this to create subtle contrast while keeping a uniform style, using Montserrat for headers and Red Hat Text for the body copy.
Using the prototype created,
we conducted an unmoderated usability test using Maze,
We had a total of 8 participants,
2 of which were familiar with The Healing.
We asked the participants to navigate the prototype to:
(1) find information about the Healing
(2) to discover future events.
The intention was to create the site as a one-page continuous scroll, so there was a slight learning curve.
• Only 50% of the participants found it very easy to navigate.
• 2 users in particular found it difficult.
This may have been due to the prototype not being able to be created as a continuous scroll within Figma, but rather as a series of clicks.
We also found half the users chose the path of "scrolling" to navigate and the other half chose to use the navigation bar up top.
.jpg)
Do you think you would regularly visit the blog and why?
"I saw the blog so I think I'd be back to read."
"I think I would visit the site, it's informational...seems like a good way to find and register for events which is what I would do most of the time."
What’s one thing you are most excited about?
"The dark mode was really nice."
A digital safe space for healing.
About Us
Allows new users to discover what The Healing is and does, through the mission and the story, and also lets new users know who makes up The Healing through the Our Team section.
Breaking the information into more easily digestible chunks created more interactivity on the site and also prevents users from being overwhelmed by information.
Events page
the latest events are highlighted, users are also able to access a full calendar of past and upcoming events as well as sign up for them.
This allows users to signup for events directly from the site, which aligned with the goal of the site becoming a hub for everything pertaining to the Healing.
Blog
We also looked into a possible blog, as users from our research wanted access to additional resources and we thought this would be a good medium for that. The top half would display featured articles and the bottom half would offer a view of the most recent articles from either all or from a selected category.
Checkout the Figma Prototype:
(a) Evaluate results from Second Usability Test
Considerations:
• Bringing the navigation bar in sooner.
(b) Member Login
Considerations:
What would a member view vs. a partner view look like?
If you like what you see and want to work together, get in touch!
