Inserisci la password per accedere a questo case study.
Enter the password to access this case study.
Case study · 2023–2024 · Enterprise UX
Un ridisegno guidato dalla ricerca della piattaforma interna di monitoraggio video di BSB, usata dagli operatori di 14 concessionarie autostradali per gestire oltre 5.000 flussi live da telecamera.
A research-driven redesign of BSB's internal video-monitoring platform, used by operators across 14 motorway concessionaires to manage over 5,000 live camera streams.
01
Contesto & problemaContext & problem
La piattaforma di BSB era cresciuta in modo organico per oltre un decennio, ogni nuova funzione aggiunta alla struttura esistente senza un'architettura dell'informazione coerente. Gli operatori che gestivano migliaia di flussi simultanei navigavano interfacce dense e incoerenti, senza una gerarchia chiara.
La sfida non era solo visiva: il sistema non aveva un modello unificato delle relazioni tra flussi, telecamere, codec e nodi geografici. Gli utenti avevano sviluppato workaround complessi, schede del browser, fogli di calcolo, passaggi verbali, per compensare ciò che l'interfaccia non mostrava.
BSB's platform had grown organically over a decade, each new feature bolted onto the existing structure with no coherent information architecture. Operators managing thousands of simultaneous streams navigated dense, inconsistent interfaces with no clear hierarchy.
The challenge was not just visual: the system had no unified model of how streams, cameras, codecs and geographic nodes related. Users had built elaborate workarounds, browser tabs, spreadsheets, verbal handoffs, to compensate for what the interface couldn't show.
02
Ricerca & discoveryResearch & discovery
Le sessioni alternavano osservazione, co-design e validazione, con partecipanti da quattro ruoli: operatori di sala controllo, ingegneri di rete, responsabili regionali e amministratori di sistema.
Sessions alternated observation, co-design and validation, with participants from four roles: control-room operators, network engineers, regional managers and system administrators.
03
04
Ogni decisione è radicata in un comportamento osservato, validata tramite test di prototipo e bilanciata con i vincoli ingegneristici.
Each decision is grounded in observed behaviour, validated through prototype testing, and balanced against engineering constraints.
ProblemaProblem
{{ d.problem }}
Scelta di designDesign choice
{{ d.choice }}
MotivazioneRationale
{{ d.rationale }}
05
Il sistema ridisegnato è stato rilasciato nel Q1 2024, unificando la vista mappa e la lista flussi in un'unica interfaccia con default basati sul ruolo.
The redesigned system shipped in Q1 2024, consolidating the map view and stream list into a unified interface with role-based defaults.
Indagine su un flusso degradato: da 14 min a meno di 6 min nei test di usabilità.Investigating a degraded stream: from 14 min to under 6 min in usability testing.
Etichettatura incoerente sostituita da un unico modello a 5 stati.Inconsistent labelling replaced by a single 5-state model.
Operatori, ingegneri, manager e admin, con default adeguati al ruolo.Operators, engineers, managers and admins, with role-appropriate defaults.
06
Il ridisegno ha introdotto una libreria di componenti condivisa per navigazione, indicatori di stato, tabelle, overlay di mappa e pannelli di dettaglio, garantendo coerenza visiva e comportamentale, consegnata con specifiche annotate per breakpoint, stati e casi limite.
The redesign introduced a shared component library for navigation, status indicators, tables, map overlays and detail panels, ensuring visual and behavioural consistency, handed off with annotated specs for breakpoints, states and edge cases.
07
I test di usabilità confermano l'intento; i dati sul campo confermano il risultato. Queste sono le metriche che strumenterei nei primi 90 giorni post-lancio.
Usability testing confirms intent; field data confirms outcome. These are the metrics I'd instrument in the first 90 days post-launch.
{{ m.body }}
{{ m.target }}info@omaramato.com
© {{ year }} Antonino Omar Amato · Case study · Rete autostradale italianaCase study · Italy motorway network
Contesto & problemaContext & problem
Fisioterapisti e osteopati freelance, dai 10 ai 40 pazienti a settimana, lavorano ancora con agende cartacee, fogli Excel e promemoria mentali. Ogni ora sottratta alla cura è un'ora spesa a ricordare.
Freelance physiotherapists and osteopaths, 10 to 40 patients a week, still run on paper agendas, spreadsheets and mental reminders. Every hour taken from care is an hour spent remembering.
~1 h
al giorno in scartoffie, sottratte alle sedutea day on paperwork, taken from sessions
2–3
no-show a settimana, per promemoria mai inviatino-shows a week, from reminders never sent
3 strumenti tools
carta, Excel e WhatsApp, nessuno che parla con l'altropaper, Excel and WhatsApp, none talking to each other
0
voglia di imparare un altro software complicatoappetite for learning another complicated tool
Il prodotto · desktopThe product · desktop
Cambia modulo dalle tab: la finestra scorre insieme alla pagina, come nel prodotto reale.
Switch module from the tabs: the window scrolls along with the page, just like the real product.
Clicca per ingrandireClick to enlarge
{{ d.body }}
Il prodotto · mobileThe product · mobile
Scorri: ogni passaggio cambia la schermata nel telefono, nell’ordine in cui il terapista la incontra davvero.
Scroll: each step swaps the screen inside the phone, in the order the therapist actually meets it.
{{ s.body }}
Dettagli di craftCraft details
Impatto attesoExpected impact
Obiettivi basati su ricerca qualitativa e quantitativa con professionisti del settore.
Targets based on qualitative and quantitative research with industry professionals.
Dietro al progettoBehind the work
Otto capitoli, dalla ricerca aumentata con AI al design system in produzione.
Eight chapters, from AI-augmented research to the production design system.
Come l'intelligenza artificiale ha guidato ogni fase — dalla ricerca qualitativa ai componenti di produzione — senza mai rompere il loop.
How AI drove every phase — from qualitative research to production components — without ever breaking the loop.
{{ p.tool }}
{{ p.body }}
Come Lead Product Designer ho guidato un team di 5 designer junior con una dashboard Kanban: retrospective e backlog review settimanali, documentazione raccolta nelle acceptance criteria delle user story.
As Lead Product Designer I guided a team of 5 junior designers with a Kanban dashboard: weekly retrospectives and backlog reviews, documentation collected in the user stories' acceptance criteria.
{{ p.desc }}
Dall'accesso al dettaglio operativo in pochi livelli, così che ogni funzione sia raggiungibile senza perdersi.
From access to operational detail in a few levels, so every function is reachable without getting lost.
Task analizzato su 20 personas. L'obiettivo: completare la prenotazione in meno di 30 secondi, mentre si è al telefono con il paziente.
Task analyzed across 20 personas. The goal: complete a booking in under 30 seconds, while on the phone with the patient.
Principi mobile-firstMobile-first principles
{{ m.body }}
Cosa cambia su desktopWhat desktop adds
{{ u.body }}
Gestione pazientiPatient management
{{ p.tag }}
{{ p.body }}
IncassiRevenue
{{ r.body }}
La fondazione del prodotto: libreria UI, design token e principi di accessibilità. Tailwind CSS v4 e Shadcn UI, tipografia Inter, base 8px, conformità WCAG 2.1 AA.
The product foundation: UI library, design tokens and accessibility principles. Tailwind CSS v4 and Shadcn UI, Inter typography, 8px base, WCAG 2.1 AA compliance.
Color Tokens
Buttons — States
Primary · radius 8 · h40
Secondary · Outlined
Ghost · Text
Typography Scale · Inter
Status Badges
Input Fields
Accessibilità · Indicatori H/M/LAccessibility · H/M/L indicators
Indicatori testuali integrati nella scala colore della pain map: colore + testo, leggibile anche per utenti daltonici.
Text indicators built into the pain-map colour scale: colour + text, readable for colourblind users too.
info@omaramato.com
© {{ year }} Antonino Omar Amato · FisioGest, SaaS per la gestione clinicaClinical management SaaS
Prospettiva, Sezione e Mappa sono tre letture dello stesso momento: la stessa allerta, la stessa timeline, la stessa provenienza dichiarata su ogni numero. Cambiando vulcano dal selettore cambiano i dati e la morfologia, non la grammatica dell'interfaccia.
Perspective, Section and Map are three readings of the same moment: same alert, same timeline, same declared provenance on every number. Switching volcano changes the data and the morphology, never the interface grammar.
{{ v.body }}
Su un tema dove protezione civile, osservatori vulcanologici, INGV e centri di ricerca decidono sulla base di questi numeri, ogni valore in interfaccia porta con sé la sua provenienza: colore diverso, etichetta diversa, tooltip diverso per «letto da fonte ufficiale» contro «stimato dal sistema».
On a topic where civil protection, volcanological observatories, INGV and research centers make decisions from these numbers, every value carries its provenance: a different color, label and tooltip for "read from an official source" versus "estimated by the system".
Lo switch dal selettore in testa cambia morfologia, viste disponibili e stato di allerta, mentre gerarchia, colori di stato e dichiarazione della fonte restano identici — la stessa struttura con cui l'applicativo definitivo accoglie i preset dei vulcani monitorati.
The switch from the selector up top changes morphology, available views and alert state, while hierarchy, state colors and source declaration stay identical — the same structure the finished product uses to hold each monitored volcano's preset.
Sei capitoli: cos'è un digital shadow, come si comporta il sistema quando le fonti tacciono, cosa ha corretto il vulcano.
Six chapters: what a digital shadow is, how the system behaves when sources go quiet, what the volcano itself corrected.
L'Etna nell'estate 2026 è passato da attività ordinaria a fase di allarme regionale. Le informazioni che contano, livello di allerta, quota di interdizione, versanti chiusi, esistono, ma sono sparse tra bollettini INGV, comunicati della Protezione Civile e ordinanze comunali, spesso pubblicati solo come testo su pagine HTML non pensate per essere lette da una macchina.
In summer 2026 Etna moved from ordinary activity to a regional alarm phase. The information that matters, alert level, exclusion altitude, closed flanks, exists, but is scattered across INGV bulletins, Civil Protection releases and municipal orders, often published as plain text on pages never meant to be machine-readable.
Il problema di design non era «com'è fatto il vulcano». Era: come mostro, in un unico posto, cosa è vero adesso, e da dove viene ogni singola informazione.
The design problem wasn't "what does the volcano look like". It was: how do I show, in one place, what's true right now, and where every single fact came from.
Un digital shadow è la rappresentazione di un sistema reale che si aggiorna a partire dai suoi dati, senza simularlo né predirne il comportamento. Qui il flusso è a senso unico, la realtà aggiorna il modello, e la morfologia del cono è schematica: onesto, utile, letto e stimato con la fonte sempre dichiarata.
A digital shadow is a representation of a real system that updates from its data, without simulating or predicting its behavior. Here the flow is one-way, reality updates the model, and the cone's morphology is schematic: honest, useful, read and estimated with the source always declared.
Le pagine ufficiali a volte caricano il bollettino via JavaScript, a volte non lo pubblicano affatto. La sismicità da sola può essere piatta anche in fase di allarme comunicato. Il design ha dovuto prevedere il fallimento di ogni singola fonte, e dichiararlo in interfaccia.
Official pages sometimes load the bulletin via JavaScript, sometimes don't publish it at all. Seismicity alone can be flat even during a declared alarm. The design had to plan for every source failing, and say so in the UI.
Correzioni fatte in produzione, guidate da segnalazioni reali: quote dei crateri, orientamento della vista, sovrapposizioni di etichette, e, quando il livello ETNAS è salito a F1 il 13 agosto, il passaggio da un'allerta impostata a mano a un'allerta che si aggiorna da sola.
Corrections made in production, driven by real reports: crater altitudes, view orientation, label overlaps, and, when the ETNAS level rose to F1 on 13 August, the shift from a manually-set alert to one that updates itself.
Durante la simulazione dell'evento F1, l'interfaccia mostrava la zona di interdizione come poligono fisso. Ragionando sul caso reale è emerso che il fronte stimato potrebbe non coincidere con quello comunicato ufficialmente, da qui la distinzione visiva tra zona da ordinanza (rosso pieno) e zona stimata (ambra tratteggiata), con tooltip che dichiara la differenza.
While simulating the F1 event, the interface showed the exclusion zone as a fixed polygon. Reasoning through the real case, it emerged that the estimated front might not match the officially communicated one, hence the visual split between ordinance zone (solid red) and estimated zone (dashed amber), with a tooltip stating the difference.
Una barra sempre presente in fondo alla dashboard porta gli otto momenti che hanno definito la crisi dell'estate 2026, dalla frattura a 3.000 m del 26 giugno al passaggio ETNAS a F1 del 13 agosto, fino alla chiusura dei fenomeni eruttivi il 26 agosto. Cliccando un nodo l'intera interfaccia entra in REPLAY: metriche, zone e stato di accesso si ricostruiscono a quel momento, e la vista scelta resta quella.
A bar pinned to the bottom of the dashboard carries the eight moments that defined the summer 2026 crisis, from the 3,000 m fissure on 26 June to the ETNAS shift to F1 on 13 August, through to the end of the eruptive phase on 26 August. Clicking a node puts the whole interface into REPLAY: metrics, zones and access status are reconstructed for that moment, and the chosen view stays put.
Questo documento descrive un concept progettuale sviluppato come esercizio di product design e system thinking. Il prototipo non è ancora connesso a dati in tempo reale.
This document describes a design concept developed as an exercise in product design and system thinking. The prototype is not yet connected to real-time data.
Inserisci la password per accedere a questo case study.
Enter the password to access this case study.
01
Contesto & problemaContext & problem
Pale e mozzi delle turbine eoliche sono prodotti con materiali compositi la cui composizione esatta raramente sopravvive alla produzione. Quando i componenti arrivano agli impianti di riciclo, gli operatori non hanno alcuna visibilità su composizione, tolleranze di produzione o storico di manutenzione.
Recuperare i dati richiedeva una ricerca manuale tra export MES scollegati, registri cartacei e contatti dei fornitori, un processo che richiedeva giorni, non minuti, bloccando sia la conformità alla marcatura CE sia il recupero dei materiali a fine vita.
Wind turbine blades and hubs are manufactured from composite materials whose exact composition rarely survives production. When components reach recycling facilities, operators have no visibility into material makeup, production tolerances, or maintenance history.
Retrieving product data required manual lookup across disconnected MES exports, paper records, and supplier contacts, a process taking days rather than minutes, blocking both CE-marking compliance and end-of-life material recovery.
tempo medio di ricerca dei dati di prodottoaverage lookup time for product data
processo senza un'unica fonte di veritàprocess with no single source of truth
02
«Adesso, se arriva una pala e ci serve la specifica del materiale, scrivo a tre persone diverse e aspetto due giorni. Quando arriva la risposta, la finestra per il riciclo si è già spostata.»
"Right now, if a blade arrives and we need its material spec, I'm emailing three different people and waiting two days. By the time we have the answer, the recycling window has moved."
{{ f.body }}
03
Architettura dell'informazioneInformation architecture
Il modello di navigazione è stato validato con gli ingegneri AMRC in sessioni di co-design: ogni livello mappa qualcosa che un tecnico può indicare sulla turbina reale.
The navigation model was validated with AMRC engineers in co-design sessions, every level maps to something a field technician can point to on the actual turbine.
Principio di design: ogni decisione di navigazione deve poter rispondere alla domanda «dove si troverebbe fisicamente questo componente?»Design principle: every navigation decision should be answerable by asking "where would this component be physically located?"
04
{{ m.body }}
05
ProblemaProblem
{{ d.problem }}
Scelta di designDesign choice
{{ d.choice }}
MotivazioneRationale
{{ d.rationale }}
06
Queste sono intenzioni di design: il progetto è stato consegnato come prototipo e MVP co-progettato. I risultati sono ancora da misurare su scala.
These are design intentions, the project was delivered as a prototype and co-designed MVP. Outcomes are yet to be measured at scale.
{{ g.tag }}
{{ g.body }}
© {{ year }} Antonino Omar Amato · Rekord, Co-design con AMRCCo-design with AMRC
Inserisci la password per accedere a questo case study.
Enter the password to access this case study.
Case study · 2024 · Mobilità · EnterpriseMobility · Enterprise
Riprogettazione user-centered del sistema di gestione delle informazioni autostradali di ASPI, dalla dashboard olistica a un sinottico ispirato alle mappe metro.
User-centered redesign of ASPI's highway information management system, from a holistic dashboard to a metro-map-inspired synoptic.
La dashboard olistica a widget: l'intero tronco autostradale in un colpo d'occhio. Allarmi, eventi, soccorsi, cantieri e mappa in un'unica vista, senza più finestre del browser disposte a mosaico.The holistic widget dashboard: the whole motorway trunk at a glance. Alarms, events, rescue, roadworks and map in a single view, with no more tiled browser windows.
01
Contesto & problemaContext & problem
Il progetto nasce dalla collaborazione tra Movyon e Autostrade per l'Italia, con il supporto consulenziale di BCG e PwC. Come design consultant per Movyon, ho riprogettato il sistema di gestione delle informazioni stradali con un solo obiettivo: migliorarne usabilità ed efficacia operativa per gli operatori delle sale radio.
The project comes from the collaboration between Movyon and Autostrade per l'Italia, with advisory support from BCG and PwC. As a design consultant for Movyon, I redesigned the road information management system with a single goal: improving its usability and operational effectiveness for radio-room operators.
{{ p.body }}
02
Dai primi incontri di Firenze, con tutte le parti coinvolte attorno allo stesso tavolo, abbiamo adottato una metodologia user-centered per la raccolta dei requisiti e la progettazione, ponendo gli operatori al centro di ogni decisione.
From the first meetings in Florence, with every stakeholder around the same table, we adopted a user-centered methodology for requirements and design, putting operators at the center of every decision.
{{ p.body }}
03
Interviste semi-strutturate, wireframe disegnati alla lavagna durante gli incontri e prototipi in Adobe XD testati nel meeting successivo. Ogni giro restituisce un miglioramento tangibile.
Semi-structured interviews, wireframes sketched on whiteboards during meetings, and Adobe XD prototypes tested in the next session. Every loop returns a tangible improvement.
{{ s.desc }}
04
La ricerca ha mappato il nucleo funzionale del sistema: 14 categorie, ognuna con le proprie esigenze di visualizzazione tra listati, sinottici e grafici di KPI.
Research mapped the functional core of the system: 14 categories, each with its own visualization needs across lists, synoptics and KPI charts.
05
Dai brainstorming è emerso un bisogno chiaro: associare liste e dati a qualcosa di più intuitivo e immersivo. È nato così un grande sinottico ispirato alle linee metropolitane di Londra e New York, l'innovazione che ha ridefinito la gestione visiva delle informazioni stradali.
From the brainstorms a clear need emerged: pairing lists and data with something more intuitive and immersive. That gave birth to a large synoptic inspired by the London and New York metro lines, the innovation that redefined the visual handling of road information.
Sinottico · vista geografica della reteSynoptic · geographic network view
Sinottico PMV · A01 Milano–NapoliPMV synoptic · A01 Milano–Napoli
Le informazioni disposte lungo la linea, come fermate su una mappa metro.Information laid out along the line, like stops on a metro map.
Supporta operatori abituati a ragionare per geografia, non per tabelle.Supports operators used to thinking by geography, not tables.
Segni visivi riconoscibili a colpo d'occhio per le situazioni critiche.At-a-glance visual cues for critical situations.
06
In fase di sviluppo, con un team scrum, il design dell'interfaccia si è concentrato su tre stream prioritari: Eventi, Cantieri e Allarmi.
In the development phase, with a scrum team, interface design focused on three priority streams: Events, Roadworks and Alarms.
Stream · EventiStream · Events
Listato gerarchico di eventi e cause, con localizzazione chilometrica, stato e azioni rapide in riga.Hierarchical list of events and causes, with kilometric location, status and quick in-row actions.
Stream · CantieriStream · Roadworks
Dettaglio cantiere con mappa, direzione, km di scambio e rientro, ordinanza e stato di installazione.Roadwork detail with map, direction, swap and return km, ordinance and installation status.
Stream · AllarmiStream · Alarms
Gestione allarmi per galleria con video live e chip d'azione per inserire o chiudere un evento SIV.Per-tunnel alarm handling with live video and action chips to open or close a SIV event.
07
Standard WCAG ai livelli AA e AAA per tipografia, colori e contrasti, perché il sistema sia leggibile anche in condizioni di stress o scarsa illuminazione. Il tutto sul design system di Movyon, costruito su griglia base 8px.
WCAG standards at AA and AAA levels for typography, colors and contrast, so the system stays readable even under stress or poor lighting. All built on Movyon's design system, on an 8px base grid.
Approccio atomicoAtomic approach
WCAG
Specifiche & strumentiSpecs & tools
08
Il processo di design è stato integrato nel flusso scrum: mentre il design avanza sull'interfaccia, gli sviluppatori lavorano su debito tecnico e code review. Due ritmi che si rafforzano a vicenda.
The design process was woven into the scrum flow: while design moves ahead on the interface, developers work on technical debt and code review. Two rhythms that reinforce each other.
{{ b.body }}
09
L'approccio user-centered e il processo iterativo hanno prodotto miglioramenti oggettivi nelle metriche di usabilità.
The user-centered approach and the iterative process produced objective improvements in usability metrics.
{{ r.note }}
© {{ year }} Antonino Omar Amato · SIV, Ammodernamento per ASPI × MovyonModernization for ASPI × Movyon