Relife

Mastermind · Scroll-Experience

Phase 0: Designsprache und Storyboard für die WebGL-Seite. Ein durchgehender Raum aus Schwarz, in den man hineinscrollt. Licht kommt nur von innen.

Wartet auf eure Freigabe
Stand 19.09., 20:40 Uhr: GPT 6 Astra hat die Technik gegengelesen und die erste Fassung als „nicht freigabefähig“ bewertet. Beanstandet waren zwei Kamerasysteme, Übergänge, die rückwärts nicht exakt gleich laufen, und ein Tempo-Regler, der auf 60-Hz-Handys falsch misst. Die zehn wichtigsten Punkte sind umgesetzt, in Technik, Designsprache und Tokens (jeweils Version 2). Es gibt jetzt eine einzige Kamera, alle Übergänge laufen rückwärts exakt gleich, und der Tempo-Regler misst richtig. Was nur ein echter Test beweisen kann, wird in Phase 1 gemessen.
Was ihr freigebt

Kurz gesagt

Sechs Szenen, ein Raum. Oben schwebt die Kapsel. Darin erscheint Agron, dann zerfällt er in Lichtstaub. Aus dem Staub werden Schlieren, die die Säulen rahmen. Die Schlieren legen sich als Raster auf den Boden, darauf stehen Aufbau, Bewerbung und Stimmen. Am Ende fließt alles in eine Sphere zurück, dort liegt die Bewerbung.

Alle Texte stammen wortgetreu von relife-mastermind.com (Abruf 19.09.2026). Neue Copy haben wir nicht geschrieben. Programmiert wird erst nach eurer Freigabe.

Farben

Palette

Void#04050C
Navy#0B1230
Violett#7B3FF2
Magenta#C84BFF
Amber#FF8A3D
Koralle#E8453C
Mint#6FD6A0
Cyan#4DA3FF
Kernweiß#FFF6E8
Schrift & Bewegung

Typo

Jost 200, weit gesperrt für Display-Zeilen, dünn wie die Wortmarke. Fließtext in Be Vietnam Pro (läuft schon auf der Live-Seite), Zeilenabstand 1,7. Pro Szene gibt es höchstens eine Headline mit Glow.

Bewegung ist langsam und schwer: expo/quint out, 0,8 bis 1,6 s, nichts federt. Der Scroll steuert die Geschichte, die Zeit lässt die Objekte nur atmen.

Storyboard

Sechs Szenen

Die Übergänge überlappen um je 4 % Scroll. Es gibt keinen Schnitt, alles wird überblendet.

1 Hero0–14 %
Bild
Leuchtende Kapsel mit Mint-Rand, innen violett, atmet und reagiert auf Neigung. Darauf das Logo als Lichtlinie.
Text
DUBAI · Mastermind 2026 · Claim · Button
2 Agron14–30 %
Bild
Die Kapsel öffnet sich, darin Agrons Porträt, von hinten beleuchtet (Mint links, Violett rechts).
Text
MASTERMIND · „Erfolg, Umsatz und Klarheit in deinem Leben“ · exklusiver Kreis
3 Auflösung30–46 %
Bild
Das Porträt zerfällt von oben nach unten in bis zu 150.000 Lichtpartikel, die zu Schlieren werden. Scrollt man zurück, setzt es sich exakt wieder zusammen.
Text
So bringt dich die Mastermind weiter · 5 Punkte
4 Schlieren46–66 %
Bild
Drei Lichtbänder mit fast weißem Kern winden sich um die Textblöcke, laufen aber nie hinter die Schrift. Vorne Bokeh, hinten Sternenstaub.
Text
Die Säulen der Mastermind · Inner Engineering · 12 Lebensprinzipien · Schöpferkraft · „von INNEN nach AUSSEN“ mit 11 Begriffen
Warum
Die Säulen handeln von Energie und Frequenz. Die Bänder sind dieser Energiestrom, er kommt aus Agrons Porträt.
5 Raster66–88 %
Bild
Die Bänder legen sich als violettes, gekrümmtes Raster auf den Boden. Die Kamera gleitet darüber, vorne ist es unscharf.
Text
Aufbau (4 Blöcke, je eine Rasterzelle) · Bewerbung in 3 Schritten als Lichtpfad · FAQ · Das sagen die Teilnehmer (7 Stimmen, je eine leuchtende Kapsel)
6 Finale88–100 %
Bild
Alle Ströme fließen spiralig in eine Sphere, dieselbe Form wie oben, jetzt ruhiger. Rundherum viel Schwarz.
Text
Bewirb dich jetzt, um … · „Jetzt Bewerbungsgespräch anfragen“ mit Glow · Formular

Zwischen den Szenen wandern 4 bis 12 kleine leuchtende Kapseln und Spheres durch die Tiefe, nie über dem Text.

Look-Vorschau

Moodframes

KI-generierte Vorschau für die Szenen 4–6 (GPT Image, 19.09.2026). Keine Personen, kein Text. Sie ersetzen nicht die Referenzbilder R1–R6, sondern zeigen nur die Richtung.

Rot-orange Lichtschliere mit hellem Kern auf Schwarz, Bokeh unten
4 Schlieren
Violettes, gekrümmtes Raster als Boden, darüber viel Schwarz
5 Raster
Sphere mit mint Rand und violettem Inneren, Lichtströme laufen hinein
6 Finale
Handy & Tempo

Technik

Das Handy bekommt eine eigene Komposition im Hochformat, die Objekte sind vertikal gestaffelt. Die Seite misst selbst, was das Gerät schafft, und stuft sich bei Bedarf herunter.

High150.000 Partikel, 12 Objekte, Bloom voll, 60 fps
Mid60.000 Partikel, 8 Objekte, Bloom halb
LowStandbild statt Partikel, 4 Objekte, nie unter 30 fps
Eure Entscheidung

Freigabe

  1. Storyboard und Texte der sechs Szenen, so wie oben.
  2. Szene 1 in Mint + Violett. Die Referenzen hätten dort drei Farben (plus Koralle-Glow, Cyan-Halo). Alternative: Violett + Cyan, näher am Logo.
  3. Button in den Szenenfarben statt des Rot-Pinks der Live-Seite, sonst wäre es in den meisten Szenen eine dritte Leuchtfarbe.
  4. Jost statt Syne für die Display-Zeilen, weil Syne nicht dünn genug ist. Der Fließtext bleibt wie auf der Live-Seite.
  5. Texte 1:1 mit Tippfehlern übernehmen oder korrigieren? Die Liste liegt vor, dazu ein paar inhaltliche Stellen in der Original-Copy, die ihr vor dem Livegang einmal bewusst abnicken solltet.
  6. Optional: zwei belegte Sätze von Agron als Einsprengsel in Szene 4/5 (aus YouTube und Instagram), also nicht von der Website.
  7. 4 oder 7 Tage? Das Bewerbungsformular im Original fragt nach „diesen 4 Tagen“, die FAQ sagt „1 Woche / 7 Tage“. Welche Angabe stimmt?
  8. Porträt: Wir haben ein echtes Standbild aus dem Podcast, freigestellt, 1000 px hoch. Das reicht fürs Handy und für den Partikelzerfall, am Desktop wird es weich. Dürfen wir es nutzen, und gibt es ein größeres Foto?
  9. Sphere-Video: Bisher gibt es nur einen einfachen Atem-Loop als Platzhalter. Ein echtes generiertes Video braucht euer Go.
Was noch fehlt

Lücken