Wie das Level- und Fortschrittssystem in Spielen funktioniert

Grundlegende Mechanik der Erfahrung und der Ebenen

Jedes Fortschrittssystem basiert auf einer einfachen Idee: Der Spieler führt Aktionen aus, sammelt Erfahrung und wenn genügend Erfahrung gesammelt wurde, findet ein Übergang auf ein neues Level statt. Beginnen wir mit der einfachsten Version in JavaScript:

class Player {
  constructor() {
    this.level = 1;
    this.experience = 0;
    this.experienceToNextLevel = 100;
  }

  gainExperience(amount) {
    this.experience += amount;
    
    while (this.experience >= this.experienceToNextLevel) {
      this.levelUp();
    }
  }

  levelUp() {
    this.experience -= this.experienceToNextLevel;
    this.level++;
    this.experienceToNextLevel = Math.floor(this.experienceToNextLevel * 1.5);
    
    console.log(`Congratulations! You have reached ${this.level} level!`);
  }
}

const player = new Player();
player.gainExperience(150); // Wir sammeln Erfahrung und erhöhen das Niveau

Beachten Sie die Formel zur Berechnung der Erfahrung für das nächste Level. Wir multiplizieren den aktuellen Wert mit 1,5, wodurch eine exponentielle Wachstumskurve entsteht. Dies ist ein wichtiger Punkt - wenn jedes Level die gleiche Menge an Erfahrung erfordert, wird das Spiel schnell langweilig.

Verschiedene Progressionskurven

Es gibt mehrere beliebte Ansätze zur Berechnung der erforderlichen Erfahrung. Lineare Progression, bei der jedes Level eine feste Menge an Erfahrung erfordert, ist für kurze Spiele geeignet. Die exponentielle Kurve, wie im obigen Beispiel, erzeugt ein Gefühl der allmählichen Komplexität. Die logarithmische Kurve macht die ersten Stufen schnell und die folgenden langsamer.

Hier ist ein Beispiel mit verschiedenen Formeln:

class ProgressionSystem {
  // Lineare Progression: 100, 200, 300, 400...
  static linear(level, baseXP = 100) {
    return baseXP * level;
  }

  // Exponentiell: 100, 150, 225, 337,5...
  static exponential(level, baseXP = 100, multiplier = 1.5) {
    return Math.floor(baseXP * Math.pow(multiplier, level - 1));
  }

  // Polynom: 100, 400, 900, 1600...
  static polynomial(level, baseXP = 100) {
    return baseXP * Math.pow(level, 2);
  }

  // Hybridformel (wie bei Pokemon)
  static hybrid(level) {
    return Math.floor(1.2 * Math.pow(level, 3));
  }
}

// Mal sehen, wie die Anforderungen an die Erfahrung wachsen
for (let level = 1; level <= 5; level++) {
  console.log(`Level ${level}:`);
  console.log(`  Linear: ${ProgressionSystem.linear(level)}`);
  console.log(`  Exponential: ${ProgressionSystem.exponential(level)}`);
  console.log(`  Polynomial: ${ProgressionSystem.polynomial(level)}`);
}

Welche Formel soll man wählen?

Das hängt von Ihrem Spiel ab. Bei mobilen Gelegenheitsspielen wird zu Beginn häufig ein schneller Fortschritt verwendet, um den Spieler zu fesseln, und dann wird das Tempo verlangsamt. In Hardcore-RPGs kann der Fortschritt von Anfang an langsam und anspruchsvoll sein.

Wir fügen Belohnungen für das Level hinzu

Ein Level-Up ohne Belohnungen ist eine verpasste Gelegenheit. Die Spieler müssen das Gefühl haben, dass ihr Fortschritt etwas bedeutet. Fügen wir ein Belohnungssystem hinzu:

class Player {
  constructor() {
    this.level = 1;
    this.experience = 0;
    this.health = 100;
    this.attack = 10;
    this.defense = 5;
    this.skillPoints = 0;
  }

