Bono
Ku●

A slide editor built around a simple interaction: put something on the canvas, then move it until it feels right.

From personal experiment to product feature. An extended version became part of Virtual Job Case Simulation.

Start with the canvas

I built a WYSIWYG editor with draggable, resizable images and rich text. React handles the interface, with QuillJS providing the text editing tools.

Give it a life beyond the demo

The company version added the pieces needed around the canvas: PDF export, server-stored slides, and templates managed through an admin panel. The personal build became a foundation for a larger product.

Built with

React · QuillJS

What does a job actually feel like? This project lets people try a job simulation, with an experience powered by ChatGPT prompts.

2,000+ users. Launched for Accenture, L’Oréal, and PwC, with HKU and CUHK Career Center partnerships.

Build the experience—and the team rhythm

I led four frontend developers, working across the interface and the workflow behind it. That meant reviewing pull requests, agreeing on code conventions, and keeping the team moving toward shared weekly goals.

Put the work in front of people

Each week, I presented progress and demos to other project teams. Their feedback helped shape the next week’s priorities, keeping the build connected to the wider product.

Built with

Next.js · React · TypeScript · Zustand · React Query · MongoDB · AWS

A physical business card, with a web experience one NFC tap away. I designed and developed the site connecting the two.

Prototyped for an audience of 50+. The service later expanded into other NFC-based experiences.

The tap is only the beginning

Behind the card were profile pages, onboarding, and an admin area. I built the paths people needed to set up a profile and reach it through their card.

Send people to the right place

Server-authenticated redirects connected those pages. The project brought together the visible profile and the account flows needed to support it.

Built with

React · TypeScript · AWS

A web puzzle game with a Three.js frontend—and a challenge beyond the visuals: keeping the gameplay honest.

110,000+ visits. More than 2,000 sign-ups for the web puzzle game.

Design the invitation to play

I led the landing page and game UI/UX design in Figma, then developed the frontend with Vue and TypeScript. The work covered both the first impression and the experience inside the game.

Think past the happy path

I focused on how the client and server communicated to help prevent gameplay exploits. Building the interface also meant thinking about what a player could manipulate.

Keep the build coordinated

I collaborated with five developers through a GitOps workflow to develop and maintain the project.

Built with

Three.js · Vue · Vuex · TypeScript · AWS · Figma

A familiar login screen became my introduction to building with React—from the artwork and animations to the server behind the sign-in button.

A working login flow behind the replica. Registration, password hashing, and JWT authorization connected to MySQL.

Recreate the details

I rebuilt the Riot client’s login interface, including interactive form states and responsive hero artwork. Preloading and Lighthouse checks helped me work on loading performance.

The tricky part was state

Inputs, animations, and parent–child communication exposed gaps in my understanding of React’s lifecycle. Refactoring with Sim Ho and Steve over Live Share helped me work through them.

A few details demanded extra attention:

• Keyboard focus: a border that seemed random turned out to be a focus outline.
• Modals: React Portals let them render above the page while preserving React’s event handling.
• Deployment: font loading, Netlify configuration, and an iOS input bug needed work beyond the local build.

Take it all the way through

The project connected a React frontend to a lightweight Express backend and MySQL database. It gave me practice with components, authentication, and deployment in the same build.

Built with

React · JavaScript · Node.js · Express · MySQL · Sequelize · bcrypt · JWT