F2P-Vorlage verwenden

Überblick

Dieser Anwendungsfall und die sofort einsatzbereiten Tools von Xsolla ermöglichen es, Free-to-Play-Spiele (F2P) über Ihren eigenen Webshop zu monetarisieren. So können Sie virtuelle Gegenstände, virtuelle Währungen und Bundles auf einer externen Website verkaufen, unabhängig davon, ob Ihr Spiel für PC, Konsolen oder plattformübergreifend ist.

Hauptmerkmale:

• Das flexible und sichere Zahlungsportal von Xsolla unterstützt weltweit über 1.000 Zahlungsmethoden.
• Die Benutzeroberfläche des Shops lässt sich per Website-Baukasten ganz einfach anpassen, ohne dass eine komplette Neuentwicklung erforderlich ist.
• Sie haben die volle Kontrolle über Ihren Artikelkatalog, die Preise und Ihre Werbeaktionen.
• Breite Palette von LiveOps-Tools, beispielsweise Rabattaktionen, Upselling und Belohnungssysteme.

In diesem Leitfaden wird erklärt, wie man einen Webshop für F2P-Spiele mit den Tools von Xsolla einrichtet und launcht.

Für wen ist es

Dieser Anwendungsfall ist für alle geeignet, die:

• Spiele für PC, Konsolen oder plattformübergreifend entwickeln und veröffentlichen
• Ingame-Items und virtuelle Währung über eine eigene Website verkaufen möchten
• weniger Plattformgebühren zahlen möchten
• die volle Kontrolle über Marketing, Verkaufstrichter und Nutzerdaten wünschen

Einrichtung

1. Erstellen Sie ein Projekt im Kundenportal.
2. Erstellen Sie einen Artikelkatalog.
3. Erstellen Sie eine Website.
4. Richten Sie die wesentlichen Blöcke ein.
5. Konfigurieren Sie die Benutzerauthentifizierung.
6. Konfigurieren Sie Webhooks, um dem Nutzer Käufe zu gewähren.
7. Testen Sie die Website.
8. Veröffentlichen Sie die Website.

Artikelkatalog erstellen

Um einen Katalog zu erstellen, haben Sie folgende Möglichkeiten:

• Artikel manuell im Kundenportal hinzufügen
• API-Methoden aufrufen
• Artikelkatalog aus einer JSON-Datei importieren

So erstellen Sie einen virtuellen Gegenstand im Katalog:

1. Öffnen Sie Ihr Projekt im Kundenportal, und navigieren Sie zum Menüpunkt Artikelkatalog > Virtuelle Gegenstände.
2. Wählen Sie im Drop-down-Menü die Option Artikel anlegen.

3. Legen Sie die Grundeinstellungen des Artikels fest:
   • Bild (optional)
   • SKU (individuelle Artikel-ID)
   • Gegenstandsname 
   • Beschreibung (optional)

4. Legen Sie den Artikelpreis fest:
   1. Stellen Sie den Schalter Preise in echter Währung auf Ein.
   2. Im Feld Standard-Währung können Sie wahlweise die Währung ändern. Legen Sie den Artikelpreis fest.
   3. Sollten Sie die Währung im Feld Standard-Währung geändert haben, müssen Sie unter Preis in echter Währung dieselbe Währung auswählen.

5. Ändern Sie den Artikelstatus in Verfügbar.

6. Klicken Sie auf Artikel anlegen.

Website erstellen

1. Öffnen Sie Ihr Projekt im Kundenportal.
2. Klicken Sie auf der Hauptseite des Projekts auf Schwerpunkt ändern und wählen Sie Virtuelle Güter im Spiel oder online verkaufen.

3. Klicken Sie im Schritt Optional: Shop einrichten auf Vorlage erstellen.

4. Fügen Sie auf der Registerkarte Express einen Link der Plattform hinzu, auf der Ihr Spiel erhältlich ist: Steam oder Epic Games Store. Auf diese Weise können Sie schnell eine auf Ihr Spiel zugeschnittene Website erstellen, denn das Spielbild, der Titel, der Name des Entwicklers und das Farbschema werden beim Erstellen der Website automatisch übernommen.

5. Klicken Sie auf Online-Shop erstellen.
6. Klicken Sie auf Weiter zur Einrichtung.

Wesentliche Blöcke einrichten

1. Ist der Schwerpunkt auf Virtuelle Güter im Spiel oder online verkaufen festgelegt, scrollen zum Schritt Optional: Shop einrichten und klicken auf Website anpassen. Sie werden zum Website-Baukasten weitergeleitet, wo Sie die erstellte Website anpassen können.

Hinweis

