Case Study: Yellow Class Gamification feature

Rishav Sood
11 min readJun 29, 2022

--

Yellow Class: Gamification feature

Overview 📖

This case study is based on Yellow Class an EdTech app, where I am working as UI/UX designer. It was one of the significant feature I had worked upon for this product. Our main goal was to use this user-centred method to increase engagement and traffic for our app.

So to better understand Consumer’s challenge, I participated in various primary & secondary research phases like Competitive audits, user survey & user interviews along with PMs. And after gathering all these curated data, I designed the UI for the same.

About Yellow Class 🧑‍🏫

Yellow Class is a new-age fun-learning Indian platform where kids between 2–12 years can learn from a wide range of hobby classes like dancing, drawing, dance, Yoga, Logical reasoning, General Knowledge, Creative writing, Personality development and so on. Multiple studies have shown that kids currently spend 100 hours/month on screen, primarily on YouTube, and:

Yellow Class believes it can offer a more positive, safe and interactive alternative to kids and win 25% of this digital time spent.

Learning new things & making progress through real efforts help kids improve self-esteem. Yellow Class provide a platform for your children to perform both.

Why do We need App Gamification? 🧐

The term gamification can be used in two ways: The first way is by adopting the act of playing a video game into everyday use(that most of us can relate with the term itself). The engagement levels and entertainment values of video gaming can motivate users to accomplish tasks that are normally viewed as boring, such as learning. Another definition of gamification is the act of using game elements to make non-games more enjoyable.

Since gamification in IT industries is all about implementing fun elements from games to the tech world, it also motivates user to come back and try the app again.

Gamification highly impacts on human behaviour by making things more exciting & fun-filled for users.

On business perspective, it’s actually a marketing tactic depending on the use of game methods like social interaction, competition, leaderboards, progress display, and rewards🤩(who don’t want them :p). Since people are more willing to complete tasks when they know they will get a reward at the end, gamification is a guide that directly increases users’ interest in using your product. A user is happy to achieve a task and gets a reward for that, and a business owner grows his revenue and gets a satisfied client who will possibly bring new clients to the app.
If you ask me, What will you get in business from Gamification? It just that:

  • More promising reviews
  • A leading position in the search engine
  • A stable social existence with no effort
  • A growing number of new users who become your target audience and are ready to use your app
  • Boost of engagement with your app
  • Happy users at last :)

Hypothesis 💬

As a kid-user my overall experience with Yellow Class is good for daily classes, but I think it disappoints me at some point in time. And those disappointments can be:

  • I’m loosing my motivation to come back more frequently.
  • I’m not getting sense of achievement & fulfilment.
  • Not having fun on the platform and instantaneous gratification.
  • Platform is less competitive.
  • I’m not challenged enough in my classes to have a continuous zeal to learn daily.
  • Less Happiness quotient — Platform is more focused on learning than fun.
  • Somehow I’m not that much serious in using the platform.

Goal 🎯

Source: giphy.com

Our core goal was to overcome all the disappointments we feel while using the app. And also app should more focus on cognitive skills such as perception, memory, problem solving, comprehension and/or establishing analogies.

We’ve all experienced the drive to compete, improve, and outperform others, and even ourselves.

Moreover, a plus with gamification is that people tend to spread the word about ‘a great app I’ve tried’ which is an extremely valuable add-on.

Research📚🪜

Quantitative Research:

I prepared a brief survey-form about the students’ learning habits through the app. This included questions about their study habits, motivations, and other factors influencing academic performance. With some help from our sales and Kids counsellors team, I was able to collect around 100s of responses. Most of these survey-forms are filled by Parents.

Insights derived from Quantitative Research

Survey Key Findings -

  1. Parents wants their kids to come on YC app and enjoy their time being here with fun-learning, not with old teaching methodologies.
  2. Kids wants to earn rewards for all the efforts they are making while spending their time on classes & other activities in the app.
  3. Kids needs more motivation to have instantaneous gratification.
  4. Kids also wants to achieve more rewards &certificates etc. and show them to their schoolmates & friends proudly.

