Tencent future classroom
Crafting interactive learning experience
As part of an internship at Tencent, my goal is to make the online course a more engaging experience for left-behind children in China. After the internship, I decided to redesign the course learning mode and wireframe individually, creating a workable prototype in my spare time.
Time
October 2021 -
November 2021
Team
Mentor-Jeff
(UIUX Designer)
Tools
Figma
Adobe Illustrator
Microsoft office
Procreate
My role
Competitive analysis
Illustration
Information architecture
User flow
Focus group interview
Background
Tencent Future classroom is an app aim to provide STEM educations to unattended children.
However, during the initial phase after the app launch, we found that all the metrics were failing.
After conducting a series of research studies, I redesigned a completely new and more engaging learning experience.
%20copy.png)
The challenge
Low View, low user retention rate, low DAU
When I joined the team, they had already discovered the problem for the first launch of the future classroom. There are three lows: low views, low user retention rate, and low daily active users (DAU). This is not a good sign.
The solution
Create a more engaging learning experience for children
My goal is to not only investigate the cause of such low views. but also create a mock-up that ensures pro-longing the user retentions and DAU.
01/
Learn like interactive card game
Instead of learning through videos, the new design employed card-swiping methods to make courses easier to comprehend. It also allows students to go at their own pace.
02/
Organized selection page and track progress
The new design has a more organized course layout. It also includes a progress ring to help users remember the course progress.
03/
Solidify learning experience
At the end of each course, students will be able to strengthen their learning by taking tests. This ensures students are actively learning and helps solidify their memories
Research
About our users: left-behind children
The intended users for the Future Classroom are middle school students aged 12-16 years old, living in rural regions of China. According to previous research, a majority of these students are left-behind children, who can easily become addicted to video games and mobile games without proper outside control.
Finding problems through Focus group interview
To address low views, we conducted a focus group with target users. Their expectations fell into three categories: engagement, accomplishment, and learning. I introduced the rainbow sheet analysis, helping the team better understand user needs. Feedback results are as follows:
Design opportunity
What if, we change the app into a game itself?
Many of the students highlight "fun" and "game". Hence, I suggested changing the app page into a gaming educational platform. Specifically, a card learning education platform.
Design
Competitive analysis: flashcards game
One of the best way to study efficiently while having fun is through flashcards. Hence, I have analyzed the existing flashcard products to learn their pros and improve their cons.
Information architecture
Based on the evaluation of the previous website, I need to improve the course-finding section. In addition, a card learning section is also added as a new feature. Here is the information architecture that I created for the section:
User flow
To further define users’ actions, we created user flows for different features to gain a better understanding of how users will use it.
Wirframing
Visualize ideas
As soon as I have determined the features, I have quickly drafted a wireframes with call outs. In such a way, I was able to show my users what the design looks like in hands.
A more friendly and fun app
To ensure quick iteration, I have tested wireframe 1.0 on two users. As a designer, this is a good opportunity for me to share my design with the community and talk to them in person. From the testing results, the users were all craving for a more friendly interface.
Brand identity
A more vibrant colors and fonts
I have decided to adjust the colors and fonts to make the design less intimidating for our users. I have applied the basic main colors from the original app, but I have increased the saturation to make colors more vibrant.
Illustration
In addition to the adjusted colors, I have also created illustrations to embedded in-between the text to inject a personality voice.
Iteration
Usability testings and iterations
In this stage, I asked three users to test the usability and learn more about their frustrations in this round of testing. I set up 15-minute sessions with them, asking them to try the prototype and give me constructive feedback. Here are some features I have adjusted according to their feedback:
Final design
Final design
Retrospective
My key learnings
01/
Accept criticism
Sometimes customer's honest feedback hurts. However, learning to dig deep into their true thoughts is the responsibility of UX designers.
02/
Think from user's perspective
Feedback from the focus group interview revealed that users did not find it attractive. After carefully listening to user needs, we pivoted our strategy to better align with their preferences.