Algorithmic matter — using serious game to understand the algorithms we encounter everyday

Algorithmic matter — using serious game to understand the algorithms we encounter everyday

games
digital
ux
information

Every day we let algorithms take decisions on our behalf. Back in 2015, I wanted to show how some of these algorithms work to non-specialist audience. So I created Alma (short for Algorithmic matter).

Alma is a kit of 3 serious games designed to help us understand Facebook Newsfeed, Google PageRank and Siri's algorithms. Alma lets us play with the algorithms using physical tokens and digital interfaces.

Alma is about learning by playing.

Every day we let algorithms take decisions on our behalf. Back in 2015, I wanted to show how some of these algorithms work to non-specialist audience. So I created Alma (short for Algorithmic matter).

Alma is a kit of 3 serious games designed to help us understand Facebook Newsfeed, Google PageRank and Siri's algorithms. Alma lets us play with the algorithms using physical tokens and digital interfaces.

Alma is about learning by playing.

Process

Process

Learning by playing

Learning by playing

To have a better understanding of algorithms I encounter everyday, I started gathering documentation about Google PageRank’s algorithm, Facebook Newsfeed’s algorithm, Twitter's algorithm and others. I realized they were sharing basic building blocks that, once explained, could really help understand these algorithms. Let's take sorting algorithms: they are everywhere and understanding the way they sort numbers is a good start to understand more complex ones.

Once the building blocks were clear in my mind I started adding layers of complexity, one piece at the time. The goal was to give enough clues to the user that he could assemble all the pieces and have an overview of how each algorithm works.

To have a better understanding of algorithms I encounter everyday, I started gathering documentation about Google PageRank’s algorithm, Facebook Newsfeed’s algorithm, Twitter's algorithm and others. I realized they were sharing basic building blocks that, once explained, could really help understand these algorithms. Let's take sorting algorithms: they are everywhere and understanding the way they sort numbers is a good start to understand more complex ones.

Once the building blocks were clear in my mind I started adding layers of complexity, one piece at the time. The goal was to give enough clues to the user that he could assemble all the pieces and have an overview of how each algorithm works.

alma-1

The complex system approach

I designed each game to be an opportunity for the user to learn and play. In each game there are dedicated times for experimention with digital and tangible interfaces as well as time for explanation through external links providing precise content.

Each game follows a narrative:  an introduction, some experimentation and explanation phases, and finally  a conclusion opening new questions for the user and suggesting interesting links. Combining the complex system approach (as seen above) and the narrative approach is a way to explain complex ideas in a playful way.

I designed each game to be an opportunity for the user to learn and play. In each game there are dedicated times for experimention with digital and tangible interfaces as well as time for explanation through external links providing precise content.

Each game follows a narrative:  an introduction, some experimentation and explanation phases, and finally  a conclusion opening new questions for the user and suggesting interesting links. Combining the complex system approach (as seen above) and the narrative approach is a way to explain complex ideas in a playful way.

alma-2

The narrative approach

Tangible objects are interesting tools to help understand complex and abstract ideas as they can be touched, manipulated, moved around. I explored ways of manipulating algorithms in tangible and digital ways using paper, cardboard, small pieces of wood and an iPad and an iPhone. I quickly discovered that 3D printed tokens with conductive ink could interact with the iPad, which allowed me to create better games using tangible tokens as a way to control the iPad interface.

I spent several weeks refining the design of both the tokens and the UI, testing them as often as I could with friends and family.

Tangible objects are interesting tools to help understand complex and abstract ideas as they can be touched, manipulated, moved around. I explored ways of manipulating algorithms in tangible and digital ways using paper, cardboard, small pieces of wood and an iPad and an iPhone. I quickly discovered that 3D printed tokens with conductive ink could interact with the iPad, which allowed me to create better games using tangible tokens as a way to control the iPad interface.

I spent several weeks refining the design of both the tokens and the UI, testing them as often as I could with friends and family.

Thinking, testing, validating and prototyping the games

Project

Project

Three games

Three games

Facebook's Newsfeed

The Facebook game is divided in two parts: first, understanding publication's relevance score, then, understanding how a sorting algorithm works. The first part is about playing with fake Facebook content—using the 3D printed conductive tokens on an iPad—in order to generate scores. The relevance score depends of the user posting, the type of post and the time of the post. All of this can be discovered by testing different tokens on the iPad to see the score changing. In the second part, the user has to sort the publication's scores as an algorithm would do. Mimicking the algorithm is a great way to understand how it works.

