SERIENBEITRAG ·

Flüssigmetall zerreißt im Takt

Wie Signed Distance Fields, Tropfenphysik und Web Audio eine geschlossene Linse aus digitalem Flüssigmetall zerreißen und wieder zusammenfließen lassen.

KONZEPT · UMSETZUNGOliver Röschner
LESEZEIT7 Minuten
BEREICHTECHNOLOGIE
Eine spiegelnde Masse aus digitalem Flüssigmetall schwebt über schwarzem Glas. Zahlreiche runde Metalltropfen sind im Raum verteilt und reflektieren kaltes blaues Studiolicht.
KI GENERIERTES ARTIKELBILD | OPERUS

Eine makellose Linse aus Flüssigmetall liegt auf schwarzem Glas. Sie wirkt schwer, kühl und vollständig geschlossen. Dann hebt der Bass ihren Kern an. Eine Kick schickt eine Welle über die Oberfläche, Melodietöne ziehen seitliche Loben aus der Masse, und im Build-up steigt alles zu einem einzigen Tropfen auf. Beim Drop reißt die Form auseinander.

Die Quecksilber-Demo setzt die Idee der Magnetfeld-Demo fort, verändert aber die entscheidende Frage. Dort wuchs eine Flüssigkeit zu Stacheln. Hier soll eine zusammenhängende Masse ihre Identität verlieren – und später sichtbar wiederfinden.

Eine spiegelnde Masse aus digitalem Flüssigmetall schwebt über schwarzem Glas. Zahlreiche runde Metalltropfen sind im Raum verteilt und reflektieren kaltes blaues Studiolicht. INTERAKTIVE DEMO Der Ton startet nach der Trackauswahl
Ton einschalten, Schmelzpunkt oder Rückstrom wählen und die Masse mit Maus oder Finger seitlich ziehen.

Diese Volumenbilanz macht den Unterschied. Würde die Linse während des Drops vollständig bleiben, wären die Tropfen nur Dekoration. Stattdessen schrumpft der Kern, wenn 22 bis 28 Satelliten entstehen. Während sie zurückrollen und verschmelzen, wächst die Hauptmasse wieder. Das Bild erzählt damit einen geschlossenen Materialkreislauf.

Eine Linse statt einer Pfütze

Die ruhige Form ist kein flaches Wasserbecken. Sie ist eine geschlossene, leicht gewölbte Linse. Im Shader entsteht sie aus mehreren Signed Distance Fields: einer breiten Grundmasse, einem Basskörper, seitlichen Melodieloben und einer aufsteigenden Build-up-Form. Ein weiches Minimum verbindet diese Teile zu einer Oberfläche ohne sichtbare Nähte.

Flüssigkeit aus Abstandsfunktionen glsl
float body = sdEllipsoid(p, vec3(radius, height, radius));
float bass = sdSphere(p - bassOffset, bassRadius);
float melody = sdSphere(p - melodyOffset, melodyRadius);

float liquid = smin(body, bass, 0.34);
liquid = smin(liquid, melody, 0.24);
return mergeSatellites(liquid, p);

Die Kick verändert dagegen nicht das gesamte Volumen. Sie verschiebt nur die sichtbare Haut als konzentrische Welle. Dadurch bleibt die Masse geschlossen, während ein Impuls über sie hinwegzulaufen scheint. Hi-Hats fügen sehr kleine Kapillarwellen hinzu. Bass und Melodie greifen tiefer ein und verändern die Silhouette.

Die Musik steuert Kräfte, nicht Szenen

Wie bei den anderen Operus Demos-Demos melden die live erzeugten Tracks musikalische Ereignisse an eine Regieschicht. Eine Kick erzeugt einen Wellenimpuls. Ein Basston hebt den schweren Kern für die Dauer der Note. Die Tonhöhe einer Melodie wird in einen Winkel übersetzt und zieht dort eine Lobe aus dem Metall. Build-up und Drop verändern Spannung, Volumenverteilung und Kohäsion.

