Fallstudie · Poseidon

Navigation anders lernen.

Eine Situation beobachten, handeln und die Regel verstehen. Mit Poseidon erprobe ich einen neuen Lernansatz für den französischen Bootsführerschein: native Apps für iPhone, iPad, Apple TV und Apple Vision Pro mit rund 90 % gemeinsamem Code.

Alcyon · natives Metal-Rendering
Alcyon · natives Metal-Rendering
Kunde
Unabhängiges Projekt
Umfang
Interaktives Lernen · Native Apple-Apps · Gemeinsame Architektur
Clément
Clément SauvageProduktentwickler und technischer Leiter
Rolle
Gestaltung des Lernkonzepts, Produktdesign und Entwicklung nativer Apps für mehrere Plattformen.
Technologie
Swift · SwiftUI · Metal

Die Situation verstehen, bevor man antwortet.

Für den Bootsführerschein müssen Regeln mit Situationen auf dem Wasser verbunden werden. Schiffslichter hängen vom Blickwinkel ab. Gezeiten verändern die Wassertiefe. Ankern erfordert einen Blick auf Grund und Platz um das Boot.

Poseidon beginnt bei diesen Situationen: eine Szene erkunden, einen Parameter ändern und das Ergebnis beobachten, dann Erklärung und Fragen bearbeiten. 3D soll die Regel sichtbar machen und der Antwort Bedeutung geben.

Der Großteil der Inhalte von Poseidon wird über In-App-Käufe freigeschaltet.

Beobachten. Ausprobieren. Prüfen.

01

Anhaltspunkte erkennen

Lichter, Tagsignale, Seezeichen und Wasserlinie erkennen. Die Szene liefert konkrete Hinweise, die sich mit der Lektion verbinden lassen.

02

Den Blickwinkel wechseln

Das Schiff umrunden, Abstand gewinnen oder unter die Oberfläche schauen. Eine andere Perspektive zeigt Zusammenhänge, die ein festes Bild verbirgt.

03

Die Bedingungen verändern

Die Gezeitenzeit einstellen oder Tag und Nacht vergleichen. Beobachtbare Veränderungen helfen, die Bedingungen von der eigentlichen Regel zu unterscheiden.

04

Handlung und Regel verbinden

Das Funkgerät bedienen oder einen Ankerplatz untersuchen und die zugehörige Erklärung lesen. Handlung und Wirkung geben der Aufgabe einen Kontext.

05

Den Gedankengang prüfen

Fragen beantworten und die Erläuterungen ansehen. Sie erklären die erwartete Entscheidung und helfen, übersehene Hinweise zu erkennen.

06

Erneut üben

Ein Thema in Übungen und Probeprüfungen wieder aufgreifen. Ziel ist, die Regel in einer anderen Situation zu erkennen und die Entscheidung erklären zu können.

3D macht Zusammenhänge sichtbar.

Eine feste Abbildung bestimmt den Blickwinkel für die Lernenden. Eine interaktive Szene lässt sie fragen: Was sähe ich auf der anderen Seite des Schiffs? Wie viel Platz bleibt unter dem Rumpf bei sinkendem Wasser? Wo liegt die Fahrrinne aus meiner Richtung? Die Kamera wird zum Werkzeug für räumliches Denken.

Ich baue die Szenen um das auf, was verstanden werden soll. Lichtsektoren, Tagsignale, Gelände und Wasserlinie geben Orientierung. Ein Schnitt zeigt den Meeresboden; der Wechsel von Tag zu Nacht verändert die verfügbaren Hinweise. Objekt, Umgebung und Regel müssen dabei zusammenpassen.

Auch die Gestaltung dient der Lesbarkeit: erkennbare Silhouetten, Kontraste, Wassermaterial und Bildausschnitte. Realismus unterstützt das Beobachten; bewusste Vereinfachungen heben einen Begriff hervor. Die Szenen sind Lernhilfen, kein validierter Navigationssimulator.

Von der Geste zum Pixel, mit Metal.

