inscription de bénévoles
Site web pour l'inscription de bénévoles
Le produit
Médecins du monde est une ONG médicale de solidarité internationale, que je soutiens depuis 7 ans et qui intervient en France et à l’étranger. Elle œuvre pour aider les gens les plus vulnérables, tant par les soins que par l’action sociale. Il n’y a jamais assez trop de bénévoles, chaque individu compte. Le site web présenté ici permettra de s’inscrire en facilitant l’engagement et ainsi renforcer un impact positif dans la communauté. Tout cela, en considérant que chaque don financier compte également pour ceux qui ne peuvent ou ne veulent pas s’engager, mais qui souhaitent apporter leur soutien.
Le problème
Malgré des emplois du temps chargés et des obstacles d’accessibilité, de nombreuses personnes sont déterminées à faire du bénévolat. La plupart des sites ne sont pas conviviaux et ont un process trop long, ce qui peut les décourager de remplir des formulaires pour devenir bénévoles. Il faut leur faciliter cet engagement qui montre leur désir d’aider les autres en trouvant des moyens de contribuer. Leur exemple démontre que le bénévolat est une valeur essentielle qui transcende les circonstances personnelles.
L’objectif
Concevoir un site web qui permet aux utilisateurs de s’inscrire facilement comme bénévole, avec un formulaire pragmatique et concis, en tenant compte d’opportunités qui puissent correspondre à leur emploi du temps et pour d’autres, qui soient sensibles à leur accessibilité en s’adaptant à leur handicap.
Mon rôle
Conceptrice UX concevant un site web pour l’inscription de bénévole au sein d’un organisme de bienfaisance, de la conception à la livraison.
Responsabilités
Conduite d’entretiens, maquettage papier et numérique, prototypage basse et haute-fidélité, réalisation d’études d’utilisabilité, prise en compte de l’accessibilité et itération des conceptions.
Processus de conception centré sur l'utilisateur
Recherche utilisateur : résumé
J’ai mené des entretiens et créé des cartes d’empathie pour comprendre les utilisateurs pour lesquels je conçois et leurs besoins. Un groupe utilisateur principal, identifié grâce à la recherche était des étudiants et salariés, hommes et femmes actifs entre 18 et 55 ans. Ils veulent devenir bénévoles mais sont confus lorsqu’ils se retrouvent face à un formulaire qui peut leur paraître compliqué et fastidieux à remplir, donc les décourager, et pour d’autres il se demandent si leur candidature serait acceptée malgré le fait qu’ils aient un handicap.
Ce groupe utilisateur a confirmé les hypothèses initiales concernant les inscriptions en ligne pour devenir bénévole,
mais la recherche a également révélé que l’adaptabilité de la mission bénévole à leur emploi du temps, ainsi que sa proximité, étaient également des facteurs clé importants.
Recherche sur les utilisateurs : difficultés
Approche
Les utilisateurs n’ont pas envie d’un process long pour remplir une formulaire d’inscription pour devenir bénévole
Doute
Ils ne savent pas si les missions seront adaptées et prendront en conséquence leur emploi du temps et/ou leur handicap éventuel
Accessibilité
Pour certains d’entre-eux, il faut tenir compte des technologies d’assistance, notamment pour ceux ayant une déficience visuelle
Les persona
Enoncé de problème : Julien est un professeur de français en fauteuil roulant, qui a besoin de s’inscrire dans une association de bénévolat qui tienne compte de son handicap, parce qu’il veut donner des cours de français à des personnes en difficulté.
Julien
Age : 37 ans
Education :
Maîtrise en littérature française & Capes
Ville : Paris
Situation familiale : Mariée
Occupation : Professeur de français
“Je suis en fauteuil roulant depuis un accident de voiture survenu il y a cinq ans. Malgré cela, je suis déterminé à mener une vie active et donner de mon temps pour les autres”
Objectifs :
– Je veux offrir une éducation de qualité à mes élèves
– J’inspire à ce que mes élèves aiment la langue française autant que moi
– Je souhaite m’engager avec une association, dans des activités qui favorisent l’inclusion des personnes handicapées dans la société
– Je veux aider en donnant des cours de français à des personnes en difficulté
Frustrations :
– Je suis parfois confronté à des défis liés à l’accessibilité
– Je recherche des moyens de m’impliquer qui tiennent compte de mon handicap
– J’ai des besoins spécifiques en matière d’accessibilité qui ne sont pas pris en compte dans les formulaires d’inscription
Bio :
Julien est un professeur de français déterminé et inspirant qui a surmonté des obstacles importants pour continuer à poursuivre sa passion pour l’enseignement. Son amour pour la langue française et la littérature est contagieux, et il est déterminé à faire une différence dans la vie de ses élèves. En dehors de sa carrière, il est également engagé dans la promotion de l’inclusion des personnes handicapées et cherche des opportunités pour partager sa passion littéraire et son enseignement avec d’autres. Il recherche des solutions via une application, qui facilitent son engagement bénévole tout en tenant compte de son handicap.
Enoncé de problème : Sarah est une étudiante et assistante en psychologie à temps partiel qui a besoin de s’inscrire facilement à des actions bénévoles qui correspondent avec son emploi du temps chargé, parce qu’elle veut aider des gens sur le plan psychologique.
Sarah
Age : 28 ans
Education : Diplôme en psychologie sociale
Ville : Lyon
Situation familiale : Célibataire
Occupation : Assistante de recherche en psychologie à temps partiel et poursuite de ses études supérieures
“Comme je travaille pour payer mes études, j’ai du mal à trouver des opportunités de bénévolat qui correspondent à mon emploi du temps chargé”
Objectifs :
– Contribuer activement à sa communauté
– Consacrer du temps à des œuvres de bienfaisance
– Acquérir une expérience significative dans le domaine de la psychologie sociale
Frustrations :
– En tant qu’étudiante et travailleuse à temps partiel, j’ai du mal à trouver des opportunités de bénévolat adaptées à mon agenda
– Je trouve que certaines organisations de bienfaisance ont des processus d’inscription complexes et peu conviviaux
– Difficile pour moi de m’impliquer comme je le souhaiterais
Bio :
Sarah est une jeune femme enthousiaste et dévouée, toujours prête à tendre la main pour aider les autres. Elle croit en la puissance de la psychologie pour apporter des changements positifs dans la vie des gens et elle est désireuse de mettre ses compétences au service de sa communauté. Malgré son emploi du temps chargé en tant qu’étudiante et assistante de recherche, elle est déterminée à trouver des moyens de contribuer à des œuvres de bienfaisance. Elle est à la recherche d’une application conviviale qui lui permettra de s’inscrire facilement comme bénévole et de trouver des opportunités de bénévolat qui correspondent à son emploi du temps.
Carte du parcours utilisateur
Les cartographies du parcours utilisateur de Julien et Sarah et de Fred, ont révélé à quel point il leur serait utile d’avoir accès à un formulaire simple, empathique, rapide et efficace.
Julien veut devenir bénévole, dans une association qui tienne compte de son handicap, pour donner des cours de français :
Démarrer la conception
Sitemap
J’ai utilisé mes connaissances pour créer un plan du site. Mon objectif était de faire l’architecture de l’information stratégique des décisions, pour améliorer la navigation globale sur le site. La structure que j’ai choisie a été conçue pour rendre les choses simples et faciles.
Maquettes papier
Prendre le temps de rédiger des itérations de chaque écran de l’application sur papier a permis de garantir que les éléments qui seront constitués les maquettes numériques seraient bien adaptés pour résoudre les problèmes des utilisateurs. Pour l’écran d’accueil, j’ai privilégié de mettre le bouton “je deviens bénévole” en avant.
*Des étoiles marquent les éléments de chaque croquis qui sont utilisés dans la proposition de la home V-1.
Maquettes papier variations de taille d’écran
Parce que l’utilisateur accède au site sur une variété différente d’appareils, ordinateurs de bureau, tablettes et mobiles, les tailles d’écrans ont été adaptées, pour que le site soit pleinement responsive sur l’ensemble de ces appareils.
Maquettes numériques
Passer du papier au numérique les wireframes facilite la compréhension et peut aider à résoudre les besoins de l’expérience utilisateur et les points à améliorer. Prioriser le bouton “je deviens bénévole” et mettre un élément visuel d’accueil convivial était un élément clé de ma stratégie.
Maquettes numériques variations de taille d’écran
De plus, au fur et à mesure que la phase de conception initiale se poursuivait, je me suis assurée de baser les conceptions d’écran sur le feedback et les résultats de la recherche utilisateur.
Prototype basse-fidélité
En utilisant l’ensemble de maquettes numériques, j’ai fait un prototype basse-fidélité. Le principal flux utilisateur que j’ai connecté consistait à s’inscrire en tant que bénévole via le formulaire, de sorte que le prototype puisse être utilisé dans une étude d’utilisabilité. Je me suis assurée aussi que l’on puisse naviguer d’avant en arrière dans le process et d’y accéder par d’autres points d’entrée.
Études d’utilisabilité
Type d’étude :
Non modérée
Pays :
France, remote
Participants :
5 participants
Durée :
15-20 minutes
Études d’utilisabilité : conclusions
Une première étude d’utilisabilité a été menée. Les conclusions ont aidé à orienter les conceptions des maquettes fonctionnelles aux maquettes. La deuxième, avec le prototype haute-fidélité a permis de pointer les aspects qui devaient être affinés.
Home
Les utilisateurs sont frustrés, car ils ne peuvent pas faire un don s’ils le souhaitent
Profil utilisateur
Les utilisateurs sont confus avec l’onglet “s’inscrire / se connecter”
Formulaire
Les utilisateurs n’ont que le choix restrictif du formulaire pour proposer leur bénévolat
Affiner la conception
Maquettes
Après les études d’utilisabilité, j’ai rajouté un bouton “je fais un don” pour que les utilisateurs voient cette option lorsqu’ils arrivent pour la première fois sur l’écran. Tout au long des feedback, revenait le fait que le potentiel bénévole, puissent également faire un don. Il avait été rajouté sur les prototypes basse-fidélité, puis le bouton “Je deviens bénévole” a hérité d’une couleur orange pour attirer l’attention et le click to action sur celui-ci de la part de l’utilisateur.
Les utilisateurs étaient confus, ils se demandaient s’il fallait s’inscrire avant ou après avoir rempli le formulaire, ou si cétait pour les bénévoles ou les donateurs. Donc un onglet générique “Mon Espace” a été créé, qui sera actif avec des code d’accès confidentiels fournis par l’association, que l’utilisateur soit bénévole ou donateur.
Les utilisateurs voulaient que leur handicap soit pris en considération et aussi accéder aux autres missions, en alternative avec le formulaire, ou souhaitaient avoir d’autres informations et/ou émettre des remarques dans le cadre du bénévolat. Une partie “missions” et un second formulaire pour rédiger un message simple, ont été également inclus sur la page.
Maquettes : version desktop
Maquettes : version mobile
J’ai inclus différentes tailles d’écran dans mes maquettes, parce que les utilisateurs consultent les site web depuis divers appareils. Pour les mobiles et tablettes, la navigation a été optimisée avec un menu hamburger, afin que l’expérience utilisateur soit la plus fluide possible.
Prototype haute-fidélité
Mon prototype haute-fidélité suit le même flux utilisateur que le prototype basse-fidélité, et inclus les modifications de conception apportées après l’étude d’utilisabilité, ainsi que plusieurs ajustements de visuels et de couleurs.
Considérations relatives à l’accessibilité
Permet l’accès aux utilisateurs malvoyants en ajoutant du texte alternatif aux images pour les lecteurs d’écran.
Utilise plusieurs options de navigation : un menu général, des onglets symbolisant les étapes et des boutons “précédent” et “suivant” pour aller et revenir dans le flux de l’inscription, un footer avec des liens vers les principales ressources du site web pour faciliter la navigation.
Les images sont représentatives pour inclure la majeure partie des individus, les espaces négatifs et les régions communes facilitent une meilleure ergonomie et lisibilité du site.
Pour aller plus loin
Points à retenir
Impact :
Le formulaire répond aux majeures attentes et besoins des utilisateurs. Il semble facile à comprendre et à utiliser.
Ce que j’ai appris :
Le site web doit tenir compte de tous les utilisateurs. Il se doit d’être équitable et inclusif. Les études et les feedback sont deux parties majeures et essentielles du process de la création d’un site web.
Extraits de feedback des pairs :
“J’ai réussi à aller jusqu’au bout ça semble clair, bravo”
“Super travail, très beaux wireframes ! »
Prochaines étapes
Inclure un champ dans le formulaire pour y mettre la description de l’handicap de l’utilisateur, s’il en a un. Cela montrerait l’empathie et l’intérêt que l’association a, pour offrir des opportunités de bénévolat à tout le monde
Mener une autre série d’études d’utilisabilité pour valider si les points de douleur rencontrés par les utilisateurs ont été efficacement traités
Effectuer davantage de recherche utilisateur pour déterminer tout nouveau domaine de besoin.
Spécifications techniques
Pour mes wireframes et prototypes j’ai utilisé Adobe XD, pour faciliter mes importations depuis Photoshop ou Illustrator 🙂
Merci d’avoir pris le temps de regarder mon travail ! 👍
Si vous désirez en savoir davantage ou établir un contact, vous trouverez mes coordonnées ci-dessous :
contact@carolereman.com