Example of the legacy dashboard
Visual Redesign for Quality Management Training Module
Quality Management System
My Role
Principal Product Designer
Team Composition
1 Principal Product Designer, 1 Product Manager
Skills and Tools
InVision, Sketch, Notion, Miro, Facilitation, User testing, Card sorting, Prototyping, Interaction Design, Accessibility
Visual Redesign for Quality Management Training Module
Project Brief
This client was in the quality management space for pharmaceuticals and life sciences. The primary module I was to work on was their training module which was designed for employees to periodically train on items to prove proficiency. They wanted to adapt their product to fit the way that training managers actually create training plans and to revamp their UI visually.
The Problem
The problem was that with their current system, people who created training plans would first have to create groups and then add trainee items to the group. This was an exhaustive way of planning the training plans. Ideally, trainees would be assigned to a category which would already contain the necessary training items for a particular profile of people.
The Goals
Restructure to process of creating trainings to be more efficient and improve usability based on user’s mental model
Develop a style guide and modernize components based on company brand and principles
Improve overall usability and enhance interaction design
Create a user research plan and assess usability through qualitative research
Responsibilities
Design strategy, user journey mapping, wireframing, cross functional collaboration, user research, usability testing
Tools
InVision, Sketch, Notion, Miro
Discovery
Team Alignment
I worked with the project manager to align on how we would work together which included identifying a design process, planning lean onboarding and planning a meeting cadence.
Prior research collected from how customers utilized the app suggested that typically companies create groups for trainees and then add items for the trainees to train on. Due to this, the decision was made to reconstruct the current information architecture to include the creation of profiles for trainees. These profiles would then be added to categories which contain a pre-developed training plan. Categories would be the parent of profiles and trainees would belong to profiles. Our hypothesis was that this pre-configuration would make it easier to add trainees to a plan and reduce the effort required to manage groups.
Understanding the Core of the Product
This was the user journey we created to help do the following:
1) Understand the journey for admins who are responsible for creating training plans
2) Identify epics and features
We then created feature level stories to organize our design discussions.
Personas
In order to effectively understand user goals, we mapped out the different types of user’s and their motivations. This is more accurately referred to as user archetypes, because we chose to focus more on user behaviors vs demographic information.
Research
Quotes from users
Usability Test
Our goal was to validate our assumptions on the new information architecture. We wanted to interview customers to understand their current training management process and test the usability of our designs using a clickable prototype. In order to do this, we first asked the following behavioral questions:
We then created a script where we walked them through a series of scenarios and tasks which they were to complete. We spoke with 12 users across 8 companies in a total of 3 sessions. I decided to utilize this spreadsheet to capture our findings.
Our findings concluded that customers found the new workflows to be much more comprehensive and aligned with the way that they develop training plans. We were also able to validate the information that training managers wanted to see. Some of our key findings that we decided to take action on were:
Users wanted to ability to duplicate profiles and categories due to the fact that some of them may need to apply to more than one subset of users
Users wanted the ability to set retraining automatically since most trainings occur for a set interval
Users wanted the ability to collect historical compliance on the profiles and categories to assess performance and metrics
Delivery
Designs
The client desired to utilize their prior theme colors and some components from a previous design style guide. Their primary design principle was simplicity and ease.
Category Mockups
Profile mockups
Dashboards mockups
Tests and Events mockups
Outcomes and Successes
Introduced new Agile design process and reduced time to market my 30%
Established research plan which included identifying customers, managing communications, creating usability script questions, tracking findings and synthesizing results
Spearheaded the adoption of a new accessible, well-organized, and regularly updated design style guide which reflected the latest design standards
Final Design Artifacts and Deliverables
Groomed 39 user stories
Produced 294 wireframes
Created 3 prototypes
Spoke to 12 users across 8 companies
Facilitated 17 user tests sessions externally
60% of observations were actionable
Project Learnings
I was reminded of the importance of being able to articulate design decisions in an effort to advocate for improved usability. I also had to learn how to navigate keeping the project going during unexpected periods of absence from the client.
