The Challenge
ORANGEHAT partnered with Marooon PR to address the House of Ruth Maryland website. House of Ruth Maryland is one of the nation’s leading intimate partner violence centers, helping thousands of battered women and their children find the safety and security that so many of us take for granted.
A recent rebrand — handled by Maroon PR — needed to be applied into their online precense. Balancing the site navigation for two very different site visitors was paramount to provide both visitor groups the content needed. The main visitor groups are those in need of help and support of their situation; the other group are the donors and volunteers to support the mission. Two very different groups with different needs and interactions.
A robust review of the content and overall site experience was needed to best identify the main areas, or features, that should be priority for a proper user experience, while encouraging the proper actions by the users. In addition to the content and user experience, the new site also needed to be better suppported for all devices, continued expansion and identification of the new branding, and a more simplistic way for House of Ruth Maryland to update content throughout the year.
The solution
A substaintial content and site audit was performed. Content was prioritized, combined, or removed based on discussions between the ORANGEHAT, Maroon PR and House of Ruth Maryland teams. A more streamlined site map was developed, creating a more naturual content flow and ways to deeper interact with the website, without a sense of getting lost inside the site. We also identified the page priority and developed three positions for navigating the website: main links/action items that was to be accessible at all times; secondary content to support the main action items, available with a small scroll movement; and the full content of the organization accessibile via a series of dropbowns in a traditional navigation experience.
Time was spent crafting adjusting these navigation priorities on the major viewports of the website between desktop, tablet and mobile devices, leveraging their display sizes and how the users would plan to interact with the site based on those displays.
Coupled with the new branding, a consistent color identification was used for each of the main audiences, providing additional cues to recognize content. A grid-based layout for the homepage provided strong visual ares to assit visitor to the four main areas of content. A design system was created for each type of content, creating a cleaner visual look and layout to digest content and encouraging interactions and learning more about Houe of Ruth Maryland.