CASE /// ERLEBNIS · INTERAKTIVE GESCHICHTE
The Next Adventure
Konzept von RAVAROBeispielseite: Figuren und Ort sind mit KI gestaltet, die Website gibt es wirklich.
Was wäre, wenn sich Ihre Besucher an Ihre Website erinnern wie an ein Spiel aus ihrer Kindheit? Ein Gastgeber, der sich nach Ihnen umdreht, ein Dschungel, der ins Arbeitszimmer wächst, zwölf Stationen zum Mitmachen — eine Website, die man nicht liest, sondern spielt.
Die Frage am Anfang
Woran erinnert man sich nach einem Website-Besuch? Fast nie an einen Text. Man erinnert sich an einen Moment, in dem man selbst etwas getan hat und die Seite darauf geantwortet hat.
Die meisten Websites erzählen nur: Sie laden, man scrollt, alles funktioniert, und fünf Minuten später weiß niemand mehr, auf wessen Seite er war. Drei Kästen, ein Kontaktformular, ein Foto vom Team — ordentlich und sofort vergessen.
Warum wir das gebaut haben
The Next Adventure hat niemand bestellt, und das ist Absicht. Die Seite gehört zu unserer Reihe von Beispielseiten, die wir ohne Kunden bauen, damit wir freie Hand haben und unser Bestes zeigen können, statt Kundenergebnisse zu erfinden.
Diese hier beginnt mit einer Erinnerung. Ralph hat als Kind ein PC-Spiel von 1996 gespielt, das er nie vergessen hat: technisch nicht perfekt, aber überall voller Persönlichkeit. Seine Frage an uns: Was passiert, wenn eine dreißig Jahre alte Erinnerung wieder lebendig wird — nicht als Nachbau, sondern als eigene Welt, die man im Browser betritt?
Dahinter steht ein Marketing-Auftrag. Die Seite soll nicht behaupten, was RAVARO kann, sondern es beweisen, während der Besucher sie benutzt. Wer hier ankommt, kennt uns meist schon; überzeugen muss ihn diese Seite nicht. Sie soll ihn überraschen und ihm zeigen, was eine Website sein kann, wenn man ihr Spielraum gibt.
“Die Seite soll wie ein Erlebnis sein, wo man immer wieder was Neues entdeckt.”
Die eine Idee — und warum
Eine Erinnerung wächst aus dem Bildschirm: Der Besucher sitzt mit im Arbeitszimmer, und Station für Station wird daraus eine Welt, durch die er sich selbst bewegt.
Wir fangen nie mit Bildern an, sondern mit einem Satz. Hier lautet er: Eine Kindheitserinnerung beginnt in einem Arbeitszimmer von heute, wächst aus dem alten Röhrenmonitor heraus und wird zum Dschungel; am Ende geht es zurück ins Heute, und die Seite fragt den Besucher nach seinem eigenen Abenteuer.
Die vier Figuren hat Ralph selbst entworfen und jeder eine feste Aufgabe gegeben. Der Gastgeber erzählt, der Papagei führt durch die Seite, das Chamäleon belohnt, wer genau hinsieht, und der Leguan tut absolut nichts Nützliches — er sorgt für die Pausen, in denen man lacht.
Genau das wäre uns fast passiert. Zu einer frühen Rohfassung schrieb Ralph: „Es gibt keinen roten Faden, warum die Seite vom Büro auf einmal so aufgebaut ist.“ Er hatte recht — wer nur scrollte, sah den Dschungel ohne Grund ins Zimmer brechen, wie ein zweites, fremdes Thema. Wir haben den Bau angehalten, alle Stationen auf ein Blatt geschrieben und erst weitergebaut, als die Geschichte von der ersten bis zur letzten hielt. Seitdem ist Weiterscrollen das Ja zum Abenteuer, und jede Station endet damit, dass eine Figur vorausgeht.
Was daraus wurde
Live ansehenZwölf Stationen und ein Schluss, gebaut in 17 Tagen: vom Arbeitszimmer bei Nacht, in dem sich der Gastgeber nach Ihnen umdreht, über eine Liane, an der man besser nicht zieht, einen Flug durch das Blätterdach und ein Suchspiel im Dunkeln bis zurück ins Heute. Zuerst der Kern der Seite im Vergleich, darunter zwei Bilder aus der echten Seite.


