Geschichten und Notizen zum Bau von FleaWinder — ein kleiner animierter Zirkus, angetrieben durch deine Tastatur und Maus.
Der Zirkus auf kleinen Bildschirmen
FleaWinder wurde für einen breiten, dünnen Streifen über der Taskleiste entworfen — bequem im Querformat. Handys sind Hochformat. Den Zirkus auf kleinen Bildschirmen zum Laufen zu bringen, bedeutete, das Layout neu zu denken, ohne das zu verlieren, was ihn lebendig macht.
The embeddable widget flips to a tall canvas on mobile, stacking the acts vertically instead of spreading them across a ribbon. Anyone dropping FleaWinder into their own site gets a layout that adapts automatically. Four theme presets (dark, light, warm, cool) and a scale parameter let it blend with whatever surrounds it.
Die grössere Herausforderung war die Lesbarkeit. Auf einem Handybildschirm sind Flöhe in Desktop-Grösse nur Punkte. Wir haben einen Zoom-Durchgang hinzugefügt, der die Flohkörper vergrössert, damit ihre Kostüme, Gesichtsausdrücke und Accessoires tatsächlich sichtbar sind — Pips Stirnband, Rex' Helm, Blazes kleine Krone. Die Persönlichkeitsdetails, die schon immer da waren, sind plötzlich auf Armlänge erkennbar.
Der Rest des mobilen Umbaus war weniger glamourös, aber genauso wichtig: berührungsfreundliche Tippziele, bessere Schriftskalierung, responsive Abstände auf der gesamten Marketingseite. Nichts Revolutionäres — einfach sicherstellen, dass der Zirkus überall richtig aussieht, wo man ihn findet.
Kostüme, Jahreszeiten und ein Zirkusdirektor
Diese Woche drehte sich alles um visuelle Tiefe. Jeder Floh in der Kolonie trägt jetzt ein einzigartiges Kostüm — Nova hat einen Sonnenschirm auf dem Hochseil, Rex trägt einen Helm in der Kanone, Blaze bekommt eine Krone für den Feuerspucker-Auftritt. Kleine Details, aber sie geben jedem Künstler eine Identität, die man auf den ersten Blick erkennen kann.
Die Bühne selbst verändert sich mit dem Kalender. Ein saisonales Partikelsystem lässt Schnee im Winter fallen, Kirschblüten im Frühling, Glühwürmchen im Sommer und treibende Blätter im Herbst. Es gibt auch eine subtile Tag/Nacht-Tönung, die an deine reale Uhr gebunden ist — der Streifen wird zur goldenen Stunde wärmer und dunkelt nach Einbruch der Dunkelheit ab, mit helleren Sternen am Nachthimmel.
Die grösste Neuerung ist der Zirkusdirektor — ein spezieller Floh mit Zylinder, der zwischen den Auftritten umherspaziert und die Show inspiziert. Er tritt nicht auf; er beaufsichtigt. Seinen Patrouillenpfad richtig hinzubekommen bedeutete, seine Rundgänge so zu timen, dass er genau dann ankommt, wenn ein Auftrittsübergang endet, was dem ganzen Zirkus ein Gefühl von Choreografie verleiht, das er vorher nicht hatte.
Unter der Haube betreibt jetzt ein vollständiges Theme-System all dies. Acht Farbpaletten plus ein automatischer Saisonmodus, der die richtige basierend auf dem Monat auswählt. Jede Farbe in jedem Auftritt und UI-Element bezieht sich auf das aktive Theme, sodass der Wechsel nahtlos wirkt und nicht aufgesetzt.
v1.1.0: Zwei Neue Auftritte
Version 1.1.0 fügt den Jonglierauftritt und den Feuerspucker zum Programm hinzu und bringt die Gesamtzahl auf sieben Live-Zirkusauftritte. Beide laufen mit demselben Energiesystem, das den Rest der Show antreibt — deine Tastatureingaben, Mausbewegungen und Klicks.
Der Jongleur verfolgt mehrere Bälle in echten Parabelbögen. Die Anzahl skaliert mit der Energie: zwei oder drei im Leerlauf, bis zu sechs bei voller Leistung, mit Fängen hinter dem Rücken, wenn das Publikum ausrastet. Das richtige Timing erforderte die Entkopplung der Phase jedes Balls, damit sie sich nicht verklumpen.
Der Feuerspucker nutzt das bestehende Partikelsystem, aber mit einem neuen Hitzeschimmer-Effekt. Die Flammenlänge wächst mit der Energie, und Klicks erzeugen Bonus-Feuerstöße. Der schwierigste Teil war die Farbmischung — ein fließender Übergang vom tiefen Rot an der Basis zum hellen Gelb an der Spitze, ohne dass es stufig aussieht.
Beide Auftritte fügen sich in das bestehende Rotationssystem ein, sodass du sie neben den ursprünglichen fünf wechseln siehst. Wenn du einen Favoriten festpinnen möchtest, kannst du im Einstellungspanel jetzt einzelne Auftritte ein- und ausschalten.
Die Geschichte Hinter der Geschichtsseite
Die Geschichtsseite von FleaWinder dokumentiert über vierhundert Jahre echter Flohzirkusse — von Robert Hookes Mikroskopzeichnungen im Jahr 1665 bis zu den Oktoberfest-Künstlern, die heute noch auftreten. Das Schreiben bedeutete, viktorianische Plakate, digitalisierte Zeitungsausschnitte und eine überraschende Anzahl akademischer Arbeiten über entomologische Unterhaltung zu lesen.
Das Schwierigste war die Entscheidung, was weggelassen werden sollte. Louis Bertolotto allein könnte ein Buch füllen (und tat es auch — mehrere sogar). Der Kompromiss war eine Zeitleiste, die die wichtigsten Momente trifft, und ausklappbare Abschnitte für alle, die tiefer graben wollen.
Die Seite verwendet Initialen, ornamentale Trennlinien und eine Serifenschrift, um die Flugblätter und Plakate widerzuspiegeln, die sie beschreibt. Jeder Abschnitt ist standardmäßig eingeklappt, damit der Leser nicht überwältigt wird, aber der erste Absatz ist immer sichtbar mit einer Initiale, die einen hineinzieht.
Der gesamte Text ist auf Englisch, Spanisch und Deutsch verfügbar. Der Übersetzungsprozess brachte faszinierende Lokalgeschichte zum Vorschein — die deutschen Flohzirkus-Traditionen auf dem Oktoberfest haben beispielsweise ihre eigene Linie, die sich von den Szenen in London und New York unterscheidet.
Warum Ich FleaWinder Gebaut Habe
Ich wollte etwas, das den Computer lebendig fühlen lässt — nicht ablenkend, sondern als stiller Begleiter, der auf deine Anwesenheit reagiert. Die meisten Bildschirmschoner aktivieren sich, wenn du gehst; FleaWinder aktiviert sich, wenn du kommst.
Die Idee war einfach: Nimm alle unbenutzten Eingaben, die dein Betriebssystem ignoriert — den Rhythmus deines Tippens, die Geschwindigkeit deiner Maus, den Takt deiner Klicks — und füttere damit eine Truppe animierter Zirkusflöhe. Je mehr du arbeitest, desto lebendiger wird die Show.
Es als transparente Überlagerung über der Taskleiste zu bauen, erwies sich als die richtige Beschränkung. Es ist immer sichtbar, aber nie im Weg. Du interagierst nicht direkt damit; du arbeitest einfach, und es reagiert. Die technische Herausforderung war, es wirklich klick-durchlässig zu machen, damit es nie den Fokus stiehlt.
FleaWinder ist ein Liebesbrief an den viktorianischen Flohzirkus — eine echte, jahrhundertealte Kunstform, bei der Uhrmacher echte Flöhe anspannten, um Miniaturkutschen zu ziehen und auf Seilen zu laufen. Die Geschichtsseite erzählt diese Geschichte ausführlich.
