Contexte de réalisation
Les étudiants de BUT Informatique souhaitaient se lancer dans un projet en parallèle de leurs cours pour en apprendre plus sur certaines technologies et méthodes de création de site web. Le BUT informatique n’inclut pas de cours de design, d’expérience ou d’ergonomie d’un point de vue des interfaces, c'est pourquoi ils avaient besoin d’une personne capable de réaliser les maquettes de leur projet. Leur idée consiste en la réalisation d’une plateforme web permettant la mise en relation de particulier pour louer des objets ou les échanger. Par exemple, une personne possédant une tonnelle, peut la mettre en location tant qu’elle ne s’en sert pas. Ce système permet ainsi de limiter l’achat d’objets à utilité courte. Réduisant ainsi dans une certaine mesure la surconsommation. L’intérêt de la plateforme repose sur le principe du gagnant-gagnant, le loueur récupère de l’argent sur son bien qu’il n’utilise pas, quant au locataire, il n’a pas le besoin d’acheter le bien et paie moins cher sa possession. Ce projet repose sur des valeurs d’échange, de partage et d’écologie. Pouvoir intervenir à notre niveau par une idée permettant de limiter la pollution et favoriser l’échange me semble important. C’est pourquoi j’ai rapidement adhéré au projet.
Mon rôle et mon approche
Ma première mission était de bien comprendre le projet. Grâce à des réunions et des échanges textuels, j’ai rapidement compris les enjeux et le but de l’équipe. Je partais de zéro, mon rôle au-delà d’UX designer peut-être considère comme directeur artistique dans la mesure où ils leur étaient nécessaires d’avoir un logo et des illustrations. À travers nos échanges, j’ai rapidement compris les valeurs de ce projet, j'ai donc cherché des inspirations. J’ai également fait un tour sur des sites “concurrents” comme le bon coin ou Vinted Nous avons donc construit un “mood board” donnant l’idée du style général de l’application. Mon expertise a permis de faire concorder le design et les valeurs du projet. Mon but étant de proposer une interface claire et accessible pour des personnes de tout âge.
Méthodologie et processus de conception
Étant habitué de l’outil Figma, je me suis rapidement attelée à la création d’un design système. Ce dernier consiste en une charte graphique plus poussée et adaptée pour le web. En tant qu’UX designer, il m’a parues primordial de construire ces bases pour permettre une cohérence graphique sur l'ensemble des maquettes. Mes premières recherches se sont concentré sur les couleurs. En effet, la couleur constitue la base de l’interface. Mon choix s’est porté sur un Vert #3CC8B9 signifiant le partage, l’écologie et la sérénité. J'ai également défini l'ensemble des couleurs secondaires et nuances de gris ainsi que leurs déclinaisons. Le design système établi ainsi toutes les couleurs. De plus, j’ai défini la taille des titres, les polices d’écriture, les espacements entre les éléments, ainsi que toutes les valeurs importantes pour l’uniformisation du design. Une fois les fondations en place et correctement variabilisées avec les outils intégrés à Figma, le travail de conception d’interface peut commencer.
Le design System de Loue Nous
Réalisation
Pour la conception d’interface, je m’inspire de ce qui existe déjà (il ne faut pas réinventer la roue) et je l’adapte au projet et j’y ajoute évidemment ma touche personnelle. J’ai beaucoup travaillé par blocs en utilisant l’auto layout de Figma permettant une plus grande flexibilité dans la modification et dans l’adaptation aux tailles d’écrans. Il est important de garder en tête que le design permettra aux développeurs de construire l’interface sans prendre de choix sur l’apparence. Il faut donc garder à l’esprit que le design a pour but final d’être codé. Ma formation pluridisciplinaire alliant design et développement web me permet de connaitre les limitations techniques du développeur et donc de penser le design pour faciliter la réalisation et limiter la difficulté liée à la phase de programmation. Dans cette optique, j’ai réalisé une dizaine de pages dont l’accueil, le profile, l’ajout d’objet, les locations d’objet…
La page de gestion du profil
La page d'ajout d'objet
Résultat
L’équipe a été très satisfaite de mon travail qui est toujours en évolution. Après une pause, le développement reprend et je travaille encore avec eux pour cette phase. Nous échangeons régulièrement et c’est pour moi le moyen d’approfondir mes compétences. Pour l’instant les maquettes sont toutes réalisées, mais pas terminé, car il y a toujours des axes d’améliorations et de perfectionnements possibles. C’est pourquoi je repasse sur ce qui a déjà été fait pour le perfectionner.