Simple Science

La science de pointe expliquée simplement

# Informatique# Interaction homme-machine

Flowy : Un nouvel outil pour les designers UX

Flowy améliore le design UX en analysant des exemples de parcours utilisateur pour de meilleures décisions.

― 13 min lire


Flowy transforme leFlowy transforme ledesign UXmodèles de design.décision UX grâce à l'analyse desUn outil pour améliorer la prise de
Table des matières

Flowy est un système qui aide les designers à améliorer l'expérience utilisateur (UX) en analysant les motifs de design dans des exemples de parcours utilisateur provenant d'applications existantes. Il utilise une combinaison de technologies d'intelligence artificielle (IA) avancées pour fournir des insights précieux aux designers. Le système inclut des fonctionnalités qui :

  1. Annotent les motifs de design dans des exemples de parcours utilisateur,
  2. Analysent les motifs de design trouvés dans ces exemples, et
  3. Suggèrent d'autres exemples de design avec des motifs similaires.

Ce processus aide les designers à prendre des décisions éclairées et accélère leur recherche d'inspiration pendant la phase de design.

Les Fonctionnalités de Design du Système

Le système Flowy a une variété de fonctionnalités conçues pour soutenir les designers UX. Il fonctionne avec des captures d'écran de smartphones, affichant des composants d'interface utilisateur (UI) tels que des boutons et des champs de texte. Chaque capture d'écran est analysée, et le système fournit des détails sur la fonction, les avantages, les inconvénients, et les considérations pour différents motifs de design. Cette analyse aide les designers à comprendre le contexte plus large de leur travail et les différentes options de design qu'ils ont.

Le système visualise les relations entre des exemples de parcours utilisateur et des motifs de design. Cette connexion soutient les designers en rendant plus facile la recherche d'inspiration pendant qu'ils travaillent sur des projets UX.

Tendances Actuelles dans les Outils de Design UX Propulsés par l'IA

Dernièrement, il y a eu une montée en flèche des outils propulsés par l'IA visant à assister dans le design UI et UX. Beaucoup de ces outils génèrent des écrans UI statiques basés sur des prompts textuels fournis par les utilisateurs. Cependant, ils manquent souvent des éléments cruciaux d'interaction et d'expérience qui jouent un rôle significatif à travers plusieurs écrans. À travers des discussions avec des professionnels de l'UX, il est devenu clair que ces outils ne répondent généralement pas aux véritables besoins des designers travaillant sur des projets complexes.

Les problèmes courants avec les outils actuels incluent l'incapacité à générer des designs basés sur des systèmes de design existants, un manque d'explications derrière les Choix de design, et un focus étroit sur des écrans individuels plutôt que sur l'ensemble du parcours utilisateur.

Le Besoin d'une Meilleure Solution

Réaliser ce fossé, Flowy a été créé pour soutenir les designers dans leur recherche d'information pendant la phase d’idéation. Au lieu de viser la génération automatique d'écrans UI, Flowy fournit des exemples détaillés de parcours utilisateur combinés avec des connaissances sur les motifs de design. Cette approche permet aux designers d'identifier rapidement les motifs de design pertinents et de mieux comprendre l'espace de design pour des parcours utilisateur à écrans multiples.

Les tests utilisateurs ont montré que Flowy aide les designers à accomplir des tâches UX réalistes, prouvant que ses fonctionnalités de design sont bénéfiques pour divers projets créatifs.

L'Importance des Parcours Utilisateurs dans le Design UX

Les parcours utilisateurs jouent un rôle essentiel dans le design UX global. Ces parcours sont des représentations visuelles qui aident les designers à comprendre comment les utilisateurs navigueront à travers une application ou un site web pour accomplir des tâches. Alors que beaucoup d'outils actuels se concentrent uniquement sur la création d'écrans UI individuels, ils échouent à capturer le contexte plus large et les interactions que les parcours utilisateurs englobent.

