I designed an AI-powered “automated doubt-solving” and interactive class learning feature to help students study in the COVID-19 situation. Today, Colearn is one of Indonesia’s fastest-growing education technology companies, used by more than 2,5 million students. In 2020, Google Play selected Colearn as the best app category for personal growth. 

Problem Space 

Colearn is an EdTech company that uses AI technology to help students understand math problems.

Colearn started the business by collaborating with the offline tuition center to escalate Indonesia’s education. Unfortunately, the offline tuition model has many challenges, like cost and time, which are only accessible to some students. Besides that, everything offline has become inefficient and scary because of COVID-19.

As a Product Designer, I help Colearn transform its business from a tuition center platform to an automated and scalable learning tool in Indonesia.

Think

One of the challenges to transform the business is we only have a limited time. I collaborate with the Customer Insight team to validate the early-stage changes to save time.

We start by doing 1:1 interviews online with some students from various Indonesian cities. The goal is to understand how their learning experiences so far. 

Through the interview, we found three main points: 

• The student has a problem finding the trusted resources to understand math lessons.
• The student has trouble finding a high-quality teacher to improve overall academic outcomes. 
• The student has a problem practicing their skills because the available exam questions are limited. 

Explore

We try to explore the problem by creating a customer journey. We defined how the student will interact with the Colearn.

We convert to a main flow from the customer journey then create the wireframe to confirm the idea. In this stage, we decide to make four main features:

Build

We create the wireframe base on the main flow that we make before. We try to confirm our hypothesis: Are the student problems solved by those features or not.

To start, we research with some students to test our wireframe. We hypothesize that students will not go to the tuition center anymore. So, we do A/B testing by creating two versions of the prototype; With the Bimbel feature and Without the Bimbel part.

• 

• 

• 

• 

• 

• 

• 

• 

The research results are pretty surprising to us. Some of the features we explored before didn’t meet student needs. Here is the insight:

• Most of them are not interested in going to a tuition center. But they need long-term learning to understand more. 
• It’s complicated to ask several questions because we need to book the teacher then ask the schedule first. Even though students need to solve the problem as soon as possible, in an instant way.
• It’s quite a lot of role models to get inspired, for example, from YouTube. So, we are not focusing on this part for now.

From those insights, we’re thinking of merging and change some features. We come up with three main parts:

Live Class

Learn concepts, practice together, and prepare for exams in a live and interactive class.

Live classes are designed to increase self-confidence to understand concepts. Teachers will teach live and interactively.

This aims to make it easier for students to understand the concepts, practice questions, and prepare for exams.

• 

• 

• 

• 

Practice

Prepare for the exams by practice answer the questions from various subjects.

The Practice feature is designed to improve students’ skills in answering questions from various subjects to understand them better.

Students can exercise themself to answer simulated exams like the original. After finish it, they will immediately receive the report to understand where to improve. 

• 

• 

• 

• 

Ask(automated doubt solving)

Get step-by-step video solutions to your math problems instantly.

The Ask feature is designed to make it easier for students to learn from their difficulties. So that students can understand concepts deeper and quickly.

Students only need to take a photo of the question they don’t understand. Colearn will answer the questions automatically by providing video solutions. This feature is built using image recognition and natural language processing technology. 

• 

• 

• 

• 

• 

• 

• 

• 

Design System

Creating a cohesive and scalable design system.

We created a design system to establish consistency and speed up the design and development process. We set out to create a design system that’s simple, clear, and visually fun for the student.

We start to define a foundation like colors, typography, elevation, icon, and grid. As a foundation, we describe making it easy to use across platforms like Web, iOS, and Android. Accordingly, the team can build a faster and more accessible interface.

• 

• 

• 

• 

Apart from Foundation, we build the Core UI components such as Avatar, Tag, Button, Form, and Alert. As the app continues to grow, we also create some new components as templates, such as Top Bar, Bottom Bar, and Feedback.

• 

• 

• 

• 

By creating the design system, we want to make it easier for everything. Starting from designers themselves, engineers, and most students who use it.

WhatsApp Chatbot

Increase user growth by bringing it from the most common channels

More than 80% of internet users in Indonesia use WhatsApp. Instead of promoting social media to download the app, we’ve been thinking of creating other channels to increase our user growth.  

Collaborating with the UX Writer, we design the WhatsApp chatbot feature. We use the Botsociety for the prototyping to make it easy to testing and share with stakeholders.

The beginning

Email is always underestimated. However, email is the oldest marketing channel and has been proven for a long time. Therefore email remains one of the best alternatives for marketing campaigns. Unfortunately making a marketing campaign is not as easy as imagined. The tools available are quite complicated and difficult to use. MailTarget which its main product is a marketing tool was created to facilitate individuals, SMEs and large companies in conducting marketing campaigns.

Insights

To gain insight I conducted a competitive analysis of 16 popular marketing tools. Some of the main points that are used as assessment parameters are how to write and send an email, how the dashboard works, how to analyze email report data, how to create an automation campaign and the general problem in the marketing campaigns.

Results of the analysis indicated that the user have difficulty to create and customized email. Other than that, users have trouble to read an email report and don’t know what should they do after reading email report. For more detail, you can see the list of the table below:

Note: Some results from the analysis cannot be shared because they are limited company NDA policy.

The challenge

How to create a powerful marketing tool that is easy to use by the user so that they can conduct a marketing campaign effortlessly. Besides, as an early startup, we need rapid development to create the product and ship it to the users as soon as possible.

Principle

To create a product, we need to set some of the principles. It can be used for us to guide when we want to build a feature at MailTarget. In this case, the principle divided into three sections. The main principle, support principle and development principle.

From the principle, I designed the main features and support features in MailTarget. The features not designed at a time. Some features designed as time goes by after getting the feedback from the users.

Design

Email Marketing

The users being able to edit the content of email directly inside the editor (what you see is what you get). So the users being able to make changes without imagining how the email can be looked. There are also available many components for supporting the users to make it easy when they create an email.

Besides that, the steps for making an email designed with concise. Less than 5 steps, the users being able to send email to hundred or million subscribers.

Email Report

The report designed with concise and meaningful. So when the users read the report they being able to know easily about performance the email which they sent.

Besides that, in each section, there is a recommended action for users. For example, users being able to give tags for contacts who opened an email to follow up for the next email.

Email automation

Email automation designed straightforward and match with what user wants to do. For example, users being able to create a marketing campaign by themself like “Download ebook via email” in just a few steps.

To make it easier, I designed a pre-configured template feature for email marketing and email automation. Accordingly, users being able to use the template to make the marketing campaign fast and effortless.

Support feature

As a Saas company, support is an important thing for users. I designed guide feature for first time user from registration until sent an email campaign.

Besides that, I also designed tutorial and integrated chat feature from crisp which always accessible from all pages. So the users feel accompanied by MailTarget team anytime.

Design system

As a startup that was just built, release product as soon as possible is a must. The design should be designed fast and then engineers should develop and build fast too, so the product is able to release soon. Therefore we build a design system. By using it, we are able to focus on the business and how to implement it.