Playground Pros

What I did
As design lead, I partnered with Playground Pros (the official multi-sport camp of MLSE) to transform their outdated, paper-based onboarding into a modern e-learning platform. I directed the project from discovery to delivery, conducting research, setting the UX vision, designing the full experience, and hiring a freelance developer to help bring it to life. Together, we delivered an end-to-end solution that turned static content into a scalable, interactive product.

Why it matters
The pandemic exposed how fragile their onboarding process was. Coaches were handed PDFs and binders with little structure, unclear progress tracking, and no meaningful way to measure learning. From a UX perspective, the problem was clear: static training materials create high cognitive load, low motivation, and no feedback loop. The opportunity was to design an experience that felt structured, trackable, and rewarding for coaches, while also giving staff the tools to manage progress at scale.

Role
Vendor Partnership

Client
MLSE

Platforms
Web

Areas
Strategy, Design, Research

Playground Pros Portfolio Header

Setting the vision

User interviews revealed that most coaches were motivated but easily overwhelmed. They wanted to learn quickly, on their own time, without wading through endless reading. That insight became the design principle: reduce friction, increase clarity. We defined the platform around modular courses, visible progress, and quick wins that keep motivation high.

user-journey-map-outlined-3

User Journey Flow

ppc-wireframes-1

Initial Wireframe Sketches

ppc-wireframes-2

Initial Wireframe Sketches

Designing for coaches

Wireframes and prototypes focused on reducing cognitive load: replacing long scrolls with structured lessons, breaking content into “topics” for quicker scanning, and moving progress bars into individual courses where they had clearer context. We added feedback mechanisms like badges and certificates to make accomplishments visible, and small but critical touches like “Mark to Complete” so learners could pick up right where they left off.

Playground Pros 1

Building the platform

Working alongside development, we combined a custom-designed front-end with a WordPress + LearnDash CMS. The goal was to hand Playground Pros a tool they could scale and own. Staff could easily create courses, assign quizzes, and track coach progress without depending on us.

Playground Pros 4
Playground Pros 5
Playground Pros 3
Playground Pros 7
Playground Pros 8
Playground Pros 9

Impact

The result was more than just a website. It was a system that solved for both sides: coaches got a clear, motivating way to learn, and staff finally had visibility into progress and performance. What started as a COVID workaround became a foundation for how Playground Pros now scales training and invests in their people.

© 2025 Eric Mok - Product Design Lead. All rights are reserved.