Wenn Sie die Projekt-Hauptseite geschlossen haben, navigieren Sie zum Abschnitt Storefronts > Websites und klicken bei der erstellten Website auf Site Builder öffnen. Die erstellte Website können Sie anhand des Erstellungsdatum leicht finden.

2. Konfigurieren Sie den Header-Block, in dem Nutzerinformationen und Website-Navigationselemente angezeigt werden:
   • Fügen Sie ein Logo Ihres Spiels oder Studios hinzu.
   • Ändern Sie bei Bedarf die voreingestellten Schaltflächen.

Header-Block (Beispiel):

3. Konfigurieren Sie den Aufmacher-Block, in dem die wichtigsten Informationen zu Ihrem Shop angezeigt werden.
   • Fügen Sie einen Shop-Namen, eine Beschreibung und ein Hintergrundbild hinzu, wenn Sie nicht die automatisch hochgeladenen verwenden möchten.
   • Fügen Sie Tags hinzu.
   • Geben Sie die Plattformen an, auf denen das Spiel verfügbar ist.
   • Bearbeiten Sie die Standardschaltflächen oder fügen Sie bei Bedarf neue hinzu.

4. Konfigurieren Sie den Battle Pass-Block, in dem ein ausgewähltes Angebot angezeigt wird:
   • Aktualisieren Sie den benutzerdefinierten Hintergrund der Karte.
   • Fügen Sie einen Angebotsnamen und eine Beschreibung hinzu.
   • Richten Sie die Kaufen-Schaltfläche ein: Wählen Sie den zu verkaufenden Artikel aus, und passen Sie bei Bedarf den Stil der Schaltfläche an.

Battle-Pass-Block (Beispiel):

5. Konfigurieren Sie den Online-Shop-Block, in dem virtuelle Gegenstände, Bundles und virtuelle Währungspakete angezeigt werden:
   • Entfernen Sie bei Bedarf die automatisch hinzugefügten Abschnitte oder fügen Sie neue hinzu.
   • Wählen Sie im Block für den entsprechenden Abschnitt den Artikeltyp und die Gruppe aus der Drop-down-Liste aus, um beide auf der Seite anzuzeigen.

Achtung

Wenn der ausgewählte Artikeltyp und die Gruppe nicht im Baukasten angezeigt werden, müssen Sie prüfen, ob den gewünschten Artikelgruppen und virtuellen Währungspaketen der Status Aktiviert zugewiesen ist, d. h. dass sie im Shop angezeigt werden können und dass die Artikel in diesen Gruppen enthalten sind. Wechseln Sie hierfür zum Artikelkatalog, und öffnen Sie den Abschnitt des entsprechenden Artikeltyps.

Online-Shop-Block (Beispiel):

6. Konfigurieren Sie den Footer-Block, in dem rechtliche Hinweise und Datenschutzeinstellungen aufgelistet sind. Sie können:
   • ein Layout auswählen: Spalten oder Zeilen.
   • einen eigenen Hintergrund festlegen.
   • Links zu sozialen Netzwerken hinzufügen.
   • Altersbeschränkungen festlegen.

Footer-Block (Beispiel):

7. Wechseln Sie zu den Warenkorbeinstellungen, um zusätzliche Funktionen zu konfigurieren. Aktivieren Sie die entsprechenden Schalter:
   • Promocode-Feld einblenden – ermöglicht es Nutzern, einen Promocode oder einen Gutschein auf der Benutzeroberfläche einzugeben.
   • Anmeldepflicht vor Warenkorbnutzung – öffnet das Anmeldefenster, wenn ein nicht autorisiertert Nutzer den Warenkorb aufrufen will.
8. Fügen Sie bei Bedarf weitere Seiten Ihrem Shop hinzu, z. B. eine Neuigkeitenseite. Gehen Sie dazu wie folgt vor:

1. 1. Fügen Sie die erforderlichen Seiten hinzu. Befolgen Sie dabei die Anleitung.
   2. Gehen Sie in dem Block, in dem Sie einen Seiten-Link platzieren möchten, wie folgt vor (als Beispiel dient der Header-Block):
      1. Fügen Sie eine neue Schaltfläche hinzu oder bearbeiten Sie eine vorhandene.
      2. Wählen Sie in den Schaltflächeneinstellungen die Aktion Seite öffnen aus.
      3. Wählen Sie aus der Drop-down-Liste eine Seite aus, die bei einem Klick auf die Schaltfläche geöffnet werden soll.

Benutzerauthentifizierung einrichten

