COSS by ESSEC & PwC : identité de marque et site Webflow d'une certification de soft skills

COSS by ESSEC & PwC certifie les soft skills des étudiants et des professionnels à partir du feedback de leur entourage professionnel. La certification se partage sur LinkedIn et se lit en cinq secondes par un recruteur.

COSS a confié à Gemeos, agence web pour les acteurs de la formation, son logo, son identité de marque, sa direction artistique, le design et le développement Webflow du site, et son référencement.

MacBook Pro sur un bureau en chêne d'une bibliothèque d'école, ouvert sur l'accueil COSS « Vos soft skills ont de la valeur. Prouvez-le. »

Rendre crédible une compétence qu'on ne voit pas sur un CV

Les soft skills se déclarent sur un CV, rarement elles se prouvent. COSS répond par une méthode : quatre questions par compétence posées à des contacts professionnels authentifiés, élaborées avec l'ESSEC et PwC. La marque devait porter le sérieux de ces deux institutions tout en parlant à un étudiant qui cherche son premier stage comme à un manager confirmé.

Gemeos a créé le logo et l'identité, exploré quatre pistes de Look & Feel, puis conçu et rédigé une centaine de pages dans Figma avant de les intégrer sur Webflow : quiz de recommandation, packs avec paiement Stripe, catalogue des formations ESSEC et pages SEO générées depuis le CMS pour chaque métier et chaque soft skill.

Industrie: Éducation
Services: Logotype; Branding; DA; UX/UI Design; Intégration; SEO

Icône COSS en lames empilées, très grande, et logotype COSS sur fond crème

Un S fait de lames décalées, comme une progression

Le logotype COSS est un mot court, très noir, aux formes ramassées : il tient à côté des blasons de l'ESSEC et de PwC sans s'effacer. L'icône reprend le S en quatre lames empilées, décalées sur une même diagonale. Chaque lame évoque un retour de l'entourage, et l'ensemble une montée en compétence.

Le logo a été construit sur une grille stricte, pour rester net en favicon comme sur un Open Badge LinkedIn. Il se décline en version co-brandée « COSS | ESSEC | PwC », utilisée dans la navigation et le pied de page du site.

Carte de certification COSS « Esprit d'équipe 4.8/5 » agrandie sur fond crème, avec l'icône COSS

Le sérieux d'une grande école, la chaleur d'un retour humain

