Brukeropplevelsesdesign for AV-teknikere

Setter nye GUI-standarder for profesjonell elektronikk

Elektronikk

Produktdesign

GUI-design

Nærbilde av GUI-design på displayet til en elektronisk enhet
KLIENTMSolutions
BELIGGENHETIsrael
TEAMUX designer, UI designer, interaction designer, project manager, product owner, software architect
NETTSIDE

MSolutions har utviklet en innovativ enhet som brukes av audiovisuelle ingeniører til å teste ytelsen til komplekse installasjoner. Til tross for apparatets mange funksjoner forble det meste ubrukt på grunn av en dårlig brukeropplevelse. Selskapet hadde forsøkt å forbedre brukervennligheten flere ganger, til og med i samarbeid med andre designere, men uten hell.

Selskapet engasjerte UX-designbyrået vårt for å hjelpe dem med å omdefinere enhetens brukervennlighet og omforme det grafiske brukergrensesnittet til et design som demonstrerer den tekniske ytelsen.

VÅRE BIDRAG

UX Design

UX-flyt

Prototyping

Konseptdesign

Produktdesign

Interaksjonsdesign

Brukergrensesnittdesign - Designsystem

Kvalitetssikring

Nærbilde av en tekniker som manipulerer lyd- og videokontrollpanelet

EN BERØRINGSSKJERM SOM HINDRER BRUKERVENNLIGHET

Teknikere kan diagnostisere problemer og optimalisere funksjonen til det audiovisuelle utstyret. Enheten kan måle komplekse installasjoner med flere monitorer, skjermer og signalkilder.

Enheten kommer imidlertid også med maskinvarebegrensninger i form av en skjerm med begrenset berøringsinteraktivitet og en liten skjermstørrelse på bare 480x320 piksler.

Nærbilde av audio-videotestingsenhet på mørk bakgrunn.
Elektronisk testutstyr på mørk bakgrunn

EN GRUNDIG OG FORUTSIGBAR PROSESS

For å innfri løftet om en helt ny brukeropplevelse gjennomførte vi en systematisk produktdesignprosess. Vi startet med å samle inn krav og organiserte innsikt fra alle interessenter.

Vi vurderte eksisterende data om brukerne, og deretter lagde vi en prioriteringsliste der vi grupperte målene i releaser. Denne detaljerte og grundige planen var forutsetningen for en fokusert designfase for brukeropplevelsen.

Tabell med krav til brukeropplevelsesdesign knyttet til prosjektfasene.

HVORFOR DERES TIDLIGERE DESIGNFORSØK MISLYKTES

Skjermen har sine tekniske begrensninger, men selskapets tidligere forsøk på å realisere et intuitivt brukergrensesnitt mislyktes av andre grunner. Vi utførte en detaljert undersøkelse av brukervennligheten og kartla et sett med ønskede resultater for hvert skjermbilde.

Hovedårsaken til at de hadde mislyktes tidligere, var at det opprinnelige GUI-designet var laget av ingeniører som hadde lagt opp funksjonaliteten slik den er i backend, ikke slik brukerne forventer at den skal fungere. I det andre forsøket på å forbedre brukervennligheten til enheten, forsøkte designeren ganske enkelt å forbedre brukergrensesnittet. Dette var dømt til å mislykkes, for et brukergrensesnitt kan aldri bli estetisk når den underliggende UX-tenkningen er mangelfull.

Design av utviklere
Fem GUI-design for elektronisk testutstyr.
Design av tidligere designer
Forbedret GUI-design med mangelfull brukeropplevelse.
Utdrag fra Design Audit
Detalj fra en rapport fra en brukervennlighetsrevisjon av en elektronisk enhet med 8 funn

KONSEPTET OM DEN NYE BRUKEROPPLEVELSEN

Designtenkningen ble styrt av brukernes behov og hva som representerer en logisk flyt for teknikerne i deres daglige praksis. Resultatet er at brukerne ikke trenger å tenke så mye, fordi fokuset i hvert trinn er på det neste logiske en tekniker ønsker å gjøre.

På skjermnivå oversettes veiledningen til et tydelig visuelt hierarki, slik at den overordnede logikken i flyten videreføres på mikronivå. Det nye brukeropplevelsesdesignet gjenspeiler brukernes prioriteringer, ikke backend.

Fem wireframes for grafisk brukergrensesnitt for elektronisk testutstyr
Eksempler på wireframes

TESTING OG ITERASJONER FORBEDRER BRUKERGRENSESNITTET

Den nye brukeropplevelsen var svært forskjellig fra det tidligere brukervennlighetsparadigmet. Til tross for at den var resultatet av en grundig prosess med dokumentasjon av brukernes behov, var det avgjørende å få i det minste en grunnleggende validering fra brukerne. Totalt tok brukertestingen og designjusteringene bare to dager.

Vi laget prototyper og organiserte noen brukertester. Brukerne kom med en mengde tilbakemeldinger. Det førte ikke til noen endring i den grunnleggende logikken i brukeropplevelsen, men det førte til små endringer som til slutt skulle løfte brukergrensesnittet til et høyere kvalitetsnivå.

Mann som interagerer med den nye brukeropplevelsen i brukertestingen

DEN VISUELLE GUIDEN DEMONSTRERER YTELSE

Det visuelle GUI-designet var en mulighet til å vise hvor smart både ingeniørene og UX-designerne har tenkt. Den er minimalistisk og nøktern, men kombinert med den overlegne finishen på den fysiske enheten ser den ut som et høyytelsesverktøy for profesjonelle.

I tillegg til merkevareaspektet og målet om å skape tillit, er det grafiske brukergrensesnittet også kompatibelt med tanke på tilgjengelighet, og det inneholder alle de tilstandene som trengs for å gjøre utviklingen enkel.

GUI-design for 9 skjermbilder som viser brukergrensesnittet til profesjonelt elektronikkutstyr
Responsiv GUI-design i laptop mockup på mørk bakgrunn
Designelementer

KOMPLETT RESPONSIV GUI-DESIGN PÅ 6 UKER

Det tok totalt 6 uker å gjennomføre prosjektet, fra den innledende brukervennlighetsrevisjonen startet til det grafiske grensesnittet ble levert til ingeniørteamet. Sluttresultatet er et brukergrensesnitt der teknikerne bare trenger å gjøre halvparten så mye arbeid for å få de resultatene de trenger.

Den strømlinjeformede interaksjonsprosessen skapte muligheter for å forenkle kodestakken. Det grafiske brukergrensesnittet er responsivt, slik at teknikerne kan styre enheten fra en bærbar datamaskin eller mobiltelefon, enten på stedet eller eksternt. Dette åpner for en verden av muligheter.

Sluttresultatet for selskapet er et produkt der den tekniske kvaliteten kommer tydelig frem i utseendet og følelsen av enheten. I tillegg kreves det mindre opplæring av teknikerne, noe som gjør det enklere for store kunder å rulle ut løsningen.

RESULTATER

Komplett design levert på 6 uker

Fullstendig dokumentasjon for utviklere

Designet er fullt responsivt

Brukergrensesnittet har blitt en referanse i bransjen