Reduce bounce rate by 23 % through improved information hierarchy
Enhancing content discovery by redesigning TogetherWell’s global navigation menu
UX Research + UXUI Design
May 2023 - January 2024
[ Before redesign ]Here is the previous information architecture along with the associated menu titles that were used in the past.
[ Hypothesis ]Users abandoned the website may due to difficulty finding desired information, leading to high bounce rates.
We were uncertain about the accuracy of the assumption, so the team opted for two rounds of user research:
Card Sorting & Usability Testing
After the research was completed, I took charge of the redesign project.
My responsibilities included synthesizing the research findings and generating solution ideations based on those insights.
[ Research Results]Users struggled to find information due to confusing labels and a lack of intuitive content grouping
Research results confirmed our initial assumption.
Unclear which content is relevant to them —> Time-consuming exploration
Users showed a great uncertainty about which content was meant for them and had to spend time exploring, guessing and learning how the content grouping was structured.
Menu titles lack clarity and use jargon
Users couldn’t quickly understand what the content would be based on the menu titles.
Lack of immediate clarity on organization’s offerings
Users couldn’t instantly grasp whether TogetherWell’s offerings were what they needed.
[ Problem statement ] Users need clear, easy-to-understand menu titles and content grouping that aligns with their expectations and mental models.
[ ideation ]Visualizing UX issues: engaging stakeholders with insights and ideations
I utilized this visual affordance to summarize the issues with each menu title.
Below ideations were designed to spark discussion, gather feedback on design directions, and align with business goals through effective visualization.
I initiated the discussion by presenting ideas for a tagline and suggestions for grouping and menu labeling.
#1 - Tagline Design
To help users understand the organization’s offerings, I proposed an idea of adding a description or tagline next to the logo, briefly explaining what TogetherWell offers.
#2 - Menu Design
Horizontal and vertical menus offer a clean and simple look, while a mega menu allows for displaying more content.
The initial discussion went well thanks to the high-fidelity mockups, which took a lot of time to create but were worth it.
While creating high-fidelity mockups in the initial ideation phase isn’t always practical, I've found it effective when presenting to stakeholders outside the UX/UI design team. These stakeholders may struggle to visualize concepts, hindering their ability to provide useful feedback. To facilitate productive discussions, I'm willing to invest extra time and effort to ensure we receive valuable input.
Design rationales were explained and agreed upon, aligning the direction:
YES to the Tagline Design
YES to the Mega Menu
[ Ideation continues ]#3 - Categorizing the content
Understanding users goals to design Information Architecture that matches their expectations.
Users’ tasks and goals on the website:
1) Public: Seeking mental health resources
2) Industry professionals: Looking for opportunities to contribute
Business goal to prioritize:
Increase # of Volunteers and more Donations
Two grouping styles were proposed initially:
Audience-focused: Allow users to easily identify content tailored for them
Organization-focused: Groups content based on its relation to the organization
During an internal presentation and discussion with fellow UX/UI designers, we unanimously chose the audience-focused approach. This decision was based on two key factors: 1) Most mental health organizations use this method so users may be more familiar with it, and 2) the research indicated that users struggled to find content tailored to their needs.
However, when collaborating with the communications team on copywriting, they introduced an interesting perspective we hadn't considered before: segregating [ For Professionals ] distinctly from the rest.
When collaborating with the communications team to name the public-facing content group, we struggled to find the right term. Should it be 'The Public,' 'The Community,' or 'The Patient'?
Users come to our website for different reasons: some seek information on peer pressure, while others need direct help.
Ultimately, we chose to structure the content by its relation to the organization, allowing for exploration by those interested in learning more about us.
[ ACHievement & Final Design Gallery]New Design Implementation Successfully Reduces Average Bounce Rate by 23.13%
High abandonment is often caused by unmet expectations. Accurate menu labels are crucial for guiding users to the right content. After restructuring the information architecture and renaming the menu labels, we reduced the average bounce rate from 64.91% to 41.78%, well below the industry guideline of 50%.
[ Retrospective ] What I can do better next time:
Enhance Handoff Efficiency and Proactive Communication with Developers
As a UX/UI design volunteer for a non-profit organization, I've learned that limited resources can lead to our outsourced work being deprioritized. Collaborating with outsourced developers can be challenging, so it’s crucial to provide clear documentation and minimize the need for debugging. To avoid misunderstandings, I plan to review every handoff and debugging detail face-to-face with developers whenever possible.Extend and Explore Solutions Related to User Suggestions
It’s easy to fall into the trap of adopting user-suggested solutions during research, but those ideas may not always address the core issues. While it's crucial to focus on users' problems, I've also learned that using their suggested solutions as a starting point can be valuable. Extending and exploring related solutions can lead to effective outcomes. For instance, if users express a desire to know what content is made for them, providing a solution that clearly indicates what’s not for them can also work. Ultimately, I've learned to prioritize understanding the problems users face rather than simply implementing the solutions they propose.
Keep moving forward:
Content Improvement
During usability testing, many users noted that the website feels 'very word-heavy.' Modern users prefer not to read extensive text online. We need to refine the content information architecture to make it easier for users to digest the information we provide and to more effectively deliver the key messages we aim to promote.