{ "id": 36897, "slug": "2025-03-10_dati-di-allenamento-in-3d", "url": "https://agents.willem.com/it/posts/2025-03-10_dati-di-allenamento-in-3d/", "source_url": "https://willem.com/it/2025-03-10_dati-di-allenamento-in-3d/", "language": "it", "date": "2025-03-10", "published": "2025-03-10T00:00:00+01:00", "created": "2025-06-26T21:29:41.554000+02:00", "updated": "2026-10-20T09:21:55.458000+02:00", "title": "Dati di allenamento in 3D", "subtitle": "Esplorare la grafica 3D sul web per i dati fitness", "summary": "Mentre correvo i miei giri intorno al paese, mi è venuto in mente che potevo usare ThreeJS per creare una rappresentazione 3D dinamica dei miei dati di allenamento. Leggi cosa ho costruito: è un work in progress, ma è un'esplorazione entusiasmante del concetto.", "topics": [ "data", "gran fondo", "running", "web" ], "author": { "name": "Willem L. Middelkoop", "url": "https://willem.com" }, "provenance": { "kind": "model", "method": "Claude Sonnet, two passes (translation, then proofreading) against a glossary and hunspell", "date": "2026-10-20", "reviewed_by_native_reader": false, "language": "it", "source_language": "en" }, "translations": [ { "language": "en", "title": "Workout data in 3D", "url": "https://agents.willem.com/en/posts/2025-03-10_workout-data-in-3d/", "source_url": "https://willem.com/en/2025-03-10_workout-data-in-3d/" }, { "language": "nl", "title": "Trainingsdata in 3D", "url": "https://agents.willem.com/nl/posts/2025-03-10_trainingsdata-in-3d/", "source_url": "https://willem.com/nl/2025-03-10_trainingsdata-in-3d/" }, { "language": "de", "title": "Trainingsdaten in 3D", "url": "https://agents.willem.com/de/posts/2025-03-10_trainingsdaten-in-3d/", "source_url": "https://willem.com/de/2025-03-10_trainingsdaten-in-3d/" }, { "language": "es", "title": "Datos de entrenamiento en 3D", "url": "https://agents.willem.com/es/posts/2025-03-10_datos-de-entrenamiento-en-3d/", "source_url": "https://willem.com/es/2025-03-10_datos-de-entrenamiento-en-3d/" }, { "language": "fr", "title": "Données d'entraînement en 3D", "url": "https://agents.willem.com/fr/posts/2025-03-10_donnees-d-entrainement-en-3d/", "source_url": "https://willem.com/fr/2025-03-10_donnees-d-entrainement-en-3d/" }, { "language": "pt", "title": "Dados de treino em 3D", "url": "https://agents.willem.com/pt/posts/2025-03-10_dados-de-treino-em-3d/", "source_url": "https://willem.com/pt/2025-03-10_dados-de-treino-em-3d/" }, { "language": "pap", "title": "Data di Entrenamentu den 3D", "url": "https://agents.willem.com/pap/posts/2025-03-10_data-di-entrenamentu-den-3d/", "source_url": "https://willem.com/pap/2025-03-10_data-di-entrenamentu-den-3d/" }, { "language": "fy", "title": "Trainingsgegevens yn 3D", "url": "https://agents.willem.com/fy/posts/2025-03-10_trainingsgegevens-yn-3d/", "source_url": "https://willem.com/fy/2025-03-10_trainingsgegevens-yn-3d/" } ], "image": "https://willem.com/global/images/9121ad1c6c99.webp", "image_width": 2560, "images": [ { "url": "https://willem.com/global/images/54e7cade7a7a.webp", "description": "RunnerUp: ha registrato la mia corsa di 11K e ha prodotto il file TCX con i dati dell'allenamento", "manager_file": "148-bf2d6faf6057f115dc72e82d984e71359f16b48d8c42b4b41c2ee918cf46b556_ContentAsPost_36897_images-1.png" } ], "text": "Sto esplorando modi per visualizzare i dati di allenamento, usando tecnologie web per la compatibilità tra dispositivi, per Gran_Fondo (https://willem.com/en/2025-03-06_open-sourcing-gran-fondo/), la mia app di corsa e ciclismo. ThreeJS (https://threejs.org/), uno strumento di rendering 3D per i browser, funziona senza problemi sia su schermi grandi che piccoli. Uso il formato TCX per i dati di allenamento perché si presta bene a essere letto con le tecnologie standard del browser e del web. Per questo progetto ho preso una sessione registrata della mia corsa del 9 marzo: il mio solito giro di 1,8KM intorno al paese, ripetuto 6 volte identiche (11KM in tutto). Mi piace questo percorso: poco traffico e poche distrazioni, così posso concentrarmi sulla corsa. Ho raccolto i dati TCX con l'app RunnerUp; fa il suo lavoro ma sembra un po' datata e non permette di analizzare ed esplorare i dati in modo interattivo.\nCome prova di concetto per esplorare la presentazione in 3D, ho costruito un prototipo che carica il file TCX con i dati dell'allenamento. Il browser li legge e genera due visualizzazioni: un rendering 3D con ThreeJS e un grafico lineare 2D del ritmo. Il colore rappresenta la velocità: più la linea è verde, più il ritmo è veloce. La visualizzazione 3D ruota come un disco in vinile e mostra i miei sei giri intorno al paese, con una forma che corrisponde alla mappa. Per collegare i due grafici ho aggiunto un cerchio bianco che segna lo stesso istante in entrambi, per far capire il legame tra le due viste.\n
Demo del rendering 3D di Gran Fondo: una visualizzazione interattiva dei dati di allenamento con ThreeJS
\nLa visualizzazione è fatta al 100% con tecnologie web: ThreeJS disegna il percorso 3D della corsa, un secondo canvas HTML5 sovrappone un grafico 2D del ritmo e un unico ciclo di animazione unisce le due scene con un punto che scorre, tenendo sincronizzati percorso e grafico. Fa parte di una fase di sperimentazione in cui \"penso ad alta voce\", cercando modi innovativi per visualizzare i dati fitness. È una demo per la mia prossima app Gran Fondo, che punta a migliorare il tracciamento interattivo dell'attività fisica con visualizzazioni ricche e coinvolgenti.\nGuarda la visualizzazione sul tuo computer aprendo questa pagina: demo (https://willem.com/etcetera/2025-03-10_GranFondo-3D-rendering/) Tieni presente che non è una demo rifinita, è \"appena uscita dal banco di lavoro\" e funziona bene soprattutto con la finestra in orizzontale. Le versioni future saranno molto più curate, con tutti gli elementi adattati a un design responsive.\nL'app Gran Fondo includerà frequenza cardiaca, cadenza e potenza per analisi più approfondite. L'interattività permetterà di ruotare il grafico 3D con il tocco e di ingrandire i dettagli. Il mio obiettivo è rendere l'analisi dell'allenamento più immersiva, intuitiva e coinvolgente per gli atleti che vogliono una visione completa delle proprie prestazioni.\nConclusione\nLa sperimentazione è una parte fondamentale della progettazione del software: ti permette di provare idee, affinare concetti e raccogliere il parere degli altri. Questa visualizzazione 3D dell'allenamento ne è un esempio. C'è ancora molto da esplorare. Resta sintonizzato su questo blog per i prossimi aggiornamenti mentre continuo a sviluppare Gran Fondo!", "word_count": 528, "markdown_url": "https://agents.willem.com/it/posts/2025-03-10_dati-di-allenamento-in-3d/post.md" }