Gamification
MY ROLE
Design the feature, create toolkit for gamification items
THE TEAM
UX/UI Designer, Product Manager, Engineers
TIMELINE
Sept 2022 - August 2023 (Revisited
Problem statement
Despite the increasing availability of educational content online, learner engagement and retention remain persistent challenges. Many students struggle to maintain interest and motivation throughout their courses, leading to lower completion rates. The goal is to tackle low completion rates by leveraging game-like elements, fostering intrinsic motivation, and creating a more immersive learning experience.
The process
A kickoff meeting, Design QA, and research helped us decide how we wanted to proceed with this design. There was a product requirements document provided with a list of categories that had context and better idea of how to create structure. I was able to categorize the badges into different categories.
Design goals
Design goals for the feature:
Categories
Colours
Badge design
Badge creation - Settings
Sidebar addition
Categories
There are 2 types of badges that can be issued.
The first type are Riipen issued badges. They are created by Riipen admins for completing tasks such as Completing a milestone, giving feedback, requesting a project, etc.
The second type are portal issued badges. These are created by admins of portals and can be issued to learners/employers. There are 3 shapes and multiple colours for the badge creators to choose from with icons as well. Users are able to upload their own images as well.
ACTIVITIES
These badges are applicable to users who can earn achievements that are based on activities that are not related to categories.Ex) Badges for learners who are members of teams that have started 1 or more projects on Riipen. 
Badges below are examples of how the user can create them
Riipen issued badges
BEHAVIOURS
Behaviours are achievements users can earn that doesn't involve completing a task related to an activity. Ex) Awarded to educators who demonstrate high levels of communication with employers.Portal issued badges
CATEGORIES
These achievements are directly related to the user earning achievements based off a category.Ex) Awarded to learners who have completed 2 or more projects in the parent category,
The colours used for the badges are used for Experience/Project cards across the platform.
Icons that are part of the icon bank for users to create badges.
Badge cards
Badge cards are displayed on the stand alone pages. These pages can be accessed through tables, badges on profiles, and sidebar menu.
To the right are some examples of badges
Avatar creation
Avatars can be created in the settings section. Users have the option to upload their own image or create one. An avatar is created by selecting the shape, colour and icon. Once created, this will generate a badge card as shown above that will be displayed on the stand alone page.
Creating an achievement from scratch
Creating an achievement with image
Stand alone page
The stand alone page displays the badge that the user has earned along with vital information such as the issuer, the description, the progress and the user it was issued to.
IMPACT