Die Authentifizierung ermöglicht es Nutzern, Artikel im Shop zu kaufen und personalisierte Angebote im Katalog zu erhalten. Bei der Authentifizierung über Xsolla-Login stehen den Nutzern verschiedene Autorisierungsmethoden zur Verfügung: über soziale Netzwerke, Einmalcodes oder ‑Links oder durch Eingabe eines Nutzernamens und Passworts. Das Xsolla-Login-Widget können Sie anpassen und Altersbeschränkungen für die Authentifizierung festlegen.

So richten Sie die Benutzerauthentifizierung über Xsolla-Login ein:

1. Öffnen Sie Ihr Projekt im Kundenportal, und navigieren Sie zum Menüpunkt Storefronts > Websites.
2. Klicken Sie bei der gewünschten Website auf Site Builder öffnen.
3. Wechseln Sie im Website-Baukasten in die Login-Einstellungen.
4. Wählen Sie Xsolla Login.
5. Wählen Sie aus der Drop-down-Liste die Option Neuer Login aus. Daraufhin wird automatisch ein Login-Projekt samt Benutzerauthentifizierung über E-Mail-Adresse und Passwort erstellt. Befolgen Sie die Anleitung, wenn Sie eine weitere Anmeldemethode einrichten möchten.

6. Verknüpfen Sie den Nutzerdatenspeicher. Je nach gewähltem Nutzerdatenspeicher stehen Ihnen unterschiedliche Produktfunktionen zur Verfügung (siehe Abschnitt Vergleich der Nutzerdatenspeicher-Möglichkeiten).

Dem Nutzer einen Kauf gewähren

Implementieren Sie in Ihrer Anwendung, dass Käufe den Nutzern gewährt werden. Nutzen Sie dafür die in den Webhooks von Xsolla erhaltenen Informationen zu den Transaktionsdetails und den gekauften Artikeln. Wenn Sie sich nach dem 22. Januar 2025 im Kundenportal registriert haben, müssen Sie für den vollumfänglichen Betrieb des Shops und die Zahlungsabwicklung die Verarbeitung der folgenden Webhooks implementieren:

Website in der Testumgebung testen

Zum Testen der Website in der Testumgebung:

1. Öffnen Sie Ihr Projekt im Kundenportal, und navigieren Sie zum Menüpunkt Storefronts > Websites.
2. Klicken Sie bei der gewünschten Website auf Site Builder öffnen.
3. Klicken Sie auf Vorschau.

4. Wählen Sie einen Artikel aus, und klicken Sie auf die Kaufen-Schaltfläche.
5. Wählen Sie als Zahlungsmethode die Option Karte aus.
6. Geben Sie die Daten einer Testbankkarte ein. In die verbleibenden Felder können Sie beliebige Werte eingeben. Sie dürfen auch falsche Angaben (Kartennummer, Ablaufdatum oder CVV) machen, um einen Fehler zu generieren.

Website veröffentlichen

1. So verbessern Sie die Leistung Ihrer Website:

1. 1. Legen Sie in den SEO-Einstellungen die Parameter fest, die von Suchmaschinen und für die Seitenvorschau in sozialen Netzwerken verwendet werden sollen: Laden Sie ein Favicon hoch, geben Sie den Shoptitel und eine Beschreibung ein, und fügen Sie ein Vorschaubild hinzu.
   2. Konfigurieren Sie die Website-Lokalisierung.
   3. Nehmen Sie Änderungen an der Domain vor (optional). Navigieren Sie dafür zum Menüpunkt Storefronts > Websites, und klicken Sie bei der gewünschten Website auf Konfigurieren. Bearbeiten Sie im Abschnitt Domäne den Wert Xsolla-Domain oder richten Sie Ihre eigene Domain ein.

2. Wenn Sie alle erforderlichen Änderungen vorgenommen haben und Ihr Webshop startbereit ist, klicken Sie auf Veröffentlichen.

Erweiterte Shop-Einrichtung

Für Ihren Shop stehen Ihnen die folgenden erweiterten Funktionen zur Verfügung:

• Regionale Preise festlegen: Steigern Sie Ihren Umsatz, indem Sie für verschiedene Länder/Regionen unterschiedliche Preise festlegen.
• Werbekampagnen einrichten und durchführen: Mit Rabatten, Boni, Promocodes, zeitlich begrenzten Angeboten und anderen Werbeaktionen können Sie Ihren Umsatz ankurbeln.
• Steigern Sie die Loyalität und Bindung Ihrer Nutzer mit Funktionen wie täglichen Belohnungen, einem Belohnungssystem oder Angebotsketten. Diese Funktionen motivieren die Nutzer, regelmäßig im Spiel vorbeizuschauen, sich intensiver mit den Inhalten zu beschäftigen und Belohnungen zu sichern.
• Erstellen Sie personalisierte Angebote für bestimmte autorisierte Nutzer, z. B. ein Willkommens-Bundle für neue Nutzer.