Comment travaillons-nous avec nos clients et comment les intégrons-nous au processus créatif ? Comment partir d'une page blanche pour arriver à un produit qui répond aux besoins clients et qui séduit les utilisateurs ?

Voilà les questions auxquelles je vais essayer de répondre aujourd'hui. Let's go! 🔥

Comme souvent, pour qu'un projet se déroule bien, la première étape consiste tout simplement à se poser avec notre client pour discuter, échanger, et apprendre à se connaître du point de vue humain et des projets. Commencer à expliquer la manière dont nous travaillons et partager nos points de vue sur le produit à créer.

Il est important à cette étape de convier les bons interlocuteurs : les individus qui vont suivre le projet et travailler au quotidien à nos côtés sur les jours, les semaines, voire les mois à venir. Nous oeuvrons tous pour le même objectif : créer un produit top ! D'où l'importance d'être sur la même longueur d'onde dès le début 😊.

Ces échanges sont capitaux, car dans le design produit, c'est souvent une question de perspective et de confiance. Que tout le monde comprenne où on va, comment et pourquoi, est donc indispensable pour que les futurs échanges soient fluides et plus efficaces.

Pour faciliter cette étape, nous aimons poser diverses questions qui peuvent varier en fonction du projet. Voici quelques exemples :

Qu'est-ce qui serait considéré comme un échec pour ce projet ?

Qu'espérez-vous de ce projet ? Qu'est-ce qui serait considéré comme un succès ?

Quel rôle cela va-t-il avoir dans votre business ?

Qui sont les personnes qui vont prendre les décisions/valider les choix ?

Y a-t-il des entreprises qui vous inspirent ?

Y a-t-il des choses que vous n'aimez pas du tout dans des projets similaires ? Que vous ne voulez pas voir ?

Avez-vous une charte graphique ? Des éléments existants sur lesquels il faut se baser ?

Quelles sont les ressources dont vous disposez actuellement ?

L'objectif de ce point est d'aligner tous les participants sur une vision commune du projet et de les éclairer sur les étapes à venir. 

À cette étape, on connait le produit, les objectifs à atteindre et les contraintes et on a peut-être même commencé à se faire de nouveaux amis, yay 😃! Mais le produit pourrait toujours ressembler à n'importe quoi... En effet, même en connaissance de toutes ces informations, le champ des possibles est toujours très vaste.

Imaginons que nous sommes architectes et qu'une famille nous demande de construire une maison pour 5 personnes avec 4 chambres et 2 salles de bain 🏠. Sachant ça, la maison pourrait tout à fait être grande, petite, large, haute, sur un étage comme sur 3 étages, blanche, bleue... Tout est encore possible et c'est pour ça qu'il faut commencer à réfléchir à différentes pistes et collaborer pour trouver la plus adaptée !

Nous aimons donc à cette étape travailler sur différentes planches visuelles, on peut parler ici de moodboard. Chaque planche représente une piste et contient des éléments tels que :

le type d'imagerie : photos, illustration, visuels 3D...

des éléments d'interfaces : boutons, animations...

Chaque moodboard doit être assez distinct des autres pour permettre d'identifier une tendance, une direction, un ton. Cela n'est pas représentatif du rendu final du design, mais est un guide pour la réalisation des futures maquettes. Le but est ici de commencer à s'orienter vers une piste plutôt qu'une autre, sans que quoi que ce soit encore complètement défini et gravé dans le marbre. Cela doit donner une idée de la future ambiance du produit, sans rentrer dans des détails superflus ou des considérations trop spécifiques.

En fonction des retours sur les différentes pistes, nous travaillons sur une version plus aboutie en prenant en compte les retours de notre client. C'est un document vivant, sur lequel on doit pouvoir itérer et revenir en cas de problème.

Maintenant que l'on a une direction sur laquelle se baser, on commence à appliquer tout ça sur de premières maquettes du produit. Le but ici est de travailler sur des vues clés, assez représentatives en terme de contenu et de composants visuels et d'interface du produit.

L'important à cette étape est encore une fois de ne pas se mettre trop de contraintes et de rester créatif ! En effet, même en ayant défini un style de typographie, une palette de couleurs et un style d'imagerie à l'étape précédente, l'interface peut encore ressembler à n'importe quoi ! Alors on essaie, on teste, on jette notre copie et on recommence jusqu'à obtenir quelques pistes intéressantes qui pourraient fonctionner.

C'est ici encore une fois un travail collaboratif entre nous et notre client. On crée une version, on la présente, on corrige, on itère, on recommence si besoin et on avance !

Et si on a un doute, on peut toujours se replonger dans tout le travail et les informations apportées par l'étape d'immersion. Il faut toujours que tout le monde garde en tête pour qui nous faisons notre produit et pour quel(s) objectif(s).

Quelques éléments une conception visuelle réussie :

