Un aperçu des livrables de conception UX les plus courants – Smashing Magazine – Gratuit : Audit complet de votre site internet

Avant de commencer !

Exemples et meilleures pratiques - Smashing Magazine
Share on facebook
Share on twitter
Share on pinterest

A propos de l’auteur

Nick Babich est un développeur, un passionné de technologie et un amoureux de l’UX. Il a passé les 10 dernières années à travailler dans l’industrie du logiciel avec une spécialisation sur…
Plus à propos
pseudo
Babich

Que font les designers UX au quotidien? Beaucoup de choses! Les professionnels de l’expérience utilisateur doivent communiquer des idées de conception et des résultats de recherche à un large éventail de publics. Ils utilisent des livrables (enregistrements tangibles du travail qui a eu lieu) à cette fin.
J’ai créé une liste qui contient les livrables les plus courants produits par les concepteurs UX alors qu’ils créent de grandes expériences pour les utilisateurs. Pour une meilleure lisibilité, j’ai combiné les livrables en fonction des activités UX.

La liste ci-dessous contient les livrables les plus courants produits par les concepteurs UX car ils créent de grandes expériences pour les utilisateurs. Pour une meilleure lisibilité, j’ai combiné les livrables en fonction des activités UX:

  1. Évaluation du projet
  2. Évaluation des concurrents
  3. Recherche d’utilisateurs
  4. Architecture de l’information
  5. Design d’interaction

Si vous souhaitez créer et concevoir vos propres prototypes un peu plus différemment, vous pouvez télécharger et tester Adobe XD et commencer tout de suite.

Obtenir la meilleure expérience utilisateur mobile possible

Rappelez-vous toujours que le design n’est pas seulement pour les concepteurs – c’est pour les utilisateurs. Il est important de traiter votre travail comme un projet en constante évolution et d’utiliser les données d’analyse et les commentaires des utilisateurs pour améliorer constamment l’expérience. Lire un article connexe →

Évaluation du projet

L’évaluation de projet est un processus d’évaluation qui aide les concepteurs UX à comprendre l’état actuel du produit.

Audit analytique

Un audit analytique est un moyen de révéler quelles parties d’un site Web ou d’une application causent des maux de tête aux utilisateurs et réduisent les conversions. Lors d’un audit analytique, un auditeur utilisera une variété de méthodes, d’outils et de mesures – sources de trafic, flux de trafic, conversions (et abandons), points chauds, etc. – pour analyser où un produit va mal (ou bien). En fin de compte, un audit analytique devrait permettre aux concepteurs UX de savoir comment booster les conversions en permettant aux utilisateurs d’atteindre plus facilement leurs objectifs sur le site Web ou l’application.

Les chiffres fournis par un outil d’analyse sur la façon dont l’utilisateur interagit avec un produit – clics, temps de session utilisateur, requêtes de recherche, conversion, etc. – aideront les concepteurs UX à découvrir les comportements inattendus et de surface qui ne sont pas explicites dans les tests utilisateur. (Image: Ramotion) (Voir la version grande)

Pointe: Prenez l’habitude de tester A / B vos modifications de conception. Le fait de savoir que tous vos changements seront testés A / B vous donnera une énorme liberté pour essayer de nouvelles choses (et potentiellement risquées). S’ils fonctionnent, vous le découvrirez presque immédiatement. De plus, vous n’aurez pas à vous inquiéter du fait que certaines modifications que vous avez apportées vont tout gâcher.

Audit de contenu

L’audit de contenu est le processus d’évaluation des actifs d’information sur une partie ou la totalité d’une application ou d’un site Web. On pourrait dire qu’un audit de contenu est un inventaire de contenu et une évaluation du contenu de chaque page (soit qualitatif par une personne, soit quantitatif à l’aide d’analyses) et / ou une affectation de propriétaires de contenu. Cela implique de rassembler tout le contenu sur votre site Web ou dans votre application et d’évaluer ses forces et ses faiblesses relatives afin de prioriser vos futures activités de marketing. En effectuant un audit, vous comprendrez mieux le contenu. Vous pouvez trouver des éléments dont vous ignoriez l’existence, repérer du contenu dupliqué ou obsolète ou identifier toutes sortes de relations dans le contenu. Les résultats d’un audit de contenu peuvent être utilisés pour une tâche globale (création d’une stratégie de contenu) ou une tâche locale (optimisation d’une certaine page).