Musikalische Ereignisse und ihre sichtbare Wirkung
Musikalisches EreignisWirkung im Flüssigmetall
Kickkonzentrische Welle über der Oberfläche
Basshebt den Kern an und lässt ihn weich zurückfallen
Melodietonzieht eine Lobe an einer aus der Tonhöhe berechneten Position
Hi-Hatfeine Kapillarunruhe und kurze LED-Reflexe
Build-upbündelt die Linse zu einem aufsteigenden Tropfen
Dropreduziert das Kernvolumen und schleudert Satellitentropfen aus

Die visuellen Parameter folgen Hüllkurven statt harten Schaltern. Ein Basston besitzt Anschlag, Haltephase und Abklingen. Die Melodielobe wandert weich zur nächsten Position. Selbst der Drop beginnt nicht mit einem einzigen Zustandswechsel, sondern mit einem kurzen Verlust der Oberflächenspannung, bevor die Satelliten ihre Flugbahnen übernehmen.

Tropfen außerhalb des Shaders

Die Hauptmasse lebt als Abstandsfunktion im Fragment-Shader. Die Satelliten werden dagegen auf der CPU bewegt. Jeder Tropfen besitzt Position, Geschwindigkeit, Radius und einen Zustand: Flug, Landung, Rollen oder Verschmelzung.

In der Flugphase wirkt Schwerkraft. Beim Kontakt mit dem Glas wird die vertikale Geschwindigkeit gedämpft, Reibung bremst die seitliche Bewegung, und eine Kohäsionskraft zieht den Tropfen zum Kern. Kleine Abweichungen verhindern, dass alle Satelliten dieselbe perfekte Bahn nehmen.

Satellitentropfen auf der CPU js
drop.velocity.y -= gravity * dt;
drop.position.addScaledVector(drop.velocity, dt);

if (drop.position.y <= floorHeight + drop.radius) {
  drop.position.y = floorHeight + drop.radius;
  drop.velocity.y *= -bounce;
  drop.velocity.xz *= Math.exp(-friction * dt);
  drop.velocity.addScaledVector(toCore, cohesion * dt);
}

Nähert sich ein Tropfen der Hauptmasse, blendet die Physik seinen Radius aus dem Satellitenfeld aus und gibt dasselbe Volumen an den Kern zurück. Im Shader verschmilzt ein weiches Minimum beide Oberflächen. Physik und Darstellung teilen sich damit denselben Übergang: Der Tropfen wird nicht einfach gelöscht, sondern verliert sichtbar seine Eigenständigkeit.

Warum Verschmelzen schwieriger ist als Zerplatzen

Viele Effekte können Objekte auseinanderfliegen lassen. Glaubwürdiges Zusammenfließen ist anspruchsvoller. Ein Tropfen darf am Rand nicht plötzlich verschwinden, die Hauptmasse darf nicht sprunghaft wachsen, und zwei spiegelnde Oberflächen dürfen während des Kontakts keine dunkle Naht bilden.

Die Demo koppelt deshalb drei Kurven: Entfernung zum Kern, verbleibender Satellitenradius und zurückgegebenes Kernvolumen. Sobald die Kontaktzone beginnt, nimmt der Tropfen langsam ab. Gleichzeitig wächst die Linse an derselben Stelle und smin rundet die Verbindung. Erst wenn fast kein eigenständiges Volumen mehr übrig ist, endet die CPU-Simulation dieses Tropfens.

Metall wird durch seine Umgebung sichtbar

Digitales Quecksilber besitzt beinahe keine eigene Farbe. Es zeigt die Bühne. Ein hoher Fresnel-Anteil macht die Ränder hell; eine Softbox erklärt die Wölbung, ein Ringlicht zeichnet die Linse nach, und warme sowie kalte Lichtstreifen laufen als lange Reflexe über die Oberfläche. Die Satelliten spiegeln dieselbe Umgebung und bleiben dadurch als Teile desselben Materials erkennbar.