✒️ Utiliser dès que possible un maximum de vrais contenus : exit le lorem ipsum, on veut travailler avec de vrais textes, pour créer une interface qui s'adapte au mieux au futur contenu. Quand on parle de site vitrine, le contenu représente une grande partie du succès du site et il est donc même nécessaire de le concevoir et de le rédiger en amont, car la ligne éditoriale est une part entière du branding de la marque.

🏠 Ne pas forcément commencer par la page d'accueil : lorsqu'on travaille sur un site, on a souvent tendance à vouloir commencer à designer la page d'accueil. Mais la page d'accueil étant souvent un hub permettant de rediriger vers les pages intérieures du site, il est parfois plus pertinent de commencer par une page produit, une page expertise ou autre avant de s'attaquer à la page d'accueil !

Une fois qu'une direction a été validée, on est dans le concret. On a une base solide, reste à l'étendre à toutes les vues à réaliser. La plus grande complexité selon moi à cette étape est d'arriver à trouver l'équilibre la rigueur et la créativité.

En effet, il faut réussir à ce que toutes les pages aient une cohérence.Et retrouver une ligne directrice dans la navigation et l'enchaînement des vues. Mais il faut également que chaque page soit unique, et apporte ses propres éléments, le but n'étant pas que chaque page soit un copier-coller de la précédente avec un nouveau titre et des photos différentes.

Tout le travail du designer va être de réussir à créer des règles et des composants d'interfaces que l'on va retrouver sur l'ensemble du produit. Nous créons par exemple une palette de toutes les couleurs qui vont être utilisées ainsi que leurs nuances, des règles typographiques et de structures de page ou encore d'iconographie... Si vous souhaitez en apprendre plus à ce sujet et acquérir une réelle méthode efficace de travail, je vous recommande chaudement la lecture de Refactoring UI de Steve Schoger et Adam Wathan. Je ne m'étendrai pas ici sur le sujet des Design Systems car c'est un sujet trop vaste, mais peut-être une prochaine fois ? 😊

Faire tout ça, c'est bien. Mais il ne faut pas oublier de garder chaque page unique et intéressante. Si on reprend l'exemple de notre maison : chaque pièce a une utilité. C'est pareil pour notre produit : chaque vue à un objectif. À nous de réussir à l'atteindre en expliquant clairement à l'utilisateur ce que l'on veut lui dire et à le guider pour qu'il atteigne cet objectif.

💡 Petit conseil en passant : si le produit semble trop massif, il peut être judicieux de travailler sur plusieurs petits lots plutôt que d'essayer de tout faire d'un coup. Nous essayons toujours d'identifier quelques fonctionnalités importantes, de les traiter, puis de travailler sur d'autres lots au fur et à mesure. Se concentrer sur un spectre restreint permet de ne pas se perdre et d'être submergé par quelque chose qui serait trop complexe.

Et bien sûr, nous n'oublions pas de décliner chaque support : desktop, tablette, smartphone... Tout y passe. En fonction du projet, il peut être intéressant de travailler sur les vues mobile en premier, c'est ce qu'on appelle le Mobile First, mais nous n'épiloguerons pas sur ce sujet aujourd'hui !

Et enfin, on transforme si possible tout ça en prototypes interactifs. C'est toujours mieux pour pouvoir se projeter de pouvoir naviguer et interagir avec son produit que de voir de simples captures d'écran en JPEG.

Vous l'aurez compris (je l'espère 🤞🏻), le processus créatif passe par plusieurs étapes qui permettent d'avancer pas à pas, ensemble, vers un résultat idéal. C'est ici un processus "type" que j'ai essayé de vous détailler, mais il n'y a pas de méthode miracle pour réussir le design d'un site ou d'une application. Il faut savoir rester flexible et adapter sa méthode.

Chaque projet est différent. Certains permettent une grande liberté créative quand d'autres sont beaucoup plus cadrés par des chartes graphiques ou des contraintes techniques importantes. Certains invitent à un travail de branding qui va au-delà d'un simple processus créatif et invite à une réflexion plus aboutie et plus profonde sur la marque, ses enjeux et sa communication.

Chez Uxer, nous travaillons également avec l'utilisateur au centre de nos projets. Cela implique un gros travail d'UX tout au long du projet qui s'imbrique au processus créatif. UX et UI Designer travaillent donc ensemble pour arriver à un résultat efficace et qui, on l'espère, ravit vos équipes et vos utilisateurs. 😍

Pour finir, si ce dernier point vous intéresse, notre UX Designer Romain nous parlait il y a quelques semaines de la raison pour laquelle il est important d'intégrer vos utilisateurs au processus de conception et de design.

Ou comment arriver à un résultat qui vous donnera envie de crier "Wahou !"

Comment faire pour que votre site ou application réponse parfaitement à vos besoins et à ceux de vos utilisateurs ?

Quels sont les outils que j'utilise quotidiennement en tant qu'UX Designer ? C'est ce que j'ai décidé de vous partager aujourd'hui. Voici donc quelques outils que j'affectionne tout particulièrement et surtout qui me permettent de gérer mon organisation, optimiser ma productivité et collaborer avec les équipes ⚡️

