
Sport · match live · Applications web
Scoreboard
Le match, seconde par seconde
Scroll pour découvrir ↓
01 · Sport · match live
Le score, seconde par seconde
Le match, seconde par seconde. Direction fictive — même niveau de craft que les missions clients sous NDA.
- 01
Buts
Ajoute un but domicile / extérieur — le tableau suit.
- 02
Feed
Les événements s’empilent comme un ticker.
- 03
Tension
Idéal pour une app fan ou une page club.
01b · Technique
Fiche technique
Stack, mise en ligne et mon rôle sur ce build — pour recruteurs et tech leads.
- Technologies
- Next.js
- TypeScript
- React
- Tailwind CSS
- Librairies & outils
- Framer Motion
- local state
- Déploiement
Démo /play — parcours produit sans API réelle
- Rôle
Produit · UI · flux métier
- Conditions
App démo interactive — intention produit claire
02 · Dans le produit
Un scroll, un écran
Chaque section se cale à l’écran — continue après le dernier pour revenir au récit.

Sport · match live
Le score, seconde par seconde
+12 kg
Squat
2:14
Hyrox
8 sem.
Cycle
47
Sessions
WEEK 01–02
Buts
Ajoute un but domicile / extérieur — le tableau suit.
WEEK 03–04
Feed
Les événements s’empilent comme un ticker.
WEEK 05–06
Tension
Idéal pour une app fan ou une page club.
Fais bouger le score
Match fictif · boutons but.
Suivre le scoreRetour au récit
Tu as quitté les écrans démo — ensuite : tester, puis les notes de craft.
03 · Clubs & médias
Le match tient les gens sur la page
“Les supporters restent pour le feed, pas juste le score.”
“On a prototypé l’écran TV en une après-midi.”
04 · Live
Fais bouger le score
Match fictif · boutons but.
- →Hero + sections sous la fold (pas juste une accroche)
- →Hiérarchie visuelle et CTA principal
- →Densité d’info vs lisibilité
- · Coup d’envoi
Démo locale — aucune donnée n’est envoyée.
05 · Même famille
D’autres directions du même type — pour comparer densités et ambiances.
06 · Ce qu’on regarde
- 01Hero + sections sous la fold (pas juste une accroche)
- 02Hiérarchie visuelle et CTA principal
- 03Densité d’info vs lisibilité
- 04États interactifs (hover, sélection, feedback)



