Gamification

Learning to code in Tutor IDE is not just about writing code — it's also about earning experience points, leveling up, collecting achievements, playing educational mini-games, completing daily quests, and competing with classmates on the leaderboard. The gamification system turns every lesson into an adventure!

Experience Points (XP)

For every activity on the platform, students earn experience points (XP). The more a student creates and learns, the faster their level grows.

How to earn XP?

Activity	XP Points
Create a new project	50 XP
Complete a challenge (lesson)	100 XP
Complete a CSS Battle	75 XP
CSS Battle — score 90%+	+50 XP bonus
CSS Battle — score 100%	+100 XP bonus
Chat with the AI assistant	5 XP per message (daily cap)
Publish a project to portfolio	25 XP
Mini-game — Easy level	15 XP
Mini-game — Medium level	30 XP
Mini-game — Hard level	50 XP
Mini-game — 3 stars (perfect)	+25 XP bonus

XP from mini-games is only awarded when the student beats their previous best score for that game and difficulty level.

Levels

XP points translate into levels — from Level 1 to Level 50. Each subsequent level requires more points:

Level	Required XP
Level 1	0 XP
Level 2	100 XP
Level 3	250 XP
Level 5	1,000 XP
Level 10	5,000 XP
Level 20	25,000 XP
Level 50	500,000 XP

The current level and level badge are visible on the student's profile and on the leaderboard.

Streaks

Daily logins build an activity streak. Each consecutive day increases the streak counter — all it takes is logging in and completing any activity.

• A fire icon shows the current streak
• The system also remembers the student's longest streak
• Maintaining a streak for several consecutive days unlocks special achievements

Educational Mini-Games

On the /learn page you'll find 4 educational mini-games that make learning HTML and CSS even more engaging. Each game has 3 difficulty levels and a star rating system — with a total of 36 stars to collect!

Available Games

HTML Master Quiz

A multiple-choice quiz testing HTML knowledge. Questions cover tags, attributes, document structure, and best practices. Each difficulty level features different, increasingly advanced questions.

Bug Hunter

A game where the student must find and fix bugs in broken code. You receive a code snippet with intentionally introduced errors — your job is to locate and correct them. The harder the level, the more bugs and the trickier the traps.

Tag Builder

Build correct HTML elements from parts! The game presents a set of components (opening tags, closing tags, attributes, content) — and you must arrange them in the correct order. A perfect way to learn HTML element structure.

CSS Stylist

Match CSS styles to visual targets. The game shows the target appearance of an element — and you must write the appropriate CSS rules to reproduce that look. Practice colors, margins, padding, fonts, and other CSS properties.

Difficulty Levels

Each game has 3 difficulty levels that unlock progressively:

Level	Color	Unlock Condition
Easy	Green	Unlocked by default
Medium	Amber	Requires at least 1 star on Easy
Hard	Red	Requires at least 1 star on Medium

Star Rating System

After completing a game, the student receives 0 to 3 stars depending on their score:

Stars	Score
0 stars	below 50%
1 star	50% — 79%
2 stars	80% — 94%
3 stars	95% — 100%

XP from Mini-Games

Difficulty Level	XP
Easy	15 XP
Medium	30 XP
Hard	50 XP
3-star bonus (perfect)	+25 XP

XP is only awarded when the student beats their previous best score. Playing the same level multiple times does not grant additional XP unless the student achieves a higher score than before.

Progress Tracking

• Stars and best scores are saved separately for each game and each difficulty level
• On the game selection page, a progress bar shows the total number of stars collected (X/36)
• Each game card displays star indicators for each difficulty level

Total: 4 games x 3 difficulty levels = 12 game modes, up to 36 stars to collect.

Daily Quests

Daily quests are organization-level objectives that refresh each day. They provide extra motivation to return to the platform regularly and complete short-term goals.

Example Daily Quests

• Complete a lesson
• Write X lines of code
• Earn X XP
• Maintain your login streak
• Create a new project

How Do They Work?

• Quests refresh daily
• Teachers configure which quests are active for their organization
• Once the condition is met, the quest is marked as completed
• Completing daily quests helps build a habit of regular learning

Parent Dashboard

Parents can view their child's progress through a secure token-based link — no account or login required.