À travers des études formatives avec des professionnels de l'UX, il est devenu évident que la phase d’idéation du design UX est semblable à un voyage de recherche d'information. Les designers doivent explorer différentes options, rassembler de l'inspiration, et faire des choix basés sur les exigences spécifiques de leurs projets. Cette observation a motivé la création de Flowy pour améliorer la capacité des designers à trouver de l'information précieuse de manière efficace.

Flowy : Un Outil Innovant de Design UX

Flowy se distingue de ses concurrents en mettant l'accent sur l'analyse des parcours utilisateurs plutôt que sur la simple génération d'écrans UI statiques. Il identifie trois principaux types de motifs de design :

  1. Motifs de disposition de composants : Comment différents composants UI sont arrangés sur un écran.
  2. Motifs d'interaction utilisateur : Comment les utilisateurs interagissent avec ces composants.
  3. Motifs spécifiques à des fonctionnalités : Motifs liés à des fonctionnalités particulières du produit.

En utilisant une technologie IA multimodale avancée, Flowy s'appuie sur un ensemble de données sélectionnées d'exemples de parcours utilisateurs de haute qualité pour aider les designers à reconnaître et comprendre les motifs de design pertinents.

Études Utilisateurs et Tests

Pour évaluer l'efficacité de Flowy, des études utilisateurs ont été réalisées avec des designers UX professionnels de différents niveaux d'expérience. Pendant ces sessions, les participants ont été invités à donner des retours et à réaliser des tâches de design en utilisant le système.

Les résultats de ces études ont indiqué que l'analyse des motifs de design de Flowy et les comparaisons visuelles d'exemples similaires étaient utiles pour guider l'attention des designers et faciliter l'apprentissage des motifs de design. Cette étude utilisateur a également révélé des domaines à améliorer pour l'avenir, concernant l'intégration des objectifs commerciaux et des informations visuelles plutôt que textuelles.

Contributions Principales de Flowy

Flowy offre trois contributions principales au design UX :

  1. Un système novateur qui soutient l’idéation en UX design : Flowy aide les designers dans leurs processus de recherche d'information en fournissant des insights spécifiques sur les parcours utilisateurs et les motifs de design.
  2. Un pipeline utilisant une IA de pointe : Cette configuration technique permet l'annotation automatique des informations sur les motifs de design dans les exemples de parcours utilisateurs.
  3. Efficacité prouvée à travers des études utilisateurs : Les résultats des études soulignent l'utilité de Flowy tout en exposant des implications de design clés pour les futurs outils de soutien à l’idéation UX.

Contexte : Le Rôle des Données dans le Design UX

Le parcours pour construire des outils de design UX efficaces est en cours depuis des années. Les outils non-IA ont tenté d'assister les designers de diverses manières, mais la complexité et la diversité impliquées dans le design UI ont conduit à un changement plus récent vers des méthodes basées sur des données. Par exemple, des ensembles de données bien connue comme le dataset Rico ont émergé pour soutenir des études visant à comprendre la sémantique du design.

Avec l'utilisation des systèmes de design devenant plus commune dans l'industrie, les designers UX se concentrent moins sur les aspects visuels et plus sur la création d'expériences utilisateur cohérentes en utilisant des composants prédéfinis. Comprendre les motifs de design devient essentiel pour les designers, car ces motifs fournissent un aperçu sur les choix de design et les stratégies potentielles.

IA Générative dans le Processus d’Idéation

L'IA générative est de plus en plus utilisée pour améliorer la créativité en fournissant diverses idées et concepts. Alors que certains outils génèrent du texte directement, d'autres créent des images pour inspirer de nouveaux designs. Flowy prend une approche différente ; au lieu de générer de nouveaux écrans, il aide les designers dans leur processus de recherche d'information en fournissant des insights précieux sur les motifs de design.

L'idée de la recherche d'information joue un rôle significatif dans le processus de design, car les designers visent à maximiser le taux auquel ils acquièrent des informations utiles tout en minimisant le temps passé à chercher. Flowy soutient ce processus en fournissant des connaissances et des analyses pertinentes, aidant finalement les designers à prendre des décisions plus éclairées.

Soutien à la Recherche d'Information dans le Design UX