Qualitative Research:

Paired alongside surveys & Analytics team, I conducted online-interviews with students asking about their behaviour objectives, wants, frustrations, and motivations while using our app. Keeping in mind that kids are free to speak and no will judge them, I conducted 7–10 interviews with kids and their parents. In most of the cases kid’s parents are present for interviews & they had various views to share with us:

User Interviews Observations

Interview Key Insights -

  1. They feel like app now has a similar teaching methodologies like other apps with nothing much different than other apps.
  2. Their kids does not know currently where he/she stands on the platform and how well he is doing.
  3. Every time the kids completes any activity he/she doesn’t get the feel-of-liveliness in the app. There should something applauding or Reward to keep up the motivation to do more.
  4. Kids need personal 1 on 1 interaction with their Mentors to understand things better about the classes & their respective doubts.

Empathy Maps:

I’ve created the Empathy Map using the insights from user research and unified all the observations of a kid to acquire a deeper understanding of how the users feel, gain, pain points, and experience.

Kid Empathy Map

Competitive Analysis:

As we began with our preliminary studies and started to find out how gamification actually works in the real world, we followed competitive analysis for our research as time constraint was a very important factor for us to get into the market with this feature.
Learning how to improve your competitor analysis can give your company an edge on the majority of rivals who are struggling with mastering this tactic.

Here are six basic steps I followed to help fortify my competitive analysis:

A competitive analysis helps to identify the main market players, determine what strategies they use to succeed and identify resources your company could use to dominate the market. Here’s my analysis for the same:

Competitors App observed for Competitive Analysis; Source: Respective Apps

Let’s get Started 📝

After analysing all the data & our hypothesis, we divided the way of rewarding kids based on their Psychology behaviour and improve their experience with solutions like:

  1. Leagues (‘Planets’ themed leagues with in-app points like Bolts & Stars)
  2. Badges (designed to promote their competitive levels within the community)
Gamification feature: Simplified flow

1. Leagues

Psychology Insight: User need to have any performance tracking system based on user skill-level hierarchy similar to a game.

Solution: Leagues are introduced so that the users will gain points upon the successful completion of each of the tasks. And upon reaching the appropriate Threshold level, the user will advance to the next level.
To make these leagues concept understandable for Kids we’d to have a theme. And finally after surveys & brainstorming across various parents & teams respectively, we decided to go with ‘Planets & Solar system’ theme because most of the kids nowadays are familiar with it & those who aren’t will be keen to learn which will also going to help them in their academics.

Leagues hierarchy Naming: based on surveys & brainstorming

Visual Designs:

a) Bolts (Points):

Psychology Insight: User does not know currently where he stands on the platform and how well he is doing.

Solution: Introducing Bolts - a way for the user to see what all has he accomplished on the platform and what more can he achieve through the same.

Points(Bolts) distribution Journey

So first let’s understand what Case 1 & Case 2 actually are:

  • Case 1(Earning Bolts): It’s the case when every time the user profile completes the corresponding activity to earn points, how will he/she will be going to earn point for the same.
  • Case 1(Loosing Bolts): It’s the case when every time the user profile completes the corresponding activity to earn points, how will he/she will be going to earn point for the same.

So, after understanding this I prepared a list of actions that can be taken on the platform & the points distribution were set based on them.

Wireframes:

Bolt Screens - Wireframes

Hi-fi Visual Designs:

Before creating Final designs I explored different design possibilities: From each repetition of the design I learn something that I can use for the next iteration. Here I’ve aggregated all the UI screens of iteration for reference:

UI design iterations made for Bolt screens

After long-days of these iterations for each screen, final screens got ready for hand-off to the developers:

Success Metrics:

  1. Increase in WoW retention
  2. Increase in all engagement metrics/activities on the platform.

b) Stars:

Psychology Insight: Users currently do not feel a lot of fun and gratification while using the platform. Also with all the programs and services on the app being free, the user has become very frivolous.

