Important
Le code du projet est aussi hébergé sur mon instance GitLab personnalisée, accessible à cette adresse. Le dépôt GitHub est un miroir du dépôt GitLab, mis à jour automatiquement.
Les contributions publiques restent sur GitHub et sont les bienvenues ; les pull requests validées y seront ensuite transférées manuellement sur GitLab pour être intégrées. 🙂
Après avoir réalisé un site Internet servant de page d'accueil vers mes différents projets et réseaux sociaux, appelé Terminal Homepage, j'ai souhaité concrétiser un projet plus ambitieux, qui allait nécessiter une bonne part de réflexion et de temps de développement. Avec l'avènement de l'intelligence artificielle, j'ai enfin eu l'opportunité de le créer à mon goût, avec un temps de développement bien plus réduit que ce que j'avais estimé si je l'avais fait seul. Je vous présente Terminal Stories. ❤️
Terminal Stories, qu'est-ce que c'est ? C'est un lecteur d'histoires interactives qui reprend les codes et l'esthétique des terminaux informatiques d'une époque passée. Il vous permet de lire, découvrir et interagir avec des histoires, des récits et des textes de fiction. Ces histoires peuvent être préenregistrées, mais aussi générées entièrement à la volée par une intelligence artificielle. 🧠
En plus de leurs fonctionnalités de choix et d'interaction, les histoires interactives s'accompagnent de plusieurs autres fonctionnalités : la sauvegarde et la reprise des histoires en cours, ainsi que l'accès à une encyclopédie de l'univers, des personnages et des lieux. Le tout est bien sûr gratuit et collaboratif : vos propres histoires peuvent être soumises pour être intégrées au site en ouvrant un ticket sur le dépôt GitHub. 😉
Concernant la partie technique, le site respecte des valeurs de sobriété numérique, d'accessibilité et de respect de la vie privée. Construit une fois puis hébergé statiquement sur GitLab Pages, il limite ainsi son empreinte carbone. Il s'appuie sur des technologies Web modernes telles que SvelteKit ❤️🔥, Vite, TailwindCSS et TypeScript, et ne contient ni cookies, ni publicité. Aucune technologie de suivi n'est utilisée par défaut ; le site peut toutefois activer, optionnellement, une mesure d'audience via Umami (si activé), une alternative open source et respectueuse de la vie privée à Google Analytics : sans cookies, sans collecte de données personnelles identifiables, et conforme au RGPD. Il est entièrement accessible à tous, sans restriction. Sur le plan de l'accessibilité, le site est complètement navigable au clavier, compatible avec les lecteurs d'écran, et un effort particulier a été porté sur la navigation depuis les appareils mobiles. 🌱
sequenceDiagram
actor Joueur
participant Terminal
participant Histoire
participant Succès
participant Encyclopédie
participant IA as Histoire générée par IA
Joueur->>Terminal: J'ouvre le terminal
Terminal-->>Joueur: Séquence de démarrage puis menu
Joueur->>Terminal: Je choisis une histoire
Terminal->>Histoire: Lance la lecture
Histoire-->>Joueur: Affiche la scène (effet machine à écrire)
Histoire-->>Joueur: Une musique d'ambiance s'installe (si le son est activé)
loop À chaque scène
Joueur->>Histoire: Je fais un choix
Histoire-->>Joueur: La suite de l'aventure
end
Histoire->>Succès: J'atteins une fin
Succès-->>Joueur: Déblocage éventuel d'un succès
Joueur->>Succès: Je consulte mes succès
Succès-->>Joueur: Débloqués, verrouillés et succès secrets
Joueur->>Encyclopédie: Je consulte le wiki (univers, personnages, lieux)
Encyclopédie-->>Joueur: Détails sur l'univers
Joueur->>IA: Je demande une histoire inédite
IA-->>Joueur: Une aventure générée rien que pour moi
Warning
Le déploiement en environnement de production nécessite un serveur Web déjà configuré comme Nginx, Apache ou Caddy pour servir les fichiers statiques générés par Vite.
- Installer Node.js LTS (>22 ou plus) ;
- Installer les dépendances du projet avec la commande
npm install; - Démarrer le serveur local Vite avec la commande
npm run dev.
- Installer Node.js LTS (>22 ou plus) ;
- Installer les dépendances du projet avec la commande
npm install; - Compiler les fichiers statiques du site Internet avec la commande
npm run build; - Utiliser un serveur Web pour servir les fichiers statiques générés à l'étape précédente.
Important
The project's code is also hosted on my custom GitLab instance, available at this address. The GitHub repository is a mirror of the GitLab repository, automatically kept up to date.
Public contributions remain on GitHub and are welcome; validated pull requests will then be manually transferred to GitLab to be integrated. 🙂
After creating a website called Terminal Homepage, which serves as a home page for my personal projects and social media accounts. I decided to take on a more ambitious project—one that would require a lot of thinking and development time. But with the rise of artificial intelligence, I finally had the opportunity to create it exactly as I wanted, with a much shorter development time than I would have needed if I'd done it alone. Introducing Terminal Stories. ❤️
What is Terminal Stories? It's an interactive story reader based on the design and aesthetics of computer terminals from a past era. It lets you read, discover, and interact with stories, narratives, and works of fiction. These stories can be pre-recorded, but they can also be generated entirely on the fly by artificial intelligence. 🧠
As well as their choice-and-interaction features, the interactive stories come with several other features: you can save and resume stories in progress, and access an encyclopedia of the universe, characters, and locations. It's all free and collaborative, of course: you can submit your own stories to be added to the website by opening a ticket on the GitHub repository. 😉
In terms of technical aspects, the website reflects values of digital sobriety, accessibility, and respect for privacy. Built once and then statically hosted on GitLab Pages, it minimizes its carbon footprint. It relies on modern web technologies such as SvelteKit ❤️🔥, Vite, TailwindCSS, and TypeScript, and contains no cookies or advertisements. No tracking technology is used by default; the site can optionally enable audience measurement through Umami (if enabled), an open-source, privacy-friendly alternative to Google Analytics: no cookies, no collection of personally identifiable data, and GDPR-compliant. It is fully accessible to everyone, without restriction. From an accessibility perspective, the website is fully keyboard-navigable, compatible with screen readers, and special attention has been given to navigation on mobile devices. 🌱
sequenceDiagram
actor Player as Player
participant Terminal as Terminal
participant Story as Story
participant Achievements as Achievements
participant Encyclopedia as Encyclopedia
participant AI as AI-generated story
Player->>Terminal: I open the terminal
Terminal-->>Player: Boot sequence then menu
Player->>Terminal: I pick a story
Terminal->>Story: Starts the playback
Story-->>Player: Displays the scene (with typewriter effect)
Story-->>Player: Ambient music sets the mood (when sound is on)
loop On every scene
Player->>Story: I make a choice
Story-->>Player: The next part of the adventure
end
Story->>Achievements: I reach an ending
Achievements-->>Player: A new achievement may unlock
Player->>Achievements: I check my achievements
Achievements-->>Player: Unlocked, locked and secret ones
Player->>Encyclopedia: I browse the wiki (universe, characters, locations)
Encyclopedia-->>Player: Details about the universe
Player->>AI: I request a brand-new story
AI-->>Player: An adventure generated just for me
Warning
Deployment in a production environment requires a pre-configured web server such as Nginx, Apache, or Caddy to serve the static files generated by Vite.
- Install Node.js LTS (>22 or higher) ;
- Install project dependencies using
npm install; - Start Vite local server using
npm run dev.
- Install Node.js LTS (>22 or higher) ;
- Install project dependencies using
npm install; - Build static website files using
npm run build; - Remove development dependencies using
npm prune --omit=dev; - Use a web server to serve the static files generated in the previous step.