Cette liste va se limiter à 6 outils mais la liste est en réalité bien plus longue. Je vais vous présenter les outils qui nous permettent aujourd'hui de répondre à un besoin de forte collaboration entre les équipes, de plus en plus de travail à distance et donc une adaptation de notre flux de travail pour rester dans une démarche qualitative et centrée sur l'utilisateur 💪

Alors allons-y, vous allez voir ces outils sont incroyables !

Organiser, gérer et centraliser sa production avec Notion


Le seul, l'unique ! Cet outil a révolutionné notre manière de travailler.
Il s'agit d'un véritable espace de travail collaboratif. J'organise donc toute ma production sur cet outil, que ce soit professionnel ou personnel. Toute l'agence l'a également adopté, c'est notre principal espace de gestion où tout le monde peut suivre l'avancée de chaque projet et les différents livrables. Cet outil permet d'intégrer une multitude de données, de formats différents et permet de nombreuses interactions. 

Notion permet aussi de partager via un simple lien tout l'espace de travail à des collaborateurs. C'est ce que nous faisons avec nos clients afin de leur donner un accès de manière transparente à toute la production et d'accéder rapidement aux livrables.

Comment je m'en sers tous les jours ? 
Je l'utilise pour toutes les phases préparatoires, recherche secondaire, gestion du recrutement, création de guides et j'en passe ! C'est également mon outil principal de prise de notes lors d'entretiens utilisateurs et d'observations, de création et partage de livrable, mais aussi de gestion de la production avec par exemple la création d'un backlog priorisé. 





Des tests qualitatifs à distance avec Lookback


Lookback est un outil qui nous permet de réaliser une partie de la recherche utilisateur, plus précisément les entretiens et tests utilisateurs. Bien évidemment, de base nous préférons les réaliser en présentiel, mais certaines contraintes nous amènent à proposer de plus en plus de distanciel (la covid-19 nous y a également poussé 🦠). Cet outil est très puissant et permet de garder tout le principe d'un entretien ou test qualitatif, mais à distance ! Comment ? En permettant d'organiser des sessions d'entretiens ou de tests utilisateurs, en live ou en "Selftest" individuel, en enregistrant l'écran du participants, ses mouvements de souris et actions mais aussi ses réactions et émotions via sa caméra.  

Comment je m'en sers tous les jours ? 
Nous réalisons des entretiens à distance, en enregistrant les échanges afin de pouvoir les exploiter ultérieurement. Il permet également de la collaboration en invitant des membres à participer en tant que spectateur. Une des forces de lookback est de pouvoir organiser des tests via des scénarios qui permettent aux participants de les réaliser au moment où ça les arrange, tout en enregistrant la session et récoltant du feedback.





L'idéation collaborative et participative avec Miro


Miro est un espace de production collaboratif qui centralise le travail de conception sur un espace commun et où l'équipe, les potentiels utilisateurs et le client peuvent intervenir et voir en direct les interactions. 
C'est un outil ludique et d'une grande simplicité qui permet de centraliser sur un petit écran, une vaste étendue de données 🚀
Nous trouvons 2 avantages à utiliser Miro :
- Les ressources de templates disponibles sont nombreuses et permettent de rapidement mettre en place un espace de travail qui nous correspond sans refaire l'existant. Il y en a énormément pour ce qui concerne l'idéation et la conception de l'expérience en général.
- Tout le monde peut travailler ensemble, la collaboration en live est un gros point fort, et permet aussi de digitaliser tous les supports et données créés en leur donnant un accès permanent via un simple lien.  

Comment je m'en sers tous les jours ? 
Je l'utilise le plus souvent comme espace de travail pour des ateliers à distance, mais aussi comme support pour synthétiser et permettre un accès à de nombreuses données issues d'entretiens utilisateurs, par exemple sous forme de diagramme d'affinité, mais aussi pour du brainstorming, de la priorisation d'idée et tout ce qui touche à l'idéation.  





Des tests quantitatifs à distance via de simples prototypes avec Maze


Nous sommes très rapidement tombés sous le charme de Maze. Organiser des tests utilisateurs à distance, via des prototypes Sketch ou Figma, et surtout analyser des résultats quantitatifs via de nombreux visuels, diagrammes et données modulables. 

C'est un atout important surtout que la mise en place initiale est simple et rapide à mettre en place à partir du moment ou l'on sait ce que l'on veut tester et que l'on a préparé son prototype ! C'est aussi une force d'obtenir des résultats de plus de 100 participants en 45 minutes, quoi de mieux pour rapidement tester une interface et valider des hypothèses ? 

Comment je m'en sers tous les jours ? 
Certains projets nous demandent d'avancer vite, et de tester vite car le vite fait souvent place à beaucoup d'hypothèse sur ses utilisateurs. Maze permet une flexibilité sur des tests utilisateurs qualitatifs beaucoup plus longs à préparer, passer et analyser. Nous l'utilisons donc souvent en compléments de tests utilisateurs individuels. Les résultats sont rapidement obtenus et nous les présentons au client avec nos recommandations. Maze est très fort car il peut aller loin dans le détail, notamment grâce aux différentes heatmaps et zones de Missclicks.





