Utilisez un modèle F2P

Présentation

Ce cas d’utilisation et les outils prêts à l’emploi de Xsolla permettent la monétisation de jeux free-to-play (F2P) via votre propre magasin en ligne. Celui-ci vous permet de vendre des objets virtuels, de la monnaie virtuelle et des lots sur un site externe, que votre jeu soit destiné au PC, aux consoles ou qu’il soit multiplateforme.

Fonctionnalités principales :

• Interface de paiement flexible et sécurisée de Xsolla, compatible avec plus de 1 000 modes de paiement dans le monde entier.
• Interface utilisateur de magasin facilement personnalisable grâce au constructeur de site, sans besoin de développement à partir de zéro.
• Contrôle total sur le catalogue des objets, les prix et les promotions.
• Large gamme d’outils LiveOps, comme les promotions par réduction, les upsells, et les systèmes de récompenses.

Ce guide décrit la configuration rapide et le lancement d’un magasin en ligne pour un jeu F2P à l’aide des outils Xsolla.

Qui peut l'utiliser

Ce cas d’utilisation est idéal pour vous si vous :

• développez ou publiez des jeux pour PC, consoles ou des jeux multiplateformes ;
• souhaitez vendre de la monnaie et des objets virtuels via votre propre site web ;
• cherchez à économiser sur les frais de plateforme ;
• souhaitez un contrôle total sur le marketing, l’entonnoir de vente et les données utilisateur.

Comment configurer

1. Créez un projet dans le Compte éditeur.
2. Créez un catalogue des objets.
3. Créez un site.
4. Configurez les principaux blocs.
5. Configurez l’authentification utilisateur.
6. Configurez les webhooks pour octroyer les achats à l’utilisateur.
7. Testez le site
8. Publiez le site.

Créer un catalogue des objets

Pour créer un catalogue, vous pouvez :

• ajouter des objets manuellement dans le Compte éditeur
• appeler des méthodes API
• importer un catalogue des objets à partir d’un fichier JSON

Pour ajouter un objet virtuel avec des paramètres de base au catalogue :

1. Ouvrez le projet dans le Compte éditeur et accédez à la section Items catalog > Virtual items.
2. Dans le menu déroulant, sélectionnez Create item.

