top of page
Betterwork view.png
Anchor 1
Youth Centralised Directory For
Out-Of-School Youths Platform

Timeline

Oct 2021 - Feb 2022

Platform

Website

My Role

UIUX Designer

Tools

Figma

Miro

Notion

Introduction

Betterwork is a platform that helps out-of-school youths to find resources about courses, finance, and more!

​

In this project, we created a youth-centric centralised directory for out-of-school youths.

My Role

I was an apprentice for Hatch with Nicholas and Leroy for this project. We worked with our supervisors Brenda, Louis.

User Research
Interviews

To better understand the different user's needs, we conducted interviews with 10 youths and 5 professionals working with out-of-school youths.

General Questions
  • When did you leave school, and what are you currently doing?
     

  • Are you interested in furthering your studies/attending courses or training where you can learn a skill and then find a job?
     

  • What kind of courses are you interested in?

Workaround Behaviours
  • Where and how do you currently get your information from? (e.g. information about jobs, courses, friends, families, etc)
     

  • What are the challenges you face now, and what helps you?

Experience Questions
  • Have you attended courses/training in the past?
     

  • What were the information/resources the school gave you upon leaving school?

Project Objective

Here are the main objectives that we aim to have.

unsplash_2QA1vKJbbG0.png
Increase awareness

Increase out-of-school youth's awareness of the following through an online platform.

  • Employment support programmes and resources.

  • Alternative education pathways, programmes and resources.

2.png
More support resources

Bridge the current gap between out-of-school youths and professionals supporting them.

  • Lack of awareness of employment support programmes available for out-of-school youths.

Key information to obtain
Key Information

Will out-of-school youths use the platform?

What is the current state of out-of-school youths and what motivates them?

What design features will they want?

Who is our exact target audience? (Caseworkers or Youths)

Personas

To better target the youths, these are the personas we created after the user research and interviews.

Persona 1.png
Out-of-school youths with goals in mind
3.png
Some have clear goals but lack the resources to get there:
  • These youths want to do better for themselves
    (e.g. Getting stable higher-paying jobs)
     

  • Financial trouble means difficulty in pursuing goals

4.png
They will search for jobs in the following ways:
  • Online via job portals like FastJobs or Part-time job Telegram Groups
     

  • Offline via walking around malls looking for hiring posters
     

  • Referrals and advice from friends and mentors

Persona 2.png
Out-of-school youths without clear plans
5.png
Settle for salary that is sufficient for daily use:
  • $500-1000 is already pretty good to them.

"Why get $1000 tomorrow, when I can get $500 today.”-the type of mindset

6.png
Lack of long-term planning due to lack of liabilities:
  • Their financial needs can be resolved with a low salary. Don’t have a strong urge to grow their earning capability through upgrading themselves.

Persona 3.png
Design Insights

Here are the different design insights from the caseworkers and the youths from third-party websites to find different courses and jobs.

Platforms

Used by youths:
 

Preferred by youths:
 

7.png
Used By Youths
  • Key information highlighted

  • Opportunities with low commitment

  • Easy to apply and join (and quit)

8.png
Used By Caseworkers
  • A wider range of activities for volunteering

  • Supports Discovery

MySkillsFuture

It is mainly used by caseworkers but:

  • Rigorous but too much content

  • Phrasing is too mature

  • The design is too dense

myskillsfuture.png
MyCareersFuture

It is mainly used by caseworkers but:

  • Monthly salary feel out of reach by OSY

  • Opportunities are mostly for those with higher education, creating an alienating effect

mycareersfuture.png
Prototype
Wireframe

Here is some of our lo-fi wireframes that we created after the user research.

Group 522.png
Group 524.png
Group 526.png
Group 528.png
Final Design
Main Features

Here are the main features that we decided to add to improve Betterwork.

Before

After

Group 522.png
Betterwork 1.png
Simple, friendly language

Some of the users found that complex sentences and words are difficult to understand so we decided to have simple copywriting.

Before

After

Group 526.png
Group 532.png
Interactive Quizzes

Short, fun quizzes to help the youths discover more about their interests, finances, and work readiness.

Before

After

Group 536.png
Group 535.png
Curated Content

Youths have trouble finding courses so the programs are supported by existing, engaging materials from other sources. Which would help them to find all the information on the platform.

Try the Prototype

You can try the mobile website prototype here!

You can try the desktop website prototype here!

© 2025 by Isaac Ong. Proudly created with Wix.com

bottom of page