Des formulaires simples et puissants avec Tally


Créer et partager un formulaire ! C'est assez simple et il existe de nombreux outils, mais pas deux comme lui 🤩 Tally permet de créer des formulaires de manière très visuelle et ludique, avec une multitude de formats de données. Il nous rappelle beaucoup notre petit préféré - Notion - surement parce qu'il lui ressemble énormément !

Comment je m'en sers tous les jours ? 
Aujourd'hui, nous essayons d'automatiser certaines tâches répétitives pour améliorer notre production. Ainsi, Tally nous permet de créer des formulaires que l'on utilise comme templates (enfin duplicables 😅) et que l'on peut personnaliser et adapter si besoin. Nous les utilisons pour la stakeholders meeting pour prendre un besoin et anticiper une visio plus approfondie. Nous l'utilisons encore plus en phase d'évaluation, que ce soit pour administrer des questionnaires exploratoires, de la complétion de phrases, de l'échelle d'utilisabilité ou encore de l'échelle UX. (Tout ceci gentiment connecté à Airtable via Zapier permet de gagner beaucoup de temps sur l'analyse de ces deux derniers, mais là n'est pas le sujet du jour 🤓)





Des wireframes à l'UI, mais pas que avec Figma


Figma est l'outil collaboratif que nous utilisons le plus ! Il est beau, magique, fort et répond (souvent) parfaitement à nos besoins 🥰 De la conception de wireframes à l'UI, nous utilisons quotidiennement Figma à l'agence avec Manu, notre designer UI.  

Cet outil a fait ses preuves face à une concurrence assez importante, il évolue rapidement et positivement. Le côté collaboratif est top et permet de travailler en équipe même à distance. Il permet également une transition simple et efficace avec le développement, permettant à nos amis les développeurs de récupérer tous les assets ou les styles CSS en un clic.

Comment je m'en sers tous les jours ? 
Même s'il me sert principalement à réaliser des wireframes et itérer avec le client, il peut être utilisé pour divers supports. Sur des audits ergonomiques assez vastes, il nous permet de digitaliser le livrable et de permettre au client de se balader sur le prototype simplement et de manière dynamique. Je l'utilise également pour créer les premiers supports de proto-personas, puis pour formaliser les personas. La dernière nouveauté à l'agence, nous avons opté pour un gain de productivité en créant notre kit wireframe ⚡️

Ces outils nous facilitent la vie au quotidien ! Cette liste est loin d'être complète mais c'est un premier aperçu 🤭 

Comment s'organiser, collaborer et centraliser sa production en UX Design chez Uxer ?

Aujourd'hui nous présentons les outils que nous utilisons tous les jours et qui nous permettent d'améliorer notre organisation et flux de production en UX Design. Voici notre petite sélection chez Uxer. 

Vous lancez un produit ? Un nouveau service ? Vous entamez une refonte de votre solution digitale ou de votre site web ? Que ce soit dans le digital ou tout autre domaine, il sera conçu et utilisé par des humains. Ce sont ces humains que nous appelons vulgairement les "utilisateurs". Ces utilisateurs sont ceux qui vont utiliser le produit au quotidien, nous aider à le concevoir et le faire évoluer.

Pourquoi intégrer vos utilisateurs dans votre projet ? 

Lorsque l'on conçoit une expérience utilisateur (ce que l'on appelle l'UX design), notre objectif est de rendre la solution utilisable, simple, agréable, ainsi que de donner toutes les possibilités aux utilisateurs de réaliser leurs actions facilement et rapidement, en prenant en compte leurs habitudes, comportement et besoins. 

Dans une conception centrée sur l'utilisateur, il semble donc évident que la première étape est de connaitre et comprendre les humains qui utiliseront la solution 👋 . C'est le point de départ, la base et l'essentiel ! 

"Je préfère mettre du budget dans mes maquettes que dans cette recherche", "Mais on sait déjà ce qu'ils veulent", "Nos utilisateurs on les connaît", "Après tout ils prendront ce qu'on leur donne car on ne l'a pas pensé comme ça", "On a l'habitude et puis ils sont comme vous et moi"

Vous avez déjà entendu ou prononcé ces phrases ? Notre vision et expérience nous obligent à vous dire que c'est faux ! Sans prétention aucune, je vous assure que vous ne savez pas tout et que vous avez encore beaucoup à apprendre des gens qui utilisent votre solution.

La recherche utilisateur - user research - s'inscrit dans une phase de conception permettant de découvrir qui sont nos utilisateurs en les identifiant, en observant leurs comportements, pensées et leurs émotions : Pourquoi tel ou tel choix ? Pourquoi telle ou telle réaction ? Quelles sont vos habitudes ? Que craignez-vous ? Quels sont vos besoins ? Dites nous vos attentes précises ? Voici de petits exemples des axes de recherche à explorer 🙂

