Caso studio · Poseidon

Imparare a navigare diversamente.

Osservare una situazione, agire e capire la regola. Con Poseidon sperimento un nuovo approccio alla patente nautica francese: app native per iPhone, iPad, Apple TV e Apple Vision Pro con circa il 90% di codice condiviso.

Alcyon · rendering Metal nativo
Alcyon · rendering Metal nativo
Cliente
Progetto indipendente
Ambito
Apprendimento interattivo · App Apple native · Architettura condivisa
Clément
Clément SauvageProduct engineer e responsabile tecnico
Ruolo
Progettazione dell’esperienza didattica, design di prodotto e sviluppo di app native multipiattaforma.
Tecnologia
Swift · SwiftUI · Metal

Capire la situazione prima di scegliere una risposta.

Preparare la patente nautica richiede di collegare le regole alle situazioni sull’acqua. Le luci di una nave dipendono dall’angolo di osservazione. La marea cambia la profondità. L’ancoraggio richiede attenzione al fondo e allo spazio attorno alla barca.

Poseidon parte da queste situazioni: esplorare una scena, modificare un parametro e osservare il risultato, poi consultare spiegazione e domande. La 3D serve a rendere osservabile la regola e a dare senso alla risposta.

La maggior parte dei contenuti di Poseidon si sblocca tramite acquisti in-app.

Osservare. Sperimentare. Verificare.

01

Osservare gli indizi

Identificare fanali, segnali diurni, segnalamenti e linea d’acqua. La scena offre riferimenti concreti da collegare alla lezione.

02

Cambiare punto di vista

Girare intorno alla nave, allontanarsi o guardare sotto la superficie. Un altro angolo rivela relazioni che un’immagine fissa può nascondere.

03

Variare le condizioni

Spostare l’ora della marea o confrontare giorno e notte. Osservare i cambiamenti aiuta a distinguere le condizioni dalla regola stessa.

04

Collegare l’azione alla regola

Usare la VHF o esaminare un ancoraggio e consultare la spiegazione associata. Il gesto e il suo effetto danno contesto all’istruzione.

05

Verificare il ragionamento

Rispondere alle domande e consultare la correzione. La spiegazione aiuta a capire la scelta attesa e a riconoscere gli indizi trascurati.

06

Esercitarsi di nuovo

Riprendere un concetto negli esercizi e nelle simulazioni d’esame. L’obiettivo è riconoscere la regola in un’altra situazione e saper spiegare la scelta.

La 3D rende visibili le relazioni.

Uno schema fisso sceglie il punto di vista per chi studia. Una scena interattiva permette di chiedersi: cosa vedrei dall’altro lato della barca? Quanto spazio resta sotto lo scafo quando l’acqua scende? Dove si trova il canale rispetto al mio avvicinamento? Muovere la camera diventa un modo di ragionare nello spazio.

Costruisco le scene intorno a ciò che occorre capire. Settori dei fanali, segnali diurni, rilievi e linea d’acqua offrono riferimenti. Una sezione rivela il fondale; passare dal giorno alla notte cambia gli indizi disponibili. Oggetto, ambiente e regola devono restare coerenti.

Anche il lavoro visivo serve alla leggibilità: sagome riconoscibili, contrasti, materiali dell’acqua e inquadrature. Il realismo aiuta l’osservazione, con semplificazioni intenzionali per isolare un concetto. Sono strumenti didattici, non un simulatore di navigazione validato.

Dal gesto al pixel, con Metal.

Metal è l’API grafica e di calcolo di Apple. Consente all’app di preparare direttamente il lavoro del processore grafico, la GPU. In Poseidon, Swift gestisce lo stato dell’esercizio e le interazioni; Metal calcola le scene a partire da quello stato. Muovere la camera o cambiare le condizioni aggiorna i dati del renderer e l’immagine successiva.

Le principali scene marittime usano un rendering procedurale. Un triangolo copre lo schermo e il suo shader ricostruisce la scena per ogni frammento. Un raggio avanza dalla camera attraverso forme descritte da funzioni di distanza fino a incontrare una superficie: è il ray marching. Il motore calcola quindi materiali, illuminazione, riflessi e rifrazione dell’acqua. Rilievi, imbarcazioni e mare rispondono agli stessi parametri.

Metal offre controllo su calcoli, risorse e risoluzione, permettendo di riutilizzare gli shader sulle piattaforme Apple. Richiede anche di costruire e mantenere il motore, misurarne il costo e adattarlo ai dispositivi. La fluidità dipende dal lavoro di ogni fotogramma, non soltanto dall’API.

I concetti dietro un’immagine.

Seguendo un’azione fino allo schermo, ogni concetto trova un ruolo preciso nel percorso.

01

CPU e GPU · organizzare e calcolare

