Lone
Ce projet est un projet réalisé avec 3 autres camarades dans un cadre pédagogique en Licence Professionnelle Webdesign à Montbéliard. Le but de ce dernier était de réaliser un site de chaussures personnalisables sur lequel il était possible de se créer un compte et de sauvegarder la personnalisation de notre chaussure.
La phase de réflexion
Avant de commencer ce projet, nous nous sommes concertés pour savoir le nom et l’histoire que nous voulions donner à notre marque de sneakers personnalisables. Nous avons souhaités que chaque paire de sneakers soit unique. Pour se faire, nous avons rendus différentes parties de la chaussure personnalisable avec une possibilité de changer la couleur ou la matière parmi une présélection.
Après cette première phase, nous avons réfléchi à un nom. Nous avons décidé de choisir le nom lone. Une lône est un bras secondaire un méandre d’une rivière ou d’un fleuve. Nous avons trouvé que cela représentait bien l’esprit que nous voulions donner à notre marque.
Après avoir choisi le nom et l’esprit de la marque, nous il était temps de choisir les différentes fonctionnalités du site. Nous avons utilisé des Post-it afin de noter toutes les idées et pour être sur de ne pas passer à côté d’une idée intéressante.
Le maquettage
Après avoir trouvé les différentes fonctionnalités, place au design ! Tout d’abord, nous avons commencé par de l’Ux Design. Nous avons dessiner sur des feuilles blanches les bases et les wireframes de notre site.
Après un résultat qui nous semblait optimal nous avons créé une maquette sur Figma. Il y a une version mobile et une version bureau qui ont été créées. Afin de la rendre plus simple pour le prototype, nous avons commencer par créer un design system. Après la création du design system, place au maquettage. Nous avons choisi des couleur sombres afin de se démarquer des autres sites de chaussures et de rester hors des principes, tel le ferait une lone.
Un lien vers la maquette version téléphone et un autre vers la version bureau sont disponibles juste en dessous.
L'intégration
Après avoir créé la maquette, place à l’intégration de cette dernière. Afin de réaliser un site internet dans lequel une personnalisation de chaussure, la création d’un compte et la sauvegarde de chaussures personnalisées, nous avons utilisés VueJS et Axios couplé à WordPress Headless. La sauvegarde de l’historique du client se fait grâce aux cookies présents dans le navigateur.
Le site n’est actuellement plus en ligne mais si vous souhaitez consulter le GitHub du projet vous pouvez en cliquant juste ici.