Dès le début ! (Le tout début même). Il faut intégrer les utilisateurs le plus tôt possible dans le cycle de conception, ce sont eux qui ont les réponses à vos questions & hypothèses, ce sont eux qui sont confrontés aux problèmes. Ils représentent le coeur même du projet. Nous allons concevoir pour eux, et encore mieux, nous allons concevoir avec eux 🤝

Sachez qu'il n'est jamais trop tard pour intégrer vos utilisateurs à votre projet ! Nous vous recommandons de le faire dès le début mais si c'est trop tard, pensez-y pour la suite du projet qui sera de toute manière amené à évoluer avec ces derniers.

Vous vous demandez surement comment connaitre ses utilisateurs et les intégrer au projet ? Je vais vous parler de 3 méthodes de recherche UX indispensables et complémentaires, la base dans le processus de conception centré sur l'utilisateur. 

🎙 Les entretiens utilisateurs. Nous nous entretenons avec les utilisateurs pour échanger sur des thématiques en lien avec le projet, sur leurs habitudes, craintes et potentiels problèmes rencontrés lors d'une précédente interaction. Ces entretiens qualitatifs permettent de générer de précieuses données sur les motivations, objectifs, craintes, besoins & désirs. Nous utilisons ensuite ces données pour dresser le profil des groupes d'utilisateurs, que nous appelons personas.



👀 Les observations. Les observations sont complémentaires aux entretiens utilisateurs. On apprend facilement lorsque l'on interview une personne, mais quoi de mieux que de l'observer en interaction avec la solution, dans son contexte d'utilisation naturel ? L'observation permet d'identifier ce que pensent les gens, ce qu'ils disent, ce qu'ils voient et ce qu'ils font réellement. Nous allons donc observer des utilisateurs en interaction avec la solution, les laisser en autonomie et relever les moments positifs et négatifs dans leurs expériences.



🧪 Les tests utilisateurs. Ces tests sont primordiaux. Il nous arrive souvent de voir et de lire des articles impliquant les tests utilisateurs en fin de projet. Oui c'est vrai, mais nous vous recommandons de tester la solution avec de réels utilisateurs dès le début ! Chez Uxer, lorsque nous le jugeons nécessaire, nous proposons le test utilisateur au début du projet. C'est un excellent complément des deux méthodes précédentes. L'objectif de réussite d'un projet, d'un point de vue client, est souvent de "faire mieux", d'améliorer les conversions, de fidéliser. Pour cela il faut savoir où sont les problèmes actuels et la cause de ces problèmes. Lorsqu'une solution est déjà existante, nous la mettons donc entre les mains de vos utilisateurs afin de les faire tester ! Ces derniers réalisent des scénarios permettant de valider ou non nos hypothèses et nous permettre de prendre des décisions éclairées.

Et si on n'a ni le temps ni le budget nécessaire ? 

La stratégie de conception centrée sur l'utilisateur est établie sur mesure. Elle répond à vos besoins dans le cadre ou elle intègre les réels besoins et attentes de vos utilisateurs et donc permet de créer une expérience globale positive. Il existe aujourd'hui de nombreuses façons de réaliser des entretiens, observations et tests utilisateurs, en fonction des contraintes temporelles, budgétaires et matérielles.

Gardez en tête qu'il vaut mieux réaliser cette recherche en l'adaptant avec les moyens que vous avez plutôt que de ne rien réaliser du tout. Il est d'ailleurs tout à fait possible de récolter certaines données et de les formaliser avec des hypothèses établies au préalable par les équipes. Il est certain que le résultat ne sera pas le plus optimal mais qu'il sera quand même une bonne base, amenée à évoluer tout au long du projet via de nombreux apprentissages. Si vous avez une certaine culture du risque, il est donc tout à fait possible d'avancer avec plus d'incertitude. Sachez que si vouliez être accompagné par Uxer, nous nous adaptons à vos contraintes et vous aidons à rester le plus qualitatif possible.

À quels risques je m'expose si je ne réalise pas de recherche utilisateur ?

Les risques sont nombreux, et non sans conséquence (😱)! Le premier qui me semble être le plus important, est celui de véhiculer une mauvaise expérience. Aujourd'hui les exigences sont de plus en plus nombreuses dans le digital : temps de chargement trop longs, informations peu explicites, architecture trop compliquée.. il existe des dizaines de raisons pour un utilisateur de vivre une mauvaise expérience. Cette dernière entraine fatalement une baisse du nombre d'utilisateurs, utilisateurs qui auraient pu devenir fidèles. Il y aurait donc 2 perdants : l'utilisateur et le client. La suite vous la connaissez, du budget investit dans un produit final qui ne correspond pas - on ne vous le souhaite pas - aux besoins utilisateurs. 

Ces phases de recherche sont souvent longues. Elles demandent un certain temps de préparation, passation puis d'analyse et formalisation sous forme de livrables à partager à toutes les parties prenantes. 

