Temperfold: Rule-Aware Thermal Route Composer
Faadil Boussari
Temperfold desktop overview
TEMPERFOLD: Self-initiated product design and front-end prototype using fictional venue data.
A thermal route composer that redraws itself as the rules change.
Interfaces usually explain rules.
TEMPERFOLD makes the rules visible by redrawing the route itself.
Most thermal apps focus on timers, bookings, or wellness tracking.
TEMPERFOLD explores a different idea.
Instead of recording a session after it happens, it lets people compose a thermal sequence while making the venue's operational rules visible.
The experience behaves like a spatial score rather than a checklist.
Every Heat, Cold, Steam, Water, and Rest segment becomes part of a readable composition that continuously reorganizes itself as the route changes.
The problem
Contrast therapy follows real operational constraints.
A longer Heat session often requires recovery before the next stage.
Most digital products hide these rules behind alerts, documentation, or staff instructions. Users only discover constraints after making a decision.
I wanted to reverse that relationship.
The interface itself should become the rule system.
The idea
TEMPERFOLD is built around one central interaction.
Increasing a Heat segment from 15 to 16 minutes immediately changes the structure of the route.
Instead of displaying an error or a popup:
a required Rest block is inserted automatically;
the entire sequence redraws itself;
every downstream segment moves into its new measured position;
the total duration is recalculated;
the rule becomes part of the composition instead of interrupting it.
The system explains itself through structure rather than dialogue.
Design direction
The visual language intentionally avoids contemporary wellness clichés.
The interface borrows from:
architectural drawings;
editorial typography;
printed registers;
musical notation;
measured spatial composition.
The goal was to make every route feel documented rather than decorated.
Signature interaction
The moment I designed the project around is simple.
Before Heat at 15 minutes:
Signature state before — Heat at 15 minutes
After — Heat at 16 minutes:
Signature state after — Heat at 16 minutes, required Rest inserted
Required Rest inserted. The entire score redraws itself.
Instead of an animation for its own sake, the movement communicates a rule becoming visible.
The rule explanation, attached directly to the route:
Rule explanation visible in the interface
Technical implementation
The prototype includes:
rule-driven thermal composition;
automatic Rest insertion;
idempotent rule engine;
dynamic duration recalculation;
atomic constraint validation;
desktop and mobile layouts;
accessibility validation;
deterministic interaction testing;
GitHub Pages deployment.
What I explored
Rather than designing another scheduling interface, I wanted to ask:
What happens when a product behaves like notation instead of software?
That question shaped every interaction, layout decision, and animation throughout the project.
Full interaction demo
Try it yourself
Increase a Heat segment from 15 → 16 minutes to trigger the signature interaction and watch the route redraw itself in real time.
Like this project
Posted Jul 16, 2026
A rule-aware thermal itinerary that automatically inserts, removes, and repositions steps as venue constraints and user decisions change.
