Nursing Website Redesign

Strategy
UX Design
Information Architecture
Visual Design
Usability Testing

Overview

Throughout my career, I worked with agencies across the government. I had the opportunity to work with the Nursing Board and redesign their website, which has online features that provide tools to issue licenses, approve education programs, and protect the public from unsafe practices.

My Role

I was the Lead Designer on this project, responsible for the overall design direction, and I collaborated with Product and external stakeholders throughout the process.

Tools I used: Figma, Google Analytics, Screaming Frog, Optimal Sort, & Axure.

Problem/Goal

I was dealing with a legacy website created over 10 years ago. Since then, only the content has changed. Unfortunately, it wasn’t easy to navigate and didn’t look trustworthy, so visitors were not utilizing the site. Instead, they were calling the office for directions. View Old Website >>

The Nursing Board wanted me to create a new experience that better reflects the user’s needs and drive them to use the Online Services.

Solution

I took several measures to optimize the website:

I updated the look and feel to make it more appealing & engaging.
Ensured that it was ADA-compliant for accessibility.
Incorporated CTA buttons that directed visitors to the Online Services.
Restructured the layout and navigation.
Designed it to be mobile-friendly.
Added a Blog to refreshen the content.
I also created documentation and trained end users to maintain the website.

My Process

My approach with Design Thinking

Gather Requirements

Kickoff

I started by gathering requirements, which included:

A Kickoff Meeting, where I invited everyone involved in the project, including Product, SMEs, and the Development Team, to ensure we were all on the same page with the business goals, priorities, and needs of the users, as well as limitations to consider.

Key Takeaways :

- - Most of their users were nurses & students, and they were not utilizing the website, and the office received a lot of calls with inquiries.
  - It had been a while since the last content update, so they needed access to maintain the website so…
  - The Development team planned to use Bootstrap and WordPress to build the website, which was ideal because, with WordPress, you can create accounts that let end users into the Admin to make updates.

Comparative Analysis

Next, I did a comparative analysis to see how other nursing sites presented information to their audience.

Most Sites:

Incorporated CTAs to highlight their services.
Had a dropdown navigation and a search
Displayed News

Website Analysis

Evaluation

I did an evaluation of the website and critiqued it to identify areas that had a negative impact on the experience.

I noticed that:

There was a dump of links on the homepage & the images were low quality.
There was no clear Call to Action or clarification about the services.
Some of the inside pages lacked branding.
The navigation was confusing. The link names didn’t match the content.
And the site wasn’t responsive.

Overall, the site didn’t leave a positive first impression.

Analytics

Next, I reviewed analytics to check performance and engagement, which uncovered:

Where users navigated most and where they dropped off.
And I noted the pages that were traffic drivers on the site.
I also noticed that users often left after 1 or 2 page views, mainly on the homepage.

I used this data later in the process to help define the hierarchy and how I placed elements on the pages.

High Traffic Pages:

Licensing, Education, Legal, Forms, Newsletter, Board, and Nurse Practice Act.

Content Audit

I conducted an inventory of the content using a tool called Screaming Frog that organized the data into a spreadsheet.

It revealed:

Duplicate pages
Broken links
and Outdated Information

I could quickly recognize and eliminate unnecessary pages and content, and later in the process, I didn’t include it with the new organization of information I had defined.

I used this information later to conduct a Card Sorting Activity with stakeholders and reorganize the information on the site.

User Research

Interviews

Next, I partnered with Product to do Research. I wanted to learn more about the users, so we conducted interviews with nurses, students, and stakeholders to understand their experience with the website.

"The site is too cluttered, and it's hard for me to find the information I need."

Key Takeaways:

Users left the site because it’s too cluttered and hard to navigate.
Most members were not aware of and never used the Online System.
They wanted to know about new policies & events, and a news section would be helpful.
Most of the calls they were receiving were about licenses & discipline.

User Personas

I conducted an activity with stakeholders and used the insights to develop 3 PERSONAS of who we were targeting, and this provided better context for me to solve their problems. I referred to these later when I formed the features and solutions.

We developed:

One for a Nurse and the Receptionist, and through the interviews, we discovered that Hospital Admins had to check the background of new employees.

Overall, users were very busy, and it was more convenient for them to go online to handle business with the Nursing Board.

Card Sorting Activity

I had to reconstruct the content on the site and define the navigation. There was a lot of information I was dealing with, and I needed help, so I facilitated a Card Sorting Activity.

I used the page titles from the content audit and had participants group them into categories during the session.
Then, I analyzed it and shared it with stakeholders to get a consensus on moving forward with the site’s Information Architecture.

Sitemap & Information Architecture

I used feedback and findings from previous research to develop a sitemap that displayed how visitors would easily navigate the pages.

Key Features

Based on the goals and user needs, I incorporated new features, including:

Search – to provide visitors with a faster way to find the content & save time.
Visual appeal with white space, vibrant images & colors to reduce clutter and increase engagement.
CTAs – to showcase main offerings.
Blog – to highlight news and keep the content fresh.
Page Templates – with consistent branding to gain the trust of users.

Visioning

Wireframes

Next, I created wireframes using Axure to display the structure of the page layouts. I incorporated the features and used findings from high-traffic pages found in analytics and feedback to prioritize the hierarchy of information:

Positioned the navigation horizontally across the top, along with a search and quick link to Online Services, which would appear globally.
Added a tagline to give users a brief overview of the Nursing Board.
I used CTAs to position the services more prominent at the top to direct visitors to their Online Services.
Add sections to educate users about their resources and funnel them deeper into the site.
I placed blog posts at the bottom and a subscription form.
Design mobile views to show how layouts would adapt to smaller screens.

After a few demos and iterations, I received approval from the stakeholders, I moved on to the hi-fi designs. Normally, I would do user testing at this fidelity, but in this case, the stakeholders want a more realistic view of the pages.

High Fidelity Design

Mockups

In the mockups, I applied stylistic and visual details using their branding colors and a combo of images that vibed. Then, I used these to build a functional prototype for usability testing.

Usability Testing

I ran moderated usability testing, and Product helped facilitate it. Together, we created a Test Plan with tasks for participants to follow.

We wanted to test if users could easily navigate the page, and we recruited 5 participants to perform specific tasks within the prototype.
The goal was to get feedback and clarity on whether users could find information, identify friction points, and eliminate confusion or misunderstanding.

Findings:

Positive

4 out of 5 participants could find services easily by clicking on the homepage CTAs without getting frustrated.
2 out of 5 participants tried to use the Search to find information needed.
2 out of 5 participants clicked on the blog posts.
3 out of 5 participants opened the navigation.

Negative

4 out of 5 participants didn’t click on the logo at the top left corner and needed help returning to the homepage.
Some said that the font size on the CTA needs to be bigger.

Recommendations:

Add a “Home” link in the main navigation
Increase CTA font size to make the text more visible

Handoff

Style Guide

I incorporated the recommendations into the final designs, created a style guide, and handed it off, along with the mockups, to the development team to reference while they coded the website.

Results

The results of the redesign were immediate and productive.

20% decrease in web-related phone calls
24% increase in visits to the site.
50% Increase in page views on mobile devices.
Improved conversions by 85%