Conception UX pour les techniciens AV

Mise en place de nouvelles normes de design de l'interface graphique utilisateur pour l'électronique professionnelle

Électronique

Conception du produit

Design d'interface graphique utilisateur

Gros plan du design d'une interface graphique utilisateur sur l'écran d'un appareil électronique
CLIENTMSolutions
LOCATIONIsrael
TEAMUX designer, UI designer, interaction designer, project manager, product owner, software architect
WEBSITE

MSolutions a créé un dispositif innovant utilisé par les ingénieurs en audiovisuel pour tester les performances d'installations complexes. Malgré le large éventail de fonctionnalités offertes par l'appareil, la plupart d'entre elles sont restées inutilisées en raison d'une mauvaise expérience utilisateur. L'entreprise a essayé d'améliorer la convivialité à plusieurs reprises, en travaillant même avec d'autres concepteurs, mais sans succès.

L'entreprise a fait appel à notre agence de design UX pour l'aider à redéfinir la facilité d'utilisation de l'appareil et à remodeler l'interface graphique utilisateur en un design qui démontre la performance de l'ingénierie.

NOS CONTRIBUTIONS

Design UX

Flux UX

Prototypage

Conception

Conception du produit

Design d'interaction

Design UI - Système Design

Assurance qualité

Gros plan d'un technicien manipulant le panneau de contrôle audio-vidéo

UN ÉCRAN TACTILE QUI GÊNE L'UTILISATION

Les techniciens diagnostiquent les problèmes et optimisent le fonctionnement de l'équipement audiovisuel. L'appareil peut mesurer des installations complexes avec plusieurs moniteurs, écrans et sources de signaux.

Cependant, l'appareil présente également des limites matérielles, à savoir un écran à l'interactivité tactile limitée et une taille d'écran minuscule de seulement 480x320 pixels.

Gros plan d'un appareil de test audio-vidéo sur fond sombre.
Équipement de test électronique sur fond sombre

UN PROCESSUS MÉTICULEUX ET PRÉVISIBLE

Pour tenir la promesse d'une expérience utilisateur qui change la donne, nous avons mis en place un processus systématique de conception du produit. En commençant par la collecte des besoins, nous avons organisé les idées de toutes les parties prenantes.

Nous avons évalué les données existantes sur les utilisateurs, puis nous avons créé des ensembles de priorités, en regroupant les objectifs par versions. Ce plan de match détaillé et méticuleux était la condition préalable à une phase de design ciblée de l'expérience utilisateur.

Tableau avec les exigences de design de l'expérience utilisateur assignées aux phases du projet.

LES RAISONS DE L'ÉCHEC DE LEURS PRÉCÉDENTES TENTATIVES DE CONCEPTION

L'écran a ses limites techniques, mais les tentatives précédentes de l'entreprise pour réaliser une interface graphique utilisateur intuitive ont échoué pour d'autres raisons. Nous avons réalisé un audit détaillé de la convivialité et défini un ensemble de résultats souhaités pour chaque écran.

L'échec précédent s'explique essentiellement par le fait que le design initial de l'interface graphique utilisateur a été réalisé par des ingénieurs qui ont présenté la fonctionnalité telle qu'elle est en arrière-plan, et non pas comme les utilisateurs pourraient s'attendre à ce qu'elle fonctionne. Lors de leur deuxième tentative d'amélioration de la facilité d'utilisation de l'appareil, le designer a simplement tenté d'améliorer l'UI. Cette tentative était vouée à l'échec, car le design d'une interface utilisateur ne peut jamais être esthétique si la réflexion sous-jacente sur l'UX est erronée.

Conception par les développeurs
Cinq designs d'interfaces graphiques utilisateur pour des équipements de test électroniques.
Conception par l'ancien designer
Un design amélioré de l'interface graphique utilisateur avec une expérience utilisateur défectueuse.
Extraits de l'audit de design
Détail du rapport d'audit d'utilisabilité d'un appareil électronique montrant 8 résultats

