Tag: gamification

How to build a tool to create story-based learning experiences? I am a developer and we are building up such a tool. I would like to write about the challenges and the steps on this road. But first, start with a story:

A friend of mine, Marcel, asked me to help him learn Viennese German. He speaks German already, but in Vienna people speak a certain dialect that is not always easy to understand. I realized that this is a real-world need, someone who can, needs and wants to learn something new. This is very valuable.

So, I’ve started the task – later it became a little challenge – to create an amazing learning experience for Marcel. He liked the story builder game, so I took this as a basis for the experience.

This game starts with a story and makes the student learn like an AI does: always just predict the next world. A big part of AI is just this skill, to predict the next word well. I believe actually that a certain part of the human intelligence is exactly this, predicting the next … . Our minds are preconditioned with the basis of this ability that gets developed during our childhood years. We as humankind can with the 2010s rise of the AI solutions also use these discoveries to understand ourselves better. Some interesting revelations:
– It is impossible to train neuron networks starting with null values. Entropy was, is and will be part of the journey. It is natural.
– To find global multidimensional mountaintops sometimes one needs to throw away the results of local mountaintops. (and waste many tens of thousands of dollars of calculations)

Planning

Anyway back to the story and my quest to create an amazing learning experience for Marcel. I started out with the following steps:

1. Create story
2. Create markup for the story builder game
3. Test
4. Make link available without signing in
5. Send link

Prompting

Creating the story was very easy: first prompt: “find German words typically used in Wien”.  Then after writing around 15 expressions ChatGPT offered me “Would you like some example dialogues or phrases using these? Or maybe you’re looking for a themed list (e.g., food, travel, emotions)?”

My second prompt: “yes, please make an example dialog using wien words in German, location in Wien city, playful, friendly, funny, B2 level” Marcel talks around C1-C2 level, but when we study new expressions we need to lower the level a bit to have more focus and energy for the new words. B2 level is more than enough for everyday conversations anyway.

LLM delivered this story (partially shown):

Markup Creation with Prompts

Now the markup creation started and this is where the challenge came: None of the LLMs I tried could deliver the markup with one prompt. I tried ChatGPT 4o, Grok 3 and Gemini 2.5 Pro.

I defined a simple markup language earlier, also assisted by an LLM. Now me and all my LLMs had just to fill this markup text, but it proved to be too difficult for them.

The beginning of the prompt was like this:
“GENERATE MARKUP TEXT FOR LANGUAGE LEARNING INTERACTION

We design a language learning interaction. I need a markup language for the following story builder game for language learning. In the markup language the full story is also stored, but for each word starting from the 10. word a choice of words is also stored. This choice of words has a choice of three different words. Only one word is correct grammatically that is marked with correct=true. All other words are clearly not correct. The user has to choose the correct word to continue.”

ChatGPT 4o gave choices where multiple words were correct. Grok 3 was glitchy a few times (citing technical errors), then gave very good word choices and remarks (see below) until word choice 12, then it simply stopped with saying “the pattern continues”. Gemini 2.5 gave mostly good choices with around 10-20% where there were multiple correct answers (what is an error in this case).

Finally I’ve used the Gemini Pro 2.5 version, it was at least a complete answer. It seems for such a story game generation multiple structured calls are needed, a kind of AI calling logic (or AI).

I’ve sent Marcel the link that worked and he was happy about the story. He found it funny and suggested some improvements like making animations faster, include translations or definitions, saving certain expresions. He is also a developer, he advised using the effort-impact matrix for the backlog.

Conclusions

Conclusions I have about this development:

1. Coding changed to “vibe coding”. Now I am at a place where most of the code is generated and checked by me, I do not need to write it directly. This did not come automatically though: to get to this point, I had to:
   1. Select the best architecture(next.js)
   1. Select the best authorization library and use it
   1. Define application folder structure
   1. Design and create database tables
   1. Design and create root components and routines
2. Next.js, Vercel.com and Cursor.ai combine well
3. We need tools not only to call AI in an automatically multiple times, but to check and correct the results in a comfortable and easy way
4. I believe human developers and architects will be always needed. Humans are better in agency, in the ability to get things done no matter what.

The author of this article, Zsolt Balai 1977 is a developer working on this „learning experience designer” now to create amazing gamified learning experiences. He is interested in language learning and teaching and believes that real spoken languages were, are and will be important in every age. He did use AI to create some pictures, but did not use any AI for the text of this article. This is why it is awkward sometimes, but at least real and authentic.