PUBLISHED ON
12 September 2023
Badges
What to expect in this documentation?
In this document, I will provide some context for the feature. Primarily, I will cover the process of designing the badges, discussing the challenges I faced while creating them on Spline. Finally, I will offer a glimpse of the feature's placement in the product.
Introduction of badges in the course
In an online, human-free course, maintaining student motivation for consistent problem-solving and course completion poses a significant challenge.
To address this challenge, we delved into various motivational strategies, including peer-to-peer competition, goal achievement features, and methods to encourage regular participation. As a result, we introduced badges at different milestone completions as a means of recognising and motivating students.
Milestones for which the student will earn the badges
Badges Earned for Consistency
1
Perfect Week
Earned upon completing a 7-day streak
2
Perfect Month
Earned upon completing a 30-day streak
3
10 Daily Goals
Earned upon completing 10 daily goals.
4
100 Daily Goals
Earned upon completing 100 daily goals.
Badges Earned for promoting Competition
5
First Podium
Earned upon finishing first on the monthly leaderboard.
6
Second Podium
Earned on finishing second on the monthly leaderboard.
7
Third Podium
Earned upon finishing third on the monthly leaderboard.
Badges Earned for Completion
8
Builder
Earned upon finishing a coding project.
9
Grinder
Earned upon solving 80% of practice questions.
10
Pro
Earned upon completing a module in the course
Final Designs
Perfect Week
img
Perfect Month
img
10 Daily Goals
img
100 Daily Goals
img
First Podium
img
Second Podium
img
Third Podium
img
Builder
img
Grinder
img
Pro
img
Interaction Design
Imagine sitting in a restaurant, eagerly ordering your favourite cuisine. When the waiter arrives with a tray, you catch the first glimpse of something familiar. As it reaches your table, the aroma and vibrant colours of the food envelop your space.
In designing the interaction for badges, my vision was similar to that moment in the restaurant. The badges should be easily identifiable from a distance, yet reveal intricate details up close. They should represent a solid, metallic feel, enticing you to reach out and grab them—much like something elegantly presented to you.
Sharables
Closing Notes
For a while, the desire to learn 3D design, but kept procrastinating. While I had played around in MagicaVoxel, a 3D pixel art tool, it remained rather rudimentary.
This project finally granted me the opportunity to step outside the confines of the 2D world and venture into the realms of 3D and interaction design. The journey of learning Spline and crafting the badges proved to be exceptional. Concepts like camera placements, lighting, materials, and numerous other aspects unfolded during the process.
Navigating a project rich in 3D and interaction dynamics presented a distinct shift from the pixel-pushing routine of 2D. The challenges of implementation, embedding, and optimising assets added a layer of complexity.
In the end, it was an enjoyable experience— "Maza aaya!"