Le papierThe paper
Rendre l'attention par la friction choisieGiving attention back, through chosen friction
Une expérience utilisateur (UX) calme pour enfants, testée en classeA calm user experience (UX) for children, tested in class
Le problèmeThe problem
Enfant, je perdais mes feuilles d'exercices à une vitesse qui tenait de la performance artistique. Devenu enseignant, en 2021, j'en ai tiré la seule conclusion raisonnable : tous mes exercices vivraient sur un site, et mes élèves n'auraient même pas l'occasion de perdre le papier.As a child, I lost my exercise sheets at a rate that bordered on performance art. When I became a teacher, in 2021, I drew the only reasonable conclusion: all my exercises would live on a website, and my students would never even get the chance to lose the paper.
La raison était modeste, presque comique. Elle m'a appris deux choses que je ne cherchais pas. La première : la perte ne disparaît pas, elle migre. Mes élèves ne perdent plus de feuilles ; ils perdent leurs fichiers dans leur Drive. Un site d'exercices prend alors un rôle que je n'avais pas anticipé : il devient le point de repère, l'endroit qui ne bouge pas quand tout le reste se perd. La fiche est toujours là, au même endroit, avec les mêmes liens au même endroit ; l'élève qui a tout égaré sait où revenir. Une partie de ce que ce texte décrit (des repères immuables, des sources rassemblées en bas de page, l'outil impossible à rater) découle de cette fonction de repère.The reason was modest, almost comic. It taught me two things I was not looking for. The first: loss does not disappear, it migrates. My students no longer lose sheets; they lose their files in their Drive. An exercise website then takes on a role I had not anticipated: it becomes the landmark, the one place that does not move when everything else gets lost. The sheet is always there, in the same place, with the same links in the same place; the student who has misplaced everything knows where to come back to. Part of what this text describes (fixed reference points, sources gathered at the bottom of the page, a tool link impossible to miss) follows from this landmark function.
La seconde leçon est le sujet de ce texte. Le papier avait un défaut : il se perdait. L'écran corrige ce défaut et en introduit un autre, que le papier n'a jamais eu : une feuille d'exercices ne crie pas, ne défile pas toute seule, n'envoie pas de notifications, ne propose pas la feuille suivante en lecture automatique. En déplaçant mes exercices vers le support qui ne se perd pas, je les installais sur le support qui capture l'attention. Et quand j'ai ouvert les livres qui auraient dû m'aider, j'ai trouvé l'inverse de ce que je cherchais : des méthodes pour capturer encore plus.The second lesson is the subject of this text. Paper had a flaw: it got lost. The screen fixes that flaw and introduces another one that paper never had: an exercise sheet does not shout, does not scroll by itself, does not send notifications, does not autoplay the next sheet. By moving my exercises to the medium that does not get lost, I was installing them on the medium that captures attention. And when I opened the books that should have helped me, I found the opposite of what I was looking for: methods to capture even more.
Ce n'est pas faute de littérature. Le champ « UX pour enfants » existe et il est mûr. Le Nielsen Norman Group (NN/g, dans la suite de ce texte) publie 156 guidelines issues de tests avec de vrais enfants ; l'industrie a ses manuels (Cantuni, Gelman) ; les cadres éthiques ont leurs principes (D4CR × UNICEF) et leurs lois (ICO Age Appropriate Design Code, 5Rights). Mais presque toute cette littérature partage un présupposé : l'engagement y est une mesure de succès, et l'on y distingue rarement l'engagement qui mesure l'apprentissage de celui qui mesure le temps passé. On y apprend à retenir l'enfant, à le faire revenir, à réduire chaque friction entre lui et le produit. Même les cadres éthiques, précieux, régulent la capture de l'attention : ils en limitent les excès, ils n'en inversent pas le sens. Ce n'est pas leur rôle ; c'est celui de qui conçoit. Quant à la critique, elle ne manque pas : les « dark patterns » visant les enfants sont devenus un front de recherche à part entière, jusque dans les apps d'apprentissage, et la Federal Trade Commission américaine consacrait en juin 2025 un atelier entier à « l'économie de l'attention » et à ce qu'elle fait aux enfants. Dénoncer n'est plus une niche. Construire l'inverse, si : un site conçu pour ne pas capturer.It is not for lack of literature. The field of "UX for children" exists and it is mature. The Nielsen Norman Group (NN/g, in the rest of this text) publishes 156 guidelines drawn from tests with real children; the industry has its handbooks (Cantuni, Gelman); the ethical frameworks have their principles (D4CR × UNICEF) and their laws (the ICO Age Appropriate Design Code, 5Rights). But almost all of this literature shares one premise: engagement is a measure of success, and it rarely distinguishes the engagement that measures learning from the engagement that measures time spent. It teaches how to keep the child, how to bring them back, how to remove every friction between them and the product. Even the ethical frameworks, precious as they are, regulate the capture of attention: they limit its excesses, they do not reverse its direction. That is not their job; it is the job of whoever designs. As for criticism, there is no shortage of it: "dark patterns" aimed at children have become a research front in their own right, learning apps included, and in June 2025 the US Federal Trade Commission devoted an entire workshop to "the attention economy" and what it does to children. Denouncing is no longer a niche. Building the opposite still is: a site designed not to capture.
Ce texte n'a pas d'autre enjeu : un site pédagogique réel, en ligne, utilisé par de vrais élèves de 8 à 15 ans, conçu pour garder du papier son calme et du web sa permanence. Une interface dont le but n'est pas de prendre l'attention, mais de la rendre.This text has no other stake: a real educational website, online, used by real students aged 8 to 15, designed to keep the calm of paper and the permanence of the web. An interface whose purpose is not to take attention, but to give it back.
Quatre choses y sont, à notre connaissance, peu traitées : la conception calme d'un simple site d'exercices (la littérature vise les apps, les jeux et le commerce) ; des mécanismes qui rendent l'attention, où ce qui accroche l'œil se retire dès que la lecture commence ; la citation des sources traitée comme un problème de design à part entière ; et le tout documenté depuis une vraie classe, par un enseignant qui peut tester chaque hypothèse sur ses propres élèves.Four things there are, to our knowledge, little addressed: the calm design of a plain exercise website (the literature targets apps, games and commerce); mechanisms that give attention back, where what catches the eye withdraws as soon as reading begins; source citation treated as a design problem in its own right; and all of it documented from a real classroom, by a teacher who can test each hypothesis on his own students.
La positionThe position
Un site pour enfants qui rend l'attention au lieu de la capturer.A website for children that gives attention back instead of capturing it.
Rendre l'attention, c'est la laisser à l'enfant pour ce qu'il est venu faire : lire la consigne, chercher, essayer. L'interface ne la lui prend que le temps de l'aider, puis la lui restitue.Giving attention back means leaving it to the child for what they came to do: read the instructions, search, try. The interface takes it only for as long as it takes to help, then hands it back.
Trois refus. Pas de gamification par points, badges ou séries. Pas de mécaniques de captation : autoplay, défilement infini, notifications. Pas d'interface qui crie : l'énergie visuelle vient des travaux des élèves, jamais de la page elle-même.Three refusals. No gamification through points, badges or streaks. No capture mechanics: autoplay, infinite scroll, notifications. No interface that shouts: the visual energy comes from the students' work, never from the page itself.
Trois affirmations. Le calme est un cadeau fait au lecteur enfant. La curiosité est récompensée, par des surprises que rien n'annonce. Citer ses sources est un geste qui s'apprend, et l'interface peut l'enseigner.Three affirmations. Calm is a gift to the child reader. Curiosity is rewarded, with surprises that nothing announces. Citing your sources is a gesture that can be learned, and the interface can teach it.
Ces six phrases ne sont pas un manifeste écrit avant de commencer : elles ont été extraites, décision après décision, d'un site en train de se reconstruire. Chacune correspond à des mécanismes précis, décrits plus bas et consignés avec leur date dans un carnet de conception : ce carnet distingue, tout au long du projet, ce qui a été observé de ce qui a seulement été supposé.These six sentences are not a manifesto written before starting: they were extracted, decision after decision, from a website in the process of rebuilding itself. Each corresponds to precise mechanisms, described below and recorded with their date in a design notebook: throughout the project, this notebook separates what has been observed from what has merely been assumed.
La lignée et le nœudThe lineage and the knot
La position s'inscrit dans une lignée qui traverse cinq mondes : la psychologie de l'enfant à Genève en 1966, l'informatique au MIT en 1980, la recherche au Xerox PARC en 1996, les tests d'utilisabilité en 2019, et les droits de l'enfant en 2022.The position belongs to a lineage that runs through five worlds: child psychology in Geneva in 1966, computing at MIT in 1980, research at Xerox PARC in 1996, usability testing in 2019, and children's rights in 2022.
Piaget et Inhelder d'abord : l'enfant construit ses structures mentales par l'action, par stades ; rien n'entre dans sa pensée sans assimilation active. Papert, qui travailla cinq ans dans son équipe à Genève, en tire le constructionnisme : donner à l'enfant des objets-à-penser, faire que l'enfant programme la machine et non l'inverse. Weiser et Seely Brown, à Xerox PARC, fondent le mécanisme qui nous manquait : une technologie calme engage à la fois le centre et la périphérie de l'attention, et circule entre les deux ; elle offre sans exiger. Le Nielsen Norman Group apporte la contrainte de réalité : des tests avec 125 enfants, des tranches d'âge étroites, et ce résultat contre-intuitif : on croit que les enfants ont besoin d'interfaces à part, or les conventions standard, celles des adultes, les aident aussi. D4CR et l'UNICEF, enfin, formulent le cadre en termes de droits de l'enfant : l'enfant créateur, pas consommateur.Piaget and Inhelder first: the child builds their mental structures through action, in stages; nothing enters their thinking without active assimilation. Papert, who worked five years in Piaget's team in Geneva, draws constructionism from it: give the child objects-to-think-with, have the child program the machine and not the other way round. Weiser and Seely Brown, at Xerox PARC, lay down the mechanism we were missing: a calm technology engages both the centre and the periphery of attention, and moves between the two; it offers without demanding. The Nielsen Norman Group brings the reality check: tests with 125 children, narrow age bands, and this counter-intuitive result: we assume children need interfaces of their own, yet the standard conventions, the adult ones, help them too. D4CR and UNICEF, finally, frame it in terms of children's rights: the child as creator, not consumer.
Ces textes ne s'alignent pas sans résistance, et c'est précisément ce nœud, l'apparente contradiction entre ces textes, que ce papier veut penser plutôt que cacher. NN/g optimise l'effort minimal : chaque friction est un défaut. Papert valorise la friction féconde : se tromper et débuguer, c'est apprendre. Piaget fonde les deux : le progrès naît d'un déséquilibre ré-équilibré, donc ni l'absence d'obstacle ni l'obstacle arbitraire. Notre synthèse tient en deux mots : friction choisie. Tout se concilie si la friction est volontaire (l'enfant peut toujours l'ignorer), signifiante (elle dit quelque chose de vrai), et jamais bloquante (le chemin principal reste lisse, au standard NN/g). Les mécanismes de la section 5 sont des applications de cette règle.These texts do not line up without resistance, and it is precisely this knot, the apparent contradiction between them, that this paper wants to think through rather than hide. NN/g optimises for minimal effort: every friction is a defect. Papert values fertile friction: getting it wrong and debugging is learning. Piaget grounds both: progress is born of a disequilibrium re-equilibrated, so neither the absence of obstacles nor arbitrary obstacles. Our synthesis holds in two words: chosen friction. Everything reconciles if the friction is voluntary (the child can always ignore it), meaningful (it says something true), and never blocking (the main path stays smooth, to NN/g's standard). The mechanisms in section 5 are applications of this rule.
Un détail géographique n'est pas un hasard : Piaget a pensé l'enfant à Genève, et le site s'adresse aujourd'hui aux petits-enfants scolaires de cette même ville. La lignée revient à son point de départ.A geographical detail is no accident: Piaget thought about the child in Geneva, and the site now addresses the schoolchildren of that same city. The lineage returns to its starting point.
Le terrain et l'instrumentThe field and the instrument
Le terrain est un site réel : discoveryclubdec.ch, le site d'un club de découverte des technologies dans une école internationale bilingue. Le site existe depuis 2021, ma première année d'enseignement ; la version décrite dans ce texte, mise en ligne en août 2026, en est la refonte complète, distillée de cinq ans passés à regarder, chaque semaine, de vrais élèves se servir de son prédécesseur. Une grille d'exercices à choisir librement (création d'images, pixels, réseaux, motifs de la nature, jeux, recherche inversée d'images), chaque exercice tenant sur une fiche : mission, parties, étapes, outil, sources. Gratuit, sans compte, sans publicité, bilingue français-anglais. Le public va de la 5P à la 12P du système scolaire suisse, environ 8 à 15 ans : une tranche qui chevauche, chez Piaget, le passage de la pensée concrète (l'enfant raisonne sur ce qu'il voit et manipule) à la pensée formelle (l'adolescent raisonne sur des idées, des hypothèses). Autrement dit : deux façons de penser, servies par un seul et même site, sans version « petits » ni version « grands ».The field is a real website: discoveryclubdec.ch, the site of a technology discovery club in a bilingual international school. The site has existed since 2021, my first year of teaching; the version described in this text, put online in August 2026, is its complete redesign, distilled from five years spent watching, week after week, real students use its predecessor. A grid of exercises to choose from freely (image making, pixels, networks, patterns in nature, games, reverse image search), each exercise fitting on one sheet: mission, parts, steps, tool, sources. Free, no account, no advertising, bilingual French-English. The audience runs from 5P to 12P in the Swiss school system, roughly 8 to 15 years old: a range that straddles, in Piaget's terms, the passage from concrete thinking (the child reasons about what they see and handle) to formal thinking (the adolescent reasons about ideas, hypotheses). In other words: two ways of thinking, served by one and the same site, with no "little ones" version and no "big ones" version.
L'instrument de mesure est assumé dans sa singularité : le jugement d'un enseignant en exercice, en situation de classe, formé par des années de pratique dans trois écoles privées genevoises. Pas de laboratoire, pas de panel, pas d'eye-tracking. À partir de cette rentrée, cet instrument suit un protocole d'observation léger et répétable : des tâches types (« ouvre l'exercice et dis-moi ce qu'il faut faire », « trouve le lien de l'outil », et une semaine plus tard « retrouve-le »), l'observation sans aide, et une note prise sur le moment, avec sa date : temps, hésitations, questions, gestes. Ce qui précède, les cinq années d'usage du site précédent, n'a pas eu ce protocole ; c'est de l'expérience de prof, pas de la mesure, et la section 8 y revient. Une règle tient tout le dispositif : un principe de conception reste une hypothèse tant qu'une observation de classe, notée le jour même, ne l'a pas confirmé ou contredit. Le présent texte applique cette règle à lui-même : la section 7 attend la classe.The measuring instrument is assumed in its singularity: the judgement of a practising teacher, in a classroom situation, shaped by years of practice in three private schools in Geneva. No laboratory, no panel, no eye-tracking. From this school year on, that instrument follows a light, repeatable observation protocol: standard tasks ("open the exercise and tell me what you have to do", "find the tool link", and a week later "find it again"), observation without helping, and a note taken on the spot, with its date: time, hesitations, questions, gestures. What came before, the five years of use of the previous site, did not have this protocol; that is teaching experience, not measurement, and section 8 comes back to it. One rule holds the whole apparatus together: a design principle remains a hypothesis until a classroom observation, noted the same day, has confirmed or contradicted it. This text applies the rule to itself: section 7 is waiting for the classroom.
C'est un petit instrument. C'est aussi un instrument rare : la littérature du domaine est écrite par des chercheurs qui empruntent des enfants pour une session de test ; celle-ci s'écrit depuis une salle où les mêmes élèves reviennent chaque semaine depuis cinq ans, avec un enseignant qui peut reformuler l'hypothèse le soir et la rééprouver le matin.It is a small instrument. It is also a rare one: the literature of the field is written by researchers who borrow children for a test session; this one is written from a room where the same students have come back every week for five years, with a teacher who can reformulate the hypothesis in the evening and test it again in the morning.
Les principes, en cinq gestesThe principles, in five gestures
Le carnet de conception présenté à la section 2 compte treize principes, chacun avec sa date et son statut (supposé ou observé). Le détail vit dans le carnet ; les regrouper en cinq gestes suffit ici.The design notebook introduced in section 2 holds thirteen principles, each with its date and its status (assumed or observed). The detail lives in the notebook; grouping them into five gestures is enough here.
5.1 Se taireKeeping quiet
Par page, un seul élément a droit au volume maximal ; tout le reste se tait : filets fins, gras rares, accent rare. Sur une fiche d'exercice, cet élément est un bandeau défilant qui porte l'accroche. Et c'est là que se joue le mécanisme central du site : le bandeau défile à l'arrivée, puis décélère et s'arrête au premier scroll, en environ deux secondes et demie. Quand la lecture commence, la page se tait. L'accroche est un service ; la distraction pendant la consigne n'en est pas un. C'est, à petite échelle, le principe de Weiser et Brown : une chose peut être au centre de l'attention un instant, puis glisser en périphérie sans disparaître. Ici, dans un bandeau de fiche d'exercice pour enfants.Per page, one element alone is allowed full volume; everything else keeps quiet: thin rules, rare bold, rare accent. On an exercise sheet, that element is a scrolling band that carries the hook. And this is where the site's central mechanism plays out: the band scrolls on arrival, then slows down and stops at the first scroll, in about two and a half seconds. When reading begins, the page falls silent. The hook is a service; distraction during the instructions is not. It is, on a small scale, Weiser and Brown's principle: a thing can be at the centre of attention for a moment, then slide to the periphery without disappearing. Here, in a band on an exercise sheet for children.
La forme entière suit ce que les graphistes appellent le style suisse, né à Bâle et Zurich dans les années 1950 et choisi ici pour ce qu'il fait, pas pour d'où il vient : une grille stricte, une seule famille de caractères sans empattement, du blanc, du noir, et un accent doux (un bleu choisi pour le public enfant, décliné en deux tons dont le plus sombre garantit le contraste AA sur le petit texte). L'énergie visuelle vient des images, en couleur : travaux d'élèves, couvertures d'exercices. L'interface, elle, ne crie jamais.The whole form follows what graphic designers call the Swiss style, born in Basel and Zurich in the 1950s and chosen here for what it does, not for where it comes from: a strict grid, a single sans-serif typeface family, white, black, and a soft accent (a blue chosen for a young audience, in two shades, the darker of which guarantees AA contrast on small text). The visual energy comes from the images, in colour: students' work, exercise covers. The interface itself never shouts.
5.2 Récompenser la curiositéRewarding curiosity
Le site cache des surprises qui ne s'activent que si on les cherche. Trois lois les gouvernent, aucune n'étant négociable. Rien ne les signale : la page est identique au pixel près pour qui ne cherche pas. Elles disent quelque chose de vrai sur la page : jamais un gag gratuit. Elles ne bloquent jamais : purement optionnelles, désactivées d'elles-mêmes pour qui a demandé à son appareil de réduire les animations, et le contenu reste entier sans elles.The site hides surprises that only activate if you look for them. Three laws govern them, none negotiable. Nothing signals them: the page is identical to the pixel for whoever is not looking. They say something true about the page: never a gratuitous gag. They never block: purely optional, switched off by themselves for anyone who has asked their device to reduce animations, and the content stays whole without them.
L'exemple fondateur est sur la page d'accueil. Le titre du site, « Discovery Club Dec », y est écrit en très grandes capitales. Si l'on passe la souris dessus, chaque lettre survolée saute et devient, un instant, un glyphe, l'un des petits signes typographiques (░ ▒ ▓ ♪ ✱) qui servent d'alphabet décoratif au site, dans ses bandeaux et ses couvertures, puis redevient une lettre. Rien ne l'annonce ; c'est un jeu de rien, mais il dit quelque chose de vrai : même le titre est fait de la matière du site. Autre exemple, plus littéral. La fiche consacrée à Internet explique aux élèves que le réseau mondial passe par des câbles posés au fond des océans. Sous la phrase de mission, en haut de la fiche, court un simple trait fin, comme un soulignement. Si l'on passe la souris dessus, ce trait gonfle jusqu'à sa taille réelle, deux centimètres, gros comme un tuyau d'arrosage, et une légende apparaît : c'est, à peu près, la vraie taille d'un câble d'Internet. Le sujet de la fiche est de rendre tangible l'intangible ; la récompense le fait littéralement. Troisième exemple : la fiche qui enseigne à zoomer une image jusqu'à en voir les pixels. L'élève qui a l'idée d'appliquer le même geste à la page elle-même, de zoomer la fiche, découvre une ligne : « oui, ici aussi : cette page n'est faite que de carrés. »The founding example is on the home page. The site's title, "Discovery Club Dec", is set there in very large capitals. If you move the mouse over it, each letter you pass jumps and becomes, for an instant, a glyph, one of the small typographic signs (░ ▒ ▓ ♪ ✱) that serve as the site's decorative alphabet, in its bands and its covers, then becomes a letter again. Nothing announces it; it is a game of nothing, but it says something true: even the title is made of the site's own material. Another example, more literal. The sheet about the Internet explains to students that the worldwide network runs through cables laid on the ocean floor. Under the mission sentence, at the top of the sheet, runs a plain thin line, like an underline. If you move the mouse over it, the line swells to its real size, two centimetres, as thick as a garden hose, and a caption appears: this is, roughly, the real size of an Internet cable. The subject of the sheet is making the intangible tangible; the reward does it literally. A third example: the sheet that teaches how to zoom into an image until you see its pixels. The student who has the idea of applying the same gesture to the page itself, of zooming the sheet, discovers a line: "yes, here too: this page is made of nothing but squares."
Une quinzaine de récompenses sont en place, réparties en onze familles de gestes : lettres qui se transforment, vide qui se peuple, glyphe qui se répète, image qui reçoit un intrus, sélection de texte, glisser-déposer, geste tenu, double-clic, zoom, geste circulaire, formule tapée au clavier. Chacune est consignée dans un registre, une simple liste : quel geste, sur quelle page, à quel endroit. Ce registre s'est révélé aussi important que les récompenses elles-mêmes. Dès qu'un même geste au même endroit s'est trouvé deux fois dans la liste, le danger était visible : le geste devenait une habitude du site, donc quelque chose qu'on s'attend à trouver, donc signalé, donc mort. Le registre sert à voir venir ce moment.Some fifteen rewards are in place, spread over eleven families of gestures: letters that transform, emptiness that fills, a glyph that repeats, an image that receives an intruder, text selection, drag and drop, press and hold, double-click, zoom, circular motion, a formula typed on the keyboard. Each is recorded in a register, a simple list: which gesture, on which page, in which spot. This register turned out to matter as much as the rewards themselves. As soon as the same gesture in the same spot appeared twice in the list, the danger was visible: the gesture was becoming a habit of the site, hence something one expects to find, hence signalled, hence dead. The register exists to see that moment coming.
Restait un paradoxe d'inclusion : des récompenses invisibles par définition ne profitent qu'aux enfants qui explorent spontanément. La résolution est venue d'un modèle d'album jeunesse : une page du site, la carte au trésor, liste les trois lois en langage d'enfant et donne un indice par récompense, jamais le geste exact ni la solution. On sait que Charlie est dans l'image ; on ne sait pas où. La chasse devient inclusive sans qu'aucune récompense soit signalée sur sa propre page, et elle fait pratiquer, en passant, tout le vocabulaire des gestes de l'informatique : survoler, sélectionner, glisser, maintenir, zoomer. De la littératie numérique, le savoir lire et écrire de l'écran, déguisée en jeu de cherche-et-trouve.There remained a paradox of inclusion: rewards that are invisible by definition benefit only the children who explore spontaneously. The resolution came from a children's picture book model: one page of the site, the treasure map, lists the three laws in a child's language and gives one clue per reward, never the exact gesture nor the solution. You know Wally is in the picture; you do not know where. The hunt becomes inclusive without any reward being signalled on its own page, and along the way it drills the whole vocabulary of computing gestures: hover, select, drag, hold, zoom. Digital literacy, the reading and writing of the screen, disguised as a game of seek-and-find.
5.3 Enseigner par l'interfaceTeaching through the interface
Le grand enjeu pédagogique du site est la citation des sources, et l'interface l'enseigne structurellement. Chaque fiche rassemble tous ses liens dans un bloc Sources en bas de page, seul bloc à l'en-tête d'accent plein, dans l'ordre d'apparition des éléments dans la page ; une bibliothèque globale les agrège par thème. Ce n'est pas un appendice : les élèves reviennent sur les fiches précisément pour les liens, et le bloc est leur repère fixe. La règle est mécanique, donc apprenable : cite tout, dans l'ordre, au même endroit.The site's great pedagogical stake is source citation, and the interface teaches it structurally. Each sheet gathers all its links in a Sources block at the bottom of the page, the only block with a solid accent header, in the order in which the elements appear on the page; a global library aggregates them by theme. It is not an appendix: students come back to the sheets precisely for the links, and the block is their fixed landmark. The rule is mechanical, hence learnable: cite everything, in order, in the same place.
Le reste de la fiche suit le même principe : la forme sert l'usage en classe. Chaque exercice est découpé en parties (« Partie 1 : le pixel », « Partie 2 : le selfie illisible »), et chaque partie en étapes numérotées qui repartent à un. Ce détail a une raison : en classe, « partie 2, étape 1 » se dicte à voix haute et tout le monde retrouve l'endroit. Quand une étape demande d'ouvrir un outil en ligne, le lien vers cet outil est une barre sur toute la largeur de la page, placée juste après l'étape qui en a besoin, impossible à rater. Et le jour où une fiche s'est mise à contenir à la fois une petite leçon et une vingtaine de tutoriels vidéo, la page a été coupée en deux formes différentes : la leçon en trois lignes qui se lisent dans l'ordre, les tutoriels en rayons de bibliothèque où l'on se sert. On suit une méthode ; on parcourt un rayon. Les mêler, c'est noyer l'une dans l'autre.The rest of the sheet follows the same principle: form serves classroom use. Each exercise is cut into parts ("Part 1: the pixel", "Part 2: the unreadable selfie"), and each part into numbered steps that start again at one. This detail has a reason: in class, "part 2, step 1" can be dictated aloud and everyone finds the spot. When a step requires opening an online tool, the link to that tool is a bar across the full width of the page, placed right after the step that needs it, impossible to miss. And the day a sheet came to hold both a short lesson and some twenty video tutorials, the page was cut into two different forms: the lesson in three lines that are read in order, the tutorials on library shelves where you help yourself. You follow a method; you browse a shelf. Mixing them drowns one in the other.
5.4 N'exclure personneLeaving no one out
« Inclusif » n'est pas ici un mot de communication : c'est une liste de contrôle mesurée par script, recochée à chaque chantier. Contrastes WCAG vérifiés, texte alternatif descriptif sur toute image porteuse de contenu (l'image d'une fiche est souvent la matière enseignée : la mosaïque de Pompéi, le premier GIF de l'histoire), focus visible, mouvement réduit respecté, page lisible sans JavaScript, poids de page contenu parce que les vieux appareils et les connexions lentes sont un public. Gratuit, sans compte, sans publicité. Le premier audit a eu des conséquences concrètes : l'accent bleu, mesuré sous le seuil de contraste pour le petit texte, a été dédoublé en deux tons ; le GIF d'accueil est passé de 5,9 à 0,9 Mo."Inclusive" is not a communication word here: it is a checklist measured by script and re-ticked at every stage of work. WCAG contrasts checked, descriptive alt text on every image that carries content (the image on a sheet is often the very material being taught: the Pompeii mosaic, the first GIF in history), visible focus, reduced motion respected, page readable without JavaScript, page weight kept down because old devices and slow connections are an audience. Free, no account, no advertising. The first audit had concrete consequences: the blue accent, measured below the contrast threshold for small text, was split into two shades; the home page GIF went from 5.9 to 0.9 MB.
L'inclusion a aussi une face développementale. Servir des enfants de 8 ans et des adolescents de 15 ans sur un même site, ce n'est pas servir des âges différents : c'est servir deux modes de pensée, concret et formel, et la question de savoir si un même gabarit peut porter les deux est traitée comme ce qu'elle est : une hypothèse à éprouver, pas un acquis.Inclusion also has a developmental face. Serving 8-year-old children and 15-year-old adolescents on the same site is not serving different ages: it is serving two modes of thinking, concrete and formal, and the question of whether a single template can carry both is treated as what it is: a hypothesis to test, not a given.
5.5 Donner un corpsGiving it a body
Un QR code imprimé se touche, se plie, se sent : c'est de l'encre sur du papier. Et pourtant c'est une porte. L'élève tient dans sa main un objet parfaitement tangible, et ce qu'il tient ouvre l'intangible. C'est le pont le plus simple que je connaisse entre le monde qui a une texture et celui qui n'en a pas, et c'est pour cela qu'il passe en premier.A printed QR code can be touched, folded, smelled: it is ink on paper. And yet it is a door. The student holds a perfectly tangible object in their hand, and what they hold opens the intangible. It is the simplest bridge I know between the world that has texture and the one that has none, and that is why it comes first.
Car c'est l'autre manque du support, après la capture : un site web n'a pas d'odeur. Pas de texture, pas de poids, rien à plier, rien à ranger dans un sac (c'est précisément pour cela qu'il ne se perd pas : les deux faces d'une même pièce). Pour des enfants dont la pensée est encore concrète au sens de Piaget, qui pensent avec leurs mains, ce manque n'est pas un détail d'esthète : le support de mes exercices est celui que leurs mains ne peuvent pas saisir.Because that is the medium's other lack, after capture: a website has no smell. No texture, no weight, nothing to fold, nothing to put in a bag (which is precisely why it does not get lost: two sides of the same coin). For children whose thinking is still concrete in Piaget's sense, who think with their hands, this lack is not an aesthete's detail: the medium of my exercises is the one their hands cannot grasp.
Les onze familles de gestes de la section précédente peuvent alors se relire autrement. Survoler, tenir, glisser, masser en cercles, sélectionner, zoomer : la main fait ces gestes depuis la première souris, mais ici la page y répond comme une matière, pas comme un bouton. Le carré d'une fiche fond en galet sous un massage circulaire, comme une argile qui se réchauffe ; un trait fin gonfle jusqu'à sa taille réelle de câble sous le curseur, deux centimètres, gros comme un tuyau d'arrosage. Ces récompenses ne sont pas seulement des surprises : elles donnent au site le peu de corps qu'un écran permet, une matière qui répond au geste. Un site n'aura jamais d'odeur ; il peut au moins avoir du répondant.The eleven families of gestures from the previous section can then be reread differently. Hover, hold, drag, rub in circles, select, zoom: the hand has made these gestures since the first mouse, but here the page answers them like a material, not like a button. The square on a sheet melts into a pebble under a circular rub, like clay warming up; a thin line swells to its real cable size under the cursor, two centimetres, as thick as a garden hose. These rewards are not only surprises: they give the site the little body a screen allows, a material that answers the gesture. A website will never have a smell; it can at least answer back.
Les frictions avec la rechercheFrictions with the research
Plusieurs choix du site contredisent les guidelines établies, ou en sortent. Les présenter comme des hypothèses testables, plutôt que les taire, fait partie de la méthode. Chaque « test » ci-dessous est ce que je ferai à la rentrée ; c'est aussi ce que tout enseignant peut faire dans sa classe, la section 7 dit comment.Several of the site's choices contradict established guidelines, or step outside them. Presenting them as testable hypotheses, rather than keeping quiet about them, is part of the method. Each "test" below is what I will do this school year; it is also what any teacher can do in their own class, and section 7 says how.
F1 · Tailles de cibles. NN/g recommande environ 2×2 cm pour les enfants ; la navigation du site utilise des liens de 12 px en capitales. Possiblement trop fin pour les plus jeunes. Test : « va à la Bibliothèque », en observant temps et erreurs.F1 · Target sizes. NN/g recommends about 2×2 cm for children; the site's navigation uses 12 px links in capitals. Possibly too fine for the youngest. Test: "go to the Library", observing time and errors.
F2 · Signifiants. La sobriété du site (cartes calmes, survols discrets) peut sous-signaler ce qui est cliquable, là où NN/g rappelle que les conventions voyantes aident les enfants. Test : « trouve l'outil », sans aide.F2 · Signifiers. The site's restraint (calm cards, discreet hovers) may under-signal what is clickable, where NN/g reminds us that conspicuous conventions help children. Test: "find the tool", without help.
F3 · Récompenses invisibles. Par définition non signalées : les enfants les trouveront-ils jamais ? La carte au trésor est une réponse partielle ; reste à observer si elle change le taux de découverte, et le plaisir.F3 · Invisible rewards. By definition unsignalled: will children ever find them? The treasure map is a partial answer; it remains to be seen whether it changes the discovery rate, and the pleasure.
F4 · Lecture. Des consignes entièrement textuelles, sans audio ni pictogrammes, supposent des lecteurs autonomes. Quel âge minimum réel ?F4 · Reading. Instructions that are entirely textual, with no audio and no pictograms, assume independent readers. What is the real minimum age?
F5 · L'accroche manquée. Un enfant qui scrolle immédiatement n'aura jamais vu le bandeau défiler. Probablement acceptable : l'accroche est un service, pas un contenu. À vérifier.F5 · The missed hook. A child who scrolls immediately will never have seen the band scroll. Probably acceptable: the hook is a service, not content. To be checked.
F6 · Deux modes de pensée, un site plat. Le même gabarit sert le concret (8 ans) et le formel (15 ans), et le haut de la tranche sort des « enfants » de NN/g pour entrer chez les adolescents. Test : faire faire le même exercice à un élève de 5P et à un élève de 11P, et observer où chacun décroche, s'ennuie ou se perd.F6 · Two modes of thinking, one flat site. The same template serves the concrete (age 8) and the formal (age 15), and the top of the range leaves NN/g's "children" for the adolescents. Test: have a 5P student and an 11P student do the same exercise, and observe where each drops off, gets bored or gets lost.
Ce que la classe en a ditWhat the classroom said
Cette version du site est en ligne depuis août 2026. Mes propres observations commencent à la rentrée, selon le protocole de la section 4, et cette section se remplira au fil de l'année : chaque principe de la section 5 y recevra son verdict, confirmé, contredit ou reformulé par la classe.This version of the site has been online since August 2026. My own observations begin this school year, following the protocol in section 4, and this section will fill up over the year: each principle in section 5 will receive its verdict here, confirmed, contradicted or reformulated by the classroom.
Mais une classe ne suffit pas, et la section 8 le dit sans détour : un seul observateur, un seul contexte. Si vous enseignez et que vous faites faire un exercice de ce site à vos élèves, votre observation vaut la mienne. Elle vaut plus si votre classe ne ressemble pas à la mienne.But one classroom is not enough, and section 8 says so plainly: one observer, one context. If you teach and you have your students do an exercise from this site, your observation is worth as much as mine. It is worth more if your class does not look like mine.
Le protocole tient en dix minutes. Choisissez un exercice. Demandez à un élève : « ouvre l'exercice et dis-moi ce qu'il faut faire », puis « trouve l'outil ». Regardez sans aider. Notez ce que vous voyez : le temps, les hésitations, les questions, l'âge de l'élève. C'est tout.The protocol takes ten minutes. Choose an exercise. Ask a student: "open the exercise and tell me what you have to do", then "find the tool". Watch without helping. Note what you see: the time, the hesitations, the questions, the student's age. That is all.
Six questions m'occupent particulièrement, vous pouvez répondre à une seule :Six questions concern me in particular; you can answer just one:
- Vos plus jeunes trouvent-ils les liens du menu, ou sont-ils trop petits pour eux ?Do your youngest find the menu links, or are they too small for them?
- Comprennent-ils ce qui est cliquable, ou la sobriété des pages le cache-t-elle ?Do they understand what is clickable, or does the restraint of the pages hide it?
- Un élève a-t-il trouvé une récompense cachée sans qu'on lui dise qu'elle existait ? Laquelle, à quel âge ?Has a student found a hidden reward without being told it existed? Which one, at what age?
- À partir de quel âge un élève lit-il la consigne seul, sans que vous la lisiez pour lui ?From what age does a student read the instructions alone, without you reading them out?
- Ceux qui font défiler la page tout de suite ratent le bandeau : cela change-t-il quelque chose ?Those who scroll the page straight away miss the band: does that change anything?
- Le même exercice, donné à un élève de 8 ans et à un de 15 : où chacun décroche-t-il ?The same exercise, given to an 8-year-old and a 15-year-old: where does each drop off?
Écrivez à contact@discoveryclubdec.ch, sujet « Observation de classe ». Ce que j'en ferai est simple et non négociable : des constats agrégés et anonymes ; jamais un nom, jamais un travail d'élève ; votre école nommée seulement si vous le demandez. Les enseignants qui contribuent seront remerciés dans la version finale de ce texte, s'ils le souhaitent.Write to contact@discoveryclubdec.ch, subject "Classroom observation". What I will do with it is simple and non-negotiable: aggregated, anonymous findings; never a name, never a student's work; your school named only if you ask. Teachers who contribute will be thanked in the final version of this text, if they wish.
Limites, et la suiteLimits, and what comes next
Les limites sont réelles et il serait malhonnête de les minorer. Un seul observateur, qui est aussi le concepteur du site : le biais de confirmation est structurel, et le protocole (tâches définies à l'avance, notes prises le jour même, verdicts par principe) est là pour le contenir, pas pour l'annuler. Un petit effectif ; une pratique formée dans trois écoles, mais toutes privées et genevoises : un seul contexte culturel et socio-économique. Des observations qualitatives, sans groupe de contrôle. Et si le site a bien cinq ans d'usage réel derrière lui, cette observation-là fut informelle : sans notes, sans protocole, avec une mémoire d'enseignant qui trie et embellit. Ces cinq ans sont la provenance des principes, pas leur validation ; c'est précisément pour cela que la section 7 applique un protocole plutôt qu'un souvenir. Ce texte ne prétend donc pas généraliser : il documente une position, les mécanismes qui l'incarnent, et ce qu'une vraie classe en dit. C'est un rapport d'atelier au sens propre, avec ce que le genre a de partiel et de situé.The limits are real and it would be dishonest to play them down. A single observer, who is also the site's designer: confirmation bias is structural, and the protocol (tasks defined in advance, notes taken the same day, verdicts per principle) is there to contain it, not to cancel it. A small headcount; a practice shaped in three schools, but all private and in Geneva: a single cultural and socio-economic context. Qualitative observations, without a control group. And if the site does have five years of real use behind it, that observation was informal: no notes, no protocol, with a teacher's memory that sorts and embellishes. Those five years are the provenance of the principles, not their validation; that is precisely why section 7 applies a protocol rather than a recollection. This text therefore makes no claim to generalise: it documents a position, the mechanisms that embody it, and what a real classroom says about it. It is a workshop report in the literal sense, with all that the genre has of the partial and the situated.
La suite est écrite dans la méthode elle-même. D'abord remplir la section 7 : une année d'observations, principe par principe. Ensuite trancher les frictions : certaines guidelines contredites se révéleront avoir raison, et le texte le dira. Enfin, si la position tient à l'épreuve de la classe, la partager sous une forme utilisable par d'autres : enseignants qui construisent un site de classe, designers qui travaillent pour des enfants et cherchent une alternative à l'engagement comme métrique. Le savoir existe, dans les livres cités ; ce qui manque, c'est une preuve de terrain qu'on peut concevoir calme, inclusif et curieux à la fois. Ce papier voudrait en être une.What comes next is written into the method itself. First, fill section 7: a year of observations, principle by principle. Then settle the frictions: some of the contradicted guidelines will turn out to be right, and the text will say so. Finally, if the position holds up to the test of the classroom, share it in a form others can use: teachers building a class website, designers working for children and looking for an alternative to engagement as a metric. The knowledge exists, in the books cited; what is missing is field evidence that one can design calm, inclusive and curious all at once. This paper would like to be one.
RéférencesReferences
- Jean Piaget et Bärbel Inhelder, The Psychology of the Child, 1966.Jean Piaget and Bärbel Inhelder, The Psychology of the Child, 1966.
- Seymour Papert, Mindstorms: Children, Computers, and Powerful Ideas, Basic Books, 1980.Seymour Papert, Mindstorms: Children, Computers, and Powerful Ideas, Basic Books, 1980.
- Mark Weiser et John Seely Brown, The Coming Age of Calm Technology, Xerox PARC, 1996.Mark Weiser and John Seely Brown, The Coming Age of Calm Technology, Xerox PARC, 1996.
- Nielsen Norman Group, UX Design for Children (Ages 3–12), 4e édition, 2019.Nielsen Norman Group, UX Design for Children (Ages 3–12), 4th edition, 2019.
- Designing for Children's Rights Guild × UNICEF, Design Principles 2.0, 2022.Designing for Children's Rights Guild × UNICEF, Design Principles 2.0, 2022.
- Rubens Cantuni, Designing Digital Products for Kids, Apress, 2020.Rubens Cantuni, Designing Digital Products for Kids, Apress, 2020.
- Debra Levin Gelman, Design for Kids, Rosenfeld Media, 2014.Debra Levin Gelman, Design for Kids, Rosenfeld Media, 2014.
- ICO (UK), Age Appropriate Design Code ; 5Rights Foundation, Child Rights by Design.ICO (UK), Age Appropriate Design Code; 5Rights Foundation, Child Rights by Design.