Workflow incentrati sui tecnici su un’interfaccia limitata da 480 × 320

Definizione di nuovi standard GUI per apparecchiature di test embedded

ELETTRONICA

Design del prodotto

Progettazione GUI

CLIENTEMSolutions
POSIZIONEIsraele
SQUADRAUX designer, UI designer, interaction designer, project manager, product owner, software architect
SITO WEB

MSolutions sviluppa interfacce di strumentazione professionali per ingegneri audio visual che mettono in servizio e risolvono problemi in installazioni complesse. Il loro dispositivo di misurazione portatile verifica l’integrità del segnale HDMI, i dati EDID, lo stato HDCP, la risoluzione, la frequenza di aggiornamento e altri parametri in ambienti multi monitor. Sulla carta, la GUI del dispositivo offriva una diagnostica ricca. Nella pratica, i tecnici evitavano molte funzioni perché il design della GUI embedded esistente era difficile da seguire durante attività critiche dal punto di vista del tempo. I precedenti tentativi di redesign non avevano risolto i problemi di usabilità fondamentali.

Questo progetto fa parte del nostro lavoro continuativo nei sistemi embedded e nell’instrumentazione professionale, dove l’UX basata su evidenze, la progettazione di interfacce per hardware vincolato e i workflow dei tecnici modellano le apparecchiature diagnostiche per l’uso sul campo.

L’azienda ha chiesto al nostro team UX per i sistemi embedded di trasformare questa interfaccia hardware vincolata in una device-UX tecnica e precisa, che permetta ai tecnici di arrivare a conclusioni affidabili più rapidamente senza aumentare il carico cognitivo sul campo.

Abbiamo applicato Dynamic Systems Design, un metodo che sviluppa soluzioni attraverso sperimentazione embedded, risolve le tensioni tra ottimizzazione locale e coerenza del sistema, e guida l'implementazione fino a quando le organizzazioni acquisiscono indipendenza.

I NOSTRI CONTRIBUTI

Audit di usabilità

Technician Workflow Mapping

Conceptual Model Design

Interaction Design

Prototype Validation

Cross-Platform Architecture

Sistema di progettazione

Developer Handover

PERCHÉ I PRECEDENTI TENTATIVI UX PER I SISTEMI EMBEDDED SONO FALLITI

Abbiamo iniziato con un audit di usabilità mirato per i dispositivi embedded. La revisione ha combinato un’ispezione euristica dell’interfaccia con walkthrough di reali attività di diagnostica AV descritte da tecnici e ingegneri esperti. I risultati hanno mostrato che i design precedenti organizzavano le schermate in base ai moduli backend piuttosto che ai workflow dei tecnici. Le funzioni erano posizionate dove esistevano nel codice, non dove erano necessarie nella sequenza di lavoro.

Un redesign successivo si è concentrato su colori e icone, mantenendo però la stessa struttura di base. Di conseguenza, i tecnici dovevano ancora ricordare quale modalità contenesse quali strumenti diagnostici e potevano perdere il contesto passando da un controllo del segnale all’altro. Il problema non era lo stile visivo, ma la mancanza di un modello UX coerente per gli strumenti di ingegneria, allineato con la pratica sul campo.

WORKFLOW INCENTRATI SUI TECNICI SU UN DISPLAY 480 × 320

Il dispositivo funziona su un piccolo display embedded da 480 × 320 pixel con supporto touch a punto singolo limitato e risorse di elaborazione modeste. I touch target dovevano essere abbastanza grandi per l’uso con i guanti. Il testo doveva rimanere leggibile a distanza di un braccio. Di conseguenza, la GUI del dispositivo di misurazione non poteva basarsi su pattern guidati da gesti o su layout informativi densi.

Questi vincoli hanno guidato decisioni concrete. Abbiamo limitato la profondità dei menu e il numero di elementi per schermata, in modo che ogni vista potesse mostrare un set completo di opzioni senza ridurre la dimensione del testo sotto una soglia confortevole. Abbiamo evitato animazioni ed effetti grafici pesanti per mantenere l’interazione reattiva sull’hardware limitato. Ogni schermata è stata progettata come uno stato piccolo e autonomo che i tecnici potevano interpretare in una frazione di secondo, mentre osservavano cavi, display e switcher.

REQUISITI E ALLINEAMENTO INTORNO AI WORKFLOW DEI TECNICI

Abbiamo raccolto i requisiti insieme al product owner di MSolutions, al lead firmware engineer e a un gruppo di tecnici AV senior che utilizzano software di misurazione professionali nel lavoro quotidiano. Ogni gruppo aveva priorità diverse. Gli ingegneri volevano pieno accesso ai parametri di basso livello. I tecnici desideravano meno passaggi e una conferma più chiara dei risultati. Il product management aveva bisogno di una struttura in grado di supportare funzionalità future senza un nuovo redesign.

Abbiamo tradotto questi input in un’unica strategia tramite tension-driven reasoning. Per ogni schermata dell’interfaccia di strumentazione professionale abbiamo definito un risultato esplicito: quale decisione il tecnico deve poter prendere in quel momento. Le funzioni esistenti sono state poi riassegnate a questi risultati e le priorità in conflitto sono state risolte a livello strategico, invece che con decisioni ad hoc sulle singole schermate. Questo ha creato una base stabile per la pianificazione delle release e per la successiva estensione del design UX del dispositivo embedded.

Design da parte degli sviluppatori
Design del designer precedente
Estratti dal Design Audit

