< Tous les articles Intégration

Refonte de site vitrine - Escaet


Objectifs

Actualiser le design et l'ergonomie du site tout en repensant les contenus pour des cibles variées.

Solution

Création d'un site vitrine sous le CMS Wordpress avec 3 entrées différentes selon les personas.

Equipe

2 personnes (1 intégrateur, 1 développeur backend)

Durée

8 mois

 

Expertises : digital | site vitrine | Wordpress


 Le challenge client 

Optimiser le site internet et le rendre actractif

L'Escaet est une école de tourisme spécialisée en management du tourisme et des voyages. Lors de la refonte de leur site internet, l'occasion était venue de réfléchir au site sous différents angles et notamment optimiser l'ergonomie et les contenus pour les rendre fluides et attractifs à leurs différents personas. L'école a fait appel à notre agence digitale pour cette mission et nous avons accepté le challenge volontiers.

  smartmockups_ljr36xu9

 Nos solutions 

Un site internet à entrées multiples

Nous avons choisi de développer le site vitrine avec le CMS Wordpress qui était tout indiqué pour les mises à jour qui seraient faites par les équipes internes.

Afin de répondre au cahier des charges, nous avons mis en place un thème au design très flexible et nous avons ainsi pensé le menu pour qu'il comporte différents accès en fonction des personas. En effet, l'école s'adresse principalement aux étudiants, mais aussi aux professionnels et aux entreprises.

Le nouveau site permet ainsi de naviguer entre les différents accès tout en ayant des repères visuels pour chaque partie.

Un menu simple (en apparence) et efficace !

Le menu principal a été soigneusement réfléchi en amont du projet, car nous savions qu'il serait l'élément crucial de la navigation des utilisateurs. Nous avons donc créé des entrées distinctes pour les étudiants, les professionnels et les entreprises afin de répondre aux besoins spécifiques de chaque groupe cible.

La section dédiée aux étudiants offre un accès facile aux informations sur les programmes d'études, les admissions et les opportunités de carrière. Les étudiants peuvent également trouver des ressources utiles telles que des témoignages d'anciens élèves et candidater aux programmes souhaités.

La partie réservée aux professionnels propose des informations détaillées sur les formations continues et les possibilités de développement professionnel. Les professionnels peuvent découvrir les avantages de se former à l'Escaet et trouver des programmes adaptés à leurs besoins spécifiques.

Enfin, la section entreprises met en évidence les services et les partenariats offerts par l'école aux entreprises du secteur du tourisme. Les entreprises peuvent trouver des informations sur les formations sur mesure, les opportunités de recrutement et les partenariats stratégiques avec l'école.

En résumé, le menu principal du nouveau site vitrine de l'Escaet a été conçu de manière à ce que chaque groupe cible puisse facilement accéder aux informations qui leur sont pertinentes. Cela permet aux utilisateurs de naviguer de manière fluide et de trouver rapidement les informations dont ils ont besoin, ce qui améliore l'expérience utilisateur globale.

Capture d’écran 2023-07-06 à 13.58.14

Capture d’écran 2023-07-06 à 13.58.38

Capture d’écran 2023-07-06 à 13.58.58

La navigation principale se dénote avec une graisse de police plus importante et elle est séparée des accès secondaires aux autres parties par un trait vertical. Les accès secondaires sont plus discrets, mais bien accessibles et compréhensibles par tout le monde. La même distinction se voit en version mobile.

Capture d’écran 2023-07-06 à 14.03.08

Une charte cohérente et claire

Afin de donner aux différents visiteurs les repères nécessaires pour une meilleure expérience de navigation, nous avons mis en place une charte graphique simple et cohérente qui facilite la lecture et l'orientation des utilisateurs. Pour ce faire, nous avons utilisé les couleurs extraites du logo Escaet et nous avons attribué des couleurs prédominantes à chaque partie du site. Ainsi, le site dédié aux étudiants se décline dans des tons oranges, le site des professionnels en bleu et le site des entreprises en vert.

Nous avons veillé à ce que tous les éléments tels que les boutons, les éléments graphiques et les décorations soient déclinés dans chaque partie du site, ce qui permet aux utilisateurs de savoir en permanence où ils se trouvent. Cette cohérence visuelle renforce l'identité de chaque section du site et facilite la compréhension et la navigation pour les visiteurs. Que ce soit en termes de couleur, de design ou de disposition des éléments, chaque partie du site est clairement identifiable et offre une expérience utilisateur harmonieuse et agréable.


 

Capture d’écran 2023-07-06 à 14.08.42Capture d’écran 2023-07-06 à 14.08.21Capture d’écran 2023-07-06 à 14.02.10

Un widget d'aide au choix

Pour la partie du site dédié aux professionnels, nous avons mis en place un widget d'aide au choix. L'objectif était de donner la possibilité aux utilisateurs de choisir parmi certains critères et leur permettre ainsi de trouver les formations correspondant à leurs choix.