Vous pouvez penser qu'il s'agit d'une perte de temps et qu'il est possible de s'en passer. Mais notre constat sur le terrain est très souvent inverse à ces croyances, car le gain d'une démarche centrée sur les utilisateurs se retrouve logiquement sur le budget et le résultat final de votre produit. En lien direct avec sa pertinence et sa capacité à répondre aux attentes des utilisateurs et ainsi à améliorer le rapport entre l'investissement financier et la valeur d'usage du produit conçu. 🙂

Pourquoi intégrer les utilisateurs finaux le plus tôt possible dans la conception de l'expérience utilisateur ?

Bien que souvent négligée, la recherche utilisateur reste essentielle dans la conception d'une expérience utilisateur. Connaître et surtout comprendre nos utilisateurs, mais aussi les impliquer dans la conception, il s'agit de la base dans une conception centrée sur l'utilisateur.  

La recherche utilisateur par Uxer - Blog Uxer 

Pourquoi intégrer nos utilisateurs, on les connaît et on sait ce qu'ils veulent !

Concevoir et réaliser des sites et applications propres, interactifs et immersifs en 2021 c'est bien. Mais en 3D, c'est mieux ! Dans cet article, nous allons discuter de pourquoi on s'intéresse pas mal à la 3D en ce moment, et de nos débuts dans l'apprentissage de cette nouvelle compétence.

Ça fait un petit moment chez Uxer que l'on discute ensemble de la manière dont on imagine nos futurs projets et de la direction que l'on souhaite prendre d'un point de vue créatif et technique. En effet, depuis la création de l'agence il y a quelques années maintenant (🎉), nous essayons toujours de nous renouveler et de réfléchir à des axes de progression et d'amélioration pour nos projets et nos compétences en interne. D'abord parce que ça nous tient à coeur de réussir à faire mieux à chaque projet, mais surtout parce que l'on souhaite éviter à tout prix de s'enfermer dans un style de site ou d'application, et de ne faire plus que ça.

Et c'est pour ça que l'on cherche à intégrer de nouvelles idées, de nouveaux styles et à apprendre de nouvelles compétences.

Ça fait quelques années que la 3D a le vent en poupe dans le web, et que l'on voit pousser des sites et applications utilisant cette compétence à plus ou moins grande échelle, pour proposer des expériences interactives et immersives poussées, ou simplement pour proposer des visuels modernes et créatifs.

C'est beau, c'est moderne, et c'est le pont idéal entre créativité et technique grâce aux frameworks WebGL qui se développent de plus en plus (un article sur Three.js bientôt ?). Bref, vous l'avez compris, on aime beaucoup, et on souhaitait se lancer dedans. C'est bien, mais par où on commence ? 🧐

Le plan était simple. Apprendre auprès d'artistes talentueux, s'entraîner, et devenir nous-mêmes talentueux avec un peu de chance, de patience et de travail. Easy enough.

La formation Blender de Roman Klco, Polygon Runway, fut un parfait point de départ. La création d'illustrations 3D dans un style minimaliste "low-poly" étant un bon moyen d'appréhender les différentes mécaniques du logiciel et les principes de base de la création en trois dimensions. On arrive rapidement à des résultats très satisfaisants, et après quelques dizaines d'heures on commence à devenir autonome pour pouvoir explorer nos propres idées.

Pour résumer, on vous conseille vivement cette formation. C'est clair, un mélange parfait de théorie et de pratique et la progression en terme de difficulté et complexité se fait naturellement. Bref, vous pouvez y aller les yeux fermés 👍.

L'étape suivante fut de partir de cette base de connaissances et de la renforcer avec un second formateur de talent, en présentiel cette fois-ci. C'est à cette occasion que j'ai pu participer à une série de sessions de formation avec David de digiCreatures (http://digicreatures.net/). Formation qui après un entretien avec David fut spécifiquement pensée pour compléter le socle de compétences acquis précédemment et pour une utilisation de la 3D sur le web (on fait tout ça pour vous, après tout).

Ces heures passées avec David furent extrêmement enrichissantes : si vous cherchez un formateur de qualité, on vous le recommande vivement.

Première étape accomplie ! Nous sommes désormais assez autonome et commençons à comprendre les différentes subtilités du logiciel. Mais maintenant, qu'est-ce qu'on fait de tout ça ?

Pour être parfaitement honnête, l'objectif n'est pas de réaliser des sites complètement immersifs basés sur des expériences 3D complexes avec gestion de shaders et génération de systèmes de particules en temps réel (🤓), mais promis, c’est pour bientôt ! Si nous avons bon espoir d'arriver à cette étape dans un futur proche, pour l'instant l'objectif est clair : être en mesure de travailler sur des directions artistiques plus variées en incorporant des éléments 3D dans nos maquettes et branding.

Et la prochaine étape ? Passer au niveau supérieur en liant design et technique dans des expériences interactives basées sur la 3D. En d'autres termes, travailler conjointement entre designers et développeurs pour monter en compétences ensemble, et pouvoir aborder sereinement de futurs projets, de plus en plus ambitieux. Et s'amuser en le faisant 😉.

