Modernisation d’une charte graphique
Le marché des logiciels à destination des formateurs professionnels est de plus en plus rude. De nombreux acteurs déjà bien implémentés vendent des solutions de plus en plus complètes et intuitives. La différence se fait principalement au niveau de la relation client, du prix, et surtout de la maniabilité de l’outil. Le site vitrine d’une entreprise comme Hop3team se doit donc de refléter son outil. La première impression d’un visiteur est très importante dans le choix de son outil.
C’est avec cet état d’esprit qu’Hop3team nous a donné carte blanche pour refondre son identité et la mettre au goût du jour. À l’exception du logo qui selon nous était déjà adapté pour proposer une charte avec une forte identité, nous avons pu challenger le reste des éléments. Que ce soit pour les couleurs, les typographies, les icônes, les éléments fonctionnels… Tout a été mis dans un Design System réalisé sur Figma afin d’harmoniser la constitution du futur site web.
Stratégie SEO
Avant de commencer à maquetter quoi que ce soit, nous avons réalisé une stratégie de référencement naturel (SEO). L’idée de cette refonte n’est pas de seulement prendre l’existant et de donner un coup de pinceau. Notre approche s’est intégrée dans un projet plus global qui comprenait le SEO. Comme pour toute stratégie, nous avons d’abord commencé par réaliser un Benchmark de la concurrence, trouver des opportunités de positionnement grâce à des recherches de mots clés, et surtout investiguer sur les préoccupations majeures des utilisateurs en recherche d’un logiciel de gestion de la formation professionnelle.
Une fois les mots clés validés avec le client, nous avons construit une architecture SEO pour chacune des futures pages du site web d’Hop3team. Cela veut donc dire que nous avons noté chacune des sections nécessaires avec les mots clés associés, et les intentions recherchées par les utilisateurs. Grâce à cette architecture, nous avons pu établir une véritable stratégie de référencement naturel. Cela nous a permis de voir également des opportunités pour des futures créations de contenus.
Maquettage Figma
Comme pour l’ensemble des projets, nous utilisons Figma pour maquetter les sites web. Grâce au design system et à l’architecture SEO expliqués précédemment, le chantier design a pu commencer. L’idée était simple : retranscrire l’identité d’hop3team sur l’ensemble du site de la manière la plus harmonieuse possible. Les variations de jaune à notre disposition dans la charte graphique, ainsi que le noir pour le contraste permet de réaliser de nombreuses sections variées et qui se détachent facilement entre elle. Le logo a été utilisé pour styliser certains blocs, mais aussi en arrière-plan de certaines pages.
La société Hop3team avait eu l’opportunité de faire un shooting photo peu de temps avant le démarrage du projet. Une aubaine pour ce maquettage car rien ne vaut des photos réelles de l’entreprise pour ajouter une touche d’authenticité. Une fois les pages validées, le client avait la possibilité d’ajouter les différents visuels et contenus textuels directement sur Figma. Cette approche collaborative permettait d’avancer en toute transparence et de corriger très rapidement certains détails de la maquette.
Optimisation du tunnel de conversion
Le but premier du site web d’Hop3team est de mettre en avant son produit et d’amener l’utilisateur à prendre rendez-vous avec un commercial, découvrir un webinaire, faire un essai gratuit… Comme nous avons tendance à le dire, le site vitrine est une porte d’entrée dans le tunnel de conversion. Il faut également rajouter le fait que le logiciel s’adresse à des cibles différentes. Un formateur professionnel indépendant n’aura pas forcément les mêmes besoins qu’un grand organisme de formation.
Ainsi, tout le site a été construit autour de cette logique de conversion. Tout au long de sa navigation, l’utilisateur est invité à poursuivre la découverte du logiciel grâce aux différents canaux de conversion. Sans oublier toute la partie tracking avec notamment l’outil Matomo qui permettra à Hop3team de suivre les performances de son futur site web en collectant des données de manière anonyme.