La CPU (Central Processing Unit) è il processore principale del dispositivo: esegue l’app e risponde alle tue azioni. La GPU (Graphics Processing Unit) è il processore grafico: svolge molti calcoli contemporaneamente per produrre le immagini. In Poseidon, quando ti muovi intorno a una barca, la CPU aggiorna il punto di vista; la GPU ricalcola barca, acqua e riflessi per mostrare la nuova vista.

02

Buffer e texture · trasportare dati

Un buffer è uno spazio di memoria dove l’app conserva le informazioni necessarie al processore grafico: posizione della barca, punto di vista o illuminazione. È come una scheda di dati che il processore consulta per disegnare la scena. Una texture conserva informazioni sotto forma di immagine. In Poseidon può mantenere il risultato di un primo passaggio di disegno prima di comporre l’immagine finale.

03

Shader · dare forma all’immagine

Uno shader è un piccolo programma eseguito dal processore grafico. Gli indica come calcolare una parte dell’immagine: forme, colori, luce o riflessi. In Poseidon questi programmi calcolano, per esempio, l’aspetto dello scafo e i riflessi sull’acqua. Quando cambi punto di vista, ripetono i calcoli perché la scena risponda al movimento.

04

Pipeline · preparare la ricetta

Una pipeline è un insieme di programmi e impostazioni preparati per produrre un’immagine. È come una ricetta: specifica quali shader usare e come combinarne il lavoro. Poseidon prepara ricette diverse per mare, meteo o sicurezza e sceglie quella adatta alla scena. La stessa ricetta può essere riutilizzata per ogni nuova immagine.

05

Comandi e passaggi · ordinare il lavoro

Un command buffer raggruppa il lavoro inviato alla GPU. Un encoder registra le operazioni di un passaggio di rendering; una coda ne organizza l’esecuzione. Alcune scene usano una texture intermedia prima dell’immagine finale.

06

Drawable · presentare l’immagine

Il drawable è la superficie destinata allo schermo. MetalKit ne facilita la gestione nelle viste classiche; SwiftUI offre pannelli e controlli. Su Vision Pro, il rendering spaziale usa Compositor Services e una proiezione per ogni occhio.

La fluidità si misura fotogramma per fotogramma.

Calcolare ogni pixel costa di più all’aumentare della risoluzione. Il motore misura il tempo effettivo della GPU e lo confronta con il budget del fotogramma. Se il calcolo richiede troppo tempo, riduce la risoluzione della scena e può abbassare la frequenza obiettivo. La qualità può risalire quando torna un margine sufficiente. Testi e controlli restano nell’interfaccia nativa.

Il motore limita anche i fotogrammi in attesa per non accumulare ritardo sui gesti e sospende il ciclo quando la vista passa in secondo piano. Le scelte bilanciano leggibilità, risposta e carico di calcolo. Le frequenze configurate sono obiettivi, da verificare su ogni dispositivo.

Quattro piattaforme. Circa il 90% di codice condiviso.

Le versioni iOS, iPadOS, tvOS e visionOS usano la stessa base di codice nativa. Modelli dei contenuti, regole e logica degli esercizi sono condivisi. SwiftUI fornisce componenti comuni e Metal le scene didattiche.

L’architettura permette di far evolvere la didattica in un unico punto. Una regola corretta o una lezione arricchita migliora la base delle quattro versioni. Le personalizzazioni riguardano presentazione, comandi e integrazione di sistema. Il codice comune va comunque verificato su ogni dispositivo.

Lo stesso apprendimento, usi diversi.

Condividere il codice lascia spazio alle caratteristiche di ogni schermo e modalità di interazione.

01

iPhone

Esplorare al tocco e studiare in un formato compatto. Un pannello espandibile collega scena, spiegazioni ed esercizi.

02

iPad

Affiancare scena e lezione sul grande schermo, con comandi touch e layout che si adatta all’orientamento.

03

Apple TV

Osservare sul grande schermo e usare il telecomando negli esercizi. Focus e leggibilità a distanza guidano gli adattamenti.

04

Apple Vision Pro

Ritrovare contenuti e scene in visionOS, con presentazione e interazioni adatte all’ambiente spaziale.

Un approccio didattico da mettere alla prova.

L’obiettivo è aiutare a spiegare una scelta nel suo contesto e riconoscere la regola quando cambiano le condizioni. Lezioni, esplorazione e simulazioni d’esame compongono questo percorso.

È una sperimentazione di prodotto e apprendimento. Una migliore comprensione o risultati d’esame migliori restano da valutare con gli studenti. Il codice comune facilita le iterazioni rispettando gli usi di ogni piattaforma.

Riferimenti tecnici nella documentazione Apple: Metal · Resource fundamentals · Setting up a command structure.

Un po’ di divertimento

Le boe prendono vita, i granchi diventano capitani e le espressioni marinare entrano nelle conversazioni. Ecco una selezione degli sticker di Poseidon, per ampliare l’universo dell’app con un po’ di umorismo.

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

Progetto indipendente

Costruiamo insieme il prossimo passo.

Parliamone