En attendant, on poste régulièrement quelques unes de nos réalisations ou d'expériences visuelles sur notre compte Dribbble, passez y faire un tour si le coeur vous en dit !

Où comment monter en compétences pour apprendre la 3D afin de passer nos projets au niveau supérieur 🚀

Apprentissage de la 3D pour l'agence Uxer pour passer nos projets web et d'applications mobile au niveau supérieur

Journal d'apprentissage de la 3D - Blog Uxer 

On risque de vous en apprendre une bonne, mais la protection de notre environnement est aujourd'hui un enjeu planétaire.  Nous aimerions que tous se mettent à agir, sans vraiment savoir sur quoi et pour quels impacts ? Si la sensibilisation se généralise sur ces sujets, le passage à l'action l'est beaucoup moins, car il semble hors de notre portée. Bien que ce soit en partie vrai, il semble toutefois possible d'effectuer une multitude de petites actions, ayant des impacts forts, si elles se généralisent au plus grand nombre.

Alexandre est venu nous voir avec cette conviction, déterminé à créer une application au service de cet enjeu. Son objectif ? Modifier les comportements en agissant sur les habitudes pour encourager un passage à l'action sur le plan écologique, tout ça de manière pratique et ludique.

Alexandre est Lauréat Frenchtech, son idée a donc été retenue et lui a permis d'obtenir un financement pour aller un peu plus loin et réfléchir, concevoir et tester son concept sur un maximum de personnes. Il avait une idée précise sur le fond de l'application, beaucoup moins sur la forme et comment rassembler ses idées, les adapter, les lier entre elles, les concevoir et les tester.

Protos-personas et parcours utilisateurs en main, Alexandre nous a donc confié cette mission afin que nous puissions l'accompagner sur ce projet passionnant. Le contexte du projet, notre volonté d'engagement, le niveau de réflexion ainsi que les grosses contraintes temporelles et budgétaires nous ont orientés vers une solution UX plus qu'adaptée : le Design Sprint.

❓ Le Design Sprint, Quésaco ? c'est une méthodologie novatrice popularisée par Jake Knapp, John Zeratsky et Braden Kowitz au sein de Google Ventures et aujourd'hui utilisée dans de nombreuses entreprises ! Merci les gars 💪

Le design sprint propose plusieurs avantages :

La possibilité de définir ensemble la problématique à résoudre,

Tester le potentiel du produit et obtenir du feedback utilisateur sans investir dans le code,

Booster la créativité et l'intelligence collective ainsi que limiter les risques liés au projet,

Pouvoir rapidement pivoter en cas d'écart avec le marché et les besoins utilisateurs.

Nous savions que l'enthousiasme d'Alexandre, son niveau de maturité et d'avancement, notre investissement, et l'intelligence collective de toute l'équipe mobilisée, nous permettraient d'obtenir en 3 jours des réponses pertinentes aux problématiques déjà identifiées du projet. D'en avoir une vision plus claire, en créant une base de départ solide pour continuer de développer le projet. Ou pas.

Le début du projet est boosté par la présentation des expertises de l'équipe, et leurs complémentarités, et une session de questions-réponses amenant sur la définition d'un objectif à long terme qui orientera toute la suite du projet. Après de longues minutes d'échanges sur les visions à moyen et long terme, l'objectif est né :

"Nous voulons identifier les freins et comprendre les conditions de motivation nécessaires pour initier la modification des comportements & des habitudes sur le sujet de la transition écologique par le développement d'un parcours numérique et ludique."

Bien évidemment c'est beau sur le papier mais soyons raisonnable, il est impossible de répondre à une dizaine de questions en 3 jours. Nous avons donc déterminé les questions précises auxquelles le sprint devait répondre.

L'application va-t-elle permettre de changer les comportements ?

Comment accompagner les utilisateurs dans la mise en application de leurs actions virtuelles dans la vie réelle ?

La première impression va-t-elle être claire/positive et motivante ?

Les utilisateurs vont-ils se sentir valorisés/engagés ?

Les utilisateurs vont-ils ressentir leur impact concret dans le monde réel ?

Quelles hypothèses pour quels parcours ?

L'objectif du jour 1 visait dans un premier temps à créer la User Journey des personas. Avec de légères incertitudes qui laissent place à beaucoup d'hypothèses ! 3 jours c'est court, nous avons donc utilisé les livrables très qualitatifs déjà fournis par Alexandre : les personas et les parcours utilisateurs.

Connaître nos utilisateurs nous a permis de facilement identifier les différents profils, parcours et atteintes d'objectifs. Nous avons également opté pour la création d'une feuille de route, donnant naissance à de nouvelles idées, que ce soit sur le périmètre de la solution ou même sur le périmètre fonctionnel.

Face à nos utilisateurs et leurs parcours grossièrement formalisés sur la feuille de route, nous avions de nombreuses questions en suspens ! Nous avons donc fait un tour de table relatant les étapes de la feuille de route, en posant des questions à chacun. Pendant ce temps, nous notions également les réponses en les transformant en questions sous la forme "Comment pourrions-nous..."