  levelUp() {
    this.level++;
    
    // Wir erhöhen die Grundeigenschaften
    this.health += 20;
    this.attack += 3;
    this.defense += 2;
    this.skillPoints += 5;
    
    // Jedes 5. Level gibt eine besondere Belohnung
    if (this.level % 5 === 0) {
      this.unlockNewAbility();
    }
    
    // Gesundheit wiederherstellen, indem man das Niveau erhöht
    this.currentHealth = this.health;
    
    console.log(`
      🎉 Level ${this.level}!
      Health: ${this.health}
      Attack: ${this.attack}
      Defense: ${this.defense}
      Skill points: ${this.skillPoints}
    `);
  }

  unlockNewAbility() {
    const abilities = [
      'Fireball',
      'Ice Arrow',
      'Shield of Power',
      'Lightning strike'
    ];
    const abilityIndex = Math.floor(this.level / 5) - 1;
    if (abilityIndex < abilities.length) {
      console.log(`✨ Ability unlocked: ${abilities[abilityIndex]}`);
    }
  }
}

Visualisierung des Fortschritts

Es reicht nicht aus, nur Zahlen zu speichern - die Spieler müssen ihren Fortschritt sehen. Erstellen wir eine einfache Fortschrittsanzeige:

class ProgressBar {
  static draw(current, required, width = 20) {
    const percentage = current / required;
    const filledWidth = Math.floor(percentage * width);
    const emptyWidth = width - filledWidth;
    
    const filled = '█'.repeat(filledWidth);
    const empty = '░'.repeat(emptyWidth);
    const percentText = Math.floor(percentage * 100);
    
    return `[${filled}${empty}] ${percentText}% (${current}/${required})`;
  }
}

const player = new Player();
console.log('Experience:', ProgressBar.draw(player.experience, player.experienceToNextLevel));

player.gainExperience(75);
console.log('Experience:', ProgressBar.draw(player.experience, player.experienceToNextLevel));

Für Webspiele können Sie HTML und CSS verwenden, um schönere Fortschrittsbalken zu erstellen. Hier ist ein schnelles Beispiel:

class UIManager {
  static updateExpBar(player) {
    const percentage = (player.experience / player.experienceToNextLevel) * 100;
    
    const expBar = document.getElementById('exp-bar');
    const expText = document.getElementById('exp-text');
    
    expBar.style.width = `${percentage}%`;
    expText.textContent = `${player.experience} / ${player.experienceToNextLevel} XP`;
  }

  static showLevelUp(player) {
    const notification = document.createElement('div');
    notification.className = 'level-up-notification';
    notification.textContent = `Level ${player.level}!`;
    document.body.appendChild(notification);
    
    // Animation des Erscheinens und Verschwindens
    setTimeout(() => notification.classList.add('show'), 10);
    setTimeout(() => {
      notification.classList.remove('show');
      setTimeout(() => notification.remove(), 300);
    }, 2000);
  }
}

Das System des Prestiges und der Wiedergeburt

Viele moderne Spiele verwenden ein Prestigesystem — wenn ein Spieler das maximale Level erreicht, kann er neu starten, aber mit Boni. Dies erhöht die Wiederspielbarkeit:

class PrestigeSystem {
  constructor() {
    this.prestigeLevel = 0;
    this.prestigePoints = 0;
  }

  canPrestige(player) {
    return player.level >= 100;
  }

  prestige(player) {
    if (!this.canPrestige(player)) {
      console.log('Insufficient level for prestige!');
      return false;
    }

    this.prestigeLevel++;
    this.prestigePoints += Math.floor(player.level / 10);
    
    // Wir werfen den Spieler ab, aber wir behalten die Boni
    const expBonus = 1 + (this.prestigeLevel * 0.1); // +10% Erfahrung für jedes Prestige
    const statBonus = this.prestigeLevel * 5; // +5 zu den Startmerkmalen
    
    player.reset(expBonus, statBonus);
    
    console.log(`
      🌟 Prestige ${this.prestigeLevel}!
      Experience bonus: +${(expBonus - 1) * 100}%
      Bonus to characteristics: +${statBonus}
      Prestige points: ${this.prestigePoints}
    `);
    
    return true;
  }

