BRYENNE KAY
Tableau d'annonce
En production dans une entreprise japonaise de B2B IT, il s’agit d’une plateforme de visualisation de données opérationnelle pour les utilisateurs internes hautement qualifiés qui fait économiser du temps et améliore les stratégies.
Situation
Entreprise
LeadPlus
L'année lancé
2021
Mon rôle
Conceptrice produits, chercheuse
Bref
Les utilisateurs internes et externes ne reçoivent pas les nouvelles concernant la plateforme ou leurs comptes dans un même espace. Les notifications sont donc dispersées dans les courriers électroniques de groupes et privés, ce qui rend les informations difficiles à trouver.
Comme il y a de nombreux types d'utilisateurs sur la plateforme, de nombreux types d'informations sont envoyés. En général, les courriels étaient envoyés à des utilisateurs externes et la communication interne se faisait via Slack. Les messages n’étaient pas toujours étiquetés pour des renseignements faciles à trouver et il était de plus en plus difficile pour les gens de créer des groupes de courriels à jour pour les bons destinataires.
Le défi et les objectifs
Créer un centre de notification centralisé et personnalisable pour tous les utilisateurs.
Il existe de nombreux types de groupes d'utilisateurs internes et externes :
-
Les groupes internes comprennent diverses équipes de vente, l'équipe de service, les responsables et les parties prenantes
-
Les groupes externes sont répartis en agences de publicité, en entreprises et en particuliers
Comme il y a de nombreux types d'utilisateurs sur la plateforme, de nombreux types d'informations sont envoyés.Certaines exigences du projet comprenaient :
-
Techniquement, il doit être conçu pour être utilisé avec Jira et copier-coller des articles Confluence
-
Doit être capable d'envoyer à des groupes spécifiques modifiables
-
Doit permettre l'étiquetage et la modification des avis
Processus de design
Comment je gère mes responsabilités dans un projet
Ma participation a commencé par le lancement d'un projet dirigé par le PM et comprenait également le promoteur principal et les intervenants. Ensemble, nous nous sommes assurés de bien comprendre les exigences, les obstacles potentiels et les objectifs opérationnels. Parallèlement à cette communication, j'ai commencé à faire des recherches qui comprenaient des entrevues avec les utilisateurs et un audit competitif. De là, j'ai pu travailler sur des histoires d'utilisateurs et des storyboards. J’ai utilisé les données de Google Analytics et June indicant quels groupes d'utilisateurs utilisent quels appareils lorsqu'ils vérifient les plates-formes, et à quelle heure de la journée. Après avoir examiné les données, j'ai pu commencer à créer des idées à partager avec l'équipe. Les maquettes sont testées à différentes étapes pour être analysées et itérées. Cette ligne peut souvent prendre la forme d'une boucle et être répétée plusieurs fois tout au long d'un projet.
Brainstorm
Research
User stories
Wireframes
Testing
Analysis
Recherche, outils & méthodes
La communication et la collaboration sont essentielles pour concevoir avec succès un outil aussi efficace
Avant Figma, avant de dessiner, il y a beaucoup de recherches de bureau. Contrairement à d'autres projets dans l'entreprise, c'est une caractéristique très commune qui est facile à rechercher : un panneau d’annonce. Je commence à consulter Google Analytics et June pour obtenir des données sur qui utilise les produits sur quels appareils à quelle heure de la journée et toute autre statistique pertinente que je peux recueillir. Plusieurs produits logiciels que j'utilise dans ma vie personnelle et professionnelle ont des caractéristiques similaires, donc je mène un audit compétitif. Je reviens en arrière et pose au développeur de ce projet quelques questions sur les limitations techniques et les possibilités. Avec mon chef de produit pour aider avec les traductions japonaises, nous menons quelques entretiens avec les utilisateurs et gardons nos notes sur Excel avant de faire nos résumés finaux dans un document Confluence Atlassian que nous pouvons partager avec l'équipe.
Mes premières itérations se font sur papier et les maquettes passent à Figma pour des designs basse et haute fidélité. J'ai mis mes prototypes Figma dans Maze pour tester et recueillir les commentaires de mes collègues et des parties prenantes.
Entrevues avec les utilisateurs : qu'est ce que les utilisateurs veulent et de quoi ont-ils besoin
Comprendre les besoins des différents groupes d'utilisateurs
Comme mentionné précédemment, il existe des utilisateurs internes (équipes de vente, équipe de service, MP, parties prenantes et super-utilisateurs) et des utilisateurs externes (agences de publicité, entreprises et clients individuels). Avec l'aide de mon PM, nous réunissons 3 membres de chaque équipe de vente et de service, les parties prenantes et 2 super-utilisateurs. Nous les interrogeons sur leurs méthodes actuelles de réception et de diffusion de l'information concernant la plateforme et sa pertinence pour leurs rôles. Les équipes de service et de vente nous expliquent leurs processus et les obstacles qu'ils rencontrent.
Après plusieurs séries de discussions et d’entrevues, nous arrivons à des conclusions semblables.
-
les expéditeurs veulent envoyer des notifications à des groupes de personnes (informations sur les ventes, mises à jour de la plateforme, modifications des procédures de modification au personnel, etc.)
-
les expéditeurs et les destinataires veulent filtrer les messages que j'ai étiquetés
-
les expéditeurs veulent être en mesure de modifier le contenu des messages pour les renvoyer facilement ou les mettre à jour au besoin
-
il doit être connecté via Confluence pour des raisons de sécurité et techniques
Avec ces idées en tête, je peux commencer par les flux de travail des utilisateurs.
Les super-utilisateurs doivent créer, modifier, baliser et envoyer du contenu à différents groupes pour avoir une communication flexible et efficace.
Flux d'utilisateurs : un chemin clair pour que les utilisateurs atteignent facilement leurs objectifs
Identifier les parcours des différents utilisateurs pour différents types d'utilisateurs
Après avoir passé en revue les exigences opérationnelles, les entrevues et les idées, j'écris le coeur de la fonctionnalité du tableau d'annonces :
les histoires d'utilisateurs. Cette étape pour moi commence toujours sur papier et inclut les flux d'utilisateurs afin que je puisse commencer à imaginer le flux pour nos différents utilisateurs internes et externes.
-
En tant que client ou agence de publicité, je veux voir toutes les notifications concernant mes comptes et MyFolio afin de ne pas avoir de surprises et je peux être informé.
-
En tant que membre de l'équipe de vente, je veux voir toutes les notifications sur MyFolio et les nouvelles de l’éditeur (Yahoo, Google, Facebook) afin que de pouvoir prendre les meilleures décisions pour les comptes de mes clients.
-
En tant qu’administrateur de plate-forme ou membre de l'équipe de maintenance, je souhaite écrire et mettre à jour les annonces ainsi que gérer la capacité des utilisateurs à faire des annonces dans Confluence afin de pouvoir les partager facilement avec différents groupes d'utilisateurs à classer.
Recherche documentaire : Audit compétitif
Rechercher des thèmes communs, des meilleures pratiques, et mesurer les avantages des alertes en temps réel dans les applications
Je crée un mood board basé sur des systèmes et outils populaires d'envoi de contenu. Maintenant que je connais tous les besoins des utilisateurs et des entreprises, je peux commencer à rassembler les pièces du puzzle.
L'une des discussions les plus approfondies que nous avons eue en tant qu'équipe était la question des alertes en temps réel, dans l'application, à recevoir par l'utilisateur. C'était une caractéristique que certains membres de l'équipe jugeaient très utile. Nos données d'utilisation à l’époque suggéraient que les utilisateurs externes vérifiaient la plateforme environ une fois par jour, regardaient l’aperçu des informations pendant une dizaine de minutes et se déconnectaient. Le dev m’a informé que bien que possible, la création d’alertes en temps réel nécessiterait beaucoup plus de temps et de ressources que si l'utilisateur devait recevoir l’alerte de notification lors de la connexion. Comme les utilisateurs ne passaient pas beaucoup de temps sur la plate-forme, en plus de savoir que les informations relatives au temps étaient très rarement envoyées, nous avons décidé de n’avoir que des alertes de notification lors de la connexion des utilisateurs.
Le dev m’a informé que bien que possible, la création d’alertes en temps réel nécessiterait beaucoup plus de temps et de ressources que si l'utilisateur devait recevoir l’alerte de notification lors de la connexion. Comme les utilisateurs ne passaient pas beaucoup de temps sur la plate-forme, en plus de savoir que les informations relatives au temps étaient très rarement envoyées, nous avons décidé de n’avoir que des alertes de notification lors de la connexion des utilisateurs.
Wireframing & mockups
Des croquis sur papier aux prototypes Figma, la communication est essentielle
Avec les exigences, les données d’interview et les histoires d'utilisateurs, j'esquisse quelques wireframes de basse fidelité. La première personne à qui je parle habituellement à ce stade est le promoteur. Non seulement il a généralement de bonnes idées, mais il peut aussi me faire savoir si les idées ou les concepts auxquels je pense sont trop compliqués. C'est un moyen facile d'éliminer rapidement certains cadres ainsi que de garder les gens impliqués dans le processus de conception. Sur la base de ses commentaires, je passe à des versions plus fidèles dans Figma que je peux montrer au reste de l'équipe.
Je fais quelques wireframes simplistes et interactifs pour leur présenter et ils éliminent ceux qui ne correspondent pas à nos besoins. Tous les concepts avec texte de prévisualisation sont rejetés, car les intervenants craignent que les utilisateurs ne soient pas aussi amener à ouvrir des notifications s'ils peuvent parcourir le contenu dans le texte de prévisualisation. Une autre idée avec laquelle nous ne continuons pas est une fonctionnalité permettant aux expéditeurs ou aux super-utilisateurs de filtrer les notifications par groupe de destinataires. Bien que cela puisse être une fonctionnalité utile pour les expéditeurs car elle leur permettrait de voir quels groupes de vente ont reçu quels e-mails rapidement, il est jugé inutile pour la version 1 et nous l’examinerons à nouveau pour une version ultérieure.
Les essais et validations
Tester dans Maze et comprendre les ICP
Je mets un wireframe haute-fidélité et une maquette dans Maze, mon programme de test préféré. Ici, je peux obtenir les commentaires de mes collègues et des parties prenantes et modifier tout problème restant avant de passer au prototype final pour le développement.
Les testeurs donnent des commentaires positifs et la maquette proposée a un taux de réussite de 100 %. Il est facile pour les utilisateurs de voir l’alerte de notification, de naviguer vers le panneau d’annonce, d'ouvrir la notification et de la rechercher par balise.
Donnez aux utilisateurs la flexibilité et le contrôle : les créateurs d’annonces peuvent créer, modifier, personnaliser les groupes de destinataires, planifier l'envoi des annonces et personnaliser les modèles.
Interface utilisateur
Un regard sur le système de design et la conception visuelle de la plate-forme
Cette plateforme et les couleurs de l'entreprise existaient avant que je rejoigne l'entreprise. Cependant, il n'existait pas de système de conception. Entre différents projets, j'ai créé la plateforme de conception pour les plateformes de l'entreprise et je l'ai mise à jour avec la collaboration du développeur. J'ai hérité de la palette de couleurs et de certains éléments, mais je les ai organisés en variantes interactives de Figma, puis je les ai ajoutés à Storybook avec le développeur pour maintenir la cohérence du design et simplifier le développement.
Voici un échantillon des couleurs utilisées sur la plate-forme, les nuances de rose et de bleu sont du logo de l'entreprise et j'ai construit les autres nuances autour de celles-ci. Le rose est la couleur de surbrillance, souvent utilisée pour les éléments d’appel à l'action, tandis que le bleu est la couleur principale pour les mises en page.
Voici un échantillon des couleurs utilisées sur la plate-forme, les nuances de rose et de bleu sont du logo de l'entreprise et j'ai construit les autres nuances autour de celles-ci. Le rose est la couleur de surbrillance, souvent utilisée pour les éléments d’appel à l'action, tandis que le bleu est la couleur principale pour les mises en page.
La typographie ici est Roboto. Il a été choisi pour sa simplicité et sa flexibillité. La langue principale de cette plateforme est le japonais, que Roboto gère élégamment. La version anglaise est réservée à l'équipe produit & ingénierie. J'ai créé l'échelle typographique pour la cohérence et la facilité visuelle.
Prototype final
Conception approuvée par les intervenants et soumise pour développement
Voici les cadres du prototype final. Au bas de cette étude de cas, il y a une vidéo du flux utilisateur du point de vue d’un expéditeur d’annonce.
Voici quelques résultats des tests de maquette :
Pour les tags, j'ai choisi le rose plus foncé car les bleus étaient des design tokens existants avec d'autres significations. Lors des tests, plus de gens ont préféré le contour de l'enveloppe pour les annonces ouvertes et non ouvertes, mais j’aimerais faire plus de tests sur les icônes à l’avenir. Comme c'est parfois le cas, il y a eu un glissement de portée au milieu du projet et certaines caractéristiques ont été jugées essentielles après la première série d’entrevues, à savoir l'ajout de l'option d'inclure l’annonce comme un email (peut être vu dans la vidéo).
Atteindre les IPC : L’adoption des fonctionnalités à 31 % est un succès le premier mois
Validations et réflexions futures
Ce qui a marché, ce qui n'a pas marché, et ce qui peut etre modifié dans de futures itérations
Le IPC de 30% pour l'adoption des fonctionnalités a été atteint dès le premier mois après la sortie de la fonctionnalité. Bien que ce soit encore un succès, il peut bien sûr être amélioré. Dans les entretiens avec les utilisateurs internes, les super-utilisateurs étaient très satisfaits de la quantité de contrôle et de personnalisation qu'ils peuvent utiliser. Les membres de l'équipe de service ont exprimé le désir d'avoir plus de filtres, qui pourront être examinés lorsque les ressources seront disponibles.
Comme c'est la première fois sur MyFolio avec une alerte, je veux donner un peu plus de temps aux utilisateurs internes et externes pour découvrir la fonctionnalité avant de regarder le score de satisfaction client. Dans une itération future, il pourrait s’avérer intéressant d'ajouter dans l’aperçu du texte et de l'expérience une limitation du nombre de balises que les créateurs peuvent ajouter à une base de données.
Flux du produit final
Voici une vidéo du parcours complet de l'utilisateur du point de vue d'un créateur d’annonces.
