Designing an application portal to digitize the Second Career Application Process
📍 Ontario Ministry of Labour
👨👩👧👦 2 designers
⏰ Jan - April 2021
🔨 User research, UI design, Prototyping
design challenge
How do we digitize the Second Career Application Process to enhance navigation, decrease overload of documentation information, improve communication and maximize user experience?
To comply with my non-disclosure agreement, I have omitted confidential information in this case study. All information in this case study is my own and does not necessarily reflect the views of the Ontario Ministry.
solution
We designed an application portal that creates a customizable experience with a dynamic layout, organized documentation system, and direct communication with Employment Counsellors to maximize user experience.
constraints
Ontario has a long-existing brand, therefore we had to adhere to the specific Ontario Design System in place to keep it consistent with the existing websites and products.
outcome
Currently being implemented to become available for all Second Career Applicants in Ontario!
scroll to see how we did this ↓
this is how we did it ⭐️
user research
We conducted User Surveys and User Interviews with past Second Career Applicants.
Overall insights 💭
We received over 250 responses for our survey and interviewed 10 clients and noticed several trends between the responses.
Found the application extremely time-consuming, confusing, and hard to navigate.
Heavily relied upon the Employment Counsellor to complete the application and assist with documentation upload
Seemed optimistic towards the proposed idea of a ‘digital solution’
detailed problem
The Second Career Application process was fully paper-based and heavily relied on in-person interaction with Employment Counsellors. The application process was extremely long and confusing for many. Previous applicants said:
“ It was a lot of hoops to jump through
“ Grow a magnificent wizard beard while you wait. And wait. And wait [for a response]
Main pain points ☹️
Hard to Navigate
Overload of Information for Documentation
Hard to contact Employement Counsellors
Long wait times without status updates
picking up the pieces
Joining the team in January, we were given the Current User Journey map outlining the Second Career Application Process.
Current journey map artifact
Insights 💭
I was able to get a high-level understanding of the current paper-based system which is very inefficient as reflected through the pain points.
I got inspiration for digital solutions through the recommendations in the Current Journey map
Outcome 📚
I suggested we create a new future state journey map to dive deeper into the problem, craft the new flow of the application process with a digital solution and illustrate the overall expected client experience.
Next steps 🗓
We decided to organize a workshop with our stakeholders to collect data for our future state journey map
journey map workshop
Conducted a Journey Mapping Workshop with 25+ stakeholders, where we used Miro Whiteboard to ask our colleagues to brainstorm ideas for potential actions, pain points, and emotions within different stages of the Future State Application Process.
Our stakeholders added their comments within the appropriate section of the whiteboard and we discussed their ideas as a team.
Workshop artifact (miro board)
Insights 💭
Trend: Want Employment Counsellors to be an important part of the digital solution to decrease pain points.
Variety of Opinions: Received many suggestions for different approaches for a digital solution:
Online application supported using webcam meetings
Online application with the ability to save progress and show status updates
Digital pdf application
Outcome 📚
From our detailed discussion of the journey through the workshop, we iterated several versions of the journey map with constant feedback from stakeholders.
Next steps 🗓
Working on the Final future state Second Career client application process journey map
Outcome: Iterations of the journey map
Reflection 🤔
Through the journey mapping process, I truly learned the importance of iteration in design. Through the iterative process, we were able to brainstorm and explore different concepts before creating an ineffective concrete product, putting user experience at the heart of the process.
Final version of the future state journey map
why digital portal
Following several meetings, our team decided that a digital portal would be the best option to digitize the application and improve user experience. Since a portal would be the one-stop-shop for the user to complete the Second Career Application from start to end. We heard from user research that navigation and documentation were the biggest pain points and interaction with the Employment counselor was necessary. Therefore we added the following features:
Tailor the Second Career Application to the user through a dynamic layout
Enable users to directly upload required documentation and forms within the portal
Allow efficient and direct communication with Employment Counsellors
Increase security by providing a single sign-in and use Public Secure
user flow diagram
After deciding upon the key features of the portal and understanding the user needs, we developed a user flow diagram to map out the flow of the portal.
mockups
We created a lo-fi draft mockup to visually present our idea and continued to build upon the concept and add more features and presented it to higher stakeholders each time and incorporated their feedback to produce the Final Mockup after countless iterations.
Key: Throughout the entire process, we followed the Ontario Design System (ODS) which allowed us to align with the Ontario Brand and create an accessible UI.
design decisions
Highlighting key features :)
Dashboard
Glimpse into important tasks
The Dashboard was the landing page of the portal and included two main sections that we found to be vital to the users: Unread Messages and Documents, which I will explore in-depth in the future sections.
Message Centre
Creating direct communication
The Message Centre allowed us to create direct communication with the Employment Counsellor within the portal with status updates, which was a previous pain point for many, as all the interactions were in-person.
Furthermore, the important tasks for the user to complete were marked with a bolded ‘Action Required’ tag to grab the user’s attention.
Documents
Clear, efficient, and well organized
To solve the main pain points of document upload and confusion regarding required documents, we created a clear, efficient, and well-organized document system, split up in: Required Documents, Document Uploads, Approved Documents
Through these tabs, the user can:
View a clear list of required documents updated based on personal information and specific application.
Directly upload through the portal and view uploads in organized folders
Check for document status updates.
Application
Easy to navigate
The heart of the pain points existed within the Application itself and its intimidating nature. Therefore, this section definitely was the most time-consuming and required a lot of back and forth between different teams. To address user frustrations, we added 3 key features outside of the Application questions themselves.
Choose a program - The user can easily choose a program with clear descriptors of different streams
Start an application - Before starting the application, the user gets a clear high-level overview of all 4 sections improving navigation greatly.
Resume Application - This feature decreases the intimidation of the Application as the user can save and come back to their application any time without the concerns of their information deleting.
Dynamic and tailored
All sections of the application are dynamic, allowing for a customizable experience.
The dynamic nature of the Application allows the users to only see the questions relevant to them, decreasing confusion and maximizing usability and desirability.
'Yes' is selected as a response to the first question
A new bubble with specific questions related to the first question appears. 'No' is selected for the second question.
As 'No' was selected for the second question, nothing appears
next steps for the team 🪜
As our term completed, our work was handed off to the next co-op students. The team is currently in the Testing and Iteration phase. The next steps for the team include:
Conduct Usability Testing with Users to gain client opinion on our proposed solution
Discover the trends from the Usability Testing
Make appropriate changes to the portal design to accommodate user feedback
Repeat and continue to iterate and begin implementing :)
key learnings ⛳️
Learned to use Design Systems —
Being given the Ontario Design System (ODS) acted as a constraint in the beginning since the design system offers very strict guidelines, limiting creative liberty. However, I learned the importance of Engineering Constraints to improve communication between engineers and designers; allowing for faster implementation by reusing components and themes. Furthermore, I dove deeper and understood why certain layouts, styles, and colors offer more accessibility.
Removing personal bias —
Realizing the difference between being empathetic towards user’s needs and pain points and my own personal assumptions allowed me to build user-centric designs. User research allowed me to validate or reject my assumptions and in turn construct a strong rationale for design decisions. If I didn’t do this, I wouldn’t have added the progress bar for resuming the application, as I didn’t realize the extent of this frustration.
Turning feedback into action items—
With continuous iterations and design critiques in large groups, it’s easy to get overwhelmed and some feedback can get lost. Thus it is vital to follow up and receive clarification to ensure the given feedback is returned with actionable items. Furthermore, sometimes client feedback can be out of scope, however, it is important to keep their suggestion in consideration when iterating.