LE CONCEPT DE LA NOUVELLE EXPÉRIENCE UTILISATEUR

La réflexion sur le design a été guidée par les besoins des utilisateurs et par ce qui représente un flux logique pour les techniciens dans leur pratique quotidienne. En conséquence, les utilisateurs n'ont pas besoin de réfléchir beaucoup, car à chaque étape, l'accent est mis sur la prochaine chose logique qu'un technicien pourrait vouloir faire.

Au niveau de l'écran, l'orientation est traduite en une hiérarchie visuelle claire afin que la logique globale du flux se poursuive au niveau micro. Le nouveau design de l'expérience utilisateur est le reflet des priorités des utilisateurs, et non du backend.

Cinq wireframes pour l'interface graphique utilisateur d'un équipement de test électronique
Exemples de wireframes

LES TESTS ET LES ITÉRATIONS AMÉLIORENT L'UX

La nouvelle expérience utilisateur était très différente du paradigme d'utilisabilité précédent. Bien qu'elle soit le fruit d'un processus méticuleux de documentation des besoins des utilisateurs, il était essentiel d'obtenir au moins un niveau de validation de base de la part des utilisateurs. Au total, les tests auprès des utilisateurs et les ajustements de la conception n'ont pris que deux jours.

Nous avons créé des prototypes et organisé quelques sessions de test pour les utilisateurs. Les utilisateurs ont été en mesure de fournir un grand nombre d'informations en retour. Cela n'a pas entraîné de changement dans la logique fondamentale de l'expérience utilisateur, mais cela a donné lieu à de petites modifications qui ont finalement porté l'interface utilisateur à un niveau de qualité supérieur.

Homme interagissant avec la nouvelle expérience utilisateur lors d'une session de test utilisateur

L'INTERFACE GRAPHIQUE UTILISATEUR DÉMONTRE LA PERFORMANCE

Le design de l'interface graphique utilisateur a été l'occasion de donner vie à la réflexion intelligente des ingénieurs et des concepteurs UX. Elle est minimaliste et sobre, mais combinée à la finition supérieure de l'appareil physique, elle donne l'impression d'un outil performant pour les professionnels.

Au-delà de l'aspect de l'image de marque et de l'objectif d'inspirer confiance, le design de l'interface graphique utilisateur est également conforme du point de vue de l'accessibilité et fournit tous les états nécessaires pour faciliter le développement.

Design d'une interface graphique utilisateur pour 9 écrans montrant les détails de l'interface utilisateur d'un équipement électronique professionnel
Maquette de l'interface graphique utilisateur d'un ordinateur portable sur fond sombre
Éléments de design

DESIGN D'UNE INTERFACE GRAPHIQUE UTILISATEUR COMPLÈTE EN 6 SEMAINES

La réalisation du projet a pris 6 semaines au total, depuis le début de l'audit initial de convivialité jusqu'à la remise du design de l'interface graphique utilisateur à l'équipe d'ingénieurs. Le résultat final est une interface utilisateur dans laquelle les techniciens n'ont qu'à faire la moitié du travail pour obtenir les résultats dont ils ont besoin.

Le processus d'interaction rationalisé a permis de simplifier la pile de codes. Le design de l'interface graphique utilisateur est réactive, de sorte que les techniciens peuvent contrôler l'appareil à partir d'un ordinateur portable ou d'un téléphone mobile, que ce soit sur place ou à distance. Cela ouvre un monde de possibilités.

Le résultat final pour l'entreprise est un produit où la qualité de l'ingénierie est évidente par l'aspect et la convivialité de l'appareil. En outre, les techniciens ont besoin de moins de formation, ce qui permet aux grands clients de déployer la solution plus facilement.

RÉSULTATS

Une conception de bout en bout livrée en 6 semaines

Documentation complète pour les développeurs

Le design est entièrement réactif

L'interface graphique utilisateur est devenue une référence dans l'industrie