(Regarder la vidéo)

Rapport de test d’utilisabilité

Les tests d’utilisabilité sont un moyen de voir à quel point un produit est facile à utiliser en le testant avec de vrais utilisateurs. Un rapport de test d’utilisabilité résume les résultats de l’utilisabilité d’une manière claire, concise et descriptive, aidant l’équipe de projet à identifier les problèmes et à trouver une solution.

Un exemple de rapport de test d’utilisabilité. (Image: Sitback) (Voir la grande version)

Pointe: Classez vos résultats. Chaque problème découvert lors des tests d’utilisabilité n’est pas tout aussi important. Un rapport sur l’utilisabilité peut avoir 5 ou 100 résultats, selon l’échelle de l’étude, et parfois il peut être écrasant pour une équipe de les parcourir tous. C’est pourquoi les résultats doivent être classés en termes de gravité (faible, moyenne ou élevée). Cela aidera l’équipe à identifier les problèmes critiques révélés par l’étude d’utilisabilité.

Évaluation des concurrents

L’évaluation des concurrents est une évaluation des forces et des faiblesses des concurrents actuels et potentiels. Évaluer les forces et les faiblesses de vos concurrents est un élément essentiel de votre propre stratégie UX.

Rapport d’analyse concurrentielle

Une analyse des produits concurrents permettra de cartographier leurs fonctionnalités existantes de manière comparable. Ce rapport d’analyse concurrentielle aide les concepteurs UX à comprendre les normes de l’industrie et à identifier les opportunités d’innover dans un domaine donné.

Une analyse concurrentielle permet aux concepteurs d’évaluer les forces et les faiblesses d’un concurrent sur un marché sélectionné et de mettre en œuvre des stratégies efficaces pour améliorer l’avantage concurrentiel d’un produit. (Image: crayon jaune) (Voir la version grande)

Pointe: Un point de départ utile pour identifier les points forts et les domaines à améliorer pourrait être l’heuristique de l’expérience utilisateur. Bien que l’analyse concurrentielle ne vise pas à reproduire l’évaluation heuristique, l’heuristique peut être un bon point de départ car elle offre une bonne structure de présentation des informations. L’heuristique comprend une navigation efficace, la clarté du texte et des étiquettes, la cohérence, la lisibilité, la numérisation, etc.

Proposition de valeur

Une proposition de valeur est une déclaration qui définit les aspects clés d’un produit: ce qu’il est, à qui il est destiné et comment il sera utilisé. Une proposition de valeur aide l’équipe à se mettre d’accord sur ce que sera le produit.