3. Configurez les paramètres de base de l'objet dans les champs suivants :
   • Image (facultatif) ;
   • SKU (ID unique de l'objet) ;
   • Item name ;
   • Description (facultatif).

4. Spécifiez le prix de l'objet :
   1. Réglez la bascule Price in real currency sur On.
   2. Dans le champ Default currency, modifiez la devise (facultatif) et spécifiez le prix de l'objet.
   3. Si vous avez changé la devise dans le champ Default currency, sélectionnez la même devise dans le champ Price in real currency.

5. Changez le statut de l'objet en Available.

6. Cliquez sur Create item.

Créer un site

1. Ouvrez votre projet dans le Compte éditeur.
2. Sur la page principale du projet, cliquez sur Change focus et sélectionnez Sell virtual goods in-game or online.

3. À l’étape Optional: Set up a web storefront, cliquez sur Create template.

4. Sur l’onglet Express, ajoutez un lien vers la plateforme où votre jeu est disponible : Steam ou Epic Games Store. Vous pourrez ainsi créer un site personnalisé pour votre jeu en un clin d’œil : l’image du jeu, le titre, le nom du développeur et la palette de couleurs sont automatiquement ajoutés lors de la création du site.

5. Cliquez sur Generate web store.
6. Cliquez sur Continue to set up.

Configurer les principaux blocs

1. Sur la page principale du projet, dans la section Sell virtual goods in-game or online, accédez à l’étape Optional: Set up a web storefront, puis cliquez sur Customize site. Vous serez redirigé vers le constructeur, où vous pourrez personnaliser le site créé.

Note

Si vous avez fermé la page principale du projet, accédez à la section Storefronts > Websites, puis cliquez sur Open Site Builder dans le volet du site créé. Pour le retrouver, vous pouvez vérifier l’heure de création affichée dans ce volet.

2. Configurez le bloc Header où s’affichent les informations utilisateur et les éléments de navigation du site :
   • Ajoutez un logo de votre jeu ou studio ;
   • Modifiez les boutons prédéfinis si nécessaire.

Exemple de bloc d’en-tête :

3. Configurez le bloc Lead, où s’affichent les principales informations sur votre magasin :
   • Ajoutez un nom de magasin, une description et une image d’arrière-plan si vous ne souhaitez pas utiliser les images téléchargées automatiquement ;
   • Ajoutez des balises ;
   • Indiquez les plateformes sur lesquelles le jeu est disponible ;
   • Modifiez les boutons par défaut ou ajoutez-en de nouveaux si nécessaire.

4. Configurez le bloc Battle pass qui affiche une offre en vedette :
   • Modifiez l’arrière-plan personnalisé de la carte ;
   • Ajoutez un nom et une description de l’offre ;
   • Configurez le bouton d’achat : sélectionnez l’objet à vendre et, si nécessaire, personnalisez le style du bouton.

Exemple de bloc de passe de combat :

5. Configurez le bloc Store, où s’affichent les objets virtuels, les lots et les packages de monnaie virtuelle disponibles à l’achat :
   • Si nécessaire, supprimez les sections ajoutées automatiquement ou ajoutez-en de nouvelles ;
   • Dans le bloc de la section concernée, sélectionnez le type d’objet et le groupe dans la liste déroulante pour les afficher sur la page.

Avis

Si le type d’objet et le groupe sélectionnés n’apparaissent pas dans le constructeur, assurez-vous que les groupes d’objets requis et les packages de monnaie virtuelle ont le statut Enabled, c’est-à-dire qu’ils sont disponibles pour affichage dans le magasin, et qu’ils contiennent des objets. Pour vérifier ou modifier le statut des objets, accédez à Items catalog et ouvrez la section correspondant au type d’objet souhaité.

Exemple de bloc de magasin :

6. Configurez le bloc Footer qui contient les informations légales et les paramètres de confidentialité. Vous pouvez :
   • Choisir une disposition : colonnes ou lignes ;
   • Ajouter un arrière-plan personnalisé ;
   • Ajouter des liens vers les réseaux sociaux ;
   • Ajouter des restrictions d’âge.

Exemple de bloc de pied de page :

7. Accédez à la section Cart settings pour configurer des fonctions supplémentaires. Activez les cases à cocher correspondantes :
   • Show promo code field — permet aux utilisateurs d’appliquer un code promo ou un coupon dans l’interface du panier ;
   • Login before shopping cart — affiche la fenêtre de connexion lors de l’accès au panier si l’utilisateur n’est pas autorisé.
8. Si nécessaire, ajoutez des pages supplémentaires à votre magasin, par exemple pour présenter les dernières nouveautés en matière de jeux. Pour ce faire :

1. 1. Ajoutez les pages nécessaires en suivant les instructions.
   2. Dans le bloc où vous souhaitez lier une page, par exemple, Header :
      1. ajoutez un nouveau bouton ou modifier un bouton existant,
      2. dans la section des paramètres du bouton, choisissez une action de clic : Open page,
      3. dans la liste déroulante, sélectionnez la page à ouvrir après le clic sur le bouton.

Configurer l'authentification utilisateur

L’authentification permet aux utilisateurs d’acheter des objets dans le magasin et de voir des offres personnalisées dans le catalogue. En configurant l’authentification via Xsolla Login, vous offrez aux utilisateurs un large choix de méthodes d’autorisation : via les réseaux sociaux, par codes ou liens à usage unique, ou par nom d’utilisateur et mot de passe. Vous pouvez aussi personnaliser le widget Xsolla Login et définir des restrictions d’âge pour l’authentification.

Pour configurer l’authentification utilisateur via Xsolla Login :

1. Ouvrez le projet dans le Compte éditeur et accédez à la section Storefronts > Websites.
2. Cliquez sur Open Site Builder dans le volet du site souhaité.
3. Dans le constructeur, accédez au bloc Login settings.
4. Choisissez Xsolla Login.
5. Dans la liste déroulante, sélectionnez New Login. Un projet de Login avec authentification par e-mail et mot de passe sera automatiquement créé. Pour configurer une autre méthode de connexion, suivez les instructions.

6. Connectez le stockage des données utilisateur. Selon l’option choisie, différentes fonctionnalités seront disponibles (voir la section Comparaison des options de stockage des données utilisateur).

Octroyer l'achat à l'utilisateur

Implémentez l’octroi d’achats à l’utilisateur dans votre application en utilisant les informations sur la transaction et sur les objets achetés reçus dans les webhooks de Xsolla. Si vous vous êtes inscrit au Compte éditeur après le 22 janvier 2025, pour assurer le fonctionnement complet du magasin et la gestion des paiements, implémentez le traitement des webhooks suivants :

Tester le site en mode bac à sable

Pour tester le site, utilisez le mode bac à sable :

1. Ouvrez le projet dans le Compte éditeur et accédez à la section Storefronts > Websites.
2. Cliquez sur Open Site Builder dans le volet du site souhaité.
3. Cliquez sur Preview.

4. Sélectionnez un objet et cliquez sur le bouton d’achat.
5. Choisissez le groupe de modes de paiement Card.
6. Entrez les informations de la carte bancaire de test. Entrez des valeurs aléatoires dans les champs restants. Vous pouvez également indiquer des informations incorrectes (numéro de carte, date d’expiration ou CVV) afin de générer une erreur.

Publier le site

1. Pour améliorer les performances de votre site :

1. 1. Dans le bloc SEO Settings, définissez les paramètres qui seront utilisés par les moteurs de recherche, ainsi que ceux destinés à la prévisualisation des pages sur les réseaux sociaux : téléchargez une favicône, indiquez le titre et la description du magasin et ajoutez une image de prévisualisation ;
   2. Configurez la localisation du site ;
   3. Modifiez le domaine (facultatif). Pour ce faire, accédez à la section Storefronts > Websites et cliquez sur Configure dans le volet du site. Dans la section Domain, modifiez la valeur Xsolla domain ou créez votre propre domaine.

2. Après avoir effectué toutes les modifications nécessaires et préparé le magasin en ligne pour le lancement, cliquez sur Publish.

Configuration étendue du magasin

Profitez des fonctionnalités étendues suivantes pour votre magasin :

• Configuration des prix régionaux. Augmentez vos ventes en configurant différentes réglementations de prix par région.
• Configuration et lancement de campagnes promotionnelles. Augmentez vos ventes grâce à des remises, des bonus, des codes promo, des offres à durée limitée et d’autres promotions.
• Stimulez la fidélité et la rétention des utilisateurs grâce à des fonctionnalités telles que les récompenses quotidiennes, un système de récompenses ou des chaînes d’offres. Ces outils incitent les joueurs à revenir régulièrement, à s’impliquer davantage dans le contenu et à obtenir des récompenses.
• Proposez des offres personnalisées pour certains utilisateurs autorisés, par exemple une offre de bienvenue pour les nouveaux utilisateurs.