Das schwarze Glas trägt eine zweite, leicht versetzte Spiegelung. Sie ist schwächer und unschärfer als das Metall selbst. Dadurch wirkt die Masse nicht wie ein freigestelltes Objekt vor schwarzem Hintergrund, sondern wie etwas, das tatsächlich auf einer Fläche landet und über sie zurückrollt.

Zwei Tracks zwischen Puls und Schwere

Die beiden Tracks der Musikdemo
TrackTempoCharakter
Schmelzpunkt126 BPMmelodischer Techno mit präzisem Puls, zwei Drops und metallischen Akzenten
Rückstrom90 BPMcineastischer Halftime-Track mit weitem Raum, schweren Impulsen und langsamem Aufbau

Schmelzpunkt hält die Oberfläche in ständiger, kontrollierter Bewegung. Kicks laufen klar über die Linse, und der Drop wirkt wie ein plötzlicher Materialfehler in einer präzisen Maschine. Rückstrom lässt mehr Ruhe zwischen den Ereignissen. Der Kern scheint schwerer, die seitlichen Loben bleiben länger sichtbar, und das Auseinanderbrechen wirkt weniger explosiv als unausweichlich.

Berührung verändert die Oberflächenspannung

Mit Maus oder Finger lässt sich die Masse seitlich führen. Die Bildschirmposition wird auf die Glasfläche projiziert und als zusätzliche Kraft an die Flüssigkeit weitergegeben. Anders als bei der Magnetfeld-Demo folgen keine Stacheln einem Magneten. Hier wird der Schwerpunkt der zusammenhängenden Masse verschoben; die Oberfläche dehnt sich und versucht gleichzeitig, wieder eine kompakte Form zu finden.

Die Interaktion bleibt absichtlich begrenzt. Sie soll das Material erklären, nicht die musikalische Regie ersetzen. Lässt man los, gewinnt die Kohäsion wieder die Oberhand und die Linse findet zur Mitte zurück.

Ein gemeinsames Bild, unterschiedliche Rechenwege

Der Hauptstrahl des Raymarchers sieht Hauptmasse, Satelliten, Glas und Licht als eine Szene. Intern entstehen die Elemente jedoch unterschiedlich: Die Linse ist eine analytische Abstandsfunktion, die Satelliten kommen aus einer CPU-Simulation, und die Glasreflexion verwendet einen zweiten versetzten Strahl.

Auf mobilen Geräten sinken Strahlschritte, Tropfenzahl und Pixeldichte. Selbstreflexion und aufwendige Umgebungsverdeckung werden reduziert. Wenn die Bildzeit dauerhaft zu hoch bleibt, senkt die Demo ihre Auflösung stufenweise. Die Choreografie bleibt gleich; zuerst wird Bildschärfe geopfert, nicht Timing oder Volumenlogik.

Das Auseinanderreißen dauert nur einen Moment. Landen, Rollen, Angezogenwerden und Verschmelzen machen daraus eine Materialgeschichte.

Was ich aus der Quecksilber-Demo mitnehme

Der spannendste Teil der Demo ist für mich nicht das Zerplatzen, sondern die Rückkehr. Sie zwingt Technik und Gestaltung, über den Höhepunkt hinauszudenken. Ein Drop ist nicht nur ein einzelner Frame. Er verändert den Zustand der Szene und erzeugt eine Bewegung, die noch viele Takte später sichtbar bleibt.

Die Quecksilber-Demo zeigt außerdem, wie überzeugend ein digitales Material werden kann, wenn mehrere Systeme dieselbe Idee teilen. Musik steuert Kräfte, Physik erhält Volumen, der Shader verbindet Oberflächen und das Licht erklärt die Form. Keines dieser Systeme würde allein reichen. Zusammen lassen sie eine mathematische Linse für einen Moment schwer, kühl und erstaunlich berührbar wirken.

Teil 7: Klangschale – Wasser, Bronze und stehende WellenWeiterlesen in der Operus Demos-Serie. OPERUS DEMOS