🌍 Étude de cas · Product Design

Vendredi remet l'engagement collaborateur au cœur des entreprises avec sa plateforme dédiée.

Refonte de la plateforme Vendredi pour Tous autour de la notion de "temps forts" — événements thématiques (sobriété énergétique, fêtes solidaires, égalité des chances…) qui rassemblent missions, défis, dons et activités internes pour mobiliser les collaborateurs sur des causes concrètes. Design Sprint, idéation collaborative et prototypage Figma sur 2 mois.

User Research Design Sprint Double Diamant Atelier d'idéation UX Writing Wireframes & Prototypage Figma · Miro Notion · Maze Jira
Durée
~2 mois
Discovery → prototype final
Rôle
Product Designer
Squad PM, devs, lead design
Contexte
Plateforme B2B
Engagement RSE & associatif
Stack
Figma · Miro · Notion
Maze · Jira · Slack
Nouvelle plateforme Vendredi pour Tous — page Actualités sur laptop
Méthode & livrables
Une refonte structurée autour des "temps forts" et de l'engagement collectif.
5
Étapes Design Sprint — comprendre, croquer, décider, prototyper, tester. Méthode Google Ventures appliquée à la refonte.
3
Personas RH cibles — directeurs RSE, managers d'équipe, collaborateurs engagés. Trois besoins distincts à concilier.
Composants Figma structurés en design system — cards, calendriers, timelines, dropdowns réutilisables.
01 · Contexte

Une plateforme d'engagement qui peinait à transformer la sensibilisation en action collective.

Vendredi est une scale-up qui aide les entreprises à embarquer leurs collaborateurs dans des actions à impact — missions de bénévolat, défis écologiques, dons à des associations. Notre mission : repenser la plateforme "Vendredi pour Tous" pour faire émerger une nouvelle brique éditoriale, les "temps forts" — des événements thématiques (sobriété énergétique, fêtes solidaires, égalité des chances, journée de la Terre…) qui agrègent missions, défis, webinars et dons sur une période donnée, pour créer un véritable élan collectif entre salariés.

🤷
Pas de vue d'ensemble
Les collaborateurs voyaient des missions et des défis isolés, sans fil rouge éditorial. Aucune notion de "moment fort" qui rassemble une équipe autour d'un sujet sur plusieurs semaines.
📭
Engagement individuel, pas collectif
Chacun s'engageait dans son coin. Pas de visibilité sur ce que faisaient les collègues, pas d'effet d'entraînement, pas de logique de "rejoindre" un mouvement déjà lancé.
🗓️
Calendrier opaque
Pas de visibilité claire sur les événements à venir, leur durée, leurs dates clés. Les RSE managers ne pouvaient pas anticiper la programmation pour leur équipe.
Équipe RSE en réflexion produit
Persona 1
Directeur RSE / Responsable engagement
A besoin d'un outil pour piloter et programmer les temps forts associatifs sur le quarter, mesurer la participation, et donner du sens à l'engagement collectif autour des grandes causes (climat, égalité, solidarité).
Collaborateurs au bureau
Persona 2
Collaborateur "John" · grand public
Veut pouvoir participer simplement, voir ce que font ses collègues, rejoindre un défi en deux clics, retrouver les temps forts qui l'intéressent et s'engager sans friction. Pas de jargon, pas de complexité.
Problématique & objectifs

Comment faire de Vendredi un élan collectif, et plus seulement une bibliothèque d'actions ?

Trois objectifs ont guidé la refonte : structurer l'éditorial, rendre l'engagement social et visible, et donner les outils de pilotage aux RSE managers.

1Éditorial
Structurer le contenu autour des temps forts
Faire émerger une brique éditoriale — un temps fort — qui rassemble webinars, missions, défis, activités internes et dons sur une période et une thématique données.
2Social
Rendre l'engagement collectif visible
Montrer qui dans l'entreprise est passé à l'action — "Marina a candidaté à une mission", "Valentin a relevé un défi" — pour créer un effet d'entraînement.
3Pilotage
Donner aux RH/RSE de la visibilité
Programmer, anticiper et mesurer : un calendrier des temps forts à venir, des KPIs de participation, et des outils pour inviter les collègues.
02 · Design process · Design Sprint

Méthode Google Ventures appliquée — de la compréhension au prototype testable.

Vu la complexité du périmètre (plusieurs personas, refonte navigation + nouvelle brique éditoriale + composants), nous avons appliqué un Design Sprint Google Ventures sur 2 sprints — comprendre, croquer, décider, prototyper, tester — pour aller vite des hypothèses au prototype Figma testable.

