Codebreaker

Educational game about Alan Turing - Mathematician, cryptanalyst and computer scientist

The image shows a scene from the learning game. A female character stands on the right side. In the blurred background, her office is visible. Next to her is a speech bubble with text.

As part of an initiative to introduce young people to the subject of artificial intelligence, we decided to tell the story of Alan Turing. He is widely considered to be the father of theoretical computer science and artificial intelligence. During WW2 he focused on deciphering the Enigma, a cipher machine used by the Nazis to encrypt radio messages.

Client/Setting

Uni project

Role

Research, Ideation, Concept, UX, UI, Illustration

Tools

Figma, Adobe Illustrator, Protopie

Team

Michael Mack, Jonas Pflug, Katja Rößler

Concept summary

By scrolling, users are taken on an exciting journey through the life of Alan Turing. Due to the young target group and the complexity of the topic, gamification is used deliver information in a playful way. It is set in the context of World War II and puts the viewers in the role of Alan Turing. The goal is to understand how the Enigma works and to learn about the life of the famous cryptanalyst.

The image shows an illustration. A hand holding a computer mouse is visible. In front of the hand is a computer screen. On the screen, three sections are displayed: Intro, Main, and End. It shows the structure of the learning game. A downward arrow symbolizes the user’s scrolling behavior.

Intro

To gain the users attention and make them feel as if they are part of the action, a delicate situation initiates the game: British supply ships are threatened by the Germans. Only with the help of Turing, the Enigma can be cracked to decipher the encrypted radio messages and locate the enemy submarines.

Characters

Different characters appear in the course of the story. They give the application a more personal and game-like touch and at the same time provide users with tasks or hints.

More information

In order to not overwhelm users with too much information, texts are only displayed in small amounts by scrolling. Additional info is shown by "pulling the rope" at the top of the screen. To match the time in which the narrative takes place, pop-ups appear in the form of projection screens.

Chapters

The structure of the application is divided into several chapters, starting with a short intro and tutorial to prepare the players to crack the Enigma in the upcoming mini games. It is followed by an educational chapter that illustrates the importance of earlier achievements for todays computer science and ends with the tragic story behind Alan Turings death.

Mini games

The integration of playful elements is intended to increase user motivation and facilitate the learning process. Complex topics are broken down into less complex and more accessible information. The games are not designed to be very challenging, but more importantly to train the user.

Rewards

To make the game-like experience complete, we implemented rewards. These medals can be collected after each completed chapter to eventually become the "Hero of Bletchley Park". The number of medals is not determined by the performance of the users. They are rather designed to motivate.

Outro

The educational game ends with the decoding of the enigma, resulting in the rescue of the british supply ships. The allusion to HAL 9000 from "A Space Odyssey" pays tribute to the importance of Turing's work for todays artificial intelligence.

You have reached the end

But there is plenty more to see.

Previous work