L'identité s'appuie sur un fond crème (#F2ECE5) plutôt que sur un blanc clinique, un noir profond pour les titres et deux accents tirés du bleu institutionnel : un bleu ciel (#B8CEFF) pour les appels à l'action et un bleu profond (#2E4D93). Un vert sauge (#CEDEBB) marque ce qui est validé : la colonne « Avec COSS », les compétences certifiées.

Les titres sont composés en PP Neue Montreal, une grotesque élégante et légèrement étroite ; les textes courants en Inter, pour la lisibilité. La pièce maîtresse de l'identité est la carte de certification : nom, compétence, note sur 5, évaluateurs authentifiés et mention « Certifié par COSS by ESSEC & PwC », pensée pour être reconnue d'un coup d'œil sur LinkedIn.

Les quatre pistes de page d'accueil COSS côte à côte, sur fond crème

Quatre pistes pour trouver le ton juste entre institution et EdTech

Avant de dessiner le site, Gemeos a exploré quatre territoires complets, chacun décliné sur une page d'accueil : palette, typographie, traitement des photos et composants. L'enjeu était le même pour toutes : afficher la caution ESSEC et PwC sans paraître distant, et donner envie de passer le quiz.

Piste 1 - Pixel et énergie
Une identité dynamique portée par un motif de pixels, où chaque cellule représente une compétence et chaque niveau une intensité, et un pictogramme en anneau qui évoque le collectif des évaluateurs. Un dégradé bleu, violet et rose traduit la diversité des profils. Perception : moderne et ambitieuse, une plateforme globale accessible à tous.
Piste 2 - Premium et humaine
Un logotype sobre et affirmé, un accent graphique sur le S comme fil conducteur, une palette bleu, bordeaux et crème et des photographies ancrées dans le réel. La rigueur et la chaleur coexistent dans chaque détail. Perception : premium sans ostentation, institutionnelle sans être distante.
Piste 3 - Lumière et données
Une version plus technologique : grands aplats violet et bleu, chiffres clés mis en scène dans des cartes de couleur, portraits souriants découpés dans la lumière. Elle insiste sur la mesure et sur la rapidité du parcours.
Piste 4 - Crème, noir et lames
La piste retenue : un fond crème, un noir profond, des accents bleu ciel et vert sauge, l'icône en lames empilées comme signature, des cartes arrondies et des portraits professionnels. Elle concilie la caution des deux institutions et la proximité d'un produit grand public.

Piste 1 : accueil COSS avec un dégradé bleu, violet et rose et des chiffres clés

Concept 1

MacBook Pro sur une table de salle de séminaire, ouvert sur la page Packs du site COSS

Du quiz à la certification en trois écrans

Le site a un objectif simple : faire passer le visiteur du doute au quiz, puis au pack. Toute la navigation pousse vers « Lancer le quizz », un quiz de recommandation de deux minutes qui propose les compétences les plus utiles au projet professionnel du visiteur. Les pages de réassurance (méthode, experts, avis, FAQ) répondent ensuite à une seule question : pourquoi croire une certification par feedback ?

Page	Ce qu'elle fait pour le visiteur
Accueil	Pose la promesse, montre la carte de certification, prouve par les chiffres et les deux institutions
Quiz	Six étapes en deux minutes pour recommander trois compétences, avec un stepper horizontal en mobile
Packs	Pack Étudiant à 49 € et Pack Pro à 129 €, comparatif « sans COSS / avec COSS », compétences supplémentaires
Méthode	Le feedback 360° expliqué, sources académiques à l'appui
Formations ESSEC	Sept formations certifiantes à l'ère de l'IA, avec brochure à télécharger
Métiers et soft skills	Une page par métier et par compétence pour répondre aux recherches des candidats

Gemeos a conçu un UI Kit complet avant les pages, puis maquetté et rédigé chaque gabarit en desktop et en mobile : une trentaine de modèles, des pages légales aux états de paiement (confirmé, interrompu, erreur du quiz). Chaque page se termine sur le même bloc : « Vos soft skills ont de la valeur. Il est temps de le prouver », avec les deux prix à portée de clic.

Pro Display XDR sur un bureau en chêne, ouvert sur la page « Les soft skills du métier de data analyst »

Un site Webflow branché sur la plateforme COSS

Le site est développé sur Webflow et dialogue avec la plateforme de certification. Le quiz envoie les réponses du visiteur à l'API de COSS, qui renvoie les compétences recommandées ; le choix du pack et des compétences ouvre ensuite une session de paiement Stripe Checkout, avec les pages de confirmation et d'échec qui vont avec. Pour le Pack Étudiant, le justificatif se dépose directement dans le formulaire.

Les métiers, les compétences, les formations, les articles et les auteurs vivent dans des collections CMS reliées entre elles : une page métier affiche ses cinq soft skills clés, une page compétence liste les métiers où elle compte. Le contenu a été importé en masse depuis les fichiers de COSS. Le parcours du quiz pousse ses étapes dans le dataLayer selon le plan de taggage du client, pour suivre chaque abandon dans GA4. L'équipe COSS a été formée à Webflow, avec un enregistrement de la session.

MacBook Pro sur une table de café en travertin, ouvert sur la page COSS « Adaptabilité : définition et comportements évalués »

Une page pour chaque métier et chaque soft skill recherchés

Les candidats cherchent « soft skills data analyst » ou « adaptabilité définition » bien avant de chercher une certification. La stratégie SEO a donc consisté à occuper ces recherches : 115 pages indexables, dont 37 pages métier, 40 pages compétence, des hubs « soft skills par métier » et « les plus recherchées », sept formations ESSEC et un blog signé par quatre auteurs.

Chantier	Détail
Pages programmatiques	Un gabarit métier et un gabarit compétence, alimentés par le CMS : définition, comportements évalués, progression par séniorité, métiers proches, FAQ
Maillage interne	Chaque métier renvoie vers ses soft skills, chaque soft skill vers ses métiers, et toutes vers le quiz et les packs
Balises & métadonnées	Title et meta description par gabarit (« Soft skills du métier : Data Analyst \| COSS »), un H1 par page, balise canonique partout
Données structurées	Organization sur tout le site, Article sur le blog, ProfilePage sur les pages auteurs
Indexation	Sitemap XML tenu à jour par Webflow, robots.txt ouvert, Search Console et GA4 suivis via Google Tag Manager

Lisible par les moteurs comme par les assistants IA

Chaque page compétence s'ouvre sur une définition courte, puis liste des comportements observables ; chaque page métier répond à « Quelles qualités pour devenir… ? ». Les articles sont signés par les fondateurs et des experts identifiés, avec leur page auteur. Ce format, définitions nettes et réponses directes, aide les moteurs et les assistants IA à citer COSS sur les soft skills.