Panda Century
UI/UX Design, Branding · Website & App
July 2022 – Feb 2023
Overview
Panda Century is an online Chinese learning platform offering personalised classes for children and adult learners.
This project involved defining the brand from concept to visual identity, alongside designing a responsive website and mobile app to support how users explore programmes, enrol in classes, and manage their learning experience.
The app complements the website by providing a centralised platform for class scheduling, accessing Zoom sessions, submitting homework, and tracking progress.
Team
Project Manager
Designers
Developers
My Role
Project Lead
UI/UX Design
Brand Direction & Identity
Prototyping
Developer Handoff
The Challenge
Panda Century’s existing digital presence did not clearly communicate its offerings or support users in navigating its programmes. Information was scattered and inconsistently structured, making it difficult for users to understand available classes or take the next step.
In addition, enrolled users relied on multiple tools to manage their learning, such as external Zoom links and manual coordination, which resulted in a fragmented experience across platforms.
Goals
Reorganise programme information to make offerings easier to understand and compare
Establish a consistent brand identity across web and mobile
Support key user actions such as exploring programmes and enrolling in classes
Provide a centralised platform for managing classes, materials, and updates
Reduce reliance on external tools by integrating core learning functions into a single experience
Understanding Existing Patterns
Initial insights were gathered through stakeholder discussions and existing project context, which highlighted challenges in how learning platforms present and organise their programmes.
Many platforms presented content in a fragmented or content-heavy way, making it difficult for users to quickly understand available options or navigate between sections. Navigation structures were often inconsistent, with key information spread across multiple pages.
Building on these insights, I focused on restructuring Panda Century’s content and navigation into a clearer and more cohesive experience.
Website Design (Discovery Experience)
Information Architecture
I restructured the website’s information architecture to better organise Panda Century’s offerings and create clearer pathways for users to explore programmes. The sitemap was designed to reflect how users move between understanding the brand, browsing programmes, and taking action, ensuring a more logical flow between pages.
Wireframes & Exploration
Early wireframes were used to explore layout, content hierarchy, and user flow. These were iterated with the CEO to align on key sections, messaging, and calls-to-action. The focus was on structuring the homepage and programme pages to help users quickly understand Panda Century’s value and navigate towards relevant classes.
Final Website Design
The final website translates Panda Century’s brand into a playful and engaging digital experience. Visual elements, illustrations, and layout were designed to reflect the brand’s emphasis on making Chinese learning interactive and enjoyable, while maintaining clear structure across content-heavy sections such as programmes and lessons.
App Design
Translating Requirements into Features
The initial requirements included both app and system-level features across the learning lifecycle. These were distilled into key user-facing features and structured around the student journey, from onboarding and enrolment to attending classes and tracking progress.
🔍 Discovery & Enrollment
Language level assessment
Class recommendations
Enrollment into classes
Switching between student accounts (for parents)
✏️ Class Participation
View upcoming lessons and reminders
Join Zoom classes directly
Access learning materials
Submit homework (image, text, audio, video)
📊 Learning & Feedback
AI audio recognition and translation
Auto-marking for selected exercises
Access to past materials
💳 Payments & Account Management
Credit top-ups and package purchases
Payment integration
Renewal reminders
🐼 Additional Features
Referral system for earning credits
Structure & User Flow
The app was structured to support the full learning journey, prioritising quick access to upcoming classes, learning materials, and key actions. The information architecture allows users to move easily between upcoming lessons, class details, and tasks such as joining sessions or submitting homework.
Final App UI
Attending a Class Flow
Users can access upcoming lessons from the home dashboard, navigate to active classes, and view detailed class information. Key actions such as joining a Zoom session and accessing materials are surfaced at the right moments to support the learning experience.
Discovery & Enrollment Flow
Users can explore available classes based on their interests, view detailed programme information, and enrol through a guided booking and payment flow.
Onboarding Flow
The onboarding flow captures user information and preferences to personalise class recommendations. Inputs such as age and learning goals shape the onboarding steps and influence the programmes presented to users.
Impact
The project brought Panda Century’s brand and product experience into a more cohesive system across both web and mobile. The website now presents programmes in a more structured and digestible way, while the app centralises key learning actions such as joining classes, accessing materials, and tracking progress, reducing the need for external tools like Zoom links and manual coordination.
Recognitions 🏆
The project was recognised with multiple design awards (2023), including:
Gold — Branding for Kids, Indigo Design Awards
Silver — Branding for Technology, Indigo Design Awards
Bronze — Visual Communication, Global Design iT Awards
Reflection
Balancing branding, product design, and business goals was one of the key challenges in this project. As the platform evolved, there was a strong push to introduce e-commerce functionality directly into the website experience.
While this was implemented within programme and lesson pages, it introduced tension between content exploration and transactional actions. This made it more difficult to maintain a clear and focused user journey, particularly during the discovery phase, where clarity and understanding are most critical.
This experience reinforced the importance of defining a primary user goal early and using it to guide design decisions. It also highlighted that not all features add value equally, especially when they compete with the core purpose of the product.
Ultimately, this project shaped how I approach complexity: by prioritising clarity, aligning stakeholders around user intent, and ensuring that every addition strengthens, rather than dilutes, the overall experience.