JOUR 1
Comprendre
Cartographier les enjeux, partager la connaissance utilisateur, aligner la squad.
JOUR 2
Croquer en solo
Chacun produit ses sketches papier — divergence avant la convergence.
JOUR 3
Décider en collectif
Vote des meilleures idées, storyboard de la solution retenue.
JOUR 4
Prototyper
Maquettes haute-fidélité Figma sur la base du storyboard validé.
JOUR 5
Tester
Tests modérés avec collaborateurs et RSE managers — itérer.
🕵️ Phase exploratoire · User Research

Comprendre comment les collaborateurs s'engagent (ou pas) au sein de leur entreprise.

L'objectif de cette phase : récolter les besoins des deux côtés du miroir — les RSE managers qui programment, et les collaborateurs qui (potentiellement) participent. Nous avons mené entretiens semi-directifs, ateliers parties prenantes côté Vendredi, et audit de l'existant.

8
Entretiens semi-directifs
Avec collaborateurs (utilisateurs et non-utilisateurs) et RSE managers de différentes entreprises clientes.
3
Ateliers parties prenantes
Côté Vendredi — PM, devs, customer success, content — pour partager la connaissance terrain.
1
Audit complet de l'existant
Cartographie des flows, captures, analyse des tickets support et de la data d'usage.
🌱 Sens
5/8 utilisateurs
Donner du sens et un cadre temporel à l'engagement.
« On a plein de missions disponibles toute l'année, mais sans cadre, on ne sait pas par où commencer. Un événement qui dure 3 semaines, c'est plus motivant. »
Nadia · Directrice RSE
👥 Collectif
6/8 utilisateurs
Voir ce que font les collègues, ne pas s'engager seul.
« Si je vois que Marina a déjà candidaté, j'ai plus envie d'y aller aussi. C'est plus simple de rejoindre un mouvement déjà lancé. »
Théo · 28 ans
📅 Visibilité
7/8 utilisateurs
Anticiper les prochains événements et les inscrire au calendrier.
« Il me faut savoir 3 semaines à l'avance ce qui arrive, pour que je puisse le proposer à mon équipe et bloquer les créneaux. »
Lucas · Manager
Analyse de la concurrence · benchmark

Apprendre des références — engagement militant, événementiel social, productivité.

Nous avons regardé trois familles de produits : les ONG qui mobilisent autour de causes (Amnesty), les plateformes événementielles sociales (Facebook Events) et les outils de productivité avec calendrier intégré (Do Space) — pour s'inspirer des bons patterns d'engagement collectif et de programmation.

Engagement militant
Amnesty International
Triptyque "conviction / mission / force du collectif" + CTA forts ("Faire un don", "Agir") visibles à tout moment.
Amnesty International — homepage 'On se bat ensemble'
Événementiel social
Facebook Events
Logique d'événement avec date, lieu, "qui participe", "qui est intéressé" — la visibilité sociale crée l'engagement.
Facebook Events — page d'événement #NousToutes
Productivité & calendrier
Do Space + dashboards modernes
Mise en avant d'un sujet "du moment" + calendrier intégré + popups de rappel — patterns de programmation à transposer.
Do Space — calendrier et dashboard
🧠 Phase d'idéation · sketches & convergence

Croquer en solo, voter en collectif — 6 idées générées, 3 retenues.

Après la Discovery, chaque membre de la squad a produit ses propres sketches papier sur les écrans clés (homepage Actualités, page Temps Forts, fiche événement). Vote silencieux, storyboard collectif, et 3 idées retenues pour le prototypage.

Sketches papier de la phase Croquer du Design Sprint
🌟
1Brique "En ce moment"
Mettre en avant le temps fort actif
Un grand bandeau visuel en haut de la home — image plein cadre, thématique, dates, KPIs (webinars, missions, défis), CTA "Découvrir".
👥
2Activité des collègues
Rendre l'engagement social visible
Un encart "Vos collègues sont passés à l'action" avec photos, noms et phrases courtes — pour créer l'effet d'entraînement.
🗓️
3Programme & calendrier
Donner la roadmap éditoriale
Une timeline visuelle avec les jalons clés du temps fort, et un calendrier compact intégré pour suivre les prochains événements.
🎨 Source d'inspiration
Patterns retenus pour la phase prototypage

Mise en avant d'un sujet phare en haut de la page, popup de rappel des prochaines réunions/missions, système de calendrier/timeline pour les futurs événements, "tâches du jour" — autant de patterns qu'on voulait adapter au domaine de l'engagement associatif.

Inspiration UI — Do Space, dashboard moderne
🧩 Construction du Design System

Composants Figma structurés — pour scaler la refonte au-delà du sprint.

En parallèle des écrans, nous avons posé les fondations d'un mini design system : navigation principale, card mission/événement, dropdown calendrier — chaque composant pensé en variants (état, taille, contexte) et documenté pour la handoff dev.

