Panda Century
Overview
Panda Century is an online Chinese learning platform that globally provides Chinese to both students and working adults. They offer customized programs tailored to their students’ interests in the aim to foster an immersive and interesting learning environment.
As part of the branding project, we were to build a website that showcased all of Panda Century’s programs, lessons and activities, along with a mobile app where users can make payments when signing up for programs, classes and future events, and receive important updates.
Sector Education-Technology
My Role Lead Designer
Job Scope
Client Liaison
Information Architecture
Interaction
Visual Design
Prototyping & Testing
Developer Liaison
Project Time July 2022 - Feb 2023
“They truly went above and beyond to help us create a brand that reflects who we are and what we stand for.”
— Li Li, Founder and CEO, Panda Century Education Pte Ltd
Background
With Panda Century’s launch into the Chinese edutech space, they wanted to stand out amongst the sea of competitors that have saturated the market. This project was initially helmed by another designer which was then passed on to me to lead, and by this point they had already interviewed the client and done the research needed. Hence, it was up to me to carry the baton.
I was responsible for the branding, product design, and UI/UX experience for both the website and mobile app. Despite having little experience in the education sector, this project was a blessing in disguise for me. Here are some of the key achievements in this project:
Making it Work for E-Commerce
Albeit unorthodox, we managed to weave in the e-commerce aspect with Panda Century's programmes, classes and upcoming events. This allows parents and working adults to sign up for classes and make payments easier.
Working with Developers
In a rare project where we work with an outsourced team for the development, we had to step out of our comfort zone and adapt to their working style and methods. Despite the initial difficulties, we overcame those struggles and worked together for a successful website launch.
Gold, Silver, and Bronze Awards
Through our collaborative efforts to establish an appealing and enjoyable brand identity, Panda Century has achieved Gold & Silver Indigo Awards for branding, and Bronze Global Design iT Award for Visual Communication.
Understanding the Problem
USP Wasn’t Showcased
Despite possessing a unique USP, Panda Century’s prior website failed to effectively capitalize on it to captivate their target audience and encourage exploration or enrollment in their classes.
Outdated Information
Panda Century's earlier website provided minimal and outdated details about their programs, classes, and events, leading to significant confusion and reduced engagement among their target audience.
Unclear Call-to-Actions
Users were left without any direction on how to enroll in Panda Century's programs, classes, and events, and they had no available avenue to make inquiries.
Product Vision
As a product, we wanted to position Panda Century as the go-to Chinese learning platform with 3 key focus areas:
Chinese Learning Made Fun
We want users to understand Panda Century's capacity to enhance their learning experience by tailoring it to their hobbies and interests, thereby creating captivating and engaging lessons.
Advanced Proficiency Test
We want to communicate to users about Panda Century's Heritage Chinese Exam, which identifies their strengths and weaknesses. This empowers teachers to customize their lessons to address specific areas accordingly.
Free Trial Classes
We want to encourage users to sign up for Panda Century’s programs, classes and upcoming events.
The website's visual style is influenced by Panda Century's brand identity, incorporating lively illustrations and brand colors to shape the UI design. If you’re interested, you can view Panda Century’s brand guide here.
Information Architecture
Based on the insights gained from our interview with Panda Century, industry research, competitor analyzes and card sorting, I defined the sitemap using octopus.do and then evaluated it with the Panda Century team.
The platform also simplified the creation of low-fidelity wireframes for the site, enhancing communication between our team and Panda Century by enabling them to provide comments. Additionally, we used visual samples to help them understand the sections better. I tend to plan the visuals of the site through sketches as well.
Website Design
Development
Initially, we were to decide which development company would work on the Panda Century website. After interviewing a few companies, we chose one and got to work. I used AdobeXd to allow the developers to inspect the HTML and CSS of the designs.
After which I briefed the developers on the sitemap and mockups for the site, and explained the extra functionalities for some pages and sections. The developers also briefed the client on how to update the site thereafter.
Results & Takeaways
We had a successful launch of the website and the mobile app is well on its way. We also won 2 Indigo Awards for this project, Gold Winner in Branding for Kids and Silver Winner in Branding for Technology.
Here are some other lessons I learnt along the way:
Trust the Process
Honestly, I faced challenges due to my limited illustration skills for this project. While creating the main character illustrations, I explored various directions. But with valuable feedback from my managing director, we achieved a consistent style that I'm still proud of today.
Less is More
Our Chinese client, familiar with multipurpose apps like WeChat, wanted the website and app to combine various functions as well. For this, we knew communication was key. Through research and sitemaps, we defined the website’s purpose, ensuring alignment among all stakeholders.
Pick your Battles
After finishing the website mockups, we handed them over to the developers. There were expected challenges, but we maintained professionalism and selected our battles carefully. Our primary goal remained clear: delivering an impressive website that's informative and offers a seamless UI/UX experience for all.
