Responsive web design
Dans le cadre de ma formation, j'ai mené à bien l'intégralité d'un projet de conception d'un site web réactif d'un refuge pour animaux domestiques en tant que designer UX responsable de la conception.
- Objectif du projet
Concevoir un site web agréable et facile à utiliser avec suffisamment d’informations pour donner envie d’adopter et permettre à l’utilisateur de faire un choix pertinent.
User persona
Les personas sont des utilisateurs fictifs dont les objectifs et les caractéristiques représentent les besoins d'un groupe plus large d'utilisateurs.
Pour développer mes personas, j'ai mené une enquête auprès d'utilisateurs potentiels d'un site web d'un refuge pour animaux afin d'en tirer des informations pertinentes sur l'utilisateur cible (âge, situation familiale, profession, objectifs, frustrations, etc.).
Wireframes papier et numériques
Pour une idéation rapide, j'ai commencé par esquisser des wireframes de la page d'accueil sur papier.
J'ai ensuite concrétisé mes idées en construisant des maquettes numériques qui m'ont permis de concevoir mon prototype basse-fidélité en y ajoutant des interactions.
Étude d'utilisabilité
Le prototype lo-fi a été testé par des utilisateurs.
Voici les principales conclusions révélées par cette étude d’utilisabilité :
Maquettes numériques et mockups
J'ai créé des maquettes et des mockups en tenant compte des observations des utilisateurs.
Dans cette nouvelle version, le site web propose de sélectionner jusqu'à trois animaux, de planifier une rencontre directement en ligne et de vérifier les informations saisies avant de valider la demande.
Cliquez sur chacune des 3 images pour agrandir.
Dans l'objectif de concevoir un site web responsive, les maquettes ont été réalisées pour deux tailles d'écran différentes : ordinateur et mobile.
Étude d'utilisabilité hi-fi
Dans le cadre de ma recherche UX, j'ai établi un plan d'étude pour la réalisation des tests du prototype haute-fidélité (hi-fi) par de vrais utilisateurs.
Les participants à l'étude ont suivi le flux utilisateur d'une demande de rencontre avec deux animaux (les chats Signore et Roméo), la réservation en ligne et la validation du rendez-vous.
Je vous invite à cliquer sur les post-its ci-dessous afin de découvrir et d'écouter les commentaires de 3 participants à l'étude d'utilisabilité du site web Pattounes Solidaires.
Prototype haute-fidélité
Lors de la conception du prototype haute-fidélité (ou hi-fi), j'ai appliqué les principes du visual design (unité, emphase, proportion, hiérarchie, variété...) et pris en compte l'accessibilité ainsi que les observations et insights issus de mon étude d'utilisabilité.
J'ai également conçu un logo pour le refuge fictif afin de l'intégrer au prototype hi-fi et obtenir un résultat encore plus réaliste.
Naviguez dans le prototype du site web ci-dessous en cliquant sur des boutons ou des icônes.
Pour une meilleure visibilité, affichez en plein écran sur un ordinateur.