top of page
Frame 35196.png

Webassessor - SaaS for Online Test Delivery

Webassessor is a globally used SaaS platform for delivering online exams, enabling organizations to manage candidate registration, test delivery, and results seamlessly.

ROLE

DURATION

TEAM

UX Design Lead

12 weeks - 2023

10 engineers, 3 PMS, Product owner, Product director, UX manager

PROJECT ACCOMPLISHMENT

Achieved a 30% improvement in exam launch rates, as tracked by Pendo (a third-party product analytics tool).

PROBLEM

Here is a global concern regarding the high rate of candidates dropping out of exams.

How can we help candidates to successfully and independently launch their exam?

SOLUTION

AI-powered mobile pre-check & system check feature

Pink Best Buy Jewellery Instagram Post.png
MacBook Air - System Check 208 (1).png

DESIGN PROCESS

Building Business Branding Steps Instagram Post (1).png

Research

Ideation

Testing

Design

RESEARCH

I ran usability testing with five clients while they shared their screens and went through the precheck process. Afterward, I asked follow-up questions about their experience.

01

3 out of 5 clients took more than 15 minutes to complete their pre-check, leading to delays in starting their exam​

All five clients mentioned that taking photos with their laptop was tricky since they had to adjust the angle and move around to get it right.

I signed up for an exam with 2 biggest competitors (Market analysis) 

02

I realized one of our competitors uses a feature called System Check to ensure that all technical components such as video, internet, and audio are functioning properly.

Screenshot 2025-01-08 at 3.46.06 PM.png
image.png

REFRAMING THE PROBLEM

We refined the problem into two key areas moving forward:

How can we ensure candidates are aware of the technical requirements (internet speed, video resolution, audio quality) before starting the exam?

 

How can we make the photo-taking process for ID and surroundings easier, and faster?

IDEA

I explored different ways to present the pre-check process in Figma, focusing on two options: using a QR code for a quick mobile switch or download an app.

1. Scan a QR code and go through pre-check process

MacBook Pro 14_ - 1 (5).png
image.png
iPhone 14 Pro - 235.png
image.png
iPhone 14 Pro - 456.png
image.png
iPhone 14 Pro - 463.png

2.  Download app to create pre-check

MacBook Pro 14_ - 2.png
image.png
iPhone 14 Pro - 466.png
image.png
iPhone 14 Pro - 463.png

SELECTED FLOW

QR Code Flow has been selected 

The app option required candidates to download it, adding extra time and potentially delaying the exam start.

 

The app would demand additional resources from our engineering team, which we didn’t have the bandwidth for.

Creating a step-by-step pre-check process for the engineering team to clearly outline all possible scenarios within this flow

Frame 35221.png
IMG_0341.png

CHALLENGE

Streamlining Client Customization in Webassessor

Each client applies their own branding to Webassessor, but the customization process needed to be more intuitive and efficient.
 

  • Worked closely with product owner to understand various types of exams we deliver.

KEY FEATURES

Here are the key ideas we chose to move forward with

A guided step-by-step mobile pre-check flow with real-time feedback

A “Test My Setup” feature before exam day to reduce launch stress.

Implementing AI to flag unauthorized items

FINAL SOLUTIONS

1. System Check

The system check helps candidates by verifying that all essential technical components, such as internet speed, video, dual camera, and microphone, are working properly before the exam starts.

image.png
MacBook Air - System Check 208 (1).png
MacBook Air - QR Code - AI Pre-Check with SMS (1).png

2. Mobile Precheck

With mobile pre-check, candidates can easily start the process by scanning a QR code. They can then take photos of their surroundings, their ID, and themselves directly from their mobile device, making the entire pre-check process faster and more convenient. This feature removes the hassle of awkward laptop setups, enabling candidates to complete the pre-check smoothly, anytime and anywhere.

Frame 1000000877 (1).png
image 18.png
image 17.png
image.png

3. Image Detection AI to Flag Unauthorized Items

We integrated AI into the pre-check flow to flag unauthorized items, providing real-time feedback. This helps candidates resolve issues before the exam, improving efficiency and ensuring a smoother process.

It was also crucial to fine-tune the sensitivity of the detection system. I didn’t want to flag candidates too frequently, as that could create unnecessary stress and anxiety. The goal was to ensure we only flagged truly important unauthorized items, striking the right balance between security and a smooth exam experience

RESULT

Integrating these solutions addressed the issue of candidates being unable to launch their exams, resulting in a 30% decrease in drop-off rates.

Candidates now complete their pre-check process in less than 10 minutes significant improvement from the previous 20 minutes ensuring they arrive on time for their exam.

image.png
image.png

LEARNING

It was amazing to see how much we improved the product in just 12 weeks. I learned how to prioritize effectively, focusing on the most impactful areas to achieve the best results in a short timeframe.

I'd love to talk and get to know you 

Whether you’re a designer looking for a collaborator or just wanna chat, feel free to email me or connect over LinkedIn

|

bottom of page