Identité visuelle : Le design du site a été pensé pour évoquer l’univers maritime avec élégance et sobriété. Le contraste fort entre des tons profonds (bleu marine, noir) et la clarté des fonds blancs permet de faire ressortir la qualité des photographies haute définition des produits.

Typographie et Iconographie : Le choix de polices modernes et épurées assure une lisibilité optimale lors du parcours dans le catalogue. Pour faciliter la lecture rapide des services et engagements de l’entreprise (Livraison, Traçabilité, Qualité), une série de pictogrammes minimalistes a été intégrée à l’interface.

Un catalogue structuré : En tant que responsable unique du développement, j’ai mis en place une architecture robuste sous WordPress. L’arborescence a été pensée pour organiser un catalogue produit dense (vivants, cuits, coquillages, crustacés) et garantir une navigation intuitive, quel que soit le profil de l’utilisateur (particulier ou poissonnier).

Responsive Design & Sécurité : L’interface est développée pour s’adapter parfaitement aux supports mobiles, répondant ainsi aux besoins des professionnels passant commande en déplacement. Enfin, le projet a inclus la mise en conformité du site avec l’intégration des outils de gestion des données personnelles (RGPD) et des mentions légales.

Performance et SEO Local : Le référencement et la vitesse ont été des priorités. L’optimisation technique du site (notamment la compression du poids des images haute résolution) garantit un temps de chargement très rapide, essentiel pour l’expérience utilisateur et le référencement local sur le bassin malouin.

Une identité ludique : Pour désacraliser l’apprentissage et le rendre agréable, nous avons imaginé une identité visuelle chaleureuse et décontractée. L’interface est guidée par une petite mascotte — un renard — qui accompagne l’utilisateur, créant un univers convivial qui s’inspire directement des codes d’engagement du jeu mobile.

Des choix graphiques assumés : La palette de couleurs s’articule autour de teintes vives et stimulantes (orange, jaune, bleu canard). Pour renforcer cet aspect ludique et accessible, nous avons opté pour des éléments graphiques aux formes douces et arrondies, qu’il s’agisse des boutons d’action ou des champs de saisie.

Intégration Mobile First : Le site a été pensé, conçu et développé à deux avec une approche strictement Mobile First. Cette méthode garantit une intégration responsive fluide, offrant une accessibilité et une expérience de jeu optimales sur tous les supports (smartphones, tablettes, ordinateurs de bureau).

Gestion autonome des utilisateurs : La plateforme gère de manière sécurisée l’intégralité du parcours utilisateur. De l’inscription jusqu’au suivi de progression, chaque action est enregistrée, permettant l’actualisation des scores et le suivi des statistiques en temps réel.

Dynamisme et Base de données : Le cœur du système repose sur une architecture complexe combinant une base de données relationnelle (SQL) et des scripts PHP. Ce système permet l’affichage dynamique des contenus générés à la volée (questions, défis de vocabulaire, compréhension orale ou traduction) selon la langue sélectionnée et le niveau du joueur.

Respect d’une identité forte : La direction artistique du musée, conçue par Pollen Studio, propose une identité sobre et contemporaine inspirée de l’histoire maritime locale (typographie spécifique, crochets graphiques, palette colorée stricte).

De la maquette au pixel près : Mon rôle a débuté à la réception des maquettes UI réalisées par la responsable du pôle Direction Artistique d’Indigo Communication. J’ai eu la charge de créer les gabarits de pages et d’intégrer fidèlement ce design sous WordPress, en m’assurant que l’interface rende justice à la richesse des contenus du futur musée (histoire, patrimoine, enjeux environnementaux).

Menus dynamiques en JavaScript : Pour pallier les limites natives du CMS, j’ai développé des scripts en JavaScript avancé. J’ai notamment conçu un menu interactif avec sous-menus intégrant des comportements complexes (ouverture/fermeture dynamiques, injection de classes CSS, interactions au survol) totalement fidèles à l’identité visuelle requise.

Enrichissement avec jQuery : Pour améliorer la lisibilité des résultats de recherche, j’ai créé un script dynamique en jQuery. Celui-ci vient greffer automatiquement des éléments visuels signalant le type ou la catégorie de chaque résultat, facilitant ainsi grandement la navigation pour l’utilisateur final.

Recherche par fenêtre modale : J’ai développé une interface de recherche innovante sous forme de fenêtre modale. Dotée d’une barre de recherche performante, elle permet de filtrer les différents contenus (pages, articles, Custom Post Types) de manière fluide sans recharger la page.