Une proposition de valeur aide les concepteurs UX à se concentrer sur les choses importantes. (Image: UX Mag (Voir la grande version)
(Regarder la vidéo)

Pointe: Assurez-vous que votre proposition de valeur est directement associée aux principaux objectifs commerciaux. En faisant cela, il sera beaucoup plus facile d’avoir des discussions sur le temps et le budget pour les activités UX.

Recherche d’utilisateurs

La recherche des utilisateurs se concentre sur la compréhension des comportements, des besoins et des motivations des utilisateurs grâce à des techniques d’observation, à l’analyse des tâches et à d’autres méthodologies de rétroaction.

Personnages

Un personnage est un personnage fictif qui utilise le produit d’une manière similaire à un type d’utilisateur potentiel. Les personas permettent aux designers de sympathiser avec les utilisateurs tout au long du processus de conception. Les personas sont un outil controversé dans l’armurerie UX: certains designers UX les aiment, d’autres les détestent. Par conséquent, il est important de comprendre non seulement les avantages mais également les inconvénients des personnages avant de les utiliser dans votre processus de conception UX.

Un personnage est un personnage fictif qui met en évidence les comportements, les besoins et les motivations de vos utilisateurs cibles. (Image: xtensio) (Voir la version grande)

Pointe: Les personnages les plus efficaces sont créés à partir d’entretiens approfondis avec les utilisateurs et de données d’observation d’utilisateurs réels. Collectez autant d’informations et de connaissances que possible sur les utilisateurs en interviewant et / ou en observant un nombre suffisant de personnes qui représentent votre public cible.

Histoire de l’utilisateur

Une user story est une simple description d’une fonctionnalité racontée du point de vue d’un utilisateur du produit. Fondamentalement, il s’agit d’une définition de très haut niveau d’une exigence (au niveau conceptuel), contenant juste assez d’informations pour que les développeurs puissent produire une estimation raisonnable de l’effort requis pour la mettre en œuvre.

(Image: realtimeboard) (Voir la version grande)

Pointe: Utilisez des user stories pour éviter le fluage des fonctionnalités. Le fluage des fonctionnalités est un terme qui revient régulièrement lors de la conception du produit. Il fait référence à la tendance à vouloir continuer à ajouter plus de fonctionnalités et à étendre la portée d’un projet. Essayez de refuser d’ajouter une fonctionnalité sans histoire d’utilisateur qui explique Pourquoi cette particularité compte.

Cas d’utilisation

Un cas d’utilisation est une description écrite de la façon dont les utilisateurs effectueront des tâches dans l’application ou le site Web. Il décrit, du point de vue d’un utilisateur, le comportement d’une application ou d’un site Web lorsqu’il répond à une demande. Chaque cas d’utilisation est représenté comme une séquence d’étapes simples, commençant par l’objectif d’un utilisateur et se terminant lorsque cet objectif est atteint.

Un cas d’utilisation est une liste d’actions ou d’étapes dans un événement, définissant généralement les interactions entre un utilisateur et un système, pour atteindre un objectif. (Image: Slideshare) (Voir la grande version)

Pointe: Les cas d’utilisation ne sont pas réservés à la phase UX; ils peuvent également être utilisés pour la phase d’assurance qualité. Ainsi, lors de l’examen de l’utilisabilité d’un produit donné, il est essentiel que le spécialiste de l’assurance qualité ait les cas d’utilisation à portée de main. Cela donnera aux spécialistes de l’AQ un ensemble de critères qui devront être pris en compte par la conception.

Carte d’expérience

Une carte d’expérience est un diagramme qui explore les multiples étapes suivies par les utilisateurs lorsqu’ils interagissent avec un produit. Il permet aux concepteurs de définir les motivations et les besoins de l’utilisateur à chaque étape du voyage, en concevant des solutions adaptées à chacune.

Une carte d’expérience simple reflète un chemin possible au cours d’un scénario. (Image: effectiveui) (Voir la grande version)
Comment créer une carte de parcours client (Regarder la vidéo)

Pointe: Le processus de création d’une carte de parcours client doit commencer par la connaissance des utilisateurs. Bien que vous puissiez vous tourner vers de nombreuses sources de données sur vos utilisateurs, l’une des plus évidentes est l’analyse de sites Web ou d’applications mobiles. Les analyses fournissent des informations précieuses sur ce que les utilisateurs font sur votre site Web ou dans votre application, et ces données vous aideront à créer des cas convaincants.

Storyboards (actuel)

Les storyboards sont des illustrations qui représentent des plans et qui représentent finalement une histoire. Dans UX, cette histoire est la série d’actions que les utilisateurs prendraient lorsqu’ils utiliseraient le produit. Les storyboards aident les designers à honorer les expériences réelles des personnes pour lesquelles ils conçoivent.

Les sourires et les expressions de tristesse sur les visages humains ont un fort impact émotionnel. Cela permet de donner vie à une histoire dans le cœur et l’esprit de votre public. (Image: Chelsea Hostetter) (Voir la version grande)

Pointe: En pensant au storyboard, la plupart des gens se concentrent sur leur capacité (ou leur incapacité) à dessiner. La bonne nouvelle est que vous n’avez pas besoin d’être bon en dessin avant de commencer à dessiner des story-boards. Ce qui est beaucoup plus important, c’est l’histoire que vous voulez raconter. Il est essentiel de transmettre clairement les informations.

Cadre de storyboard du film Goodfellas de Martin Scorsese. (Voir la grande version)

Sondage

Une enquête est un moyen rapide et peu coûteux de mesurer le niveau de satisfaction des utilisateurs et de recueillir des commentaires sur le produit. Bien qu’une enquête soit un excellent moyen de collecter des informations auprès d’un grand nombre d’utilisateurs, sa limite évidente est le manque de connaissances qualitatives – par exemple, Pourquoi les clients utilisent le produit d’une certaine manière.

(Regarder la vidéo)

Pointe: Gardez l’enquête courte. La tentation lors de la création d’un sondage est d’ajouter d’autres questions. Le problème est que cela peut devenir douloureusement long et que les gens sauteront simplement les questions. Si vous souhaitez collecter des informations plus précieuses, vous devez utiliser une meilleure approche. Gardez l’enquête succincte et exécutez-en une autre dans un mois ou deux.

Architecture de l’information

L’architecture de l’information consiste à décider comment organiser les parties de quelque chose pour qu’elles soient compréhensibles. Pour les produits numériques, l’architecture de l’information se traduit par la création de navigation, de plans de site, de taxonomies et de wireframes.

(Image: Murray Thompson, UX Booth) (Voir la version grande)

Plan du site

Un plan du site est un diagramme des pages d’un site Web, organisé de manière hiérarchique. Il permet de visualiser facilement la structure et la navigation de base du site Web.

Exemple de plan du site (Image: Behance) (Voir la version grande)

Pointe: Si vous souhaitez créer un plan de site rapidement et facilement, utilisez la méthode de tri des cartes.

Taxonomie

Une taxonomie résulte d’une exploration de plusieurs façons de classer le contenu et les données: articles dans un site Web d’actualités, catégories de produits dans une application de commerce électronique, etc. Une taxonomie aide les concepteurs à définir la structure de contenu qui prend en charge les objectifs de l’utilisateur et de l’entreprise .

(Image: Christian Ricci) (Voir la grande version)

Pointe: Une taxonomie est un document évolutif qui doit être testé et mis à jour régulièrement.

Wireframe

Un filaire est un guide visuel qui représente la structure d’une page, ainsi que sa hiérarchie et ses éléments clés. Les wireframes sont utiles lorsque les concepteurs UX doivent discuter des idées avec les membres de l’équipe et les parties prenantes, et pour aider le travail des concepteurs visuels et des développeurs.

Les wireframes peuvent être présentés sous forme de croquis:

L’esquisse est un moyen rapide de visualiser une idée (telle qu’une nouvelle conception d’interface). (Image: Nicholas Swanson) (Voir la version grande)

Les wireframes peuvent également être présentés sous forme d’illustrations numériques:

Exemple de wireframes pour une application mobile. Téléchargez Wires, deux kits UX filaires gratuits pour mobile et web, conçus pour Adobe XD. (Voir la grande version)
(Regarder la vidéo)

Pointe: Gardez les wireframes simples et annotez. Le but d’un filaire est de montrer la structure de la conception d’une page – les détails viendront plus tard. Si vous prévoyez de présenter un filaire à l’équipe, essayez d’inclure des annotations. Les annotations aident à créer un contexte et à livrer rapidement des idées clés.

Design d’interaction

La conception d’interaction (souvent abrégée en IxD) est la pratique de la conception de produits numériques interactifs. Il s’agit d’un processus par lequel les concepteurs créent des interfaces utilisateur attrayantes avec des comportements et des actions logiques et réfléchis.

Scénarios (planifiés)

Fondamentalement, c’est le même storyboard que nous avons vu dans la section sur la recherche d’utilisateurs, avec une seule différence: ces storyboards sont utilisés pour vendre des solutions de conception. Les concepteurs les utilisent pour montrer les avantages d’une solution proposée et pour convaincre les parties prenantes avec elle.

(Image: digiflip) (Voir la grande version)

Pointe: Concevez un résultat clair. Assurez-vous que votre storyboard laisse le public sans aucun doute sur le résultat de l’histoire. Si vous décrivez une situation défavorable, terminez par tout le poids du problème; si vous présentez une solution, terminez par les avantages de cette solution pour votre personnage.

Diagramme de flux utilisateur

Un diagramme de flux utilisateur est une représentation visuelle des actions de l’utilisateur pour effectuer des tâches au sein du produit. Un flux utilisateur visualisé permet d’identifier plus facilement les étapes à améliorer ou à repenser.

Le flux d’utilisateurs permet de construire une compréhension commune de chaque page de votre application ou de votre site Web. (Image: Behance) (Voir la version grande)

Pointe: Pour de nombreux projets en phase de conception active, la création de flux d’utilisateurs peut prendre du temps, car les dessins deviennent instantanément obsolètes à mesure que les écrans changent. Ryan de Basecamp propose une version simplifiée des flux d’utilisateurs. Ce format est très rapide à esquisser et il communique l’essentiel de ce qui doit se produire.

Prototype

Beaucoup de gens utilisent les termes «filaire» et «prototype» de manière interchangeable, mais il y a une différence significative entre les deux livrables de conception: ils ont un aspect différent, ils communiquent des choses différentes et ils servent à des fins différentes. Alors que les wireframes sont similaires aux plans architecturaux (par exemple, un plan de construction), un prototype est une représentation de moyenne à haute fidélité du produit final. L’objectif d’un prototype est de tester des produits (ou des idées de produits) avant d’investir beaucoup de temps et d’argent dans le produit final.

Un prototype donne un avant-goût de la façon dont l’utilisateur va interagir avec le produit. Cela peut être analogique:

Prototype analogique basse fidélité (Vidéo: UX Playground) (Voir la grande version)

Ou il peut être numérique:

Prototype interactif haute fidélité créé dans Adobe XD et mis en miroir sur un iPhone (Voir la grande version)

La chose la plus importante est que le prototype devrait permettre à l’utilisateur de découvrir le contenu et de tester les principales interactions avec l’interface d’une manière similaire à la façon dont ils le feraient avec le produit final.

Pointe: Testez autant que possible des prototypes sur des appareils réels. Alors qu’un émulateur sur votre bureau peut fonctionner dans certains cas, rien ne remplace l’expérience des conceptions sur un véritable appareil.

Conclusion

Vous êtes probablement surpris par le nombre de livrables mentionnés dans cet article. Rassurez-vous, chaque projet est différent et un concepteur UX n’aurait pas besoin de les produire tous pour chaque projet. N’oubliez pas non plus qu’il n’y a pas de livrable unique qui soit aussi efficace pour tous les projets. Chaque livrable devient un outil de communication efficace dans le bon contexte et avec le bon public.

Cet article fait partie de la série de conception UX sponsorisée par Adobe. L’outil Adobe XD est conçu pour un processus de conception UX rapide et fluide, car il vous permet de passer de l’idée au prototype plus rapidement. Concevez, prototypez et partagez – le tout dans une seule application.
Vous pouvez consulter des projets plus inspirants créés avec Adobe XD sur Behance, et également visiter le blog Adobe XD pour rester à jour et informé.

Smashing Editorial(ms, vf, yk, al, il)

Inscris-toi à notre newsletter !

Partage cet article avec tes amis !

Share on facebook
Share on google
Share on twitter
Share on linkedin