HETIC Executive Education - Refonte stratégique et UI/UX de l'offre IA & Management

HETIC Executive Education - Refonte stratégique et UI/UX de l'offre IA & Management

À propos de

HETIC ExEd

HETIC Executive Education est l'entité formation continue de HETIC, grande école du digital fondée il y a 25 ans. Elle lance une nouvelle offre certifiante destinée aux cadres et managers : 4×3 jours, 90h, 9 900€ HT, financement CPF/OpCo, certification RNCP.

Le problème : le site existant était conçu pour des étudiants de 20 ans. L'offre ExEd ciblait des DRH de 40 ans avec des budgets de plusieurs milliers d'euros à valider. Le même design servait les deux publics — et ne convainquait ni l'un ni l'autre.

L'enjeu était double : crédibiliser HETIC comme acteur de la formation professionnelle sénior, et convertir deux profils très différents — la DRH qui signe le budget (Sophie, 38-50 ans) et le manager qui suit la formation (Marc, 35-48 ans).

Le travail de S Agency

Le vrai problème (pas le brief)

Ce qu'ils ont demandé : Un site pour présenter la nouvelle formation IA & Management.

Ce que j'ai diagnostiqué : Un problème de positionnement d'abord, de design ensuite. Le frein principal identifié dans le brief était explicite : « HETIC, c'est une école pour les jeunes, pas pour des cadres expérimentés. » Ce n'est pas un problème de couleurs ou de typographie, c'est un problème de signaux.

Ce que ça changeait à mon approche : Avant de toucher à quoi que ce soit visuellement, j'ai retravaillé la hiérarchie de l'information pour chaque profil. La DRH a besoin de réassurance institutionnelle (RNCP, Qualiopi, 25 ans d'histoire) en 10 secondes. Le manager a besoin de se projeter dans ce qu'il va concrètement apprendre. Ces deux parcours de lecture ne peuvent pas utiliser un design simple ciblant les étudiants.

Les décisions de design clés

Décision 1 — Supprimer les couleurs HETIC

Choix : Palette vert PGE + noir, avec typographie institutionnelle sobre. Couleurs vives réduites, pas de "dynamisme étudiant".

Pourquoi : Les couleurs HETIC (vives, jeunes, énergiques) envoient le signal exact opposé à celui qu'une DRH de 45 ans attend d'un prestataire de formation certifiante à 9 900€. Le design doit dire « institution », pas « startup ». En executive education, la sobriété visuelle est un argument de vente.

Alternative écartée : Garder les couleurs HETIC basiques pour assurer la cohérence avec les parcours étudiants classiques. Rejeté car la cohérence avec un site étudiant est précisément ce qu'on cherche à éviter.

Décision 2 — Deux parcours de lecture, pas un

Choix : Structurer chaque page pour que la DRH trouve ses signaux de réassurance dans les 10 premières secondes (logos, RNCP, prix, financement), et que le manager trouve son parcours de projection ensuite (programme, méthode, profil des intervenants).

Pourquoi : Le brief identifiait deux cibles avec des freins complètement différents. Faire un seul design qui « moyenne » les deux = ne convaincre personne. J'ai choisi de privilégier d'abord la DRH (c'est elle qui signe), avec un bloc de réassurance très haut dans la page, avant même la description du programme.

Alternative écartée : Commencer par la description du contenu de la formation. Rejeté car une DRH qui ne fait pas confiance à l'institution ne lit pas le programme.

Décision 3 — Copywriting affirmatif, pas descriptif

Choix : Transformer les intitulés de modules en résultats concrets. « Module 3 : IA et management » devient « Savoir piloter un projet IA sans être tech ».

Pourquoi : Le manager (Marc) arrive avec un frein précis : « Est-ce que ça va m'apporter quelque chose de concret, ou c'est encore du blabla sur la transformation digitale ? » Répondre à cette question passe par un langage orienté compétences acquises, pas intitulés académiques. C'est une décision UX autant qu'une décision éditoriale.

Alternative écartée : Reprendre les intitulés existants pour gagner du temps. Rejeté car ils ne répondaient à aucun des freins identifiés dans le brief.

Décision 4 — Landing page séparée du site principal

Choix : Concevoir une landing page dédiée aux campagnes LinkedIn, wireframe uniquement, conçue pour HubSpot ou Unbounce : pas intégrée dans le CMS Drupal existant.

Pourquoi : Une page de conversion pour LinkedIn Ads a une logique radicalement différente d'une page de présentation. Zéro navigation, zéro distraction, un seul CTA. Mettre ça dans Drupal = subir les contraintes du CMS. Une LP sur Unbounce se déploie et s'A/B teste indépendamment.

Alternative écartée : Intégrer la LP dans Drupal pour simplifier la gestion. Rejeté car les contraintes techniques de Drupal auraient sacrifié la souplesse de la LP.

Le résultat

Métrique

Attendu

Réel

Délai de livraison

7-8 jours (brief reçu 25/03, deadline 03/04)

4 jours (V1 livrée le 29/03)

Nombre de livrables

3 pages Figma

3 pages (Homepage + Page formation + LP)

Allers-retours client

Max 2 prévus

0 retouche majeure

Retour client

"Très satisfait"

Ce que j'ai appris

Le brief créatif le plus utile n'est pas celui qui décrit ce qu'il faut faire — c'est celui qui documente les freins psychologiques des utilisateurs. Le brief HETIC m'avait donné deux phrases qui valaient de l'or : « HETIC, c'est une école pour les jeunes » (frein DRH) et « encore du blabla sur la transformation digitale » (frein manager). Ces deux phrases ont piloté chaque décision de design — bien plus que les spécifications techniques.

Quand un client formule lui-même les objections de ses prospects, le travail de UX est à moitié fait. Il suffit de construire un design qui répond à ces objections dans l'ordre où elles apparaissent dans la tête du visiteur.

Témoignage client

"Simon a livré en 4 jours ce qu'on attendait en deux semaines et le résultat était exactement ce dont on avait besoin."

— Mathieu Porst, Collaborateur équipe HETIC ExEd

Informations du projet




Client

HETIC Executive Education

Type de prestation

UX/UI Design · Copywriting · Wireframing

Outil

Figma

Durée

4 jours

Livrables

3 pages Figma (wireframe + maquette LoFi)

Dev hand-off

Thomas — intégration Drupal

Secteur

Éducation supérieure · Formation continue

Contact

Discutons de votre projet

Prêt à donner vie à votre vision ? Contactez-moi pour échanger sur votre projet.

Informations de contact

Email :

simoncade.contactpro@gmail.com

Cal.com (pour prendre rdv) :

Réseaux sociaux ;