De nombreuses questions ont été soulevées, nous les avons catégorisées selon des problématiques et les objectifs suivants : favoriser le passage à l'action, divers, rendre visible et valoriser.

Nous n'avions pas de réponse claire à apporter à ces nombreuses questions. Le temps étant compté, le vote a été la solution qui nous a permis de sélectionner les HMW prioritaires.

Comment pourrions-nous valoriser l'action positive auprès des autres utilisateurs ?

Comment pourrions-nous expliquer les initiatives ?

Comment pourrions-nous guider l'utilisateur dans le processus de transition ?

Comment pourrions-nous nous assurer que l'utilisateur se sente flatté par son initiative et son impact et se sente valorisé ?

Comment pourrions-nous traduire les impacts au travers d'une histoire et expliquer la suite ?

Comment pourrions-nous faire pour que l'application ait un impact concret dans la vie "réelle" et ce ne soit pas seulement perçu comme un jeu ou une application ?

Les grandes questions sont posées ! Mais à quels moments vont-elles impacter le projet et le parcours de l'utilisateur ?

Nous avons positionné les HMW sélectionnés sur chaque étape où elles rentrent en interaction et sont susceptibles de changer l'expérience des utilisateurs. La magie opérante, nous avons pu ainsi identifier le parcours prioritaire ou nous allions consacrer tout le reste de notre temps.

L'intelligence collective permet de libérer l'esprit et d'aider à la créativité pour arriver à des résultats souvent étonnants mêlant l'intelligence, la logique et la créativité de chacun. Pour répondre aux HMW, quoi de mieux que de les formaliser selon la vision de chacun ? Nous avons donc réalisé un atelier de co-conception, le CRAZY 8.  Nous avions une multitude d'écrans et de nombreuses idées pour le lendemain matin.

Cette journée commence par la prise de connaissance des croquis de chacun. Prendre les meilleures idées, s'inspirer des autres pour ensuite redéfinir sa propre vision ! Avec un nouvel objectif :  Réduire le nombre d'écrans de 8 à 3 ! Ce long atelier créatif a débouché sur une présentation chronométrée des idées. S'en est suivie une petite phase de critique afin que chacun donne son point de vue, pour ou contre, sur les idées des autres (bien évidemment dans un échange constructif et objectif).

Et que fait-on de ces petits brouillons ? Il y avait 60 croquis, représentant des dizaines d'idées ! Un vote, assez personnel, a été effectué et nous a permis de retenir les idées les plus intéressantes à retenir, à creuser ou à garder en tête.

Avant de passer à la conception de l'interface (le design UI), nous avons, tels de vrais réalisateurs inspirés, créé le storyboard du prototype afin de donner du sens au parcours que nous devions représenter, dans l'objectif d'apporter des réponses à nos questions.

Pas besoin d'être un artiste ! Le but est que tout le monde soit finalement d'accord et comprenne. Cette étape est déterminante, car elle précède la concrétisation de tout le travail accompli en une interface et de futurs tests utilisateurs. Nous avons limité ce storyboard à 15 écrans, gros challenge quand on sait qu'il ne nous restait qu'une après-midi pour tout réaliser et le lendemain pour réaliser les tests !

Le prototype a été effectué sur un outil de conception UI, de manière interactive, permettant de pouvoir passer facilement d'écran en écran et permettant de tester le prototype en conditions quasi réelles.

Après-midi très intense, surtout pour notre designer, Manu, qui a dû sortir 15 écrans en un temps très très limité ! Concentration et rigueur au programme. C'est tout de même stimulant de voir cette idée prendre vie. Et pendant ce temps, le reste de l'équipe réalise les scénarios des tests utilisateurs prévus le lendemain.

La réalisation de la maquette a pris plus de temps que prévu ! (En réalité on s'en doutait). La nuit porte conseil et également son lot d'imagination. Finir les derniers écrans, amener plus de détails sur certains, l'ensemble des prototypes interactifs était prêt en milieu de matinée !

La structure des tests a beaucoup d'importance ! C'est la seule occasion du sprint pour apprendre de tout ce qui a été produit et répondre aux grandes interrogations du début de sprint. On valide l'idée ? On y apporte des évolutions ? On pivote et on s'adapte ? On jette tout ?

C'était le moment de tout découvrir ! Pour des questions de temps et de logistique, nous avons organisé des tests à distance sur un outil dédié en ligne.

Vous avez une idée de projet, c'est bien. Mais comment répondre à des questions complexes et apporter une solution plus ergonomique à vos utilisateurs ?

Comment répondre à des questions complexes et précises ? Pour développer une application web plus en phase avec vos utilisateurs. Le sprint design est l'une des méthodes UX utilisées par Uxer pour accompagner les projets web confiés.

Un sprint design par Uxer, ça donne quoi ? 🤨

Design, code & vied’une agence bordelaise