CASE STUDY
Creating a Compassionate Experience
The rebrand and redesign of a government website
Creating a Compassionate Experience
The rebrand and redesign of a government website
User Research
Problem Today’s Texas Health & Human Services houses a vast amount of information that is difficult to navigate. Users are looking for a better way to obtain information easily, efficiently and effectively.
Usability Testing CURRENT SITE Users were tasked with locating office hours and finding instructions for reporting child abuse to evaluate how easily critical information could be found on the existing site.
PARTICIPANT A
"It's a hassle to have to call a number to get office hours."
PARTICIPANT B
"The site works well if I'm going here for one of the 6 popular topics, after that I'm lost"
PARTICIPANT C
"It's a hassle to have to call a number to get office hours."
100%
Frustrated
60%
Used Search
60%
Felt Inadequate
100%
Disappointed
PARTICIPANT A
"It's a hassle to have to call a number to get office hours."
PARTICIPANT B
"The site works well if I'm going here for one of the 6 popular topics, after that I'm lost"
PARTICIPANT C
"It's a hassle to have to call a number to get office hours."
Restructuring Hierarchy Plan
Overall Branding
A space for compassion, understanding and ease of getting basic needs met. Create a safe and welcoming service for those who need to feel cared for. Use infographics to illustrate benefits and information. Compassionate, easy to navigate, informative and educational. Soft, Earth, human, kind.
Information Architecture
Organize information effectively by using a typography and hierarchy system. Through usability testing, titles of sections need defining with more clarity. Moving sections of information to compartments that better serve their purpose.
SITE MAP
Design
Branding Moodboard
Navigation
I created the navigation interface to be clean, straightforward, and accessible. Employing a consistent square form that alters hue on desktop when hovered enables users to effortlessly navigate and locate the data they require.
Imagery
Photography feels compassionate, relatable, and positive.
Typography
Typography choices and information hierarchy is crafted to help viewers navigate easier through content.
Rough Sketches & Concepting
Wireframes
Desktop
Navigational System Design
The main navigation spans the top of the page. Large, simple dropdown menus appear on hover allowing user to view the contents within each section.
Desktop Wireframe Templates
Mobile Wireframe Templates
NAV MENU
SECONDARY
MENU
HOMEPAGE
SECONDARY
LANDING PG
CONTENT
PAGE
Usability Testing
Key Findings with Usabilitiy Testing New Design
+
“Much easier to navigate”
+
“I feel like I’m really going to be taken care of”
+
“This now looks like a HUMAN and HEALTH Service site”
+
“The imagery brings life to the matter”
-
“Desktop copy is too small for me to read”
Branding Styleguide
High-Fidelity Prototype
HIgh Fidelity Compositions
Key Takeaways
Most government organizations house an abundant amount of important information both for the people that it serves, and the people who work within and for the organization. Step by step processes help site users find the information they are looking for easily, effortlessly and efficiently.
Users need terminology that is directive and relatable. Updating some of the navigational titles created a more comfortable and easy flow.
With a simple and clean navigational system users were less, if at all, frustrated with locating the information they were tasked to find.
CASE STUDY
Creating a
Compassionate Experience
The rebrand and redesign of
a government website
User Research
PROBLEM Today’s Texas Health & Human Services houses a vast amount of information that is difficult to navigate. Users are looking for a better way to obtain information easily, efficiently and effectively.
100%
Frustrated
60%
Used Search
60%
Felt Inadequate
100%
Disappointed
Usability Testing CURRENT SITE Users were tasked with locating office hours and finding instructions for reporting child abuse to evaluate how easily critical information could be found on the existing site.
PARTICIPANT A
"It's a hassle to have to call a number to get office hours."
PARTICIPANT B
"The site works well if I'm going here for one of the 6 popular topics, after that I'm lost"
PARTICIPANT C
"It's a hassle to have to call a number to get office hours."
Restructuring
Hierarchy Plan
Overall Branding
A space for compassion, understanding and ease of getting basic needs met. Create a safe and welcoming service for those who need to feel cared for. Use infographics to illustrate benefits and information. Compassionate, easy to navigate, informative and educational. Soft, Earth, human, kind.
Information Architecture
Organize information effectively by using a typography and hierarchy system. Through usability testing, titles of sections need defining with more clarity. Moving sections of information to compartments that better serve their purpose.
SITE MAP
Design
Branding Moodboard
Navigation
I created the navigation interface to be clean, straightforward, and accessible. Employing a consistent square form that alters hue on desktop when hovered enables users to effortlessly navigate and locate the data they require.
Imagery
Photography feels compassionate, relatable, and positive.
Typography
Typography choices and information hierarchy is crafted to help viewers navigate easier through content.
Rough Sketches & Concepting
Wireframes
Desktop
Navigational System Design
The main navigation spans the top of the page. Large, simple dropdown menus appear on hover allowing user to view the contents within each section.
Desktop Wireframe Templates
Mobile Wireframe Templates
HOMEPAGE
SECONDARY
LANDING PG
CONTENT
PAGE
Usability Testing
Key Findings with Usabilitiy Testing New Design
+
“Much easier to navigate”
+
“I feel like I’m really going to be taken care of”
+
“This now looks like a HUMAN and HEALTH Service site”
+
“The imagery brings life to the matter”
-
“Desktop copy is too small for me to read”
Branding Styleguide
High-Fidelity Prototype
HIgh Fidelity Compositions
Key Takeaways
Most government organizations house an abundant amount of important information both for the people that it serves, and the people who work within and for the organization. Step by step processes help site users find the information they are looking for easily, effortlessly and efficiently.
Users need terminology that is directive and relatable. Updating some of the navigational titles created a more comfortable and easy flow.
With a simple and clean navigational system users were less, if at all, frustrated with locating the information they were tasked to find.
CASE STUDY
Creating A
Compassionate
Experience
The rebrand and
redesign of a
government website
User Research
PROBLEM Today’s Texas Health & Human Services houses a vast amount of information that is difficult to navigate. Users are looking for a better way to obtain information easily, efficiently and effectively.
100%
Frustrated
60%
Used Search
60%
Felt Inadequate
100%
Disappointed
PARTICIPANT A
"It's a hassle to have to call a number to get office hours."
PARTICIPANT B
"The site works well if I'm going here for one of the 6 popular topics, after that I'm lost"
PARTICIPANT C
"It's a hassle to have to call a number to get office hours."
Usability Testing CURRENT SITE Users were tasked with locating office hours and finding instructions for reporting child abuse to evaluate how easily critical information could be found on the existing site.
Restructuring Hierarchy Plan
Overall Branding
A space for compassion, understanding and ease of getting basic needs met. Create a safe and welcoming service for those who need to feel cared for.
Use infographics to illustrate benefits and information. Compassionate, easy to navigate, informative and educational. Soft, Earth, human, kind.
Information Architecture
Organize information effectively by using a typography and hierarchy system. Through usability testing, titles of sections need defining with more clarity. Moving sections of information to compartments that better serve their purpose.
SITE MAP
Design
Branding Moodboard
Navigation
I created the navigation interface to be clean, straightforward, and accessible. Employing a consistent square form that alters hue on desktop when hovered enables users to effortlessly navigate and locate the data they require.
Imagery
Photography feels compassionate, relatable, and positive.
Typography
Typography choices and information hierarchy is crafted to help viewers navigate easier through content.
Rough Sketches & Concepting
Wireframes
Desktop
Navigational System Design
The main navigation spans the top of the page. Large, simple dropdown menus appear on hover allowing user to view the contents within each section.
Desktop
Wireframe Templates
Mobile
Wireframe Templates
Usability Testing
Key Findings with Usabilitiy Testing New Design
+
“Much easier to navigate”
+
“I feel like I’m really going to be taken care of”
+
“This now looks like a HUMAN and HEALTH Service site”
+
“The imagery brings
life to the matter”
-
“Desktop copy is too
small for me to read”
Branding Styleguide
High-Fidelity Prototype
HIgh Fidelity Compositions
Key Takeaways
Most government organizations house an abundant amount of important information both for the people that it serves, and the people who work within and for the organization. Step by step processes help site users find the information they are looking for easily, effortlessly and efficiently.
Users need terminology that is directive and relatable. Updating some of the navigational titles created a more comfortable and easy flow.
With a simple and clean navigational system users were less, if at all, frustrated with locating the information they were tasked to find.