← Retour à l'atelier
Web App · Full-Stack 2026 · ProjInt HEIG-VD · Équipe de 6

Blood
League

Transformer les collectes de sang en entreprise en une compétition positive : une plateforme web conçue pour les HUG et le CTS Genève.

EN LIGNE · blood-league.ch Blood League, HUG × CTS Genève, projet intégré de l'équipe Baobab, juin 2026
Mandant
Hôpitaux Universitaires de Genève
Centre de Transfusion Sanguine
Rôle
Product Owner
Front-end · UX du checker
Stack
Laravel · Vue.js · MySQL
Git · Infomaniak
Période
Mai – juin 2026
4 sprints Scrum
Le brief

30 % d'inscrits
qui ne peuvent pas donner.

Les collectes de sang en entreprise pèsent environ 10 % des dons annuels des HUG, un chiffre qui stagne depuis la disparition du Trophée de la générosité en 2010. Et sur le terrain, trois personnes sur dix s'inscrivent sans pouvoir donner le jour J, faute d'avoir vérifié leur éligibilité en amont : des créneaux bloqués, du personnel médical mobilisé pour rien.

Le mandat du CTS : relancer le Trophée, créer un Label RSE pour les entreprises partenaires, et trouver un moyen ludique de réduire ce delta. En analysant le brief, un quatrième problème est apparu : aucun kit de communication, chaque entreprise repart de zéro pour annoncer sa collecte.

Notre réponse renverse la logique. Blood League ne récompense pas le volume brut de dons mais le taux d'efficacité, soit le ratio entre inscrits et donneurs réels. Une PME de 30 personnes bien organisée peut finir devant une banque de 500. Réduire le delta devient un avantage compétitif.

30%
De delta à réduire
16
Questions dans le checker
102pts
Score max par saison
3
Labels · Blood, Gold, Legend
Le concept
01

La ligue : chaque entreprise est une équipe

Chaque employé est un joueur, chaque don un point marqué. La ligue tourne toute l'année : les entreprises accumulent des points à chaque collecte selon quatre sous-scores (efficacité, fréquence, taux de donneurs et supporters) et progressent dans trois divisions. Le classement exact n'est jamais public pendant la saison : chacun voit sa propre progression, pas celle des autres.

Championnat4 sous-scores3 divisions
La page d'accueil de Blood League : les trois piliers : championnat, label RSE et cérémonie
02

Les labels : personne ne repart les mains vides

En fin de saison, toutes les entreprises participantes reçoivent un label, sans exception : Blood League Label pour celles qui jouent le jeu, Gold pour les 35 % suivants, Legend pour le top 15 %. Téléchargeable en haute résolution, le label se glisse dans un rapport RSE, une offre d'emploi ou un post LinkedIn. Enfin quelque chose de concret à montrer.

Label RSEAutomatiqueInclusif
Les trois niveaux de labels Blood League : Label, Gold et Legend
03

Les Awards : le Trophée, remis au goût du jour

Une cérémonie annuelle, le seul moment où les classements sont révélés. Quatre médailles saluent des performances précises : The Climber pour la progression, The Flood pour la mobilisation, The Pulse pour les supporters, The New Vein pour la meilleure nouvelle venue. The Golden Heart, prix du jury des HUG, succède au Trophée de la générosité.

Cérémonie5 médaillesPrix du jury
Les Blood League Awards : médailles The Flood, The Pulse, The Climber, The New Vein et The Golden Heart
Le parcours employé
04

Le lien co-brandé : une page qui lui ressemble

Chaque entreprise partenaire reçoit un lien unique généré par le CTS, vers une version du site à ses couleurs, avec son logo et son nom. L'employé y voit le score de son équipe, la date de la prochaine collecte, le mur des joueurs anonymisé, et un seul bouton : « Avant de rejoindre l'équipe, vérifie si tu peux jouer. » Il n'y a pas d'autre chemin.

Co-brandingLien uniqueMur des joueurs
Capture à venir
Page co-brandée
05

Le checker : seize questions, zéro jargon

Le cœur du dispositif et la décision de conception la plus importante : impossible de réserver sans passer par le checker. Une mascotte guide l'employé à travers seize questions posées une par une, en mode conversationnel (âge, poids, état de santé du jour, dernier don, voyage récent, médicaments), chaque critère médical reformulé en langage courant. Mobile-first, parce que c'est là que le lien s'ouvre, entre deux réunions.

ObligatoireConversationnelMobile-firstLPD
Capture à venir
Checker d'éligibilité
06

Joueur ou Supporter : aucune zone grise

Éligible ? Animation de célébration, le bouton de rendez-vous se débloque : « Tu es dans l'équipe ! » Non éligible ? Pas de message de refus froid comme chez tous les concurrents benchmarkés, mais un rôle : Supporter. Ambassadeur le jour J, relais du kit sur ses réseaux : ses contributions comptent dans le score de son entreprise. L'innovation dont l'équipe est la plus fière.

Deux issuesRôle SupporterRappel J-48h
Capture à venir
Écrans Joueur / Supporter
07

Le leaderboard : la preuve sociale

La page publique affiche les entreprises engagées avec leur label et leur division, filtrables par niveau. Une entreprise qui entend parler de Blood League lors d'un événement RSE peut vérifier par elle-même qui joue déjà : la vitrine fait le travail commercial à la place du CTS. Le score exact, lui, reste confidentiel.

Vitrine publiqueFiltres par labelSaison 2026
Le leaderboard public : entreprises labellisées, filtrables par Label, Gold et Legend
Côté régie

Le back-office
du CTS.

L'administrateur crée les profils entreprises, génère les liens co-brandés, ouvre et clôture les collectes, valide le nombre réel de dons après chaque passage de l'équipe médicale, et attribue les labels en fin de saison. Trois niveaux d'accès : admin, éditeur, lecteur.

Le dashboard suit six KPIs définis avec le mandant (effectif, résultats Joueurs et Supporters, partages, prises de rendez-vous, dons effectifs) et en déduit le delta résiduel, le taux d'efficacité et le score de division. Pas de Google Analytics : chaque événement est enregistré par Laravel directement en base, sans donnée personnelle, conformément à la LPD suisse.

Dashboard KPIsLiens co-brandésTracking maison3 niveaux d'accès
Capture à venir
Dashboard admin
Ma contribution

Product Owner,
et les mains dans le front.

01

Product Owner

Vision produit, priorisation du backlog et lien entre les décisions de conception et les attentes du mandant. Mise en place et tenue du Jira : épiques, stories, story points, burndown par sprint.

02

UX du checker

Mindmap du formulaire et du checker d'éligibilité, zonings desktop et mobile, puis maquettes complètes du parcours : chaque question, chaque état, les deux écrans de résultat.

03

Front-end Vue.js

Développement des interfaces réactives sur le back-end Laravel : pages publiques, checker conversationnel et composants du design system, livrés par sprints d'une semaine.

04

Seeder de démo

Jeu de données réaliste qui simule une saison en cours (PME très efficace, grand groupe au delta élevé, nouvelle venue en progression) pour rendre le dashboard et les KPIs lisibles en démo.

L'équipe Baobab
La soutenance

Le pitch, slide par slide.

La présentation finale défendue le 12 juin 2026 devant l'équipe pédagogique. Naviguez avec les flèches.

← Suite Retour à l'atelier