--- title: "Piattaforma di Telemonitoraggio e Assistenza: Case Study · Volcanic Minds" description: "Sviluppo di una dashboard di telecare per il monitoraggio sanitario remoto. Scopri come abbiamo garantito sicurezza e affidabilità per i pazienti." url: "https://volcanicminds.com/case-studies/telecare-monitoring-dashboard" lang: "it" type: "second_level_page" updated: "2026-10-12" alternate: "https://volcanicminds.com/en/case-studies/telecare-monitoring-dashboard" summary: "Un'interfaccia di controllo e monitoraggio per il telesoccorso, con cui abbonati e istituti di vigilanza gestiscono dispositivi, accessori e notifiche di emergenza in tempo reale. Il partner aveva già il backend: abbiamo curato tutta l'interfaccia, dal progetto in Figma al frontend React collegato alle sue API, da usare in centrale come su tablet e smartphone." --- # Monitoraggio telesoccorso e vigilanza Una dashboard che completa la piattaforma permette ad abbonati e istituti di vigilanza di gestire device di teleassistenza, configurare accessori e monitorare notifiche di emergenza in tempo reale. - **H24** Monitoraggio - **100%** Accessibilità - **20+** Device Supportati - **100%** Pure Web ## Il punto di partenza *La sfida* Quando gli istituti di vigilanza e gli utenti preposti devono monitorare la sicurezza di anziani, persone fragili o siti remoti, la tempestività visiva e logica è tutto. Il nostro partner tecnologico possedeva una solida infrastruttura backend ad alta affidabilità e gestiva perfettamente i nodi hardware e i sensori di allarme fisici. Il collo di bottiglia risiedeva però nel livello applicativo e di usabilità: serviva tradurre flussi di dati complessi e crudi in una dashboard utilizzabile istantaneamente dagli operatori in control room. - Frontend: 5 / 5 - Accessibilità: 5 / 5 - UX/UI: 5 / 5 - Integrazioni: 3 / 5 - Security: 4 / 5 ## Il problema riscontrato Il rischio di complessità eccessiva. Il nostro compito è stato prendere in carico l'intera spina dorsale dell'interfaccia utente: dalla progettazione iniziale su Figma per delineare l'architettura delle informazioni, fino alla scrittura del codice frontend definitivo, strutturato per agganciarsi al backend del partner in modo dinamico e senza frizioni. ## Lo stack - Figma - React - TailwindCSS - MUI ## Come abbiamo lavorato. 1. **Creazione mockup e ideazione UI/UX** — Tradurre le esigenze di una control room di sorveglianza in wireframe razionali, interfacciandosi con il committente per validare la chiarezza visiva di ogni singola schermata prima di toccare codice. 2. **Sviluppo frontend modulare** — Scrivere la logica React lato client per agganciarsi stabilmente alle API esterne del partner, mantenendo la coerenza dei dati mostrati sottoposti ad aggiornamenti continui. 3. **Piena accessibilità cross-device** — Conformare un'esperienza visiva che non sbavasse in complessità passando dai monitor in stazione di controllo agli schermi ridotti di tablet e smartphone. 4. **Pairing e onboarding hardware** — Instaurare un handshake per il pairing tramite BT di dispositivi IoT così da semplificarne la configurazione ## Caratteristiche sotto esame Focus su funzionalità e soluzioni ## Progettazione operativa *Il punto d'ingresso* Abbiamo progettato e sviluppato la user interface affinché fosse immediato tradurre le metriche inviate dal server. Lo stato di connessione e l'alimentazione sono condensati visivamente. Utenti e addetti ricevono la stringa disconnessa trasformata in una priorità grafica ben evidenziata, senza ricaricare la pagina browser. ## Estensione di dispositivi e accessori *Accessibilità completa* L'infrastruttura di telecare imponeva la massima modularità. Abbiamo progettato il sistema, fin dalle fondamenta, per essere mobile-first ma senza rinunciare alla qualità e occupazione delle informazioni anche su schermi più grandi. ## Monitoraggio dispositivi *Poche distrazioni* Ogni card dispositivo riporta i dati principali, fornendo a colpo d'occhio tutte le informazioni necessari per individuare guasti, problemi di allerta o situazioni in cui intervenire. Le notifiche persistenti insieme ai messaggi temporanei di feedback avvisano immediatamente di ogni cambio in corso. ## Hai un progetto simile? Il valore intrinseco delle funzionalità e dei dati, perde di valore se non galvanizzato da interfacce opportune. Ridisegnare wireframe e ingegnerizzare i flussi utente impone di comprendere a fondo il comportamento degli utenti e quali dati saranno realmente utili. - [Prenota una call](https://vms.srl/booking) ## Domande frequenti Domande sul progetto ### Di cosa vi siete occupati in questo progetto? Abbiamo analizzato il comportamento dell'utente e studiato le funzionalità offerte dal solido backend del cliente, dando così vita a wireframe e a mockup. Lo sviluppo dell'intero progetto dashboard è iniziato solo dopo aver condiviso e discusso col partner di tutto lo user journey e la user experience. ### La dashboard funziona su dispositivi mobili? Assolutamente sì, l'intera dashboard è progettata progettata per funzionare su qualsiasi dispositivo (smartphone, tablet o pc) che abbia accesso a un browser moderno. Questo è stato un requisito fondamentale emerso durante lo studio del comportamento utente. ### Come si aggiungono nuovi device IoT? In modalità mobile, la dashboard sfrutta la connessione BT (bluetooth) per effettuare un handshaking di identificazione e collegamento. Il dispositivo viene così aggiunto diventando istantaneamente disponibile su qualsiasi interfaccia aperta (che sia mobile, tablet o direttamente su pc). ### È possibile rinnovare solo il frontend di un software gestionale esistente? Assolutamente sì, ed è esattamente l'approccio *decoupled* (o Headless) che abbiamo adottato per questo progetto. In pratica, molte aziende possiedono backend robusti ma interfacce obsolete che rallentano le operazioni. Sviluppando un frontend moderno, possiamo "agganciarci" tramite API a qualsiasi sistema preesistente. Questo abbatte i costi di ricostruzione totale, riduce il rischio tecnologico e permette di lanciare una User Experience moderna e performante in tempi rapidi, estendendo il ciclo di vita del software aziendale. ### Una dashboard così strutturata è pronta per integrare logiche di Intelligenza Artificiale o Automazione Avanzata? In questo progetto abbiamo curato la parte di design e di sviluppo della dashboard, tuttavia per altri progetti ci siamo occupati di integrare veri assistenti agentici AI (non semplici chatbot) in grado di aumentare ulteriormente l'efficienza operativa.