Composant navigation principale
Navigation principale
5 entrées · sticky en haut
Actualités, Temps forts, Missions, Défis, Dons — la nouvelle architecture qui structure la plateforme. Logo Vendredi à gauche, profil utilisateur à droite.
Composant card mission
Card mission
Photo + participants + favori
Carte mission avec image plein-cadre, nombre de participants en avatar stack, favori en haut à droite, logo association, titre, durée et lieu.
Composant calendrier compact
Calendrier compact
Vue mensuelle avec navigation prev/next, jour courant en cercle, plage du temps fort surlignée en vert mint — utilisée en sidebar de la home.
Solution finale · maquettes haute-fidélité

Une plateforme structurée autour de l'événement collectif.

L'expérience finale articule la home "Actualités" autour du temps fort actif (Sobriété Énergétique, novembre-décembre 2022), avec activité des collègues, prochains temps forts, missions et défis recommandés, et calendrier compact en sidebar. La fiche temps fort détaille missions/défis proposés et un programme jalonné.

L'accueil Actualités, structuré autour du temps fort en cours.

"Hello John !" — un dashboard personnel qui s'ouvre sur le temps fort du moment (image plein-cadre, dates, jalons), suivi de l'activité des collègues, des prochains temps forts, et des missions/défis recommandés.

Bandeau "En ce moment" — image full-bleed, thématique, dates, KPIs (1 webinar · 5 missions · 23 défis · 2 activités internes), CTA "Découvrir".
Activité des collègues — Marina, Valentin, Jonas et leurs actions récentes, avec photos et phrases courtes.
Carrousel temps forts — pictos circulaires colorés (Sobriété, Fêtes Solidaires, Égalité, Genres, Terre), navigation latérale.
KPIs collaborateur — 8 défis réalisés · 4 associations favorites · 3 missions terminées, en haut à droite.
Solution finale — page Actualités Vendredi pour Tous
Page liste des temps forts
Page · Temps Forts
"Donnez du sens à vos actions !"
Page dédiée Temps Forts — bannière éditoriale crème avec illustration, le temps fort en cours mis en avant, puis la grille des "prochains temps forts" (Fêtes Solidaires, Égalité des chances, Journée des droits des femmes, Mondiale de la Terre, Biodiversité, Mois des fiertés…).
Fiche détail d'un temps fort
Fiche · Sobriété énergétique
L'événement, en détail.
Hero plein-cadre, sponsors, dates, KPIs, encart webinar de sensibilisation en surimpression, missions proposées (Don de chaleur, Moulin de Pont Rû…), défis et programme jalonné (29/11, 01/12, 04/12, 08/12).
Détail laptop — vue in-context
Détail · vue laptop
Le bandeau "En ce moment", en contexte.
Vue laptop sur la home Actualités : eyebrow "Environnement et biodiversité", titre "Sobriété Énergétique", enjeu, dates, KPIs et CTA "Découvrir cet événement". L'utilisateur arrive et sait immédiatement ce qui se passe.
Vue laptop alternative
Détail · header & nav
Header personnalisé + KPIs en un coup d'œil.
"Hello John !" + sous-titre engageant + 3 cartes KPIs (défis réalisés, associations favorites, missions terminées) — un repère personnel rassurant avant de plonger dans le contenu éditorial.
03 · Prototype en mouvement

Voir la solution en action.

Démonstration vidéo du parcours Vendredi pour Tous : arrivée sur la home Actualités, plongée dans le temps fort Sobriété Énergétique, exploration des missions et du programme jalonné.

▶ Walkthrough vidéo
Parcours complet Vendredi pour Tous
De la home Actualités à la fiche d'un temps fort — la nouvelle expérience d'engagement collaborateur de bout en bout.
Voir sur YouTube ↗
Conclusion · ce que le projet a apporté

Une nouvelle brique éditoriale, un design system posé, une squad alignée.

Le Design Sprint nous a permis d'aller vite des hypothèses au prototype testable, et de poser les bases d'un design system Figma réutilisable pour la suite des chantiers — toutes les briques (cards, calendrier, navigation, encarts éditoriaux) sont structurées en composants documentés.

🌱
Une nouvelle brique éditoriale
"Temps forts" est désormais une entrée de navigation à part entière, avec sa page liste, sa fiche détail, son intégration dans la home — un fil rouge qui rassemble missions, défis, dons et activités.
👥
Engagement rendu social
L'activité des collègues ("Marina a candidaté…", "Valentin a relevé un défi") est désormais visible sur la home — le moteur d'entraînement identifié en recherche est activé.
🧩
Design system posé
Cards, calendrier, navigation, dropdowns : tous les composants structurants sont en variants Figma — la base pour les prochains chantiers produit.
🤝
Squad alignée par le sprint
Le format Design Sprint a embarqué PM, devs et content sur la même réalité utilisateur — décisions plus rapides, ownership partagé, moins d'aller-retours sur les détails.

Étude de cas Vendredi pour Tous

Discutons de votre prochaine plateforme d'engagement ou refonte produit.

Me contacter →