Federal Health Agency’s Customer Service Center Website Redesign

MY ROLE
UX Co-Lead
User Research
Wireframes Design
Prototyping
Checkpoint Presentation
TEAM
SCADpro Team:
1 Project Lead | 16 UX/UI Researcher & Designer | 3 Illustrator
Deloitte Team:
1 Project Manager
2 Engineers
TIMELINE
Jan - Mar 2025
TOOL
Figma
Adobe Photoshop
Adobe Illustrator

Overview

What is CSC?

The Customer Service Center website is a public-facing platform built on Salesforce. It manages diabetes knowledge resources and provides technical assistance to over 1,400 health organizations and 780,000 participants delivering national diabetes programs.

97.6 million U.S. adults have prediabetes

According to CDC, that’s nearly 45% of the adult population, a sharp increase from 38% in previous years.

My Role

As the UX Co-lead of a 21 person team, I partnered with PMs and developers on research, wireframes, and prototypes.

We designed within the constraints of Salesforce Experience Cloud, Customer Service template, 508 compliance, and limited end user access.

Result

30.2% faster task completion for bookmarking articles.
Unified brand identity with a clean, modern visual system to reduce visual clutter and build trust.
Built a scalable design system, ensuring Salesforce compatibility and WCAG 2.2 AA accessibility.
Restructured navigation from 8 to 5 categories to streamline tasks and reduce friction.

Project Goal

Enhance the design, navigation, and accessibility of the CSC so users can find relevant and appropriate resources in a timely-manner.

Who is our user?

Healthcare organizations and support staff who deliver or assist with lifestyle change programs. They rely on the platform for training, technical support, and implementation guidance to better serve their communities.

Collaboration

Cross-functional collaboration

We explored ideas like gamification and custom UI elements early on, but after two working sessions with Salesforce developers, we gained a clearer understanding of the platform’s limitations. While some visual changes were possible, key layout components were harder to alter without affecting long-term stability. These conversations helped us ground our designs in what's technically feasible.

Throughout the project, we also held weekly checkpoints with PM, designers, and Deloitte stakeholders. Their input on everything from feature feasibility to data sourcing, challenged us to stay grounded, validate our ideas, and ensure each decision was practical for both users and the business.

Now the moment you've all been waiting for…
Introducing a brand new CSC experience

Our Solution

Navigating with ease – a smarter first impression

Challenge
The original homepage was cluttered with text and repetitive icons, lacking visual hierarchy and clear CTA, which confused users and made key resources hard to find.
Solution
We've revamped the homepage to be more modern, clean, and visually compelling. But most importantly, we've made it easier and quick for organizations to navigate through the site and find the information they need.

Easy onboarding – confidence starts here

Challenge
Usability testing revealed that the page felt outdated and disconnected, with users frustrated by having to manually type and track confusing organization names.
Solution
We streamlined and clarified the sign-up flow, making it quicker, more approachable, and visually aligned with modern UX standards, enhancing user confidence.

A clear path to the website mission

Challenge
Cluttered content and weak visual hierarchy made it hard for users to find key info or take action, with no strong CTAs to support onboarding.
Solution
Improved visual structure highlights the National DPP’s mission and key resources, with a clear CTA, a newsletter sign-up awaits, inviting continued engagement.

Improved structure – easier access to essential resources

Challenge
An overly long navigation menu, repetitive categories, and lack of visual separation made it hard for users to find relevant resources and understand content structure.
Solution
We reorganized the layout and refined the interface to improve discoverability, helping users locate the right information faster and with less friction.

Unified support hub – Instant answers & seamless help

Challenge
The original interface exhibited fragmented user flows between FAQ and Contact functions, compounded by redundant entry points and insufficient information scent.
Solution
Redesigned “FAQ” and “Contact Us” sections into a unified Support page with visual FAQs and clear category segmentation, streamlining navigation and reducing cognitive load.

We hit the ground running with research,
as it was the backbone of our design decisions.

Secondary Research

We started by listening to the numbers and learning from others

To understand where the current website was falling short, we first generated a analytics report:

⬇77.79%

Number of U.S. visitors to the CSC website

⬇16.78%

Desktop Monthly Visit
At the same time, we looked outward, analyzing 3 competitor websites in the public health space. We studied what they were doing well in terms of structure, clarity, tone and what gaps we could learn from to make this site stand out.

First Round Testing

Then, we turned to the stakeholders

Through initial testing with 20 stakeholders initially, we identified where users were getting lost, frustrated, or confused by the existing experience.
75% of users struggled using the current site
User Quotes

Sensory Cue

Setting the tone: Desining for trust and security

We noticed the current site used 7 different shades of green. To better understand how users emotionally responded to these colors, we ran a sensory cue survey to guide our future palette decisions.

80%

Linked blue to trust and security

73%

Preferred the blue option overall

Key Insights

1. High bounce rate (56.87%) revealed that users struggled to find relevant content due to confusing navigation and poor search functionality.

2. A disorganized content structure made it difficult for users to locate essential information efficiently.

3. Inconsistent visual design elements made the interface feel unpolished and untrustworthy.

4. Poor readability and desktop-focused layouts failed to meet the needs of older users and mobile audiences.

5. The complex onboarding process discouraged user engagement and return visits.

Design Challenge

Design Opportunity

Hey! If you are still here,
let's talk about how we get to the final design.

Ideation

We improved the information hierarchy.

We simplified the navigation through four key changes, making the navigation easier for users to find the information they need efficiently.

Testing & Iteration

We had ideas. Now it was time to test if they truly worked for real users.

After the mid-fidelity phase, we ran A/B testing with 22 participants on a tight schedule to evaluate key functionalities and visuals. We focused on how well users could navigate the site, complete tasks, and interact with the interface. We also tested color schemes and components to ensure accessibility and match user preferences.

Key insights from the usability tests and iterated designs included the following:
1. Homepage before and after
2. Resources page before and after
3. Support - Ask for help page before and after
4. Support - My request page before and after
5. Profile - My activity page before and after

Behind the scenes

Finally, shout out to my amazing team!

Reflection

Takeaways

Back every design decision with research
Our shift in brand color direction was initially based on secondary research. While this gave us a foundation, it wasn’t enough to reflect how users emotionally respond to color. Running a sensory cue test later validated (and sometimes challenged) our assumptions. I learned that even visual or branding choices should be grounded in direct user insight when possible.
Sync with developers earlier
Connecting with the development team in week 4–5 gave us helpful clarity, but had we engaged earlier, we would’ve had more time to refine assets and align features with technical feasibility.