How Does It Work?

1. The student generates an invite link from their Dashboard
2. The student shares the link with their parent
3. The parent opens the link in a browser — no login or account needed
4. The parent sees their child's progress in a secure read-only view

What Can Parents See?

• Current XP and level
• Activity streak
• List of projects
• Earned achievements
• Overall progress statistics

Managing Links

• Students can generate multiple links for different parents/guardians
• Each link can be revoked (invalidated) at any time
• Links are unique and secure — only the person with the link has access

Achievements

The platform has 44 achievements in 10 categories. Each achievement unlocks automatically when the condition is met, and the student receives an on-screen notification. Every achievement has its own unique AI-generated badge image.

Projects (5)

• First Project (first-project) — create your first project
• Builder (builder) — create 5 projects
• Architect (architect) — create 10 projects
• Code Factory (code-factory) — create 25 projects
• Code Machine (code-machine) — create 50 projects

Challenges (5)

• First Challenge (first-challenge) — complete your first challenge
• Problem Solver (problem-solver) — complete 5 challenges
• Challenge Master (challenge-master) — complete 10 challenges
• Challenge Champion (challenge-champion) — complete 25 challenges
• Lesson Legend (lesson-legend) — complete 50 challenges

CSS Battle (5)

• Pixel Perfect (pixel-perfect) — score 100% in a CSS Battle
• Pixel Sniper (pixel-sniper) — score 100% in 3 CSS Battles
• Pixel Machine (pixel-machine) — score 100% in 5 CSS Battles
• CSS Warrior (css-warrior) — complete 5 CSS Battle tasks
• CSS Legend (css-legend) — complete 10 CSS Battle tasks

Streaks (5)

• On Fire (on-fire) — maintain a 3-day streak
• Dedicated (dedicated) — maintain a 7-day streak
• Unstoppable (unstoppable) — maintain a 14-day streak
• Month of Code (month-of-code) — maintain a 30-day streak
• Code Marathon (code-marathon) — maintain a 60-day streak

AI Tutor (4)

• First Chat (first-chat) — start a conversation with the AI assistant
• Curious Mind (curious-mind) — send 50 messages to the AI assistant
• AI Explorer (ai-explorer) — send 200 messages to the AI assistant
• AI Mastermind (ai-mastermind) — send 500 messages to the AI assistant

Social / Publishing (3)

• Published! (published) — publish your first project
• Showcase (showcase) — publish 5 projects
• Portfolio Pro (portfolio-pro) — publish 10 projects

Levels (5)

• Rising Star (rising-star) — reach Level 5
• Getting Serious (getting-serious) — reach Level 10
• Halfway There (halfway-there) — reach Level 25
• Elite Coder (elite-coder) — reach Level 40
• Max Level (max-level) — reach Level 50

Leaderboard (3)

• Top 3 (top-3) — finish in the top 3 on the leaderboard
• Number One (number-one) — reach 1st place on the leaderboard
• Streak Leader (streak-leader) — have the longest streak in your organization

Games (7)

• Game Starter (game-starter) — complete your first mini-game
• Game Master (game-master) — earn 3 stars in 10 games
• Turtle Tamer (turtle-tamer) — complete all difficulty levels in the Turtle game
• Color Wizard (color-wizard) — achieve a perfect score in the color game
• Flexbox Ninja (flexbox-ninja) — master all Flexbox challenges
• Speed Demon (speed-demon) — complete a game in record time
• Bug Exterminator (bug-exterminator) — find and fix 50 bugs in Bug Hunter

Special (2)

• Welcome! (welcome) — log in for the first time
• Early Adopter (early-adopter) — a secret achievement for the first users

Leaderboard

Students can compare their results with classmates in their organization on the leaderboard.

How does the ranking work?

• The ranking includes all students in a given organization (school or group)
• Students are sorted by the number of XP points earned
• The top three places are highlighted with medals: gold, silver, and bronze
• The current student's position is always highlighted, even if they are far down in the ranking

Time Filters

The leaderboard can be filtered by time period:

• This week — who earned the most XP this week
• This month — monthly ranking
• All time — total ranking since account creation

Thanks to filters, even new students have a chance to reach the podium in the weekly ranking.