e-Bike
UX/UI design avec une étude de cas pour un site web de commande de vélos personnalisés.
Date
Mars 2024
Rôle
UX/UI designer
[ Voir le site ]
C’est quoi e-Bike
e-Bike est un site web innovant qui permet aux utilisateurs de commander des vélos personnalisés en ligne. Il offre une plateforme conviviale où les clients peuvent choisir parmi une variété de modèles de vélos, de couleurs, de tailles et d’accessoires pour créer le vélo parfait qui correspond à leurs besoins et à leur style de vie.
Problèmes
Avant e-Bike, les clients cherchant à personnaliser des vélos en ligne étaient confrontés à une expérience utilisateur rigide, des options de personnalisation limitées et un processus de commande complexe. e-Bike a été créé pour résoudre ces problèmes et offrir une expérience de personnalisation de vélos en ligne plus fluide et intuitive.
Objectifs
Lors de la création d’E-bike, les objectifs principaux étaient d’améliorer l’expérience utilisateur en fournissant une plateforme intuitive pour la personnalisation des vélos, d’augmenter les options de personnalisation en offrant une large gamme d’options pour permettre aux clients de créer le vélo de leurs rêves, et de simplifier le processus de commande en le rendant aussi simple et transparent que possible pour les utilisateurs.
Processus de conception
En tant que designer UX, mon objectif principal était de concevoir une interface utilisateur qui offre une expérience de personnalisation de vélos en ligne fluide et intuitive. J’ai travaillé sur la conception de l’interface utilisateur, en veillant à ce qu’elle soit facile à utiliser pour les clients. J’ai également contribué à l’intégration des différentes options de personnalisation pour les vélos dans l’interface utilisateur.
Empathie
Définition
Idéation
Prototype
Test
Comprendre les utilisateurs
La première étape de la conception UX est de comprendre qui sont nos utilisateurs et quels sont leurs besoins. Pour e-Bike, nos utilisateurs sont des personnes qui cherchent à acheter un vélo personnalisé en ligne. Ils veulent une plateforme qui leur permet de personnaliser facilement leur vélo et de voir le résultat final avant de faire leur achat.
Pour comprendre nos utilisateurs, j’ai mené des recherches utilisateur, y compris des interviews et des enquêtes, pour recueillir des informations sur leurs préférences, leurs comportements et leurs besoins. J’ai également analysé les données d’utilisation du site pour comprendre comment les utilisateurs interagissent avec les différentes fonctionnalités.
Ces informations ont été essentielles pour concevoir une interface utilisateur qui répond aux besoins de nos utilisateurs et offre une expérience de personnalisation de vélos en ligne fluide et agréable. Elles ont également aidé à identifier les domaines d’amélioration potentiels pour rendre le processus de personnalisation et de commande encore plus facile pour les utilisateurs.
Personas
Dans le cadre de mon rôle de designer UX pour E-bike, j’ai entrepris plusieurs étapes clés pour comprendre nos utilisateurs et concevoir une expérience qui répond à leurs besoins. J’ai commencé par créer des personas, qui sont des représentations fictives de nos utilisateurs typiques. Ces personas m’ont aidé à comprendre qui sont nos utilisateurs, quels sont leurs besoins et comment ils pourraient interagir avec notre site.
Ensuite, j’ai créé des récits d’utilisateurs, qui sont des déclarations simples qui décrivent ce que l’utilisateur veut accomplir en utilisant E-bike. Ces récits m’ont aidé à me concentrer sur les objectifs de l’utilisateur et à concevoir des fonctionnalités qui répondent à ces objectifs.
Enfin, j’ai créé une carte du parcours utilisateur, qui est une représentation visuelle de l’expérience de l’utilisateur lorsqu’il interagit avec E-bike. Cette carte m’a aidé à comprendre le flux de l’expérience utilisateur, à identifier les points de friction potentiels et à concevoir des solutions pour améliorer l’expérience globale.
Lucas
Explorateur cycliste
Ville : Strasbourg
Age : 29
Famille : En couple
Lucas est un cycliste passionné qui voit chaque sortie comme une opportunité d’explorer de nouveaux terrains et de repousser ses limites. Pour lui, le choix du vélo parfait va au-delà de la simple question de performance ; il veut aussi que son vélo reflète sa personnalité et son style de vie aventureux. Lorsqu’il décide d’acheter en ligne, il veut que le processus soit aussi simple et sûr que possible, et il cherche également des options de sécurité supplémentaires pour protéger son investissement.
“Chaque virée à vélo est une aventure en soi”.
Objectif
Lucas cherche un vélo qui lui offre le confort et la stabilité nécessaires pour explorer de nouveaux horizons tout en étant suffisamment robuste pour affronter les chemins les plus exigeants.
Il veut pouvoir personnaliser son vélo pour qu’il soit à son image, lui permettant ainsi de se démarquer sur les routes et sentiers.
Lorsqu’il achète en ligne, Lucas s’attend à ce que le processus soit simple et sans tracas. Il souhaite également pouvoir enregistrer son vélo pour obtenir un matricule d’identification et éventuellement un cadenas offert pour assurer sa sécurité.
Frustration
Il trouve souvent difficile de trouver un vélo qui répond à toutes ses exigences en matière de confort, de stabilité et de personnalisation.
La complexité des options de personnalisation en ligne peut parfois rendre le processus frustrant.
Lucas est préoccupé par la sécurité de son vélo lorsqu’il est garé à l’extérieur et souhaite des options de sécurité supplémentaires telles qu’un matricule d’identification et un cadenas offert.
Récit utilisateur
En tant que Lucas, explorateur cycliste, je souhaite pouvoir personnaliser les caractéristiques de mon vélo lors de l’achat en ligne afin de créer un vélo qui correspond à mes besoins spécifiques en matière de confort, de stabilité et de sécurité, et qui reflète ma personnalité aventureuse.
Carte du parcours utilisateur
Claire
Cycliste occasionnelle
Ville : Strasbourg
Age : 26
Famille : En couple
Claire est une cycliste occasionnelle qui apprécie les balades tranquilles le week-end ou pendant les vacances. Pour elle, le vélo est un moyen de se détendre et de passer du temps de qualité avec ses proches. Elle recherche un vélo simple et confortable, sans trop de gadgets ou de caractéristiques techniques complexes. Lorsqu’elle achète en ligne, elle préfère un processus simple et intuitif, avec des options claires et un service clientèle disponible pour répondre à ses questions.
“Je veux un vélo qui rendra mes balades agréables et sans tracas”.
Objectif
Trouver un vélo confortable et facile à utiliser pour des balades occasionnelles en famille ou entre amis.
Souhaiter une expérience d’achat en ligne simple et intuitive, sans trop de complications.
Chercher un bon rapport qualité-prix et une garantie de satisfaction.
Frustration
Elle trouve difficile de trouver un vélo qui convient à son niveau d’expertise et à ses besoins simples.
Les sites web de vélos peuvent souvent être trop complexes pour elle, ce qui rend le processus d’achat déroutant.
Claire veut être sûre de faire un bon investissement et d’avoir un support client fiable en cas de problème.
Récit utilisateur
En tant que Claire, cycliste occasionnelle, je souhaite pouvoir acheter un vélo en ligne de manière simple et intuitive, avec des options claires et un processus sans complications, afin de pouvoir profiter de balades agréables et sans tracas avec ma famille et mes amis.
Carte du parcours utilisateur
Composants et guide de style
Lors de la conception de E-bike, j’ai créé une bibliothèque de composants et un guide de styles pour assurer la cohérence de l’interface utilisateur à travers le site.
Composants : J’ai conçu une variété de composants réutilisables, y compris des boutons, des champs de saisie, des curseurs de personnalisation, etc. Ces composants ont été conçus pour être flexibles et peuvent être utilisés dans différents contextes à travers le site.
Guide de styles : J’ai également créé un guide de styles qui définit les couleurs, les typographies, les espacements, et d’autres éléments de style utilisés sur le site. Ce guide aide à assurer que l’apparence de E-bike est cohérente, professionnelle et attrayante pour nos utilisateurs.
Ces outils ont été essentiels pour maintenir la cohérence de l’interface utilisateur de E-bike et pour faciliter le processus de conception et de développement. Ils ont également aidé à créer une expérience utilisateur plus cohérente et agréable pour nos utilisateurs.
Grids
J’ai utilisé deux grilles pour des appareils différents. Une grille de 12 colonnes pour le bureau et une grille de 6 colonnes pour le téléphone.
Wireframes à faible fidélité
J’ai créé des wireframes à faible fidélité pour chaque page clé du site, y compris la page d’accueil, la page de personnalisation du vélo, et la page de commande. Ces wireframes ont été utilisés pour visualiser et tester les idées de conception avant de passer à des maquettes à haute fidélité.
Ces wireframes ont permis à l’équipe de conception et aux parties prenantes de comprendre comment les utilisateurs navigueront sur le site et interagiront avec les différentes fonctionnalités. Ils ont également aidé à identifier les problèmes potentiels dans le flux de l’expérience utilisateur et à apporter des modifications avant de passer à la phase de développement.
Wireframes à haute fidélité
Après avoir travaillé sur les wireframes à faible fidélité, j’ai élaboré des wireframes à haute fidélité pour E-bike. Ces wireframes offrent une représentation plus détaillée de l’interface utilisateur, y compris la mise en page, les images, les typographies et les couleurs. Ils ont permis de visualiser l’aspect final du site avant de passer à la phase de prototypage.
Prototype
J’ai ensuite créé des prototypes à haute fidélité pour E-bike. Ces prototypes interactifs ont permis de tester l’expérience utilisateur de manière réaliste, d’obtenir des retours précoces et de faire des ajustements avant le développement.
Note : Cliquez sur option puis sur Adapter à l’écran pour avoir une bonne expérience.
