---
title: "Créez une histoire pour navigateur avec Twine et SugarCube"
description: "Créez une petite histoire SugarCube avec un choix mémorisé, deux fins et une méthode pratique pour publier du HTML et tester les sauvegardes."
language: fr
canonical: https://bestadultgames.io/fr/developers/guides/first-twine-game
---

[Vue d’ensemble](https://bestadultgames.io/fr/developers.md) [Commencez ici](https://bestadultgames.io/fr/developers/start.md) [Outils](https://bestadultgames.io/fr/developers/tools.md) [Modèles d’IA](https://bestadultgames.io/fr/developers/models.md) [Guides](https://bestadultgames.io/fr/developers/guides.md) [Civitai & LoRA](https://bestadultgames.io/fr/developers/lora.md) [Publication](https://bestadultgames.io/fr/developers/publishing.md) [Modèles de documents](https://bestadultgames.io/fr/developers/templates.md)

[Développeurs](https://bestadultgames.io/fr/developers.md) / [Guides](https://bestadultgames.io/fr/developers/guides.md) / Moteurs

Débutant · S priorité de lecture

# Créez une histoire pour navigateur avec Twine et SugarCube

Créez une petite histoire SugarCube avec un choix mémorisé, deux fins et une méthode pratique pour publier du HTML et tester les sauvegardes.

Best Adult Games · 4 min de lecture · Sources vérifiées le 5 octobre 2026 · D’après la documentation publiée

![Schéma de flux allant de la conception du jeu au moteur, puis à la version jouable, avec la conception du jeu mise en évidence.](https://bestadultgames.io/images/localized/fr/developer-guides/first-twine-game-intro-1.svg)

*Une seule décision mémorisée donne à une petite histoire une conséquence que les joueurs peuvent tester. Best Adult Games · schéma original*

Un choix compte quand l’histoire s’en souvient. Ce projet pour débutants suit deux collaborateurs adultes qui décident comment ouvrir un studio, avec un petit graphe de passages, une décision enregistrée et deux fins. Il nécessite très peu d’illustrations. Votre première tâche consiste à faire en sorte que chaque choix mène au résultat prévu, puis que ce résultat soit conservé après une sauvegarde et un rechargement.

Le téléchargement contient le code source Twee pour SugarCube. Compilez-le en HTML jouable avec Tweego et un format d’histoire SugarCube installé, ou recréez les passages de l’histoire à la main dans Twine. L’exemple n’a pas été exécuté ici dans un environnement Twine : effectuez donc les tests ci-dessous avant de le publier.

## Choisissez d’abord le format

![Schéma de flux allant des besoins de l’histoire au format d’histoire, puis à la version de test, avec le format d’histoire mis en évidence.](https://bestadultgames.io/images/localized/fr/developer-guides/first-twine-game-section-1-1.svg)

*Sélectionnez SugarCube avant de copier les macros de l’exemple. Best Adult Games · schéma original*

Créez une histoire dans Twine, sélectionnez SugarCube 2 comme format d’histoire et notez la version utilisée. Gardez sa documentation officielle à portée de main pour les macros, les variables et les sauvegardes. Les exemples Harlowe utilisent une syntaxe différente ; les copier directement dans SugarCube est un moyen rapide de transformer une scène simple en séance de débogage.

Dans le code source téléchargé, les lignes commençant par :: introduisent des passages. StoryTitle et StoryData contiennent les informations de configuration. Dans l’éditeur de Twine, définissez le titre de l’histoire et le format SugarCube, puis créez StoryInit et les six passages de l’histoire en respectant exactement leurs noms. Copiez le contenu de chacun sans son en-tête :: et sélectionnez Start comme passage de départ. Un fichier .twee est un code source modifiable ; publiez du HTML pour les joueurs.

## Construisez le graphe des passages

![Schéma de flux allant du passage au choix, puis au passage suivant, avec le passage suivant mis en évidence.](https://bestadultgames.io/images/localized/fr/developer-guides/first-twine-game-section-2-1.svg)

*Vérifiez le nom de la destination aussi soigneusement que le libellé visible du choix. Best Adult Games · schéma original*

L’exemple initialise $sharedPlan à false. Start propose deux réponses : SharedPlan lui attribue la valeur true, tandis que SeparatePlan lui attribue la valeur false. Les deux mènent à Discussion, qui vérifie la valeur et affiche le lien vers SharedEnding ou IndependentEnding. Voilà tout le graphe : une décision avec une conséquence visible.

Donnez aux passages des noms stables et distinctifs, puis vérifiez chaque destination dans le graphe visuel comme dans la version publiée. Un joli libellé de lien ne peut pas compenser une faute dans le nom de la destination. Séparez le nom interne du passage du texte que vous pourriez réécrire ou traduire, afin qu’un changement de formulation ne casse pas le parcours.

## Rendez les changements d’état prévisibles

![Schéma de flux allant de l’état à la transition, puis à la condition, avec l’état mis en évidence.](https://bestadultgames.io/images/localized/fr/developer-guides/first-twine-game-section-3-1.svg)

*$sharedPlan transmet la décision de la réponse à la fin. Best Adult Games · schéma original*

Utilisez une variable nommée pour une décision précise. Ici, $sharedPlan enregistre si le joueur a choisi un projet commun ; elle n’a pas à représenter tous les sentiments entre les personnages. Définissez-la au moment du choix et lisez-la là où la conséquence apparaît. Rendre ce lien évident facilite l’extension d’une petite histoire.

Vérifiez ce qui se passe lorsqu’un joueur revient sur un passage. Si son affichage ajoute un point, une nouvelle visite peut involontairement en attribuer un autre. Dans les projets plus importants, donnez aux événements uniques leurs propres règles et décidez si revenir en arrière dans l’historique de l’histoire doit annuler leurs effets. Testez aussi les rechargements, sans supposer qu’ils se comportent comme une première visite.

## Concevez une page lisible

![Schéma de flux allant du texte à la mise en page, puis à la saisie, avec la mise en page mise en évidence.](https://bestadultgames.io/images/localized/fr/developer-guides/first-twine-game-section-4-1.svg)

*Vérifiez la fluidité de la lecture et le focus des liens avant d’ajouter des arrière-plans décoratifs. Best Adult Games · schéma original*

Commencez avec l’interface par défaut du format d’histoire. Donnez au texte une largeur de lecture confortable, utilisez une police lisible et rendez bien visible le focus clavier sur les liens. Vérifiez les paragraphes et les choix sur un écran étroit. Une surcouche décorative n’est pas d’un grand secours si le joueur ne trouve pas la ligne suivante ; n’ajoutez des arrière-plans élaborés qu’une fois la lecture fluide.

Faites en sorte que les paramètres et les commandes de redémarrage et de sauvegarde soient faciles à trouver. Ne vous fiez pas uniquement à la couleur pour signaler les liens disponibles ou un état important, afin que la page reste compréhensible si un indice coloré passe inaperçu. Si vous ajoutez du son ou du mouvement, prévoyez des commandes et commencez discrètement. Laissez les joueurs choisir quand la bande-son ou l’animation entre en scène.

## Publiez et testez la persistance

![Schéma de flux allant de la publication à la sauvegarde, puis au rechargement, avec le rechargement mis en évidence.](https://bestadultgames.io/images/localized/fr/developer-guides/first-twine-game-section-5-1.svg)

*Un test de sauvegarde doit porter sur la page hébergée comme sur la version locale. Best Adult Games · schéma original*

Publiez avec Twine, ou compilez le code source en HTML avec le format SugarCube sélectionné, puis servez ce fichier depuis l’hébergement prévu. Testez-le dans le navigateur et à l’origine du site que les joueurs utiliseront. Le stockage du navigateur dépend de son contexte : une sauvegarde locale réussie ne suffit donc pas à établir le comportement de la version hébergée.

Sauvegardez avant la décision, puis après. Fermez la page, rouvrez-la et chargez chaque sauvegarde en vérifiant que le choix mémorisé et la fin disponible sont corrects. Répétez le test dans un nouveau profil de navigateur, en y créant de nouvelles sauvegardes. Vérifiez séparément la navigation privée, l’effacement du stockage et la diffusion intégrée dans une autre page. Décrivez les limites constatées ; les paramètres du navigateur et le comportement de l’hébergement peuvent empêcher les sauvegardes de persister.

## Préparez les futures mises à jour

![Schéma de flux allant de la version à la migration, puis au test de mise à jour, avec la version mise en évidence.](https://bestadultgames.io/images/localized/fr/developer-guides/first-twine-game-section-6-1.svg)

*Les versions archivées et les sauvegardes représentatives vous permettent de vérifier ce qu’une mise à jour modifie. Best Adult Games · schéma original*

Conservez le code source modifiable sous contrôle de version et archivez chaque version HTML publiée. Consignez la version de SugarCube et les modifications des passages, et conservez des fichiers de sauvegarde représentatifs afin de pouvoir comparer une mise à jour à la version précédente. Décidez si les mises à jour prendront en charge les sauvegardes existantes. Si les joueurs doivent recommencer, expliquez cette obligation avant qu’ils ne chargent la nouvelle version.

Jouez chaque fin depuis un nouveau départ et vérifiez tous les liens au clavier et, si nécessaire, avec des commandes tactiles. Utilisez la matrice de test des parcours pour consigner les résultats attendus et réels. Vous pouvez passer à la suite lorsque l’histoire se lit clairement, que son état se comporte de façon prévisible et que vous pouvez reproduire le processus de publication. Consultez le guide des parcours et des états avant de construire un vaste réseau de branches.

## Décisions clés

- Sélectionnez SugarCube 2 avant d’écrire des macros SugarCube.
- Conservez le code source Twee ; publiez du HTML jouable.
- Testez les visites répétées, les sauvegardes et les rechargements sur l’hébergement prévu.
- Gardez des noms de passages stables et archivez les versions publiées.

## Fichiers du guide

[Exemple Twee pour SugarCube](https://bestadultgames.io/developers/templates/studio-sample.twee) [Matrice de test des parcours](https://bestadultgames.io/developers/templates/test-matrix.csv)

Les communautés externes consacrées aux modèles et les sites de publication externes peuvent contenir du contenu explicite. Les liens vers les sources s’ouvrent dans un nouvel onglet ; ce guide ne charge pas leurs aperçus.

### Sources et lectures complémentaires

- [Twine](https://twinery.org/)
- [Twine Cookbook](https://twinery.org/cookbook/)
- [Code source et documentation officiels de SugarCube](https://github.com/tmedwards/sugarcube-2)
- [Compilateur Tweego](https://www.motoslave.net/tweego/)

Dernière vérification 5 octobre 2026.

## Dans ce guide

1. [Choisissez d’abord le format](https://bestadultgames.io/fr/developers/guides/first-twine-game#section-1)
2. [Construisez le graphe des passages](https://bestadultgames.io/fr/developers/guides/first-twine-game#section-2)
3. [Rendez les changements d’état prévisibles](https://bestadultgames.io/fr/developers/guides/first-twine-game#section-3)
4. [Concevez une page lisible](https://bestadultgames.io/fr/developers/guides/first-twine-game#section-4)
5. [Publiez et testez la persistance](https://bestadultgames.io/fr/developers/guides/first-twine-game#section-5)
6. [Préparez les futures mises à jour](https://bestadultgames.io/fr/developers/guides/first-twine-game#section-6)

## Outils et modèles associés

- [Twine](https://bestadultgames.io/fr/developers/tools?q=Twine)

[Modèles de production](https://bestadultgames.io/fr/developers/templates.md)

## Guides connexes

Moteurs · Débutant · 3 min de lecture

### [Choisissez un moteur en fonction du jeu que vous créez](https://bestadultgames.io/fr/developers/guides/engine-comparison.md)

Choisissez entre Ren'Py, Twine, Godot, RPG Maker MZ, Unity et Unreal en testant les tâches dont votre jeu a réellement besoin.

Lire le guide → S priorité de lecture

Moteurs · Débutant · 4 min de lecture

### [Créez une première histoire Ren'Py avec deux fins](https://bestadultgames.io/fr/developers/guides/first-renpy-game.md)

Apprenez à gérer les dialogues, les choix, l’état, les sauvegardes et les vérifications avant publication avec une petite histoire Ren'Py sans contenu explicite.

Lire le guide → S priorité de lecture

Moteurs · Avancé · 3 min de lecture

### [Définir le périmètre d’un jeu 3D en temps réel et l’évaluer](https://bestadultgames.io/fr/developers/guides/realtime-3d.md)

Comparez Godot, Unity et Unreal à l’aide d’une scène jouable, d’une boucle d’interaction et d’un budget de performance pour votre appareil cible.

Lire le guide → B priorité de lecture
