Case Study | Roper St. Francis Healthcare
Roper St. Francis Healthcare Website Redesign
Roper St. Francis Healthcare Website Redesign
Roper St. Francis Healthcare Website Redesign
A full end-to-end redesign of rsfh.com, from discovery and information architecture through UI design, patient-facing content strategy, and hands-on CMS implementation across 100+ pages.
A full end-to-end redesign of rsfh.com, from discovery and information architecture through UI design, patient-facing content strategy, and hands-on CMS implementation across 100+ pages.
A full end-to-end redesign of rsfh.com, from discovery and information architecture through UI design, patient-facing content strategy, and hands-on CMS implementation across 100+ pages.
Role
Lead UX Designer
Lead UX Designer
Lead UX Designer
Responsibilities
UX research · Information architecture · Content strategy · Wireframing · UI design · Prototyping · CMS development · QA
UX research · Information architecture · Content strategy · Wireframing · UI design · Prototyping · CMS development · QA
UX research · Information architecture · Content strategy · Wireframing · UI design · Prototyping · CMS development · QA
Platform
Responsive web · Kentico CMS · Figma
Responsive web · Kentico CMS · Figma
Responsive web · Kentico CMS · Figma
Deliverables
100+ pages built end-to-end
100+ pages built end-to-end
100+ pages built end-to-end
01 — The challenge
01 — The challenge
A growing healthcare system needed a clearer digital front door.
A growing healthcare system needed a clearer digital front door.
A growing healthcare system needed a clearer digital front door.
Roper St. Francis Healthcare had grown into a complex network of hospitals, physician practices, services, and 120+ locations. As the organization expanded, its digital experience needed to evolve with it.
Roper St. Francis Healthcare had grown into a complex network of hospitals, physician practices, services, and 120+ locations. As the organization expanded, its digital experience needed to evolve with it.
The Problem
Patients struggled to find the information they needed. Too much content, complex navigation, and an inconsistent experience made the site difficult to use.
Patients struggled to find the information they needed. Too much content, complex navigation, and an inconsistent experience made the site difficult to use.
The Opportunity
Design a scalable, patient-first digital experience that could grow with the organization and implement it fully in the Kentico CMS.
Design a scalable, patient-first digital experience that could grow with the organization and implement it fully in the Kentico CMS.
My Role
I worked across UX research, information architecture, content strategy, wireframing, UI design, prototyping, CMS implementation, and QA. Rather than handing off designs and stepping away, I stayed involved through production, building and configuring 100+ pages in Kentico and ensuring the final experience matched the design intent.
I worked across UX research, information architecture, content strategy, wireframing, UI design, prototyping, CMS implementation, and QA. Rather than handing off designs and stepping away, I stayed involved through production, building and configuring 100+ pages in Kentico and ensuring the final experience matched the design intent.
Research &
strategy
Reviewed existing experiences, stakeholder requirements, user needs and healthcare website patterns.
Reviewed existing experiences, stakeholder requirements, user needs and healthcare website patterns.
Reviewed existing experiences, stakeholder requirements, user needs and healthcare website patterns.
Information
architecture
Helped determine how services, locations, providers and patient resources should be organized and connected.
Helped determine how services, locations, providers and patient resources should be organized and connected.
Helped determine how services, locations, providers and patient resources should be organized and connected.
UX & UI design
Created page structures, wireframes and polished responsive designs in Figma.
Created page structures, wireframes and polished responsive designs in Figma.
Created page structures, wireframes and polished responsive designs in Figma.
Content strategy
Worked through hierarchy, calls to action, page organization and content presentation.
Worked through hierarchy, calls to action, page organization and content presentation.
Worked through hierarchy, calls to action, page organization and content presentation.
CMS Build
Built and configured more than 100 production pages in Kentico CMS.
Built and configured more than 100 production pages in Kentico CMS.
Built and configured more than 100 production pages in Kentico CMS.
Quality
assurance
Reviewed layouts, responsive behavior, imagery, content hierarchy and component consistency as pages moved toward launch.
Reviewed layouts, responsive behavior, imagery, content hierarchy and component consistency as pages moved toward launch.
Reviewed layouts, responsive behavior, imagery, content hierarchy and component consistency as pages moved toward launch.
Before
Homepage — Before & After
After
02 — Homepage
02 — Homepage
The homepage
The homepage
The homepage
The homepage became the foundation for the new RSFH digital experience. It needed to quickly connect patients with care while also serving a broader range of audiences, including prospective patients, physicians, and media. I used an iterative design process to establish the visual language, content hierarchy, and interaction patterns that would carry across more than 100 pages.
The homepage became the foundation for the new RSFH digital experience. It needed to quickly connect patients with care while also serving a broader range of audiences, including prospective patients, physicians, and media. I used an iterative design process to establish the visual language, content hierarchy, and interaction patterns that would carry across more than 100 pages.
Old Website — Audit & Analysis
The existing website contained a large amount of valuable information, but years of growth had created an experience that was increasingly difficult to navigate.
Patients needed to quickly answer questions like:
The existing website contained a large amount of valuable information, but years of growth had created an experience that was increasingly difficult to navigate.
Patients needed to quickly answer questions like:
Where should I go for care?
Where should I go for care?
Where should I go for care?
Which doctor should I see?
Which doctor should I see?
Which doctor should I see?
Where is the closest location?
Where is the closest location?
Where is the closest location?
How do I schedule an appointment?
How do I schedule an appointment?
How do I schedule an appointment?
Healing People & Communities Near You
Healing People & Communities Near You
Healing People & Communities Near You
How can we help you today?
How can we help you today?
How can we help you today?
Find a Location
Find a Location
Find a Location
Appointments
Appointments
Appointments
Patient Portal
Patient Portal
Patient Portal
Find a Doctor
Find a Doctor
Find a Doctor
Get the Care You Need
Get the Care You Need
Get the Care You Need
Express Care
Express Care
Express Care
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Previous slide
Previous slide
Previous slide
Virtual Care
Virtual Care
Virtual Care
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Previous slide
Previous slide
Previous slide
Emergency Care
Emergency Care
Emergency Care
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Previous slide
Previous slide
Previous slide
Primary Care
Primary Care
Primary Care
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Previous slide
Previous slide
Previous slide
Heart & Vascular Care
Heart & Vascular Care
Heart & Vascular Care
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Previous slide
Previous slide
Previous slide
Orthopedics
Orthopedics
Orthopedics
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Comprehensive medical care for all ages, including routine check-ups
Previous slide
Previous slide
Previous slide
View All
View All
View All
What Our Patients Say
What Our Patients Say
What Our Patients Say
Don't just take our word for it. Hear from the patients who have experienced our commitment to exceptional healthcare firsthand.
Don't just take our word for it. Hear from the patients who have experienced our commitment to exceptional healthcare firsthand.
Don't just take our word for it. Hear from the patients who have experienced our commitment to exceptional healthcare firsthand.
"The orthopedic team helped me recover from a sports injury faster than I expected. The physical therapy program was tailored to my needs, and I'm back to playing basketball pain-free."
"The orthopedic team helped me recover from a sports injury faster than I expected. The physical therapy program was tailored to my needs, and I'm back to playing basketball pain-free."
"The orthopedic team helped me recover from a sports injury faster than I expected. The physical therapy program was tailored to my needs, and I'm back to playing basketball pain-free."
David Thompson
David Thompson
David Thompson
Orthopedics
Orthopedics
Orthopedics
"When my son had an accident, the emergency team acted quickly and kept us informed every step of the way. Their professionalism during a stressful time meant everything to our family."
"When my son had an accident, the emergency team acted quickly and kept us informed every step of the way. Their professionalism during a stressful time meant everything to our family."
"When my son had an accident, the emergency team acted quickly and kept us informed every step of the way. Their professionalism during a stressful time meant everything to our family."
Emily Watson
Emily Watson
Emily Watson
Emergency Care
Emergency Care
Emergency Care
"I was in and out in less than 30 minutes with a diagnosis and treatment plan. The express care service is perfect for busy professionals who need quick, quality medical attention."
"I was in and out in less than 30 minutes with a diagnosis and treatment plan. The express care service is perfect for busy professionals who need quick, quality medical attention."
"I was in and out in less than 30 minutes with a diagnosis and treatment plan. The express care service is perfect for busy professionals who need quick, quality medical attention."
Robert Kim
Robert Kim
Robert Kim
Express Care
Express Care
Express Care
The staff here is incredibly compassionate and professional. Dr. Johnson took the time to listen to all my concerns and created a personalized care plan that has made a real difference in my health.
The staff here is incredibly compassionate and professional. Dr. Johnson took the time to listen to all my concerns and created a personalized care plan that has made a real difference in my health.
The staff here is incredibly compassionate and professional. Dr. Johnson took the time to listen to all my concerns and created a personalized care plan that has made a real difference in my health.
Primary Care
Primary Care
Primary Care
After my heart procedure, the cardiology team followed up with me regularly. Their expertise and genuine care gave me confidence throughout my recovery. I'm grateful for their dedication.
After my heart procedure, the cardiology team followed up with me regularly. Their expertise and genuine care gave me confidence throughout my recovery. I'm grateful for their dedication.
After my heart procedure, the cardiology team followed up with me regularly. Their expertise and genuine care gave me confidence throughout my recovery. I'm grateful for their dedication.
Heart & Vascular Care
Heart & Vascular Care
Heart & Vascular Care
The virtual care option was a game-changer for me. I was able to consult with my doctor from home, saving time while still receiving excellent care. The platform was easy to use and very convenient.
The virtual care option was a game-changer for me. I was able to consult with my doctor from home, saving time while still receiving excellent care. The platform was easy to use and very convenient.
The virtual care option was a game-changer for me. I was able to consult with my doctor from home, saving time while still receiving excellent care. The platform was easy to use and very convenient.
Virtual Care
Virtual Care
Virtual Care
Previous slide
Previous slide
Previous slide
Next slide
Next slide
Next slide
MID-FI WIREFRAME
MID-FI WIREFRAME
MID-FI WIREFRAME
Two early directions explored different approaches to the homepage, with the mid-fi direction introducing search as a primary pathway for helping visitors quickly find the right care.
Low-fi wireframe
Explored the overall content structure and key pathways into care, locations, billing, and patient resources.
Mid-fi wireframe
Introduced a more search-focused approach, making search a primary entry point while using patient stories and testimonials to reinforce trust.
Two early directions explored different approaches to the homepage, with the mid-fi direction introducing search as a primary pathway for helping visitors quickly find the right care.
Low-fi wireframe
Explored the overall content structure and key pathways into care, locations, billing, and patient resources.
Mid-fi wireframe
Introduced a more search-focused approach, making search a primary entry point while using patient stories and testimonials to reinforce trust.
Two early directions explored different approaches to the homepage, with the mid-fi direction introducing search as a primary pathway for helping visitors quickly find the right care.
Low-fi wireframe
Explored the overall content structure and key pathways into care, locations, billing, and patient resources.
Mid-fi wireframe
Introduced a more search-focused approach, making search a primary entry point while using patient stories and testimonials to reinforce trust.
LOW-FI WIREFRAME
LOW-FI WIREFRAME
LOW-FI WIREFRAME
Early Concept — First Directions
Early Concept — First Directions
Early Concept — First Directions
Team Feedback — Synthesis
I presented both concepts to stakeholders including clinical leadership, marketing, and IT. Feedback was clear: patients needed immediate access to care navigation, but the health system's reputation and warmth had to come through — not be buried below the fold.
I presented both concepts to stakeholders including clinical leadership, marketing, and IT. Feedback was clear: patients needed immediate access to care navigation, but the health system's reputation and warmth had to come through — not be buried below the fold.
Keep
Keep
"Find a Doctor" and location search prominent
"Find a Doctor" and location search prominent
"Find a Doctor" and location search prominent
Add
Add
A trust-building hero with real patient/community imagery
A trust-building hero with real patient/community imagery
A trust-building hero with real patient/community imagery
Simplify
Simplify
Navigation to 5 top-level items maximum
Navigation to 5 top-level items maximum
Navigation to 5 top-level items maximum
Ensure
Ensure
Mobile parity from day one
Mobile parity from day one
Mobile parity from day one
STAKEHOLDER SYNTHESIS · ROUND 02
STAKEHOLDER SYNTHESIS · ROUND 02
STAKEHOLDER SYNTHESIS · ROUND 02
What we heard
What we heard
What we heard
→
→
→
what we'll do
what we'll do
what we'll do
Affinity mapping from a 60-minute homepage review with eight cross-functional stakeholders.
Affinity mapping from a 60-minute homepage review with eight cross-functional stakeholders.
Affinity mapping from a 60-minute homepage review with eight cross-functional stakeholders.
01
01
01
Hero banner
Hero banner
Hero banner
HOMEPAGE · ABOVE THE FOLD
HOMEPAGE · ABOVE THE FOLD
HOMEPAGE · ABOVE THE FOLD
Make search the primary
Make search the primary
Make search the primary
focal point of the hero.
focal point of the hero.
focal point of the hero.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
Place 4 clear CTAs
Place 4 clear CTAs
Place 4 clear CTAs
directly under the
directly under the
directly under the
search bar.
search bar.
search bar.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
Put content in a
Put content in a
Put content in a
container over imagery
container over imagery
container over imagery
to avoid accessibility
to avoid accessibility
to avoid accessibility
issues.
issues.
issues.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
Use full-width imagery,
Use full-width imagery,
Use full-width imagery,
with an option to swap
with an option to swap
with an option to swap
in video.
in video.
in video.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
SYNTHESIS
SYNTHESIS
SYNTHESIS
Search-led, immersive entry point
Search-led, immersive entry point
Search-led, immersive entry point
Use a high-contrast search container over full-bleed
Use a high-contrast search container over full-bleed
Use a high-contrast search container over full-bleed
media, with four task-based pathways below.
media, with four task-based pathways below.
media, with four task-based pathways below.
02
02
02
Resources → Services
Resources → Services
Resources → Services
NAVIGATION · CONTENT HIERARCHY
NAVIGATION · CONTENT HIERARCHY
NAVIGATION · CONTENT HIERARCHY
Resources aren't needed
Resources aren't needed
Resources aren't needed
here — the main
here — the main
here — the main
navigation already
navigation already
navigation already
covers them.
covers them.
covers them.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
Use this space to
Use this space to
Use this space to
highlight Services
highlight Services
highlight Services
instead.
instead.
instead.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
Use an icon feature
Use an icon feature
Use an icon feature
block rather than a
block rather than a
block rather than a
simple list of links.
simple list of links.
simple list of links.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
SYNTHESIS
SYNTHESIS
SYNTHESIS
Turn passive links into service
Turn passive links into service
Turn passive links into service
discovery
discovery
discovery
Remove duplicated resource links and introduce a
Remove duplicated resource links and introduce a
Remove duplicated resource links and introduce a
visual, icon-led services module.
visual, icon-led services module.
visual, icon-led services module.
03
03
03
Featured story
Featured story
Featured story
SOCIAL PROOF · TESTIMONIALS
SOCIAL PROOF · TESTIMONIALS
SOCIAL PROOF · TESTIMONIALS
The current layout feels
The current layout feels
The current layout feels
confusing. The purpose
confusing. The purpose
confusing. The purpose
isn't immediately clear.
isn't immediately clear.
isn't immediately clear.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
Three buttons are
Three buttons are
Three buttons are
excessive and make the
excessive and make the
excessive and make the
section feel cluttered.
section feel cluttered.
section feel cluttered.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
Show multiple patient
Show multiple patient
Show multiple patient
voices, not just one
voices, not just one
voices, not just one
featured testimonial.
featured testimonial.
featured testimonial.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
A card carousel could
A card carousel could
A card carousel could
replace the current
replace the current
replace the current
homepage 3-up cards.
homepage 3-up cards.
homepage 3-up cards.
STAKEHOLDER NOTE
STAKEHOLDER NOTE
STAKEHOLDER NOTE
SYNTHESIS
SYNTHESIS
SYNTHESIS
A focused carousel of patient voices
A focused carousel of patient voices
A focused carousel of patient voices
One clear action, multiple stories, and a repeatable
One clear action, multiple stories, and a repeatable
One clear action, multiple stories, and a repeatable
card pattern that can replace the 3-up.
card pattern that can replace the 3-up.
card pattern that can replace the 3-up.
PRIORITY DECISIONS
PRIORITY DECISIONS
PRIORITY DECISIONS
What moves forward
What moves forward
What moves forward
01
01
01
Lead with search
Lead with search
Lead with search
02
02
02
Design for image + video
Design for image + video
Design for image + video
03
03
03
Feature four service pathways
Feature four service pathways
Feature four service pathways
04
04
04
Prototype story carousel
Prototype story carousel
Prototype story carousel
05
05
05
Reduce competing CTAs
Reduce competing CTAs
Reduce competing CTAs
Final Design — Homepage
03 — tHE SYSTEM
04 — tHE ECOSYSTEM
Beyond the homepage
Beyond the homepage
Beyond the homepage
Patients & Visitors
The old Patients & Visitors page was essentially a wall of links, making it difficult for patients to find what they needed. The redesign reorganized content around key needs before, during, and after a visit, with clearer wayfinding and easy access to essential tools like MyChart and billing.
The old Patients & Visitors page was essentially a wall of links, making it difficult for patients to find what they needed. The redesign reorganized content around key needs before, during, and after a visit, with clearer wayfinding and easy access to essential tools like MyChart and billing.
Consolidated 40+ resource links
Progressive disclosure for billing
Persistent MyChart CTA
Service Category
The Specialty Detail Page gives patients a clear, easy-to-navigate overview of RSFH services and programs. It explains care in plain language, highlights where services are offered, and guides patients toward relevant next steps.
For editors, the flexible template creates consistency across service and program pages while allowing content to be tailored with providers, locations, related services, and resources. The result is a scalable experience that balances patient needs with the flexibility required for a large healthcare system.
The Specialty Detail Page gives patients a clear, easy-to-navigate overview of RSFH services and programs. It explains care in plain language, highlights where services are offered, and guides patients toward relevant next steps.
For editors, the flexible template creates consistency across service and program pages while allowing content to be tailored with providers, locations, related services, and resources. The result is a scalable experience that balances patient needs with the flexibility required for a large healthcare system.
Before
After
About Roper St. Francis
The About section needed to communicate RSFH’s history, community commitment, and leadership without feeling overly corporate. The redesign uses a timeline and featured photography to tell the organization’s story in a more personal and engaging way, connecting RSFH’s history to the community it serves.
The About section needed to communicate RSFH’s history, community commitment, and leadership without feeling overly corporate. The redesign uses a timeline and featured photography to tell the organization’s story in a more personal and engaging way, connecting RSFH’s history to the community it serves.
Before
After
Find a location
With 120+ locations across the Charleston region, each location page needed to present address, hours, services, and directions consistently — while feeling specific and useful, not like a generic template. A wireframe-to-final comparison shows the structural clarity achieved.
With 120+ locations across the Charleston region, each location page needed to present address, hours, services, and directions consistently — while feeling specific and useful, not like a generic template. A wireframe-to-final comparison shows the structural clarity achieved.
News & Health Resources
A content hub housing news, health library articles, physician blogs, and community events. The editorial card grid creates a scannable, trustworthy experience — with filtering by topic and content type built directly into the page architecture.
A content hub housing news, health library articles, physician blogs, and community events. The editorial card grid creates a scannable, trustworthy experience — with filtering by topic and content type built directly into the page architecture.
04 — Production
After designing the experience, I brought it to life in the CMS.
After designing the experience, I brought it to life in the CMS.
After designing the experience, I brought it to life in the CMS.
After design sign-off, I moved directly into Kentico CMS to bring the experience to life. Working alongside the content team, I configured templates, built and connected components, and led QA across browsers and devices. Owning the process from design through implementation helped preserve the original design intent through to the final product.
After design sign-off, I moved directly into Kentico CMS to bring the experience to life. Working alongside the content team, I configured templates, built and connected components, and led QA across browsers and devices. Owning the process from design through implementation helped preserve the original design intent through to the final product.
100+
100+
100+
Pages built in Kentico CMS
Pages built in Kentico CMS
Pages built in Kentico CMS
120+
120+
120+
Location pages structured and populated
Location pages structured and populated
Location pages structured and populated
2
2
2
Designers — from research to production
Designers — from research to production
Designers — from research to production
