IELTS Online Tests | WeChat mini-program | 2019
With China being the focus for InterGreat's transnational and study abroad services, the company wanted to introduce its biggest IELTS practice tool into the Chinese market. That's why I and the team stepped in to turn the IELTS Online Tests (IOT) web app experience into a WeChat mini-program.
My Role:
Design Research, UX Design, Functional Specs
Team:
Danny Ng. (Product Owner)
Ellen H. (UI Designer)
Jack Y. (Developer)
QR Code to Visit (on WeChat)
The education consultants reported that even though IOT is a great tool for IELTS practice, they find it hard to convince their Chinese students to use the current web app. As most of the communication between the consultants and students/parents are on WeChat, we wanted to bring this IELTS practice tool to where it all happens.
Web App on Mobile: require users to log in to take test to but does not have WeChat login option
WeChat Mini App: only require users to log in by allowing authorisation via WeChat
To understand the challenge better, I worked with our Chinese consultants to conduct user research with the aim of finding out why it might be a problem for them to access the web app. The normal flow would start with the consultant sharing with her student a URL link via WeChat to practice IELTS using IOT. The student then clicks on the link and would then be redirected to the external web app. It is in this final step that we identified the main problem to be.
1) The web app content is comprehensive but shown to be overwhelming to the Chinese students we talked to. They don't know where to start. So they leave.
2) They want to take the practice test and it requires them to sign up, but it doesn't have a 1-step WeChat login action. So they leave.
3) All the content is in English. They can change the language settings to Chinese but they would have to scroll down to find it and many give up before they find it. So they leave.
4) Students also report that the web app seems to take longer to load on certain pages with more content. And once again, they leave.
AFTER: require users to log in to take the test but does not have WeChat login option
As WeChat mini-programs are considered sub-applications within the WeChat ecosystem, it is a convenient option for our clients whom we already establish consistent communication via WeChat. On top of it, my research also shows that there are many opportunities for the business by joining this platform:
1) The web app is not optimised to be shared on WeChat whereas a WeChat mini-program could easily be promoted by our consultants and influencers, and perhaps even has the potential to be shared amongst students and parents.
2) There is almost no difference between the percentage of users on a native app compared to its WeChat mini-program. In fact, the mini-programs even have an advantage when it comes to lowered-tier cities in China as a result of people being more reluctant to download a new app.
3) Both the numbers of active users and the average time spent on WeChat mini-programs has continued to increase. Research shows that users are more used to spending more time per session on mini-programs.
The story was that I recently designed IOT 2.2 with a number of changes in user experience design based on several studies with our users. My first instinct was to simply bring the mobile version of IOT 2.2 and translate it directly into a WeChat mini program. However, as soon as I started my research on WeChat and the mini-programs on the platform, I realised there are differences between the two and dedicated solutions were needed to create this mini-program.
As this is the very first version, we decided to bring only the core features of the IOT web app to the WeChat mini-program. As the students need a tool to easily practice their IELTS, the free Listening and Reading tests made it to the priority list while paid services like Writing and Speaking tests were sent to the backlog.
With the goal of making everything simple for the users, I started with the bottom nav bar which is a necessary feature among WeChat mini-programs but does not exist in the original web app. After taking the information architecture into account, I decided that three main tabs are all it needs for the users to access all the current information: Home, Exam Library, My Account.
Capitalising on WeChat's one-click verification system that WeChat users are already so familiar with, allowing users to do the same with our mini-program was only natural. We also used this opportunity to collect more data on our users, with the hopes of using it for future development decisions.
As users continue to engage with the mini-program, we could build them a user profile to help keep track of their study progress (as long as they registered their phone numbers with the system). To simplify and reduce the hassle of the user experience, such verification requests only happen once. After which, students would never have to "log in" again within their own WeChat account.
Low-fi Wireframe: Authorisation steps
Final: Request for personal info on WeChat when visit mini-program
Final: Request for mobile number authorisation prior to taking tests
After submitting a Listening or Reading practice test, the user would then be redirected to the results page where the user's test score, answers, corrections, and feedback would be shown. However, I also recognised that many users don't really understand how their score indicates their skill. That's why I designed the Score Explanation section which was then added to both the current web app and this WeChat mini-program version.
Since the primary reason for this project is to make everything simple and instant for our Chinese users, I incorporated a suggestion brought up by our CEO: there needs to be some form of instant gratification, recognising their achievements. Although we already had the Leaderboard showing the top 10 highest scoring users and the fastest test timings, this board only refreshed after we collected all the weekly data.
So while revealing their score, we decided to also show the test taker how well they performed relative to other users. Pairing this with the score explanation and the Share button, users with high scores were more likely to share their results with friends or via WeChat Moments, which in-turn increases the exposure of IOT mini-app.
To prepare for the next phase of paid services development, we started the design of wallet function. This is one of the important business strategies for the company with several brands, products and services. The customers could easily use their wallet to make purchases across these different brands, as well as receiving rewards from the referral program and more.
Since its launch, the IOT mini-program has been supporting many more students with the convenience of never having to leave the WeChat ecosystem. From the education consultant’s feedback, many of their students have been reported to use the tool more frequently and become an effective tool for not only their IELTS practice but also their study abroad application.
Take a chance
This project came to me almost unexpectedly, as originally it was assigned to another product owner who was more familiar with the Chinese market. At first, I was a bit reluctant but I’m glad I took a chance on it. Not only did it result in me gaining valuable insights into the Chinese market, it also kept me ahead of the curve during a time when the WeChat mini-programs were relatively new.
Kickstart, then watch it grow
The first version was proved to be a success and since then, the mini-program continues to be improved by the brilliant IOT design and development team. Many changes and new features have been added, including the Live Lesson feature I designed for the web app version. Being able to see the product you once worked with growing into an even better version of what you've done is what I would describe as pretty darn cool.