La théorie de la recherche d'information, établie en 2016, est devenue un concept clé pour comprendre comment les gens recherchent des informations. La théorie compare la recherche d'information des humains à celle des animaux cherchant de la nourriture. Avec Flowy, l'objectif de design est de soutenir efficacement le comportement de recherche d'information des designers.

Des recherches antérieures ont indiqué que peu d'études se concentrent explicitement sur l'amélioration des processus de recherche d'information des individus. L'approche de Flowy est novatrice, car elle applique la théorie directement au contexte du design UX, en faisant un outil précieux pour les designers.

Études Formatives : Apprendre des Designers

Pour évaluer le paysage actuel des outils de design UX, des études formatives ont été menées avec des designers UX pour explorer leurs expériences et préférences. Les questions tournaient autour des sujets suivants :

  1. Retour sur les outils de soutien au design basés sur des prompts existants,
  2. Gestion des parcours utilisateurs utilisant divers artefacts de design.

Les entretiens ont révélé que les outils actuels sont limités dans leur utilité pour les designers, beaucoup exprimant leur frustration face à leur incapacité à soutenir efficacement les flux de travail dans le monde réel.

Conclusions Clés des Études Formatives

Conclusion 1 : Utilité Limitée des Outils Existants

Les participants ont unanimement convenu que les outils IA existants se concentraient trop sur des écrans UI individuels et manquaient le contexte plus large des parcours utilisateurs. Les designers ont trouvé que les résultats générés étaient souvent trop génériques et simplistes, entraînant une insatisfaction face à leurs résultats.

Conclusion 2 : Gestion Adaptative des Parcours Utilisateurs

Les designers ont signalé qu'ils adaptaient leurs représentations et artefacts en fonction des besoins spécifiques du projet. Cette approche adaptative souligne l'importance de la flexibilité dans le design UX, indiquant que les outils IA actuels échouent à soutenir adéquatement la complexité de la gestion des parcours utilisateurs en pratique.

Conclusion 3 : Compréhension des Motifs de Design

Les motifs de design sont apparus comme des éléments critiques dans le design UX. Les designers utilisent des motifs pour obtenir des perspectives sur l'espace de design et soutenir leurs processus de prise de décision. Comprendre les raisons derrière ces choix de design est crucial, soulignant le besoin d'outils fournissant des insights sur les motifs de design et les scénarios.

Objectifs de Design pour Flowy

Les insights obtenus des études formatives ont guidé les objectifs de design pour Flowy, y compris :

  1. Soutenir la prise de décision basée sur des preuves : Flowy vise à améliorer les processus de recherche d'information des designers pour des inspirations de design UX.
  2. Prioriser les parcours utilisateurs : L'accent est mis sur la fourniture de conseils liés aux interactions des parcours utilisateurs, plutôt qu'à des écrans statiques individuels.
  3. Offrir des insights complets sur les motifs de design : Combiner des exemples individuels avec des connaissances agrégées sur le design est essentiel pour aider les designers à prendre des décisions éclairées.
  4. Assurer des informations faciles à comprendre : Il est important de présenter les informations sur les motifs de design dans un format digeste pour faciliter une prise de décision rapide.

Mise en Œuvre de Flowy

Dans le développement de Flowy, un pipeline d'annotation des motifs de design a été créé qui exploite la dernière technologie IA multimodale. Le système prend des exemples de parcours utilisateurs et les analyse pour générer des annotations précises sur les motifs de design.

Annotation des Motifs de Design

Le pipeline d'annotation se compose de plusieurs étapes. D'abord, les captures d'écran originales des parcours utilisateurs sont traitées pour identifier les éléments UI pertinents. Ensuite, des articles de directives de design sont récupérés, et cette information est utilisée pour générer des annotations détaillées, y compris le nom, la raison d'être, les avantages, et les considérations de chaque motif de design.

Design d'Interface Utilisateur Conviviale

L'interface utilisateur de Flowy a été conçue pour fournir un accès clair et facile aux informations sur les motifs de design. Les utilisateurs peuvent explorer la page d'accueil, voir les parcours utilisateurs, et accéder à une analyse détaillée des motifs, améliorant leur capacité à comprendre diverses options de design.

