UX/UI Design Intern @ Flowclass

UX/UI Design for Budget Planner Finance App

Flowclass is a Hong Kong-based edtech and SaaS platform that helps tutoring centers and education businesses manage student enrollment, payments, and class operations — all in one place. It empowers educators to streamline administrative tasks and scale their business with ease.
➡️ Visit their website

Flowclass is a Hong Kong-based edtech and SaaS platform that helps tutoring centers and education businesses manage student enrollment, payments, and class operations — all in one place. It empowers educators to streamline administrative tasks and scale their business with ease.
➡️ Visit their website

Role

UI/UX Design Intern

UI/UX Design Intern

Company

Flowsophic Limited

Flowsophic Limited

Duration

Jan 2025 - May 2025

Jan 2025 - May 2025

Tools

Figma, Figjam

Figma, Figjam

Some Numbers…

Some Numbers…

To learn and grow with the talented team was an amazing journey.

To learn and grow with the talented team was an amazing journey.

During the internship, I collaborated closely with PM and engineers to ensure product’s implementation and business achievement. Moreover, I pioneered UX consulting and design thinking sharing for the internal team, building the workflow for the the team's first designer role.

6

New Feature Design

16

UX Improvement

20

Prototypes

12

Quality Assurance

5

User interviews

1K+

Snacks Hunting HAHA🍿

Re-design Front-end Onboarding Flow

Highlighted Feature 1

Discover and Define

,,

There were just too many fields need me to fill in. They even scattered across different pages.!! It felt overwhelming.

Operations Manager at a Dance Studio

,,

I had to ask CS on WhatsApp how to publish my class. That step should have been more obvious.

Admin Staff at a Kids School

,,

It felt like I was jumping around. One minute I’m editing my profile, the next I’m somewhere else. There’s no clear flow.

Director of a Tutorial Center 

,,

Honestly, I was about to give up. I just wanted to test the platform quickly.

Admin Staff at a Karate School

Original Design

Our Challenges

  1. Onboarding process was unclear and disorganized

  1. Lacked personalization for different tutor types

  1. Tutors were confused about the required steps to complete setup

  1. Difficulties in setting up profiles and publishing courses

  1. Resulted in high drop-off rates during onboarding

  1. Negatively impacted first-time user retention and activation

Problems to Solve

To synthesise the findings and align with business goal by "How might we" questions

How might we

help new users get started quickly without feeling overwhelmed by setup tasks?

How might we

streamline the onboarding process so users can publish their first class with minimal friction

How might we

convert users by aligning subscription prompts with their setup progress?

How might we

clearly communicate what is required vs. optional during onboarding

New Design

Overall:

Linear progress indicator (visually breaks down the onboarding into 11 clear, sequential steps)

  • The top progress bar updates in real time as users complete each stage.

  • Users can track their progress, know what’s next, and go back to review completed steps by simply clicking each steps.

Embedded Live Preview Panels

  • Solves: “It felt like I was jumping around.”

  • Benefit: In-line preview components on the right side show how the class will look live — keeping users grounded in context without needing to navigate elsewhere.

Step 1: Guided Entry Point – Setup or Skip

  • Solves: “Honestly, I was about to give up. I just wanted to test the platform quickly.”

  • Benefit: Offers users the option to skip setup and explore later, accommodating those who just want to try the platform before committing to a full setup. Clearly stated the overview for set-up everything,

Step 2: Some Basic Info about the school

  • Something essential in a onboarding flow

Step 3: Customize School Profile

  • Solves: Lack of personalization

  • Benefit: New features that allow users to set up their own theme colour to best fit their branding, not just limited to "Flowclass blue". "Generate with AI" button to allow users to generate a good descriptions.

Step 4: WhatsApp Business Integration

  • Solves: "Don't know how to set-up WhatsApp message automation to collect tuition / course fee"

  • Benefit: QR code link with whatsapp, "Send Test message" function to help users make sure nothing goes wrong. Set-up automated payment follow-up message in a click.

Step 5: Create First Course

  • Solves: “I had to ask CS on WhatsApp how to publish my class.”

  • Benefit: This step guides users through course creation with clear input fields. QR code toggle for attendance adds automation and flexibility for tutors managing large student groups.

