Plant a Smile

Plant a Smile –
A digital garden that blooms with your smile

There’s not enough smiling in the world – and we want to change that! With the Plant a Smile installation, we create a playful interaction designed to make people laugh. At its heart is a friendly digital sun that uses various approaches – from jokes and unexpected actions to cute and friendly gestures – to bring out a smile. Whenever someone laughs, the sun responds by planting a flower in a digital garden. The more people smile, the more vibrant and lively the virtual landscape grows.

Plant a Smile was developed as part of the Master’s program in Human-Computer Interaction Design at THA Augsburg in a team of five.

Our sun’s mission:
to make people smile

The sun is the main character designed to make users laugh. With a unique personality, it can show emotions, perform actions, move in the garden, and interact individually with each user. To spark smiles, the sun has a variety of actions, including making jokes, giving compliments, offering playful gestures, or surprising the user. It can either act autonomously or respond to the user’s actions.

And so the garden keeps growing

With each smile, the sun plants a flower in a digital garden. The more smiles, the more vibrant and beautiful the garden grows. If no one smiles for a while, the garden may wither, so it needs care to keep growing. It encourages regular smiles to keep the garden alive.

Flower generator

Using L-System, we developed a system of dynamic, evolving flowers. To ensure a smooth, high-performance experience, the real-time generator and wind simulations were implemented using Vue.js and Pixi.js.

Tracking

The face tracking allows the sun to detect and respond to users‘ movements and smiles. This was implemented using the JavaScript libraries face-api.js and p5.js.

When a user smiles, the face tracking detects it, triggering the planting of a flower in the digital garden.