Metal ist Apples Grafik- und Berechnungs-API. Damit bereitet eine App die Arbeit des Grafikprozessors, der GPU, direkt vor. In Poseidon verwaltet Swift den Übungszustand und die Interaktionen; Metal berechnet daraus die Szenen. Eine Kamerabewegung oder veränderte Bedingungen aktualisieren die Daten und damit das nächste Bild.

Die wichtigsten maritimen Szenen werden prozedural gerendert. Ein Dreieck bedeckt den Bildschirm; sein Shader rekonstruiert die Szene für jedes Fragment. Von der Kamera aus bewegt sich ein Strahl durch Formen, die durch Distanzfunktionen beschrieben sind, bis er eine Oberfläche erreicht: Ray Marching. Danach berechnet der Renderer Material, Beleuchtung, Reflexionen und Lichtbrechung im Wasser. Gelände, Schiffe und Meer reagieren auf dieselben Szenenparameter.

Metal gibt Kontrolle über Berechnungen, Ressourcen und Auflösung, während sich Shader auf Apple-Plattformen wiederverwenden lassen. Dafür muss der Renderer entwickelt, gepflegt, gemessen und an Geräte angepasst werden. Flüssige Darstellung hängt vom Aufwand pro Bild ab, nicht allein von der API.

Die Grundbegriffe hinter einem Bild.

Eine Aktion lässt sich bis zum Bildschirm verfolgen. Jeder Begriff hat dabei eine konkrete Aufgabe.

01

CPU & GPU · organisieren und berechnen

Die CPU (Central Processing Unit) ist der Hauptprozessor des Geräts: Sie führt die App aus und reagiert auf Eingaben. Die GPU (Graphics Processing Unit) ist der Grafikprozessor: Sie führt viele Berechnungen gleichzeitig aus, um Bilder zu erzeugen. Wenn man sich in Poseidon um ein Boot bewegt, aktualisiert die CPU den Blickwinkel; die GPU berechnet Boot, Wasser und Reflexionen für die neue Ansicht.

02

Buffer & Texturen · Daten bereitstellen

Ein Buffer ist ein Speicherbereich, in dem die App Informationen für den Grafikprozessor ablegt: etwa Bootsposition, Blickwinkel oder Beleuchtung. Er lässt sich mit einem Datenblatt vergleichen, das der Prozessor beim Zeichnen der Szene liest. Eine Textur speichert Informationen in Bildform. In Poseidon kann sie das Ergebnis eines ersten Zeichenschritts festhalten, bevor das fertige Bild zusammengesetzt wird.

03

Shader · dem Bild Gestalt geben

Ein Shader ist ein kleines Programm auf dem Grafikprozessor. Es beschreibt, wie ein Teil des Bildes berechnet wird: Formen, Farben, Licht oder Spiegelungen. In Poseidon berechnen diese Programme zum Beispiel das Aussehen des Rumpfs und die Reflexionen auf dem Wasser. Bei einem anderen Blickwinkel berechnen sie das Bild neu, damit die Szene auf die Bewegung reagiert.

04

Pipeline · das Rezept vorbereiten

Eine Pipeline ist ein vorbereitetes Paket aus Programmen und Einstellungen zur Bilderzeugung. Wie ein Rezept legt sie fest, welche Shader verwendet und wie ihre Aufgaben kombiniert werden. Poseidon bereitet verschiedene Rezepte für Meer, Wetter oder Sicherheit vor und wählt das passende zur Szene. Dasselbe Rezept lässt sich für jedes neue Bild wiederverwenden.

05

Befehle & Durchläufe · Arbeit ordnen

Ein Command Buffer bündelt GPU-Arbeit. Ein Encoder zeichnet die Operationen eines Renderdurchlaufs auf, eine Befehlswarteschlange ordnet ihre Ausführung. Manche Szenen nutzen eine Zwischentextur vor dem endgültigen Bild.

06

Drawable · das Bild anzeigen

Das Drawable ist die für den Bildschirm bestimmte Fläche. MetalKit verwaltet sie in klassischen Ansichten; SwiftUI liefert die umgebenden Bedienelemente. Auf Vision Pro verwendet das räumliche Rendering Compositor Services mit einer Projektion pro Auge.

