Animation ist teuer: Sie kostet Aufmerksamkeit, und Aufmerksamkeit hat der Bote nicht, wenn er mit dem Essen durch den Kiez läuft. Deshalb hier nicht alles, was ginge, sondern die Stellen, an denen Bewegung eine Information trägt, die man sonst nicht sieht. Alle vier laufen unten echt — Knopf drücken, dann noch einmal.
Kiezi begleitet die Runner, wenn gerade nichts los ist: Im leeren Auftrags-Bildschirm fällt er von oben herein, landet mit einem Stauchen, streckt die Zunge raus – und wenn ihm langweilig wird, führt er eine seiner 80 Nummern auf. In der App alle fünf Minuten; hier alle 40 Sekunden, auf Knopfdruck oder beim Antippen (die Tippfläche liegt unten in der Mitte, wie in der App).
Das ist dieselbe Bühne wie in der App: Maße, Farben, Zeiten und Kurven kommen 1:1 aus dem App-Code, die Figur besteht aus Bauteilen (Arm, Zunge, Rakete, Flamme, Fallschirm) statt aus Bildern. Bisher fünf der 80 Nummern. Wer „Bewegung reduzieren“ eingeschaltet hat, sieht ihn sitzend, Zunge raus.
Zum Splash zuerst die Einschränkung: Der native Startbildschirm ist ein statisches Bild. Android
zeigt ihn, bevor überhaupt JavaScript läuft — dort lässt sich mit expo-splash-screen nichts
animieren. Ab Android 12 könnte das System ein animiertes Vektor-Icon zeigen, aber dafür bräuchte es ein
eigenes Config-Plugin, das die Drawable-XML schreibt, und das ist fehleranfällig und auf ~1 Sekunde
begrenzt.
Der gangbare Weg ist die Übergabe: Der native Splash bleibt stehen (preventAutoHideAsync),
die App rendert darunter dieselbe Marke auf demselben Grund — und übernimmt dann mit der Animation. Für den
Betrachter ist das ein durchgehender Vorgang, weil das erste Bild identisch ist. Das läuft auf beiden
Plattformen, überlebt jedes prebuild und darf länger dauern als eine Sekunde.
Die Marke zeichnet sich in der Reihenfolge ihrer Bedeutung: erst der Block, dann der Weg zum Restaurant, der Safranpunkt als Abholung, zuletzt die Schritte zurück. In 1,2 Sekunden ist die Geschäftsidee erzählt, ohne ein Wort.
Der wichtigste Schirm im Produkt: Hier wartet jemand. Heute springt der Fortschritt lautlos um — man muss zweimal hinsehen, ob sich etwas geändert hat. Die Linie, die sich füllt, sagt „gerade eben ist etwas passiert“, auch wenn man das Handy nur kurz aus der Tasche zieht.
StepLine bekommt eine
animierte Füllung, sonst nichts.Der emotionale Höhepunkt des Ablaufs — und heute ein harter Schnitt. Die Spur läuft ein letztes Mal durch, der Suchring löst sich auf, und an seiner Stelle steht der Bote. Ein Takt, nicht mehr: Danach will man die Karte sehen, nicht die Animation.
RouteProgress gibt es schon,
er bekommt einen Abschluss statt eines Abbruchs.Der Lohn für den Lauf. Ein kurzes Aufsteigen der Zahl macht aus einer Anzeige eine Quittung. Das ist die einzige Stelle, an der Bewegung reine Belohnung sein darf — hier wartet niemand auf Information, hier ist der Auftrag vorbei.
Animated.Value auf
Deckkraft und Verschiebung.Damit die vier oben wirken, muss der Rest still bleiben. Bewegung, die nichts erzählt, macht aus einer ruhigen App eine zappelige — und wirkt nach dem dritten Mal wie ein Fehler.
Unabhängig von Bewegung: Der Bote bewegt sich auf der Karte in Sprüngen, weil jede neue Position den Marker versetzt. Zwischen zwei Standorten zu interpolieren wäre keine Verzierung, sondern die ehrlichere Darstellung — er geht ja tatsächlich, statt zu springen. Das ist die einzige Stelle, an der Bewegung sogar korrekter ist als Stillstand. Aufwand: klein im SVG-Fallback, mittel bei MapLibre.