Floss Boss

Year

2025-2026

Medium

UI/UX, Motion, Interaction

Tools

Rive, After Effects, Figma

Role

Lead UI Motion Designer

Floss Boss is an interactive alternative control exhibit where two players team together to brush and floss the teeth of a lake monster from within its mouth using giant dental equipment!

The game was developed by a team of six designers and four developers, and was presented at alt.ctrl.GDC in San Francisco in March of 2026, as well as Imagine RIT in April of the same year.

The game was developed by a team of six designers and four developers, and was presented at alt.ctrl.GDC in San Francisco in March of 2026, as well as Imagine RIT in April of the same year.

My Role

My Role

CLICK HERE TO TRY THE COMPONENT!

CLICK HERE TO TRY THE COMPONENT!

CLICK HERE TO TRY THE COMPONENT!

I served as the primary UI motion designer for Floss Boss. In this role, I had to consider to smoothest way to convey information on the screen when the user interacts with the physical objects on set.

The primary goal was to indicate that a tooth is being cleaned when the user brushes or flosses the corresponding tooth in real life.

Design Opprtunities

  • 1

    The game only lasts a minute. As an alternative control experience, players would need to quickly learn how the giant dental tools they’re holding correspond to the game on the screen.

  • 2

    With two roles to fill, the brusher and the flosser, a team of two would also need an obvious visual distinction between the teeth that need to be brushed, and those that need to be flossed.

  • 3

    They players are constantly looking between the screen and set. When a player performs a task, they need feedback indicating that what they did in the real world impacts the digital game.

  • 1

    The game only lasts a minute. As an alternative control experience, players would need to quickly learn how the giant dental tools they’re holding correspond to the game on the screen.

  • 2

    With two roles to fill, the brusher and the flosser, a team of two would also need an obvious visual distinction between the teeth that need to be brushed, and those that need to be flossed.

  • 3

    They players are constantly looking between the screen and set. When a player performs a task, they need feedback indicating that what they did in the real world impacts the digital game.

  • 1

    The game only lasts a minute. As an alternative control experience, players would need to quickly learn how the giant dental tools they’re holding correspond to the game on the screen.

  • 2

    With two roles to fill, the brusher and the flosser, a team of two would also need an obvious visual distinction between the teeth that need to be brushed, and those that need to be flossed.

  • 3

    They players are constantly looking between the screen and set. When a player performs a task, they need feedback indicating that what they did in the real world impacts the digital game.

In short, players need quick, noticeable animations and UI that allow them to easily telegraph the task that needs to be done, and how their actions fulfill those tasks.

Initial Attempts

The cleaning and decaying animations for each tooth went through several iterations and were tested with real users to see how well they worked in an actual interactive setting.

The main feedback we received is that the animations were unnoticeable since the teeth were all at the bottom of the screen. The bacteria and decay were easily missable, appearing out of nowhere with not much indication.

Adjustments

Spawning

Spawning

Many changes were made to make the animations less missable when interacted with. For instance, I gave each creature a jump animation, where they pop into the air when they first spawn, making them more apparent.

Cleaning

Cleaning

The suds now no longer simply float on the tooth during the cleaning animation. Now, the entire tooth gets filled with bubbles, starting from the bottom, creating a visual progress bar of sorts. The user knows how long they need to brush for the tooth to be clean. When the bubbles pop, the creatures plays a defeat animation, and a clean, sparkling tooth is revealed, indicating to the user that the task is complete.

Flossing

Flossing

The flossing animations were designed to feel clean and satisfying, as if the player were slicing through the bacteria between the gums.

State Machines

All the UI animations were created in RIVE, allowing them to be interactable . I worked with developers to import the animations into HTML and trigger the interactions via JavaScript

Here’s a look behind the scenes at how the state machines are wired and hooked up! Everything was done with simple inputs, before Data Binding became the standard.

Music and Sound

Outside of animation and UI, I also handled the project's music and sound. I set out to create an energetic minute-long song that captured a jazzy underwater vibe. Take a listen to the Shrimply Flossin', the gameplay theme for Floss Boss!

0:00/1:34

Highlights!

GAMEPLAY @ GDC!

GAMEPLAY @ GDC!

GAMEPLAY @ GDC!

NOTABLE NAMES PLAYING FLOSS BOSS!

NOTABLE NAMES PLAYING FLOSS BOSS!

NOTABLE NAMES PLAYING FLOSS BOSS!

Juniper Dev

Juniper Dev

Memoria

Memoria

Memoria

PC GAMER

PC GAMER

DISCORD

DISCORD

FULL SET @ IMAGINE RIT

FULL SET @ IMAGINE RIT

FULL SET @ IMAGINE RIT

THE TEAM BEHIND THE TEETH

THE TEAM BEHIND THE TEETH

THE TEAM BEHIND THE TEETH

CHECK OUT THE FULL FLOSS BOSS SITE!

CHECK OUT THE FULL FLOSS BOSS SITE!

CHECK OUT THE FULL FLOSS BOSS SITE!

© Copyright Dayne Stein 2024

Contact

Dayne Stein

Links

Like whatcha see?

Let's get in touch!

© Copyright Dayne Stein 2024

Contact

Dayne Stein

Links

Like whatcha see?

Let's get in touch!

© Copyright Dayne Stein 2024

Contact

Dayne Stein

Links

Like whatcha see?

Let's get in touch!

Create a free website with Framer, the website builder loved by startups, designers and agencies.