Ziehen Sie den Regler: links eine verworfene Fassung — der Kopf dreht nach links, die Augen schauen nach rechts. Rechts die eingebaute, in der Kopf und Blick dieselbe Richtung nehmen. Auf der Seite folgt dieser Blick Ihrer Maus oder Ihrem Finger, wohin Sie sie auch bewegen.
Bildschirmfotos der Seite in Version 0.4m vom 17. Oktober 2026, aufgenommen auf einem großen Bildschirm. Figuren und Ort sind mit KI gestaltet — die Seite sagt das am Ende selbst.
Wie wir entscheiden
KI ist bei uns Werkzeug, nicht Argument. Sie liefert in Minuten Bilder und Filme, und ebenso schnell solche, die nicht tragen. Was daraus eine Seite macht, an die man sich erinnert, sind Entscheidungen, und jede beginnt mit derselben Frage: Was erlebt der Besucher an dieser Stelle, und was hat das Geschäft dahinter davon?
Fünf solcher Entscheidungen haben diese Seite geformt. Ralph hat jede Fassung selbst durchgesehen und durchgehört; wo sein Urteil etwas verändert hat, steht es dabei.
1 · Die Seite bemerkt den Besucher, bevor er liest
Der Gastgeber dreht sich nach Ihnen um und schaut Ihrem Zeiger nach. Dafür läuft kein Film ab: Von ihm gibt es Bilder mit Blick nach links, zur Mitte und nach rechts, dazwischen kurze Übergänge, und die Seite zeigt immer das Bild, das zu Ihrer Bewegung passt. Als Ralph die ersten Fassungen auf seinem großen Bildschirm sah, schrieb er: „Alles noch etwas unscharf.“ Also wurde jede Szene in hoher Auflösung neu erzeugt; am Handy kommt die leichtere Fassung an, am großen Monitor die scharfe.
Warum so: Auf Gesichter und Blicke reagieren Menschen, bevor sie einen Satz gelesen haben. Eine Figur, die den Besucher bemerkt, hält ihn genau in den ersten Sekunden fest, in denen er sonst schon wieder weg wäre — und ein unscharfes Gesicht hätte genau diesen Moment verschenkt.
2 · Jede Station gibt dem Besucher etwas zu tun
Eine frühe Szene fand Ralph „nur ok“: Ein Blatt schwebte ohne Grund nach vorn. Sein Wunsch war, dass der Besucher aus Versehen etwas auslöst, das der Figur zustößt. Daraus wurde eine Liane mit dem Holzschild „Nicht ziehen“. Wer trotzdem zieht, reißt den Gastgeber am Fuß nach oben, und genau dieser Klick führt in die nächste Station.
So ging es weiter. Im Dunkeln wird Ihr Zeiger zur Taschenlampe, und irgendwo sitzt ein getarntes Chamäleon; neun solcher Verstecke gibt es auf der Seite. Beim Flug ist Scrollen Fliegen, riesige Steinbuchstaben wackeln, wenn man sie antippt, und kurz vor Schluss erzählt die Seite, woher die Idee kommt: Die Welt wird grob wie ein Spiel von 1996, und aus einer Bleistiftzeichnung wird Strich für Strich der Gastgeber von heute.
Warum so: Was man selbst entdeckt hat, merkt man sich. Wer sich durch zwölf Stationen geklickt, gesucht und geflogen hat, hat keine Seite gelesen, sondern etwas erlebt — und weiß am Abend noch, wessen Seite es war.
3 · Was Ihre Kunden hören, entscheiden Sie
Jede erzeugte Aufnahme wird nachgelesen, bevor sie auf die Seite kommt; so fiel auf, dass eine Stimme die Regieanweisungen gleich mitsprach. Was das Nachlesen nicht findet, ist der Klang: Beim ersten Hören fand Ralph die Stimme des Papageis „schlimm“ und die deutschen Sätze plump.
Daraus wurde eine feste Regel: erst anhören lassen, dann einbauen. Alle Sätze liegen auf einer Hörprobe-Seite nebeneinander, je Satz mehrere Fassungen. Neun Stimmen sprachen Probe, Ralph wählte eine, und die spricht jetzt Deutsch und Englisch — gewählt erst, nachdem geprüft war, dass sie kommerziell genutzt werden darf. Als er zuletzt schrieb „Die Töne passen aber nicht immer dazu“, wurde jeder der 74 Töne einzeln gegen das Bild gehalten, in dem er erklingt; die Schritte im Schluss setzen genau dort auf, wo die Füße den Boden berühren.
Warum so: Eine Stimme, die nicht passt, macht aus einer Figur mit Persönlichkeit eine Werbefigur, und ein Ton, der einen Wimpernschlag zu früh kommt, wirkt billig, auch wenn niemand sagen kann, warum. Für Sie heißt das: Nichts geht live, was Sie nicht vorher gehört haben, und die Rechte daran sind geklärt.
4 · Dieselbe Seite am Handy, ohne zweiten Bau
Ralphs Vorgabe war klar: Die Seite soll am Handy funktionieren, ohne dass sie ein zweites Mal gebaut wird. Die erste Fassung lud alle Filme auf einmal und hielt sie fest; ein Handy wäre daran erstickt. Heute lädt sie dort nur, was die aktuelle Station braucht, und gibt es danach wieder frei. Das Riesenwort ist breiter als der Schirm, also gleitet es langsam und lässt sich mit dem Finger schieben, und wo Ralph am Handy nicht sah, dass es seitlich weitergeht, sitzt jetzt ein Pfeil-Knopf.
Warum so: Die meisten Besucher kommen mit dem Handy. Ein Erlebnis, das nur am großen Bildschirm trägt, verliert genau die, die es zuerst sehen — und ein Weg, den man nur durch Wischen findet, ist für viele gar keiner.
5 · Jede Fassung wird ganz durchgespielt
Nach jeder Änderung fährt ein Prüfprogramm die ganze Seite ab, wie es ein Besucher täte: am großen und am normalen Rechner, in der Größe eines iPhones und eines Android-Handys, vor und zurück, mit und ohne Ton, auf Deutsch und Englisch. Erst wenn alles besteht, gilt ein Stand. Und weil Zahlen allein nicht reichen, sehen wir von jeder Fassung eine Aufnahme der ganzen Seite an; einmal zeigte sie, was die Prüfung übersehen hatte — ein Hinweis lag auf den Schuhen des Gastgebers.
Vor dem Start kam die Probe auf der echten Adresse: Die Seite stellt keine einzige Anfrage an fremde Server, auch die Schriften kommen vom eigenen.
Warum so: Ein Fehler, den Ihr Kunde findet, kostet mehr als jeder, den wir finden. Und wer Ihre Seite besucht, hinterlässt keine Daten bei Dritten — eine Sorge weniger, für Sie und für ihn.
Was schiefging und was wir daraus gelernt haben
Über jeden Bau führen wir ein Protokoll: was geändert wurde, warum und was danach geprüft ist. Daraus stammen diese Fehler. Jeder hat eine Regel hinterlassen, die seitdem bei jedem Projekt gilt.
- Was passierte
Die erste Figur war ein bewegliches 3D-Modell: Sie lief und drehte den Kopf, technisch sauber. Aber der Mund bewegte sich nicht, und sie sah schlechter aus als das Bild, aus dem sie entstand.
→ Was wir seitdem anders machenVor jedem Werkzeug prüfen wir, ob es das liefert, worauf es ankommt. Hier war das ein Gesicht, das lebt.
- Was passierte
Eine Drehung ohne vorgegebenes Endbild: Die KI erfand die fehlende Hälfte, und aus einem Grinsen wurde eine Grimasse.
→ Was wir seitdem anders machenJede Bewegung bekommt ihr eigenes Anfangs- und Endbild. Lieber zwei kurze Szenen als eine lange.
- Was passierte
Ralph sah eine Rohfassung, ohne zu wissen, was davon Platzhalter war. Sein Urteil konnte nur „kein roter Faden“ lauten.
→ Was wir seitdem anders machenKein Zwischenstand ohne Legende: was fertig ist, was noch kommt und wo man im Ganzen steht.
- Was passierte
Damit die Figur das Riesenwort nicht verdeckt, haben wir es geteilt. Danach war es nur noch halb so groß und hatte seine Wucht verloren.
→ Was wir seitdem anders machenEin verdecktes Wort ist besser als ein kleines. Nicht alles, was uns stört, stört den Besucher.
- Was passierte
Ralph hörte, dass die Töne nicht immer passten, aber nicht, welche. Einige kamen einen Wimpernschlag zu früh oder zu spät, einer klang nach Comic.
→ Was wir seitdem anders machenJeder Ton steht mit Nummer in einer Liste und wird am Bild geprüft, dazu ein Prüffilm, in dem jede Nummer groß im Bild steht.
- Was passierte
Sobald man die Liane berührte, fehlte oben ein Stück, und unten blieb ein dunkler Rand stehen — zu sehen nur im breiten Fenster, in dem Ralph die Seite ansah, nicht in dem, in dem wir prüften.
→ Was wir seitdem anders machenGeprüft wird in der Fenstergröße dessen, der hinsieht. Und alles, was sich bewegt, ragt an jedem Rand über.
Gemessen
Was das für Ihr Geschäft tut
Stellen Sie sich vor, ein Kunde öffnet Ihre Website, und das Erste, was passiert: Jemand dreht sich nach ihm um. Er bewegt die Maus, und der Blick folgt ihm. Er scrollt, und etwas bricht herein. Zwölf Stationen später hat er gesucht, gezogen, getippt und ist geflogen — und am Ende fragt ihn die Seite, was sein Abenteuer wäre.
Das ist der Unterschied zwischen einer Seite, die man gelesen hat, und einer, die man erlebt hat. An drei Kästen und ein Kontaktformular erinnert sich am Abend niemand, an einen Moment, in dem eine Seite auf einen selbst geantwortet hat, schon. Wer so etwas erlebt hat, erzählt davon und weiß noch, wessen Seite es war.
Dafür braucht es keinen Dschungel. Eine Marke mit Persönlichkeit, ein Laden, eine Werkstatt, ein Produkt, das man aufklappen möchte: Was Ihre Kunden an Ihnen mögen, kann auf Ihrer Seite etwas tun, statt nur dazustehen.
Diesen Dschungel gibt es nicht. Ihre Marke schon.
The Next Adventure ist eine Beispielseite ohne Auftrag; Figuren und Ort sind mit KI gestaltet. Die Idee, dass eine Figur dem Zeiger nachschaut, haben wir bei einer Bewegungsvorlage von figmaformotion gesehen; Figuren, Welt, Filme, Ton und Code sind eigens für diese Seite entstanden. Gezeigt werden hier nur unsere eigenen Bilder.
So viel Bild und Ton hat Gewicht: Die Seite braucht eine gute Verbindung und lädt am Handy Station für Station. Am echten iPhone ist sie noch nicht abgenommen; die Handy-Werte stammen aus nachgestellten Handys am Rechner. Gebaut ohne Auftrag, zeigt sie, was möglich ist — eine Verkaufszahl beweist sie nicht.
Eine Website, die nur gut aussieht, ist totes Kapital. Website Systems baut eine Seite aus Ihren echten Unternehmenszielen — die Ihnen Arbeit abnimmt und Besucher zu echten Anfragen macht.
WEITERE CASES ///
Nächster Build