Flüssigkeit wird Bild für Bild gemessen.

Mit höherer Auflösung wird die Berechnung pro Pixel teurer. Der Renderer misst die tatsächliche GPU-Zeit und vergleicht sie mit dem Zeitbudget eines Bildes. Bei Überlastung senkt er die Szenenauflösung und gegebenenfalls die angestrebte Bildrate. Bei ausreichendem Spielraum kann die Qualität wieder steigen. Texte und Bedienelemente bleiben in der nativen Oberfläche.

Der Renderer begrenzt ausstehende Bilder, damit Eingaben nicht durch eine wachsende Warteschlange verzögert werden. Im Hintergrund pausiert die Renderschleife. Diese Entscheidungen wägen Lesbarkeit, Reaktionsfähigkeit und Rechenlast ab. Konfigurierte Bildraten sind Ziele und ersetzen keine Messung auf jedem Gerät.

Vier Plattformen. Rund 90 % gemeinsamer Code.

iOS, iPadOS, tvOS und visionOS verwenden dieselbe native Codebasis. Inhaltsmodelle, Regeln und Übungslogik werden gemeinsam genutzt. SwiftUI liefert gemeinsame Oberflächenkomponenten, Metal die Lernszenen.

So entwickelt sich das Lernkonzept an einer zentralen Stelle weiter. Korrigierte Regeln und ergänzte Lektionen kommen der Grundlage aller vier Versionen zugute. Anpassungen betreffen Darstellung, Bedienung und Systemintegration. Gemeinsamer Code muss dennoch auf jedem Gerät geprüft werden.

Dasselbe Lernen, unterschiedliche Nutzung.

Gemeinsamer Code lässt Raum für die Besonderheiten jedes Bildschirms und jeder Eingabemethode.

01

iPhone

Per Touch erkunden und im kompakten Format lernen. Ein aufklappbares Panel verbindet Szene, Erklärungen und Übungen.

02

iPad

Szene und Lektion auf dem großen Display nebeneinander sehen, mit Touch-Bedienung und an die Ausrichtung angepasstem Layout.

03

Apple TV

Auf dem großen Bildschirm beobachten und Übungen per Fernbedienung steuern. Fokusnavigation und Lesbarkeit aus der Entfernung bestimmen die Anpassungen.

04

Apple Vision Pro

Inhalte und Szenen in visionOS nutzen, mit Darstellung und Interaktionen für die räumliche Umgebung.

Ein Lernansatz, der sich bewähren muss.

Ziel ist, Entscheidungen in einer Situation erklären und die passende Regel unter veränderten Bedingungen erkennen zu können. Lektionen, Erkundung und Probeprüfungen bilden diesen Weg.

Das Projekt erprobt Produktgestaltung und Lernen. Besseres Verständnis oder höhere Bestehensquoten müssen mit Lernenden untersucht werden. Gemeinsamer Code erleichtert Iterationen und erhält die Eigenheiten jeder Plattform.

Technische Grundlagen in Apples Dokumentation: Metal · Resource fundamentals · Setting up a command structure.

Ein bisschen Spaß

Seezeichen werden lebendig, Krabben werden Kapitäne und maritime Redewendungen finden ihren Weg in Gespräche. Diese Auswahl an Poseidon-Stickern ergänzt die Welt der App mit einer Prise Humor.

Poseidon-Sticker : « Garde le nord ! »
Poseidon-Sticker : « Bien reçu ! »
Poseidon-Sticker : « Cap sur le week-end ! »
Poseidon-Sticker : « Salut, matelot ! »
Poseidon-Sticker : « Je perds le nord »
Poseidon-Sticker : « Je rame… »
Poseidon-Sticker : « Ça tangue »
Poseidon-Sticker : « Tu es mon phare »
Poseidon-Sticker : « Permis en poche ! »
Poseidon-Sticker : « Je fais le point. »
Poseidon-Sticker : « Un compas dans l’œil. »
Poseidon-Sticker : « Alfa, bravo… bravo ! »