In this game you are playing the algorithm!

Facebook's Newsfeed

The Facebook game is divided in two parts: first, understanding publication's relevance score, then, understanding how a sorting algorithm works. The first part is about playing with fake Facebook content—using the 3D printed conductive tokens on an iPad—in order to generate scores. The relevance score depends of the user posting, the type of post and the time of the post. All of this can be discovered by testing different tokens on the iPad to see the score changing. In the second part, the user has to sort the publication's scores as an algorithm would do. Mimicking the algorithm is a great way to understand how it works.

In this game you are playing the algorithm!

louischarron2

Picking a different token generate a different relevance score, each token represents either a type of content, a type of friend or a post timestamp.

Google PageRank

Google PageRank algorithm measures websites' popularity using the links connecting each of them. The goal of this game is to put a webpage (here represented as a dot) on top of Google Search first page. To do so, the user has to create links between his or her page and others. With its bright colors and simple interface the game is strongly inspired by contemporary mobile games.

There are multiple ways and various obstacles to reach the perfect size, representing Google Search first page. The game starts easy and increases in difficulty at every level, adding each time one layer of understanding of the PageRank's algorithm.

Inspired by level design, this game is about learning by going from the simplest to the most complex, step by step.

Google PageRank

Google PageRank algorithm measures websites' popularity using the links connecting each of them. The goal of this game is to put a webpage (here represented as a dot) on top of Google Search first page. To do so, the user has to create links between his or her page and others. With its bright colors and simple interface the game is strongly inspired by contemporary mobile games.

There are multiple ways and various obstacles to reach the perfect size, representing Google Search first page. The game starts easy and increases in difficulty at every level, adding each time one layer of understanding of the PageRank's algorithm.

Inspired by level design, this game is about learning by going from the simplest to the most complex, step by step.

louischarron3

As a metaphor of webpages, the dot grows when connected to other dots (pages). The goal here is to get to the maximum size with the minimum number of links.

As a metaphor of webpages, the dot grows when connected to other dots (pages). The goal here is to get to the maximum size with the minimum number of links.

Siri's algorithm

To be able to provide answers, digital assistants like Siri have to understand us first. This game explains how a computer can understand what we say. Siri's understanding is based on syllables: it associates a mathematical models to each we pronounce. Here, the mathematical model is taking the shape of 3D printed soundwave tokens and each syllables is symbolized by its soundwave. The game is about finding the right composition of syllables for a given sentence, from what we see of the soundwave shape.

While explaining complex algorithms, this games is based on a simple children game.

Siri's algorithm

To be able to provide answers, digital assistants like Siri have to understand us first. This game explains how a computer can understand what we say. Siri's understanding is based on syllables: it associates a mathematical models to each we pronounce. Here, the mathematical model is taking the shape of 3D printed soundwave tokens and each syllables is symbolized by its soundwave. The game is about finding the right composition of syllables for a given sentence, from what we see of the soundwave shape.

While explaining complex algorithms, this games is based on a simple children game.

louischarron4

The user has to discover the hidden sentence through more than 50 3D printed syllables, taking the shape of its soundwave.

almahover

What I learned

What I learned

Design as a pedagogical tool

Design as a pedagogical tool

Designing games to explain algorithms made me realize that design can be used to explain the complexity of our world, which has been at the core of my work since.

I learned a lot by trying to create a dialogue between tangible and digital interfaces, which I believe to be a very promising area for human-machine interaction. Lastly the process of testing many interactions and small bits of each game with friends and family was very rewarding as a methodology.

Designing games to explain algorithms made me realize that design can be used to explain the complexity of our world, which has been at the core of my work since.

I learned a lot by trying to create a dialogue between tangible and digital interfaces, which I believe to be a very promising area for human-machine interaction. Lastly the process of testing many interactions and small bits of each game with friends and family was very rewarding as a methodology.

Exhibition & Rewards

Exhibition & Rewards

Exhibited at L’Institut Français, Milan, during the Triennale « Broken Nature » — 2019
Label Observeur du Design — 2017
EnsAD Master’s Thesis Project, graduated with highest honors — 2016

Exhibited at L’Institut Français, Milan, during the Triennale « Broken Nature » — 2019
Label Observeur du Design — 2017
EnsAD Master’s Thesis Project, graduated with highest honors — 2016

Credits

Credits

Apps developped with Maxime Alexandre

Apps developped with Maxime Alexandre