NUOVO MODELLO CONCETTUALE PER I WORKFLOW DI DIAGNOSTICA AV

La svolta concettuale è arrivata trattando il dispositivo come una guida attraverso una narrazione diagnostica AV standard, invece che come una semplice raccolta di strumenti. Il nuovo modello struttura la sequenza di misurazione così come i tecnici la vivono realmente. Un workflow tipico, ad esempio, inizia con i controlli di integrità del collegamento, prosegue con la verifica di EDID e HDCP, passa poi alla validazione della risoluzione e dello spazio colore su ogni display e si conclude con una conferma consolidata che l’installazione soddisfa il profilo definito.

Nella nuova GUI embedded, ogni stato indica la successiva azione logica. I parametri compaiono solo quando sono necessari per la fase diagnostica in corso. La gerarchia visiva enfatizza un’unica intenzione tecnica per schermata e colloca le informazioni secondarie in posizioni prevedibili. Per i tecnici, il dispositivo ora si comporta come un collega esperto che propone i controlli giusti nel giusto ordine, invece che come un cassetto pieno di strumenti separati.

Esempi di wireframe

VALIDAZIONE DEI PROTOTIPI CON TECNICI AV SUL CAMPO

Abbiamo tradotto il nuovo modello in prototipi interattivi e li abbiamo testati con tecnici AV che lavorano regolarmente su sale conferenze multi monitor e video wall. Le sessioni combinavano osservazione basata su compiti e brevi interviste. Ai tecnici è stato chiesto di svolgere scenari realistici, come individuare la causa di una risoluzione errata su un display in una catena di segnale che per il resto appare funzionante.

Il feedback si è concentrato sulla terminologia, sul raggruppamento dei parametri di segnale e sull’ordine con cui i risultati dovrebbero apparire quando viene individuato un guasto. Il workflow principale non ha richiesto modifiche, ma molti dettagli sono stati affinati. Alcune etichette sono state riviste per rispecchiare il linguaggio utilizzato dai tecnici sul campo. Alcuni stati di conferma intermedi sono stati semplificati per evitare esitazioni. Dopo queste rifiniture, un partecipante ha osservato che l’interfaccia embedded rispecchiava finalmente il modo in cui già pensano quando si trovano davanti a un rack. L’intero ciclo di test e iterazione ha richiesto due giornate intensive all’interno della finestra di progetto di sei settimane.

INTERFACCIA CROSS-PLATFORM PER DISPOSITIVO, LAPTOP E MOBILE

Una volta stabilizzato il modello di interazione embedded, abbiamo esteso la device-UX tecnica agli ambienti laptop e mobile. L’architettura responsive mantiene la stessa sequenza di workflow dei tecnici, utilizzando però superfici più ampie per mostrare in modo più chiaro le relazioni tra misurazioni, valori storici e profili di riferimento.

I tecnici possono ora collegarsi al dispositivo di misurazione da un laptop durante le sessioni di messa in servizio o utilizzare un’interfaccia mobile per controlli rapidi. Il design dell’interfaccia cross-platform consente il controllo remoto in spazi ristretti e una migliore collaborazione tra i colleghi sul posto e quelli in un centro operativo centrale. Poiché il modello concettuale è identico, non è necessario imparare comportamenti separati per ciascuna piattaforma.

DESIGN SYSTEM PRONTO PER GLI SVILUPPATORI E RISULTATI MISURABILI

Il lavoro si è concluso con un Design System pronto per gli sviluppatori, adattato all’hardware vincolato e alle interfacce responsive. Definisce i componenti, i loro stati, le regole di layout per l’interfaccia touchscreen embedded da 480 × 320 e i pattern di interazione per la gestione degli errori e gli edge cases. Questo livello di precisione riduce le ambiguità di implementazione e aiuta a mantenere il codebase gestibile quando vengono aggiunte nuove funzionalità diagnostiche.

L’intero redesign, dall’audit di usabilità alla consegna finale, è stato completato in sei settimane. I walkthrough interni delle attività con il cliente hanno mostrato che i tecnici potevano raggiungere le stesse conclusioni con circa la metà delle interazioni precedenti nei workflow principali. I nuovi utenti erano in grado di utilizzare la GUI del dispositivo di misurazione dopo una breve introduzione guidata, senza bisogno di coaching ripetuto. I grandi clienti integratori hanno segnalato rollout più fluidi, perché meno persone avevano difficoltà con l’interfaccia.

L’organizzazione ha acquisito risorse immateriali: la capacità di giudicare ciò che conta nella diagnostica AV professionale, un’intuizione di prodotto condivisa su come le interfacce di misurazione dovrebbero guidare le decisioni dei tecnici, e una capacità di ragionamento che consente ai team di estendere le funzionalità diagnostiche senza frammentare il modello di interazione. Il sistema mantiene la propria competitive position supportando diagnosi rapide e accurate in condizioni di campo impegnative, mentre i concorrenti che privilegiano l’esposizione delle funzionalità rispetto alla chiarezza dei workflow faticano a servire tecnici che lavorano sotto pressione temporale in installazioni complesse.

Il risultato è una embedded systems UX che rende visibile la qualità dell’ingegneria di MSolutions e un’interfaccia di strumentazione professionale pronta per le future release.

RISULTATI

Design end-to-end consegnato in 6 settimane

Documentazione completa per gli sviluppatori

Il design è completamente reattivo

La GUI è diventata un riferimento nel settore

Hai un progetto in mente?