Learn Chinese through stories for Elementary School
Proudct Design | iPad App
Having used Betterchinese for elementary school students for three years as a public school teacher, I have heard numerous complaints about the website from colleagues, parents, and mostly from students. “I always forget my login information.” “Why can’t we use it on an iPad?” “The website is so passive and boring.” “I can’t see the homework history.” “The navigation process is so confusing.” As a result, I decided to redesign the Betterchinese web for my students on an iPad medium to make it fun, intuitive, and engaging.
Get to know the users – Survey and Personas
Having been a teacher for four years, I am always confident that I know my kids very well. However, after I delivered the survey, it turned out that I didn’t get all answers right: Top 3 Frustrations in using BetterChinese:
Top 5 Expectations for BetterChinese:
It is true that “I am not the user” and “people don’t always use the product the way I imagined them to.” A designer should never assume users would do the same or think the same as him or herself. Expert’s view might help, but it could be biased, insufficient or misleading. I learned that correct UI decisions should be based on research and data.
With this learning, I built my user’s persona based on lots of interviews and conversations I had with the students.
Assessing the current website
To empathize users’ path and struggles, I started to assess the current website from a 1st grader’s perspective. I started from logging in, view this week’s homework, take a lesson, view previous homework, fill out a homework log, and log out. I took on a 6 year old’s lenses, and tried to carefully capture the possible obstacles. And they were recorded as below:
1. Login issues
• Important Information is Hidden
Login in button is hidden under “My Lessons” rather than “My account”, which makes it almost impossible for first-time users to find, not to mention a 6 or 7-year-old.
• Confusing Login channel
Students, parents, teachers are all using the same login channel, which is confusing to all. It is also unnecessary to have students exposed to so many advertisements.
• Complicated School Account and Personal Account
Login in includes personal account and school account; the switch between the two is very confusing.
• Logging in requires to much effort
In school account, all students need to enter class ID, user ID, and password. With so much typing, many students and parents find it challenging to remember three logging in information.
• Irrelevant and distractive Information
Main page is about selling its books, courses, which is not directly relevant to the majority of the students. Through the survey, none of the 20 participants were aware of the contents on the main page. This is a typical example of banner blindness.
2. Navigation issues
• Homework history is missing.
• For the lesson menu, students can only see the lesson numbers until they hover the mouse over the lesson number.
• Many sub-menu buttons are in Chinese, which is impossible for non-heritage students or parents to read or guide.
3. Engagement concerns
The stories and animations are very fun to watch. However, there are no educational games for students to play while learning.
UI is not interactive. For example, it only shows a vocabulary list, which is dry, boring, and unsuitable for younger students to learn a world language.
Understand the Competition
While I was trying to understand my users and the current website and needs, I believe it is also very important to know what my competitors are doing, especially the solutions they come up with to solve the common problems that all online education webs are facing. Among the many competitors, I found three representatives: Khan Academy as the most popular subject contents teaching web, Duolingo as the top-rated language learning app, and ABCYa as an educational game platform for elementary school students.
I also researched and tried out many direct Chinese online learning competitors like… I learned that Chinese online learning website or application is still a new area. Among many applications and websites, BetterChinese still has big opportunities for its rich contents and market share. However, many new language learning websites like Duolingo, Mango, could also become potential strong competitors for its engaging UI/UX design, gamification, sound effects, social features, well-designed contents, etc. So the redesign of BetterChinese should focus on improving its user experiences, and make it fun, engaging, and interactive.
Solution Discovery: Brainstorm with Students
So far, my objectives in re-designing BetterChinese website is to make the website more fun, engaging, and easier for elementary school students. The focuses are prioritized as below:
My new key takeaways from students’ input are:
Based on lots of students’ feedback and input, as well as competitor analysis, I mainly applied the following solutions in the new iPad design:
Log In with QR code
After finishing the prototype of the new BetterChinese iPad, I invited students from 1st grade to 5th grade in my user testing. They first completed 8 tasks like login, study a lesson, play a game, see their ranking, change the setting, etc. Then they were asked to complete a system usability scale survey. Students compared the original website and the new website: Result pictures from old portfolio sketch.
User testing results