Helped a non-profit make better matches between migrant workers and volunteers so that migrant workers were able to up-skill and learn a language during the lockdown period in COVID-19.








User Research


Interaction Design

Creating a design library

Hosting remote design sprint


1x Lead Engineer

2x Product Designers

1x Product Manager

5x Engineers


June 2020 - October 2020


The COVID-19 outbreak within migrant worker dormitories in Singapore resulted in a government-ordered quarantine. Migrant workers were unable to go out to work and battled boredom and anxiety. It's Raining Raincoats (IRR), a non-profit helping migrant workers in Singapore, wanted to substitute this frustration with education by matching migrant workers with volunteers to teach them English during quarantine. The high influx of requests made the manual process of using 16 excel sheets to match potential students arduous and inefficient, resulting in only 30% of the students to be matched.

User Research Insights

Tackling the multiple excel sheets
(Making the screening, matching and follow up process clear)

After identifying the main processes undertaken at IRR into four parts: Screening, matching, notifying and following up with matches, dropped out. I used these steps to flesh out the main pages of the internal management system and explored the information architecture and placement of the navigation bar.


Above, I explored the layout of the main processes and how these processes may differ for students and teachers.

During our user interviews, we noticed that there some cases needed urgent following up and IRR team would have trouble keeping track of teachers and students. Thus A, made sense as red notifications would alert the user on the urgency of individuals that needed following up with. However, the navigation bar felt overwhelming and repetitive with some processes that were similar for both teachers and students. Additionally, as IRR have separate teams that manage students and teachers, it seemed more appropriate to go for B so each communication team would not be confused by tasks needed to be done by the other team. Though it made the process easier for each communication team, it still was repetitive.

Thus, I explored creating a simpler tab bar that highlighted the main processes and only showed students or teachers within the tabs in C. This design highlights the 4 main processes, and since only students are screened and only teachers need following up, separating the categories by teachers and students seemed redundant. C was beneficial as it took up less space, and allowed for more fields within tables if needed.

We finalized on D which combined the simple processes but added a section for profiles of students and teachers, which enabled users to have an overview of the statuses of all students and teachers instead of going into separate tabs. The "dropped out" tab was removed as no actions needed to be undertaken when either a student or teacher has dropped out and users were still able to view anyone who dropped out within the profiles tabs. D helped reduced the amount of tabs being toggled between and made the processes clear.

Simplify the screening process

Simplify – I explored several interfaces to speed up and ease the screening process. Its Raining Raincoats screeners make about more than 30 calls a day and this process needed to be quick. After narrowing down the key details needed for screening such as (interest to learn english and english proficiency), I analyzed which features would allow IRR to screen students in bulk.

Screening Process Explorations

While As drag and drop feature would have helped screeners create a visual on who is left to screen. Since this process is usually done in bulk simultaneously by a few screeners, only viewing 5 students could get confusing and does not make get use of the screen. Thus I stuck with a table showcasing all students that had to be screen, shown in B and C. While B allows users to focus on selecting a proficiency, it prevented screeners from double checking other important details with students. Substituting a modal pop up for a in-line drop down, in C helped screeners double check other details.

IRR Dropdown Iteration

Applying to context and removing redundancy – After testing, users gave feedback about the after selection box that the description is cut off and does not improve readability when double-checking. I realized the description was slightly redundant and only needed to maintain consistency amongst screeners on the proficiency of students and iterated it from A to B.

Ensuring students are matched properly.

To replace the manual process of referring to 2 excel sheets and matching students. We ideated an automated process that would generate a few matches based on a student and teacher's native language, english proficiency and any second languages that a teacher might have.

IRR Suggestions for Teacher Matches

Upon reviewing with the IRR team, we were given feedback that it would be ideal to have slightly more options as well as the option to search by company of volunteers. Modal pop up A did not provide context to why an "80% match" is good and would be hard to differentiate which volunteer is best suited if there are similar matches.

IRR Suggestions for Teacher Matches (Iteration)

I ideated options C and D to see how the search bar option would pan out.

ConsistencyD's search bar is consistent with the existing search bar that we use to search within the table. To reduce confusion the CTA button was taken away and users were either able to select a teacher to match directly or close the pop up.


Creating an internal management system that streamlined the screening, matching and follow up processes so the IRR team could have an updated details of each migrant worker and volunteer that is waiting to be paired up.

Screening Final Prototype

Matching Final Prototype


  • Leart to work with a team of 6 remotely on a 12 hour time difference
  • Learnt the importance of documentation and using tools such as Jira to communicate with engineers
  • Learnt how to conduct a remote design sprint and engage a team of engineers, users, designers and product manager.
  • Worked with the Buefy Design library + design systems
  • Learnt about information hierarchy and informationa architecute when designing tables

This product will be pushed out by early 2021.

Key metrics to look out for:

  • If there is an increase in number of students being matched within a day
  • The duration it takes to re-match a teacher volunteer to a student after one has dropped out.