Étude Utilisateur : Évaluer l'Efficacité de Flowy

Une étude utilisateur a été menée pour recueillir des retours des designers UX sur leur expérience avec Flowy. Pendant l'étude, les participants ont navigué dans le système, offert des retours et réalisé une tâche de design.

Insights Clés de l'Étude

  1. Accélérer la Recherche d'Inspiration : Les participants ont trouvé que les fonctionnalités de Flowy soutenaient leurs processus de prise de décision, leur permettant d'explorer les motifs de design plus efficacement.
  2. Désir d'Annotations Élargies : Les designers ont exprimé un besoin d'annotations incluant des objectifs de produit, des objectifs commerciaux et des contraintes techniques, montrant que les décisions de design impliquent souvent divers facteurs.
  3. Préférence pour l'Apprentissage Visuel : La plupart des designers préféraient apprendre à travers des comparaisons visuelles d'exemples de design plutôt que des explications textuelles, soulignant l'importance d'informations de design intuitives et accessibles.

Implications de Design pour les Outils Futurs

Sur la base des insights recueillis lors de l'étude utilisateur, plusieurs implications de design pour les futurs outils d’idéation UX ont été dérivées :

  1. Fournir des informations sur les motifs de design concises et faciles à comprendre pour réduire la charge cognitive.
  2. Élargir les analyses sur les motifs de design pour englober des considérations plus larges au-delà des parcours utilisateurs.
  3. Prioriser l'apprentissage visuel à travers des exemples comparatifs plutôt que de se fier uniquement à des explications textuelles.

Conclusion : L'Avenir du Soutien au Design UX

Flowy incarne une approche centrée sur l'humain pour le design UX, mettant l'accent sur le soutien des designers dans leurs processus créatifs. En fournissant des analyses perspicaces sur les motifs de design et en favorisant une recherche d'information efficace, Flowy vise à améliorer l'efficacité et la qualité globale des travaux de design UX.

Avec un affinement continu, Flowy peut jouer un rôle significatif dans la transformation de la manière dont les designers naviguent dans des processus décisionnels complexes tout en s'assurant qu'ils conservent la maîtrise de leur travail créatif. Les développements futurs impliqueront des tests dans le monde réel et des itérations pour résoudre davantage ses limitations et élargir son applicabilité à un éventail plus large de scénarios de design.

Source originale

Titre: Flowy: Supporting UX Design Decisions Through AI-Driven Pattern Annotation in Multi-Screen User Flows

Résumé: Many recent AI-powered UX design tools focus on generating individual static UI screens from natural language. However, they overlook the crucial aspect of interactions and user experiences across multiple screens. Through formative studies with UX professionals, we identified limitations of these tools in supporting realistic UX design workflows. In response, we designed and developed Flowy, an app that augments designers' information foraging process in ideation by supplementing specific user flow examples with distilled design pattern knowledge. Flowy utilizes large multimodal AI models and a high-quality user flow dataset to help designers identify and understand relevant abstract design patterns in the design space for multi-screen user flows. Our user study with professional UX designers demonstrates how Flowy supports realistic UX tasks. Our design considerations in Flowy, such as representations with appropriate levels of abstraction and assisted navigation through the solution space, are generalizable to other creative tasks and embody a human-centered, intelligence augmentation approach to using AI in UX design.

Auteurs: Yuwen Lu, Ziang Tong, Qinyi Zhao, Yewon Oh, Bryan Wang, Toby Jia-Jun Li

Dernière mise à jour: 2024-06-23 00:00:00

Langue: English

Source URL: https://arxiv.org/abs/2406.16177

Source PDF: https://arxiv.org/pdf/2406.16177

Licence: https://creativecommons.org/licenses/by/4.0/

Changements: Ce résumé a été créé avec l'aide de l'IA et peut contenir des inexactitudes. Pour obtenir des informations précises, veuillez vous référer aux documents sources originaux dont les liens figurent ici.

Merci à arxiv pour l'utilisation de son interopérabilité en libre accès.

Plus d'auteurs

Articles similaires