Episode engine with LLM-driven characters lets Mastory ship new learning stories faster

Context

Erbis enhanced an educational application that teaches mathematics through gameplay. The project details, the technologies used and the challenges the team faced are outlined below.

Challenge

Mastory is a story-based game that places learners in varied scenarios and prompts them to think deeply.

The client asked us to implement a system that lets content managers write episodes for the educational app in a standard JSON format and in a custom Flow language.

Our team had to make sure content managers could switch between JSON and Flow language without losing narrative coherence. The challenge was more than technical: it also meant designing an intuitive interface for efficient content management.

Pre-development

We studied the project documentation and interviewed the client to understand the goals and objectives. We also studied the target market to understand the value proposition of alternative educational apps.

With the scope defined, we assigned two JavaScript engineers. Once the technology stack and deadlines were set, development began.

Solution

We followed classic Scrum: planning tasks for two weeks and reporting on completed work at the end of each sprint. The client took an active part, contributing suggestions and proposals, and transparent communication made it easy to reach consensus.

Over the year-long project we:

• Implemented the application on the Nuxt 3 framework, using the Hasura automated GraphQL API service over a PostgreSQL database
• Transformed the written episodes into a finite state machine based on the XState library
• Enabled communication with characters through text-to-speech (TTS)
• Used ChatGPT to handle user inputs
• Added a dynamic coordinate axis and 3D scenes with the Babylon.js library to render the challenges inside episodes

End product

The solution is a complete system that lets content managers create game episodes.

Each episode has base features: communication with characters, video stories, achievement review and more. Communication with characters can be enabled per episode; using AI, characters understand what learners say and respond according to context.

Beyond the base features, each episode has its own unique challenge that makes the experience distinctive.

Architecture and tech stack

A Nuxt 3 and TypeScript front end talks to a Hasura GraphQL API over PostgreSQL. Episodes authored in JSON or Flow compile to XState state machines that drive the story; ChatGPT interprets learner input for character dialogue, TTS voices the characters, and Babylon.js renders the coordinate axis and 3D challenge scenes. Auth0 handles authentication and the platform runs on Google Cloud.

• Nuxt 3 and TypeScript
• XState
• Hasura GraphQL and PostgreSQL
• Babylon.js and Cortex.js
• ChatGPT and text-to-speech
• Auth0
• Google Cloud

Results

The content-management system enabled rapid development of new plotlines and stories for Mastory and streamlined content creation, allowing a more dynamic and diverse narrative.

Mastory’s users now enjoy a richer experience, which supports retention and satisfaction. The enhancement has raised the app’s appeal and contributed to growth in the customer base.

What made it work

Erbis’s takeaways from this engagement:

• Put the story in a state machine. Compiling episodes to XState is what keeps LLM-driven dialogue inside a coherent narrative rather than wandering off it.
• Give authors two doors to the same model. Supporting both JSON and a domain-specific Flow language let technical and non-technical content managers work in the same system.
• Treat the LLM as an input interpreter, not the author. ChatGPT handles what the learner says; the episode logic decides what happens next.
• Two engineers, one year, one product. A small senior team with a clear scope shipped an engine, not just features.