Arts martiaux Tarragone
Nous avons repensé le site de M4RTIAL, un centre d’arts martiaux à Tarragone. À partir d’une première version en vibe coding, nous avons retravaillé l’UX/UI, les styles CSS et la navigation pour présenter le centre et consulter sereinement la collection STRIKE.
La première version avait été générée et ajustée avec l’IA, par vibe coding. Elle avait du contenu et des fonctions, mais des règles CSS concurrentes, des animations brusques et peu d’espace pour lire. Le visiteur devait chercher trop longtemps pour comprendre le centre. La refonte devait donner une route claire vers les disciplines, les horaires, les tarifs et la prochaine étape.
Photos d’entraînement, base noire et touches dorées donnent une direction plus sobre. L’espace entre les blocs laisse le temps de lire. La hiérarchie distingue présentation du centre, informations pratiques et collection STRIKE. Ce travail associe design d’interface, architecture de l’information et développement frontend sur une base existante.
La navigation suit les questions du visiteur : que pratiquer, quand venir, à quel prix et comment commencer ?
Les règles CSS concurrentes ont été revues, puis les marges, polices et composants harmonisés entre accueil et catalogue.
Les animations ont été atténuées et les contenus espacés pour laisser le temps de lire et de s’orienter.
Le catalogue STRIKE réunit recherche, filtres de vêtements, tailles et panier pour comparer et préparer une demande.
La mise en page responsive préserve l’ordre de lecture. À 320 px, les vêtements passent sur une colonne en gardant recherche, filtres et choix de taille. Le récapitulatif réunit articles, quantités et coordonnées dans la largeur disponible.
Le visiteur découvre une discipline, consulte son horaire puis rejoint la demande d’inscription. Dans le catalogue, recherche et filtres réduisent les articles ; taille et ajout au panier conservent la sélection. Le récapitulatif affiche quantités et sous-total avant l’envoi à l’équipe.