Ce widget dynamique, offre aux professionnels la possibilité de sélectionner leurs préférences en matière de formation. Grâce à une série de questions ciblées, les utilisateurs peuvent indiquer la finalité recherchée, le financement, la durée ainsi que le format voulu. En fonction de leurs réponses, le widget fournit une liste de formations recommandées correspondant à leurs besoins spécifiques.

L'avantage de ce widget est qu'il est évolutif. En effet, il peut être mis à jour régulièrement pour inclure de nouvelles formations et critères, afin de rester en phase avec l'évolution de l'offre de l'école. Ainsi, les professionnels ont toujours accès aux dernières formations proposées par l'Escaet, ce qui leur permet de rester à jour dans leur domaine et de développer leurs compétences en fonction de leurs besoins et de leurs objectifs.

En outre, cela renforce la position de l'Escaet en tant qu'école de référence dans le domaine du tourisme et de la gestion du voyage, en offrant des solutions sur mesure pour les professionnels du secteur.

 
Capture d’écran 2023-07-06 à 14.10.06

Un design sobre mais affirmé

Concernant le design du site, nous avons construit de nombreux gabarits de sections. L'école peut ainsi construire les pages à sa guise en se servant des gabarits initiaux et en les adaptant à leurs contenus.

Nous avons introduit plusieurs éléments visuels qui permettent de disposer d'un large choix de mise en page. Les éléments graphiques sont à la fois sobres et affirmés, donnant au site une esthétique moderne et attrayante. Par exemple, nous avons ajouté des dégradés élégants autour des images, ce qui leur donne une allure plus sophistiquée et les met en valeur. De plus, nous avons utilisé des titres en caractères pleins alternés de quelques mots en 'contour' pour faciliter la lecture et attirer l'attention sur certaines parties importantes des textes.

Ces éléments visuels apportent une touche de dynamisme au design du site tout en restant cohérents avec l'identité de l'école. Ils contribuent à rendre la navigation plus agréable et intuitive pour les utilisateurs, en leur offrant une expérience visuelle attrayante et en mettant en avant les informations clés. Grâce à ces choix de design réfléchis, le site de l'Escaet se démarque visuellement tout en restant professionnel et informatif.

  Capture d’écran 2023-07-06 à 14.17.03
 
Capture d’écran 2023-07-06 à 14.18.48
 
Capture d’écran 2023-07-06 à 14.19.29
Capture d’écran 2023-07-06 à 14.19.12
Capture d’écran 2023-07-06 à 14.19.02
Capture d’écran 2023-07-06 à 14.20.01
 

Des formulaires intelligents, une expérience fluide

Pour répondre aux besoins spécifiques du client, il était important de mettre en place des formulaires intelligents sur le site. Ces formulaires sont conçus de manière à ce que certaines questions restent initialement "cachées" à l'utilisateur, et ne s'affichent que selon les choix qu'il fait au fur et à mesure de ses réponses.

Cette approche permet d'optimiser l'expérience utilisateur en évitant de surcharger les formulaires avec des questions qui ne sont pas pertinentes pour chaque utilisateur. Ainsi, les questions s'affichent de manière progressive et adaptée aux choix et aux besoins spécifiques de chaque utilisateur.

Grâce à ces formulaires intelligents, l'utilisateur est guidé tout au long du processus de remplissage du formulaire, ce qui rend l'expérience plus fluide et agréable. De plus, cela permet d'obtenir des réponses plus précises et pertinentes, ce qui facilite le traitement des demandes et améliore la qualité du service proposé par l'école.

Grâce à cette fonctionnalité, l'école de tourisme Escaet peut désormais offrir une expérience personnalisée et efficace à ses visiteurs, en leur permettant de remplir des formulaires adaptés à leurs besoins spécifiques, tout en optimisant la gestion des demandes pour l'équipe interne.

 Le résultat 

Le développement du site a duré plusieurs mois. Pendant cette période, notre équipe a créé différents gabarits adaptés aux contenus de l'école. Chaque détail a été soigneusement pris en compte pour garantir une expérience utilisateur optimale et une harmonie parfaite entre les 3 mini-sites.

Les différentes parties du site sont maintenant bien structurées et faciles à naviguer, offrant ainsi une expérience fluide et agréable aux utilisateurs. Les couleurs prédominantes pour chaque section du site aident également à créer une atmosphère cohérente et claire, tout en renforçant l'identité de l'école.

Le développement de ce site a été un très bon défi, mais nous sommes fiers du résultat final. L'école de tourisme Escaet dispose maintenant d'un site vitrine moderne et attractif qui met en valeur son expertise et son offre de formations. Nous sommes impatients de continuer à travailler avec eux pour relever de nouveaux défis et améliorer encore davantage leur présence en ligne.

AVANT APRES
Capture d’écran 2023-07-06 à 14.31.54

 

Capture d’écran 2023-07-06 à 14.32.45

 

 

 


 

 

Pour aller plus loin...

Digital & Co.

Découvrez notre blog! Nous vous livrons nos astuces, conseils et coups de cœur sur des sujets comme les nouvelles technologies, les techniques web, le marketing, les publicités et les images de marque. Des informations utiles en somme, n’en ratez aucune !