V-Brainer
How I helped Vedantu reach 3.6 Million+ users with gamified learning
About
Vedantu is the second-largest Edtech company in India, with 35M+ users providing live online coaching to students of grades 6th-12th. Vedantu has grown from its niche of providing one-to-one online teaching to tutoring millions of kids through live lectures covering the entire syllabus of various Indian competitive exams.
Vedantu has always been at the forefront of teacher-student interactions, experimenting and creating pedagogies in the online world. V brainer is its foray into the gamified learning space.
My Role
As the only designer, I advocated for the user and their needs, backed by data.
My task was to bring together stakeholders from across departments and to champion a user-centric approach to making our products.
I ensured the communication of ideas and also built brand guidelines based on Vedantu's principles. Once I had everyone on board, I guided its development and deployment and then measured what was essential to learn from this experiment.
Listening to students
Several teachers on the platform take live classes directly from the studios at the residential office. Due to this, a lot of dedicated students started coming to meet these teachers to either clarify their doubts or find a quiet place to study. Having real users at our office was a unique opportunity that we always used to our benefit.
The teachers also maintained a good rapport with many hundred students through online groups on WhatsApp, where we directly received user feedback. However, It wasn't enough as we scaled throughout India and in 500+ cities worldwide. It became important to remove our biases and gain a holistic view of our users' problems.
I saw this moment as a great opportunity to suggest conducting a large-scale user survey and creating user personas that Vedantu had not done before.
As all the stakeholders got on board, we initiated a survey sent out through email and SMS to our users. We saw over 12,000+ users in the survey from all corners of India and beyond. We also asked the students to give feedback via WhatsApp, which gave us much higher conversions.
Mobile first
The data gathered was collated into 'buckets', each providing some contextual behavioral information on the students. At first, we looked at the primary device used to access the platform at the survey time, augmented by our internal device data collection to prepare a device usage graph.
Most of the students were using a desktop to access lectures of Vedantu ( 58% share ), although the users of mobile were increasing much faster with time ( 36% share ). This meant that we had to take a mobile-first approach with the products we were building in the future.
We identified 3 'axis' on which our users could be distributed :
1. The class they studied in school. We had 5 buckets here, 3 for 6-8th, 9-10th & 11-12th. We further divided the students in 11-12th by their stream, these were MPC ( Maths, Physics & Chemistry ), BiPC ( Biology, Physics & Chemistry ) & MBiPC ( Maths, Biology, Physics & Chemistry ). There were also students who were repeating their classes and were grouped in the same category.
2. Their physical location in India. We had 3 buckets here, the North-West corridor, the North-East corridor & the South corridor. These became important as the medium of learning was different in each of these areas.
3. The level of dedication of the student. This was a behavioral division. We could broadly identify 3 categories. There were the hard-working, dedicated students who saw online education as a supplement to their existing coaching. Some students lacked access to good coaching in their area and looked at online education primarily to get an edge above their peers. We called these groups of students the aspirants.
Students lacked a platform for competing with their peers but did not like sitting through a 3-hour exam to do so. They lacked resources for revision before the exam. Their doubt-solving was limited to their classrooms, and even when they did get the opportunity to do so, it wasn't easy to go back and see what was learned. Students liked being engaged in short-term quizzes.
The users of vedantu also quickly rise due to the demand for online teaching in India, as seen here:
Based on the survey and through inputs from key stakeholders, we defined the project's primary objective to produce a daily live educative quiz platform. Students could review questions after they completed the quiz and compete in real time for exciting prizes. They also must be able to set reminders for future quizzes.
Insights
A total of 3 ( location ) x 5 (grade/stream) x 2 ( behavioral ) = 30 user personas were created and analyzed for this exercise. After we grouped the answers of the students for the survey with their personas, several insights emerged. Some of the insights gained were as follows:
-
The medium of learning for the students is important and diverse. Most students along the NW corridor prefer Hindi as their medium of learning. Students along the NE corridor prefer English, while students of the South corridor prefer their regional language.
-
Most students take additional coaching through small-scale tuitions, usually after school. Some students take coaching full-time, more prevalent in the south corridor.
-
Students prefer to learn offline than online, as they like directly interacting with their teachers and other students to compete in the class and clear their doubts.
-
Students were flexible and approachable to new methods of learning online, more prevalent in the urban sector.
-
Students have a large presence on platforms like youtube but find it difficult to search their queries and rarely look beyond the first few results.
-
There is a huge demand for portion completion in all classes, irrespective of streams, as the schools are inadequate in completing the syllabus on time.
-
Students across the class have no avenue to ask doubts or compete apart from exams.
For a lot of these learnings, the team had some intuition about the results, especially from the experienced founding team. But having the data to back up our gut feelings gave us the much-needed encouragement to go ahead with our experimentations. This also helped us dispel some misconceptions we had and streamlined our work in many ways, like moving away from a desktop-first design to a mobile-first design.
Scaling the product is always an exercise in scaling your understanding of your users.
User Engagement Flow
As we established the problem statement, I moved on to fit it into the existing product. This was titled V Brainer, and was pitched as India's first live online quiz platform. A core engagement loop was identified and funneled from the product acquisition flow
Wireframes
Once the key functionalities were nailed, I quickly made low-fidelity wireframes to get all the stakeholders on board with the emerging UI. This was refined further by input from the team.
Wireframes clarify product features for stakeholders. It's the skeleton on which the product is designed.
Style Guide
A competitor analysis of the product was carried out, and a design document was compiled. There was a clear need to define the new product's styling to differentiate it from the existing learning experience while keeping the product's identity intact. This began with a typographical analysis of various sans serif fonts that worked well with Open Sans (existing typeface).
In the end, Poppins was chosen as the font of choice because of its clear legibility owing to the big x-height in the font. It’s a playful sans serif that pairs well with the existing Product Sans font. This was also when we performed a preliminary color analysis and defined the primary UI elements.
UI Elements
As the premise of the product was experimental in nature, the UI elements were straightforward and similar to pre-existing elements of Vedantu, with the key difference being the corner rounding radius, which was more pronounced to make it friendlier and more approachable to a younger audience. Illustrations were used liberally and a limited emoji use was incorporated into the buttons to make it more familiar. Interactive elements were added in the background using the particles.js library.
Early mockup of the V Brainer landing page using particles.js
User Interface
We then integrated these elements into the wireframes to create the screens seen below. You can see more screens here including the screens for the web and some more of the process. These were iterated before being uploaded to zeplin and pushed into production.
Reception & Takeaways
-
V Brainer was a massive success, played by more than 3.6M+ users, and garnered over 110k new users in it's first 2 months (+8.3% of total users!)
-
This helped us gain Youtube subscribers (+46k combined in the first 3 months) through the videos of the teachers.
-
Students loved interacting with the teachers and competing among themselves to win prizes. Students loved being engaged in short educational quizzes with their peers they could not find elsewhere. This also helped teachers engage students in the classes and received a lot of positive feedback.
-
As students demanded more frequent tests, this solidified gamification as a means of the main engagement loop for the product. Live quiz has now become one of the core offerings of Vedantu.
-
This product was later absorbed into the Vedantu Youtube live menti quiz and in the all-in-one learning app under the Daily Challenges section.