  // Kontinuierliche Verbesserungen für Prestige-Punkte
  buyPermanentUpgrade(upgrade) {
    const upgrades = {
      'double_xp': { cost: 10, effect: 'Double experience' },
      'start_level_10': { cost: 15, effect: 'Start from level 10' },
      'bonus_gold': { cost: 20, effect: '+50% gold' }
    };

    const selected = upgrades[upgrade];
    if (!selected) return false;
    
    if (this.prestigePoints >= selected.cost) {
      this.prestigePoints -= selected.cost;
      console.log(`Purchased: ${selected.effect}`);
      return true;
    }
    
    return false;
  }
}

Ausgleich der Progression

Der schwierigste Teil ist, das System richtig auszubalancieren. Der Spieler muss den Fortschritt spüren, aber nicht zu schnell. Ein paar Tipps: Die ersten fünf Levels sollten schnell gespielt werden, um den Spieler zu fesseln und die Mechanik zu zeigen. Die mittleren Levels sind der Hauptinhalt, hier sollte das Tempo angenehm sein. Späte Levels können ernsthafte Anstrengungen erfordern, dies schafft ein Gefühl der Leistung.

Es ist wichtig, mit echten Spielern zu testen. Was einem Entwickler ausgewogen erscheint, kann für einen durchschnittlichen Spieler zu schnell oder zu langsam sein. Verwenden Sie Analysen, um zu verfolgen, auf welchen Levels Spieler stecken bleiben oder das Spiel abbrechen.

Hier ist ein einfaches Protokollierungssystem für die Analyse:

class Analytics {
  static logLevelUp(player, timeSpent) {
    const data = {
      level: player.level,
      timeSpent: timeSpent,
      timestamp: new Date().toISOString()
    };
    
    // Im echten Spiel senden wir an den Server
    console.log('Analytics:', data);
    
    // Speichern Sie lokal für die Analyse
    const history = JSON.parse(localStorage.getItem('levelHistory') || '[]');
    history.push(data);
    localStorage.setItem('levelHistory', JSON.stringify(history));
  }

  static getAverageLevelTime() {
    const history = JSON.parse(localStorage.getItem('levelHistory') || '[]');
    if (history.length === 0) return 0;
    
    const total = history.reduce((sum, entry) => sum + entry.timeSpent, 0);
    return total / history.length;
  }
}

Fortgeschrittene Techniken

Moderne Spiele verwenden oft mehrere parallele Fortschrittssysteme. Zum Beispiel Charakterlevel, Skilllevel, Kampfwertung, saisonaler Fortschritt. Jedes System gibt dem Spieler etwas Neues und hält das Engagement in verschiedenen Phasen des Spiels aufrecht. Beliebt sind auch Tages- und Wochenziele, die zusätzliche Erfahrung und Belohnungen bieten und die Spieler dazu anregen, regelmäßig zum Spiel zurückzukehren.

Vergiss nicht das Feedback. Jede Aktion des Spielers sollte Fortschritte zeigen: Erfahrungszahlen, Animationen, Soundeffekte, visuelle Effekte, wenn das Level steigt. All dies schafft ein Gefühl der Zufriedenheit und motiviert zum Weiterspielen.

Befund: Das Level- und Progressionssystem ist eine ganze Wissenschaft, die Programmierung, Spieldesign und Spielerpsychologie vereint. Ein richtig umgesetztes System hält die Spieler stundenlang in Atem und erzeugt genau den Effekt von „noch einem Level“. Experimentieren Sie mit Formeln, testen Sie sie an echten Spielern und scheuen Sie sich nicht, das Gleichgewicht nach der Veröffentlichung zu ändern.

🎓 Weiter geht's!

Sie können dieses Thema vertiefen und die Entwicklung von Spielen, Webanwendungen und vielem mehr erlernen Kodike — unsere Bildungsplattform mit Kursen für angehende Entwickler.

Und wir haben auch einen coolen Telegram-Kanal mit einer freundlichen Community, in der Entwickler Code diskutieren, Erfahrungen austauschen und sich gegenseitig helfen, zu wachsen.