Timeline
3-Week Team Sprint, 2022
My Role
User Research
UX Design
Team
Caroline Koerschner
Chelsea Turnbo
Elnaz Talaei
Tools
Figma
Dovetail
Maze
The Solution
(Above) Final delivered prototype
The Client
During the lockdown of the 2020 Covid Pandemic, Dr Charlene Brown created CNA Simulations, a Learning Management System for Certified Nursing Assistants (CNA).
Because of the lockdown, CNA students couldn’t do their in-person clinicals, a requirement for certification.
(above) Before: the main class page seen on the CNA simulation dashboard
The platform provides virtual simulations for CNA students to learn invaluable skills, scenarios, and patient communication.
Information Overload
Instructors cannot assign individual assignments within a “Scenario”
Scenarios include 6 parts:
• Care Plan • Pre-Sim Quiz • Post-Sim Quiz
• Documentation • Reflection & • Simulation
![]()
After interviewing five CNA instructors and conducting usability studies with them, we learned that within a Simulation are multiple lessons, but not all lessons are taught at the same time in a teacher’s lesson plan.
So, they delay assigning Scenarios to students until all material gets taught.
When instructors do finally assign a Scenario, students get burnt out, because it takes 1.5 – 2 hours to complete.
Scenarios include 6 parts:
• Care Plan • Pre-Sim Quiz • Post-Sim Quiz
• Documentation • Reflection & • Simulation
(Left): a view Inside the scenario, shown with the associated care plan. (right): detail of all the parts within a simulation
That is something you have to think about before you assign a scenario too; is that these scenarios you have to be so far into teaching students skills.
After interviewing five CNA instructors and conducting usability studies with them, we learned that within a Simulation are multiple lessons, but not all lessons are taught at the same time in a teacher’s lesson plan.
So, they delay assigning Scenarios to students until all material gets taught.
When instructors do finally assign a Scenario, students get burnt out, because it takes 1.5 – 2 hours to complete.
How Might We Solve this Problem?
How might we create a way for Instructors to assign individual parts of a scenario?
Stack of Cards
Our client worried that if she added the individual parts of a lesson to the assignments page, would users scroll infinitely to find the content?
I created 2 sets of cards as a way to tighten the assignments page:
Leading with a big visual, a title of the assignment, a subhead, brief description of what content is inside, then two buttons for quick navigation.
If instructors already know what they want to assign, we created a way for them to assign work quickly. Or jump directly to students’ grades.
If they need to view more of what’s inside a specific assignment, clicking the card will take them to the associated page.
If instructors already know what they want to assign, we created a way for them to assign work quickly. Or jump directly to students’ grades.
If they need to view more of what’s inside a specific assignment, clicking the card will take them to the associated page.
(Left): cards for the Scenario assignment page. (right): cards for the skills assignment page.
We’re Breaking Up
In a Scenario page, how can Instructors assign the specific parts of an assignment?
We broke down the parts into interactive tiles, and gave Simulation an accordion dropdown:
Navigating with Dora
Users also had difficulties navigating the site: getting in and out of Simulations, finding students’ grades, and not knowing where to find site Resources.
Through comparative research, we noticed left sidebars are a common standard. We wanted to implement a familiar feature, something always visible:
(Left): The final Left sidebar we created. (right): left sidebar seen on canvas
The main sections Users need to access are:
Classboard - Where Users can choose which Class they’re in
Scenario - The main assignment
Skills - Individual lessons
Grades
Help
& Resources
I implemented icons as a way to give visual clues for each section & with its relative title, so there wouldn’t be any confusion where users are within the site
Classboard - Where Users can choose which Class they’re in
Scenario - The main assignment
Skills - Individual lessons
Grades
Help
& Resources
I implemented icons as a way to give visual clues for each section & with its relative title, so there wouldn’t be any confusion where users are within the site
Testing, Testing
We conducted more usability studies via Maze.co to see how our mid-fidelity prototypes were working.
Task 1:
Navigate to Demo Class 1 and add a student to this class.
![]()
Results:
![]()
Navigate to Demo Class 1 and add a student to this class.
Results:
Task 2:
Quickly Assign the pre-sim portion of module 1 and then navigate into Module 1.
![]()
Results:
![]()
In this task, many users wanted to click on the Scenario button on the left navigation. As of this test’s creation, the button wasn’t working, but the heatmaps show that it is useful since users tend to click there.
Quickly Assign the pre-sim portion of module 1 and then navigate into Module 1.
Results:
In this task, many users wanted to click on the Scenario button on the left navigation. As of this test’s creation, the button wasn’t working, but the heatmaps show that it is useful since users tend to click there.
Task 3:
From Module, 1 assign Sim 3 to all students.
![]()
Results:
![]()
“I wouldn't initially click assign before selecting a module” one comment read. Having users click Assign, then accessing the separate sections under Materials wasn’t typical for how users flow through this task.
From Module, 1 assign Sim 3 to all students.
Results:
“I wouldn't initially click assign before selecting a module” one comment read. Having users click Assign, then accessing the separate sections under Materials wasn’t typical for how users flow through this task.
I really like the idea of being able to assign specific sim tasks within a module and to specific students as needed!
Skills to Pay the Bills
Our client also mentioned that potential customers have requested to use the platform in non-classroom settings — like nursing homes, for example.
Potential customers reached out asking if they could use the platform to teach employees new skills or refresh old skills.
Potential customers reached out asking if they could use the platform to teach employees new skills or refresh old skills.
To help get our client ready for when she wants to scale up her business, we created a Skills page.
Similar to the Scenarios page, each skill is a separate card. Users can do individual skill lessons without running through entire scenarios.
Similar to the Scenarios page, each skill is a separate card. Users can do individual skill lessons without running through entire scenarios.
(Above) Our wireframed Skills page
Next Steps
• Grading: An important section requested both by our Client and an issue that also came up in user interviews. In its current state, users can’t “get a holistic view of a student’s grade.” Unfortunately due to time constraints, our team wasn’t able to tackle this issue.
• Onboarding: A lot of new users expressed confusion how to navigate in and out of pages on the dashboard. Our team wanted to create onboarding explaining the different areas of the site and how to use different features. That would be a great addition to help future users quickly understand the service.
• FAQs: Add a Frequently Asked Questions sections so users don’t have to consistently e-mail Dr Brown with their issues/questions
• Teacher Profile: We started this with the icon & welcome on top of the navigation bar, but we wanted to add user profiles to personalize the dashboard for each user.