Step 6: Structured Class Setup Workflow

  • Solves: Confused by class type options and how to configure class schedules, leading to setup delays and misconfiguration.

  • Benefit: Offers visual class type selection with clear labels, and an intuitive way to set price, quota, and time slots — reducing setup errors and saving time

Step 7: Payment set-up

  • Solves: Previously unclear next steps

  • Benefit: Ensures payment setup is completed within onboarding, removing another point of post-onboarding confusion. Users can connect their Stripe account to have online payment

Step 8: Create application form

  • Solves: Missed or delayed setup of class enrollment forms, leading to operational issues

  • Benefit: Ensures every class has a ready-to-use application form during onboarding, streamlining student intake and reducing manual follow-ups. Drag and drop custom fields allow users' flexibility

Step 9: Student Import & Custom Settings

  • Solves: Operational readiness concerns

  • Benefit: Enables tutors to import existing student data or prepare class settings right away, streamlining launch.

Step 10: Subscription Plan Integration (Final Step)

  • Solves: Lack of clarity on plan structure post-signup

  • Benefit: Introduces the pricing plans during onboarding in a non-intrusive way, so users know what to expect moving forward.

Results & Impact

  1. Limited Engineering Bandwidth
    As a fast-moving startup, Flowclass had limited engineering capacity. While I completed the design for the onboarding flow during my internship, implementation was still in progress, and I was unable to test the live version within my time there. 

  2. Restricted Testing Resources
    Due to tight timelines and team focus on shipping core features, we had limited capacity to conduct large-scale user testing. Most feedback was gathered through informal sessions with internal stakeholders and a small group of target users.

  3. Positive Feedback
    Early qualitative feedback indicated the new design improved user clarity and engagement, with stakeholders expressing enthusiasm for its step-by-step guidance and live previews.

Class Type Setting Recommendation

Class Type Setting Suggestion

Highlighted Feature 2

Problem

Flowclass offers five different class types, each designed for different teaching formats (e.g. recurring classes, one-time events, regular class, etc.). However, based on user interviews and customer support feedback, many users were confused about which course type to choose during class creation.

  • Users often selected the wrong type, leading to backend issues and having to redo the setup.

  • This confusion increased onboarding friction and delayed class publishing.

(Logic Flow)

(Logic Flow)

Design Solution

To guide users in choosing the correct course type, I took initiatives to design a lightweight, question-based recommendation flow as a smart step in the class creation process.

Developed 4 key questions that help identify the best-fit course type based on the user’s teaching model:

  1. Do you need to set a time for students to attend?

  2. Do all students finish the course at the same day?

  3. Will your course happen again and again? (e.g. monthly)

  4. Can the student decide the time of the lesson themselves?

Based on the answers, the system recommends the most suitable class type to the school or to the teacher

Results

  1. Reduced course type confusion during onboarding — users no longer needed to reference external help materials or ask CS.

  2. Support tickets related to “class type confusion” dropped ~50% within the first month of launching.

Mind Learning

The 4-month internship at Flowclass Sparked my Passion for product Design

Taking ownership in a fast-paced environment

Taking ownership in a fast-paced environment

At Flowclass, a growing edtech startup, I was given the opportunity to take on real product responsibilities — from redesigning a small UI/UX flow to being an owner of a project. Working in a lean team pushed me to think critically, act independently, and deliver quickly with decent quality.

🤝

Blending design with technology

Blending design with technology

As the sole design intern, I collaborated closely with engineers and product managers. This experience taught me how to communicate design decisions effectively, work within technical constraints, and contribute to features like Onboarding Flow through testing and iteration.

🚀

Building impact through design

The startup setting gave me end-to-end exposure — from user research and ideation to execution and validation. Seeing how thoughtful design directly improved user experience and activation rates helped me develop confidence in my ability to create value through product design.

More works…

Four Internal Systems

Binance / 2026

Product / User Research & interview

Bowtie / 2025

Student Mobile App

Personal Project (CUSIS) / 2025

Four Internal Systems

Binance / 2026