Solution: Stars are introduced as YC Currency that can be used as a substitute for real money for a user to spend and be more serious when they enrol in a program. Also this helps them get gratified on accomplishing things on the platform.

Users will start earning Stars, based on performing the various activities on Yellow Class app.

Wireframes:

Stars Screens - Wireframes

Hi-fi Visual Designs:

Before starting to work on UI Screens, we had to decide the icon representing the star(Currency). So, we lots of iterations were made to decide the one:

Creating Stars - Journey

UI screens of iteration for Stars screens reference:

UI design iterations made for Stars screens

Finally the screens ready to hand-off are like this:

Success Metrics:

  1. Increase in Program Completion Rate
  2. Increased user activity like posting on feed and referrals to earn stars

2. Badges

Psychology Insight: Badges can influence a player’s behaviour, leading them to select certain routes and challenges in order to earn the badges that are associated with them

Solution: Introducing Badges to level up the user when the desired number of activities are fulfilled. This will intrinsically keep them motivated to accomplish goals for a long run.
Humans inherently feel good about achieving something so we also introduced progress bars in badges to offer visual feedback on the completion of each badge.

Without a measure of progress to give a player feedback on the meaning of his or her decisions, meaningful play is not possible.

For e.g. - For any badge named (Super Star), the user profile needs to complete a total of 1 class to earn L1 Badge; a total of 5 classes to earn L2 Badge and so on.

Before proceeding with UI designs we need to create badges names & their look. Thus we designed:

Badges Design; Design Courtesy: Sambhav

Wireframes:

Hi-fi Visual Designs:

Iterations of screens before jumping into final UI were something like this:

Iterations made for Badges Screens

And the final designs ready to hand-off to developers are like this:

Success Metrics:

  1. Increase in number of classes completed.
  2. Increase in number of classes completed on weekends.
  3. Increase in number of posts on feed.
  4. Increase in number of referrals made.

Results📈

These ideas were essential in determining the effectiveness of gamification to increase MAUs watch-time, engagement and user retention rates in the platform and the techniques companies can apply.

These can also influence them to make their achievements & gratification fulfilled in certain categories, because users are intrinsically motivated to accomplish goals.

After gamification: Watch time & User engagement results

My Learnings🎓

There are hundreds of competitors in the market, which makes it tough to stand out and look original. So let’s admit it because:

Designing an educational digital product comes with its own set of challenges. However, being aware of these challenges is the first step in overcoming them.

The industry doesn’t need yet another average classroom management tool or learning management system.

Believe me, this approach will not take you far, and neither will it help you secure any funding. You need to be different as per your audience, need to understand kids behaviour (I would suggest this blog to read, if you want to understand kids behaviour as parent or anyone) and make the best use of innovative tools and services to stand out in this already crowded market.

Apart from all these as a designer, I learned some good things about myself & product designing is that:

  • I improved myself to be a good listener.
  • I brushed up on my interviewing and survey-creation skills.
  • It gave me huge scope to work on enhancing my UI skills.
  • Gained an understanding of how to structure and present data in a more effective way.
  • Due to limited time and resources, we weren’t able to make significant discoveries about the problem. Although the research did help us test out our assumptions.
  • We should never rush to the low fidelity phase & could’ve had proper discussions early so that we avoid extra iterations while making high fidelity mockups.We loose most of our time in the prototyping phase, going over and over the fundamental screens.

P.S: Our gamification feature made a higher conversion rate in app. We also received fewer enquiries about how the platform works, which shows the new design is easier to understand.

Last but not least, thank you for reading this study case! All comments and feedback are welcomed & appreciated for further improvement! Feel free to contact me through LinkedIn or email me at rishavsood19@gmail.com

Did you know? 👏

You can give up to 50 Claps for an article?

Tap and hold the clap button for a few seconds.

Thank you :)

Download the Yellow Class App

--

--

Rishav Sood

An engineer turned UI/UX designer, passionate about solving complex problems for in a product by altering user behaviours using Visual designs.