Casestudy · Poseidon
Anders leren varen.
Een situatie bekijken, handelen en de regel begrijpen. Met Poseidon verken ik een andere leermethode voor het Franse vaarbewijs, met native apps voor iPhone, iPad, Apple TV en Apple Vision Pro. Ongeveer 90% van hun code is gedeeld.
- Klant
- Onafhankelijk project
- Omvang
- Interactief leren · Native Apple-apps · Gedeelde architectuur
- Clément
- Clément SauvageProduct engineer en technisch leider
- Rol
- Ontwerp van de leerervaring, productontwerp en ontwikkeling van native apps voor meerdere platforms.
- Technologie
- Swift · SwiftUI · Metal
01
De situatie begrijpen voordat je een antwoord kiest.
Voor het vaarbewijs moet je regels verbinden met situaties op het water. Scheepslichten hangen af van de kijkhoek. Het getij verandert de beschikbare diepte. Ankeren vraagt aandacht voor de bodem en ruimte rond de boot.
Poseidon begint bij die situaties: een scène verkennen, een instelling veranderen en het resultaat bekijken, gevolgd door uitleg en vragen. 3D moet de regel zichtbaar maken en betekenis geven aan het antwoord.
Het grootste deel van de inhoud van Poseidon wordt ontgrendeld via in-appaankopen.
02
Kijken. Uitproberen. Controleren.
Herkenningspunten bekijken
Lichten, dagmerken, betonning en de waterlijn herkennen. De scène geeft concrete aanwijzingen om met de les te verbinden.
Het standpunt veranderen
Rond het schip bewegen, afstand nemen of onder het wateroppervlak kijken. Een andere hoek toont verbanden die een vaste afbeelding kan verbergen.
De omstandigheden variëren
De getijtijd aanpassen of dag en nacht vergelijken. Door veranderingen te bekijken, worden de omstandigheden en de regel zelf van elkaar onderscheiden.
Handeling en regel verbinden
De marifoon bedienen of een ankerplaats onderzoeken en de bijbehorende uitleg lezen. De handeling en het gevolg geven de opdracht context.
De redenering controleren
Vragen beantwoorden en de toelichting bekijken. De uitleg helpt de verwachte keuze te begrijpen en gemiste aanwijzingen te herkennen.
Opnieuw oefenen
Een begrip opnieuw behandelen in oefeningen en proefexamens. Het doel is de regel in een andere situatie te herkennen en de keuze te kunnen uitleggen.
03
3D maakt verbanden zichtbaar.
Een vaste afbeelding kiest het standpunt voor de leerling. Een interactieve scène laat vragen toe: wat zie ik aan de andere kant van het schip? Hoeveel ruimte blijft onder de romp als het water daalt? Waar ligt de vaargeul vanuit mijn richting? De camera verplaatsen wordt een manier om ruimtelijk te redeneren.
Ik bouw de scènes rond wat begrepen moet worden. Lichtsectoren, dagmerken, reliëf en de waterlijn bieden houvast. Een doorsnede toont de bodem; de overgang van dag naar nacht verandert de beschikbare aanwijzingen. Object, omgeving en regel moeten met elkaar blijven kloppen.
Ook het beeld dient de leesbaarheid: herkenbare silhouetten, contrast, watermaterialen en kadrering. Realisme ondersteunt de waarneming, met bewuste vereenvoudigingen om een begrip uit te lichten. De scènes zijn leermiddelen, geen gevalideerde navigatiesimulator.
04
Van gebaar naar pixel, met Metal.
Metal is Apples API voor grafische weergave en berekeningen. Daarmee bereidt een app rechtstreeks het werk van de grafische processor, de GPU, voor. In Poseidon beheert Swift de oefenstatus en interacties; Metal berekent de scènes vanuit die status. De camera verplaatsen of omstandigheden wijzigen verandert de rendergegevens en vervolgens het volgende beeld.
De belangrijkste maritieme scènes gebruiken procedurele rendering. Een driehoek vult het scherm; de shader reconstrueert de scène voor elk fragment. Vanuit de camera beweegt een straal door vormen beschreven met afstandsfuncties tot hij een oppervlak raakt: ray marching. Daarna berekent de renderer materialen, licht, reflecties en lichtbreking in water. Terrein, schepen en zee reageren zo op dezelfde scèneparameters.
Metal geeft controle over berekeningen, middelen en resolutie, terwijl shaders op Apple-platforms herbruikbaar zijn. Dat vraagt ook om ontwikkeling, onderhoud, metingen en aanpassingen aan apparaten. Vloeiendheid hangt af van het werk per beeld, niet alleen van de API.
05
De begrippen achter een beeld.
Volg een handeling tot aan het scherm. Elk begrip heeft een eigen taak in dat traject.
CPU & GPU · organiseren en berekenen
De CPU (Central Processing Unit) is de hoofdprocessor van het apparaat: hij voert de app uit en reageert op je handelingen. De GPU (Graphics Processing Unit) is de grafische processor: hij voert veel berekeningen tegelijk uit om beelden te maken. Als je in Poseidon rond een boot beweegt, werkt de CPU het standpunt bij; de GPU berekent de boot, het water en de reflecties voor het nieuwe beeld.
Buffers & textures · gegevens doorgeven
Een buffer is een plek in het geheugen waar de app informatie voor de grafische processor bewaart, zoals de positie van de boot, het standpunt of de verlichting. Zie het als een gegevensblad dat de processor raadpleegt om de scène te tekenen. Een texture bewaart informatie als een afbeelding. In Poseidon kan die het resultaat van een eerste tekenstap vasthouden voordat het eindbeeld wordt samengesteld.
Shaders · het beeld vormgeven
Een shader is een klein programma dat op de grafische processor draait. Het beschrijft hoe een deel van het beeld wordt berekend: vormen, kleuren, licht of reflecties. In Poseidon berekenen deze programma’s bijvoorbeeld het uiterlijk van de romp en de reflecties op het water. Als je het standpunt verandert, rekenen ze opnieuw zodat de scène op je beweging reageert.
Pipeline · het recept voorbereiden
Een pipeline is een voorbereid pakket van programma’s en instellingen om een beeld te maken. Zoals een recept bepaalt het welke shaders worden gebruikt en hoe hun werk wordt gecombineerd. Poseidon bereidt verschillende recepten voor zee, weer en veiligheid voor en kiest het juiste voor de scène. Hetzelfde recept kan voor elk nieuw beeld opnieuw worden gebruikt.
Opdrachten & passes · werk ordenen
Een command buffer bundelt werk voor de GPU. Een encoder legt de opdrachten van een renderpass vast; een wachtrij organiseert de uitvoering. Sommige scènes gebruiken een tussentijdse texture voordat het eindbeeld wordt samengesteld.
Drawable · het beeld tonen
De drawable is het oppervlak bestemd voor het scherm. MetalKit beheert dit in klassieke weergaven; SwiftUI levert panelen en bediening. Op Vision Pro gebruikt ruimtelijke rendering Compositor Services met een projectie voor elk oog.
06
Vloeiendheid wordt beeld voor beeld gemeten.
Berekening per pixel wordt duurder bij een hogere resolutie. De renderer meet de werkelijke GPU-tijd en vergelijkt die met het tijdsbudget. Duurt het te lang, dan verlaagt hij de scèneresolutie en eventueel de beoogde beeldsnelheid. De kwaliteit kan weer stijgen zodra er voldoende ruimte is. Tekst en bediening blijven in de native interface.
De renderer beperkt ook wachtende beelden om vertraging van gebaren te voorkomen en pauzeert de renderlus wanneer de weergave naar de achtergrond gaat. Die keuzes wegen leesbaarheid, reactiesnelheid en rekenbelasting af. Ingestelde beeldsnelheden zijn doelen; metingen op elk apparaat blijven nodig.
07
Vier platforms. Ongeveer 90% gedeelde code.
De versies voor iOS, iPadOS, tvOS en visionOS gebruiken dezelfde native codebasis. Inhoudsmodellen, regels en oefenlogica zijn gedeeld. SwiftUI levert gemeenschappelijke interfacecomponenten; Metal wordt gebruikt voor de leerscènes.
Zo kan de leerervaring op één plek verder worden ontwikkeld. Een verbeterde regel of les komt de basis van alle vier versies ten goede. Aanpassingen richten zich op presentatie, bediening en systeemintegratie. Gedeelde code vraagt nog steeds om controle op elk apparaat.
08
Hetzelfde leren, verschillende manieren van gebruik.
Code delen laat ruimte voor de eigenschappen van elk scherm en elke invoermethode.
iPhone
Met aanraking verkennen en compact studeren. Een uitklapbaar paneel verbindt de scène met uitleg en oefeningen.
iPad
Scène en les naast elkaar houden op een groot scherm, met aanraakbediening en een indeling die zich aan de oriëntatie aanpast.
Apple TV
Op een groot scherm kijken en oefeningen met de afstandsbediening doorlopen. Focusnavigatie en leesbaarheid op afstand bepalen de aanpassingen.
Apple Vision Pro
Inhoud en scènes gebruiken in visionOS, met presentatie en interacties afgestemd op de ruimtelijke omgeving.
09
Een leermethode om te toetsen.
De ambitie is om keuzes in hun context te helpen uitleggen en de regel te herkennen wanneer omstandigheden veranderen. Lessen, verkenning en proefexamens vormen dit traject.
Het is een experiment in productontwerp en leren. Beter begrip of hogere slagingspercentages moeten nog met leerlingen worden onderzocht. Gedeelde code helpt bij iteraties en behoudt het eigen gebruik van elk platform.
Technische achtergrond in Apples documentatie: Metal · Resource fundamentals · Setting up a command structure.
10
Een beetje plezier
Boeien komen tot leven, krabben worden kapiteins en maritieme uitdrukkingen duiken op in gesprekken. Deze selectie Poseidon-stickers geeft de wereld van de app een vleugje humor.