Jade Tempel
Was wäre, wenn Ihre Gäste den Weg zu Ihnen schon gegangen wären, bevor sie anreisen? 1.284 Stufen, eine Halle aus Jade, ein Drache nach dem Gewitter — eine Website, die man nicht ansieht, sondern besteigt.

NEPHELE Residences
Niemand kauft das Projekt. Man kauft Wohnung A1803.

Leuchtfeuer Nordsee
Vier Tage, zehn Fassungen, ein Leuchtturm — und eine Linse, die man selbst zerlegt.

NUIT VISIBLE
Einen Duft kann man nicht zeigen. Also erzählt ihn der Scroll.

The Elite Cars
Ein Supersportwagen-Händler, dessen Website schon gut aussah — und trotzdem keinem etwas verkaufen konnte, der keine Lust hatte, vorbeizufahren.

CLAW BBQ
Ich kenne diesen Ort. Ihre Website nicht.

Juwelier Dührkoop
Feine Uhren, verkauft von einer Seite, in die man sich nicht hineinlehnen konnte.

Andy Engel
Ein Mann, für den Menschen über Kontinente fliegen — mit einer Website für Leute, die vorbeifahren.

BSD Wiedemann
Wir haben seine Website aufhören lassen, Feuerlöscher zu verkaufen — damit das Unternehmen Expertise verkaufen kann.

Hofmühl
Eine Brauerei verkauft auf ihrer Website kein Bier. Sie verkauft den Grund, warum jemand im Laden nach dieser Flasche greift.

Aurora Grand
Eine Hotel-Website, durch die man läuft, bevor man bucht.

PULPA
Eine Limonade, die es nicht gibt, auf einer Website, die Dinge kann, die die meisten Websites nicht können.

Werrewerk Küchen
Was, wenn Ihr Kunde in seiner fertigen Küche stehen könnte, bevor der erste Schrank gebaut ist? Eine Küche, die im Zeitraffer entsteht, die der Besucher mit Preis selbst umgestaltet, und dahinter ein Betrieb, dem man sie auch abnimmt.
Alle unsere Website-Arbeiten
Alle Projekte in dieser Disziplin — mit Zahlen, Videos und Ergebnissen.


