edusearch-adams-edtech

byJean Phebus Widly Laguerre

1. RÔLE ET MISSION DE L’IA DE DÉVELOPPEMENT Agis comme une équipe internationale senior composée de : Un architecte logiciel spécialisé en plateformes SaaS. Un développeur Full-Stack senior. Un ingénieur Front-End spécialisé en applications web modernes. Un ingénieur Back-End et API. Un ingénieur spécialisé en moteurs de recherche. Un expert en intelligence artificielle éducative (EdTech AI). Un expert UX/UI et design systems. Un expert SEO technique et international. Un ingénieur DevOps et infrastructure Cloud. Un expert en cybersécurité, confidentialité et conformité. Un ingénieur QA spécialisé dans les tests automatisés. Ta mission consiste à concevoir, développer, tester, documenter et préparer au déploiement le module complet des pages publiques autonomes et dynamiques d’EDUSEARCH ADAMS, une plateforme SaaS EdTech internationale combinant recherche pédagogique spécialisée, découverte de ressources éducatives et intelligence artificielle éducative. Ne produis pas une simple maquette visuelle, une landing page isolée ou un prototype statique. Construis une architecture cohérente, modulaire, réutilisable, sécurisée, accessible, évolutive et réellement fonctionnelle. Les fonctionnalités doivent être implémentées lorsqu'elles sont réalisables dans l'environnement de développement. Lorsqu'une intégration externe, une clé API, un service payant ou une configuration d'infrastructure est nécessaire, crée une intégration propre, documente les prérequis et fournis un mode de démonstration clairement identifié, sans simuler une fonctionnalité de production comme si elle était opérationnelle.

Accueil
Accueil

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirements Document for edusearch-adams-edtech

1. Introduction

EDUSEARCH ADAMS est une plateforme SaaS EdTech internationale qui combine trois capacités : la recherche pédagogique spécialisée, la découverte de ressources éducatives et l'intelligence artificielle éducative. Ce document spécifie le module complet des pages publiques autonomes et dynamiques de la plateforme : un ensemble de pages publiques réellement fonctionnelles, alimentées par des données applicatives, dotées de métadonnées SEO techniques et internationales, et maintenues par un éditeur de contenu public.

Le produit n'est ni une maquette visuelle, ni une landing page isolée, ni un prototype statique. Il s'agit d'une architecture cohérente, modulaire, réutilisable, sécurisée, accessible, évolutive et réellement fonctionnelle, documentée et préparée au déploiement.

Public visé : les visiteurs publics internationaux (enseignants, responsables d'établissement, chercheurs, concepteurs de programmes, acheteurs du secteur éducatif) qui découvrent la plateforme sans compte, et l'éditeur de contenu public qui produit et maintient les pages publiques.

Portée actuelle : le module des pages publiques (Accueil, Contenus, Connexion) et les mécanismes indispensables à son fonctionnement (identité applicative, source de données applicative, SEO technique et international, documentation des prérequis et modes de démonstration).

Page 1 of 26

2. System Overview

EDUSEARCH ADAMS est livré comme une application web full-stack :

  • Front-end : pages publiques autonomes et dynamiques, rendues côté serveur pour l'indexation SEO, avec une identité visuelle de type affiche typographique (voir sections 6–8).
  • Back-end : API applicative qui sert les contenus publics dynamiques, gère l'identité de l'éditeur de contenu public et expose les métadonnées SEO techniques et internationales.
  • Stockage applicatif : base de données relationnelle persistante pour les contenus publics, leurs métadonnées SEO, les variantes linguistiques et les comptes éditeurs.
  • Intégrations externes : toute intégration externe, clé API ou service payant est encapsulée derrière une interface propre, documentée, avec un mode de démonstration clairement identifié ; aucune fonctionnalité de production n'est simulée comme opérationnelle.

Acteurs :

  • Visiteur public (persona humain actif) — accède anonymement aux pages publiques.
  • Éditeur de contenu public (persona humain actif) — accède après authentification à l'espace de gestion des contenus.
  • Système applicatif (acteur non humain) — rend les pages, sert l'API, applique les métadonnées SEO.

Exclusions actuelles : aucune maquette visuelle, landing page isolée ou prototype statique n'est livré. Aucune fonctionnalité de production n'est présentée comme opérationnelle lorsqu'elle dépend d'une intégration externe non configurée.

Page 2 of 26

2a. Product Interpretation and Delivery Boundary

Le module livré est un système de pages publiques dynamiques : les visiteurs publics consultent des pages rendues à la demande depuis une source de données applicative, indexables et disponibles en plusieurs variantes linguistiques. L'éditeur de contenu public dispose d'un espace de travail protégé pour créer et mettre à jour ces contenus et leurs métadonnées SEO.

Propriété de l'accès :

  • Les pages publiques (Accueil) sont accessibles anonymement, sans compte.
  • L'espace de travail de l'éditeur (Contenus) est protégé : il exige une identité applicative établie. La page Connexion est le point d'entrée anonyme qui permet à l'éditeur d'établir cette identité ; elle ne peut pas elle-même être protégée.
  • L'identité de l'éditeur est provisionnée par un administrateur avant la connexion (voir section 11) ; le module ne fournit pas d'auto-inscription publique.

Frontière actuel / futur : toutes les capacités décrites dans ce document sont actuelles. Les intégrations externes non configurées fonctionnent en mode démonstration identifié ; leur passage en production relève de la configuration d'infrastructure documentée, pas d'une nouvelle capacité produit.

2b. Source Content Inventory

Non applicable — aucune directive de référence content_source n'est fournie.

2c. Page Content and Component Coverage

Page 3 of 26

Accueil

Rôle : entrée publique anonyme présentant EDUSEARCH ADAMS, sa recherche pédagogique, ses ressources éducatives et son IA éducative, avec signalement des modes de démonstration et prérequis.

Information / état :

  • Bloc héros plein écran : titre « TROUVEZ LE SAVOIR QUI ENSEIGNE » en Anton, barre de recherche pleine largeur, micro-labels « RECHERCHE PÉDAGOGIQUE · RESSOURCES ÉDUCATIVES · IA ÉDUCATIVE ».
  • Bandeau marquee des termes de recherche pédagogique.
  • Sections de présentation : recherche pédagogique, ressources éducatives, IA éducative.
  • Bandeau de signalement des modes de démonstration et des prérequis d'intégration externe (visible, non ambigu).
  • Métadonnées SEO techniques et internationales rendues dans le document (titre, description, hreflang, lang).

Actions principales : saisir une requête de recherche pédagogique et la soumettre ; naviguer vers les sections ; changer de langue si des variantes sont publiées.

Actions de support : consulter les prérequis et le mode de démonstration ; accéder à la Connexion (lien de navigation).

Entités de domaine : Page publique, Contenu public, Variante linguistique, Métadonnée SEO, Terme de recherche pédagogique.

Page 4 of 26

Responsabilités des composants :

  • HeroPoster — composition typographique plein écran, barre de recherche.
  • SearchBar — champ de recherche à bordure 3px, bouton rouge rectangulaire « RECHERCHER ».
  • MarqueeBand — bandeau défilant pausable, statique en prefers-reduced-motion.
  • SectionBlock — blocs de contenu dynamiques servis par l'API.
  • DemoNotice — signalement des modes de démonstration et prérequis.
  • LocaleSwitcher — variantes linguistiques publiées.

États :

  • Chargement : squelettes typographiques respectant la grille poster.
  • Vide : si aucun contenu publié, message explicite « Contenu en préparation » sans casser la composition.
  • Succès : contenu rendu, métadonnées SEO présentes.
  • Erreur : si l'API échoue, page de repli avec message et action « Réessayer ».
  • Récupération : réessai recharge les contenus ; le mode démonstration reste signalé.
Page 5 of 26

Contenus

Rôle : espace de travail de l'éditeur pour créer et mettre à jour les contenus dynamiques et les métadonnées SEO techniques et internationales des pages publiques.

Information / état : liste des pages publiques avec statut (brouillon / publié), variantes linguistiques, métadonnées SEO (titre, description, hreflang), date de dernière modification.

Actions principales : créer une page publique ; éditer le contenu ; éditer les métadonnées SEO ; gérer les variantes linguistiques ; publier / dépublier.

Actions de support : filtrer par statut ; prévisualiser ; se déconnecter.

Entités de domaine : Page publique, Contenu public, Variante linguistique, Métadonnée SEO, Statut de publication.

Responsabilités des composants :

  • PageList — liste dense à lignes réglées, chiffres tabulaires.
  • PageEditor — formulaire d'édition du contenu.
  • SeoPanel — métadonnées SEO techniques et internationales.
  • LocalePanel — variantes linguistiques.
  • PublishControl — publication / dépublication avec confirmation.
Page 6 of 26

États :

  • Chargement : liste en attente.
  • Vide : « Aucune page publique — créez la première ».
  • Succès : confirmation de sauvegarde / publication.
  • Erreur : validation échouée (champ requis manquant, hreflang invalide) avec messages par champ.
  • Récupération : les modifications non sauvegardées restent dans le formulaire ; réessai possible.
Page 7 of 26

Connexion

Rôle : vérification de retour de l'éditeur de contenu public accédant à son espace de gestion des pages publiques.

Information / état : formulaire d'identité (identifiant et secret), message d'erreur éventuel, indication que le compte est provisionné par un administrateur.

Actions principales : soumettre ses identifiants ; revenir à l'Accueil.

Entités de domaine : Compte éditeur, Session.

Responsabilités des composants :

  • LoginForm — champs et soumission.
  • AuthError — message d'erreur non révélateur.
  • ProvisioningNotice — mention du provisionnement administrateur.

États :

  • Chargement : soumission en cours, bouton désactivé.
  • Vide : formulaire vierge.
  • Succès : redirection vers Contenus.
  • Erreur : identifiants invalides, message générique ; compte non provisionné, message dédié.
  • Récupération : nouvelle tentative possible sans perte du champ identifiant.
Page 8 of 26

3. Functional Requirements

FR-01 — Pages publiques autonomes et dynamiques (explicit) As a Visiteur public, I should consulter des pages publiques autonomes et dynamiques rendues depuis la source de données applicative, afin de découvrir EDUSEARCH ADAMS.

  • Déclencheur : requête HTTP sur une page publique.
  • Résultat observable : page rendue avec contenu à jour issu de la base applicative.
  • Échec / récupération : si l'API échoue, page de repli avec action « Réessayer ».
  • Continuation : navigation vers les sections et la recherche.
  • Accès : anonyme.

FR-02 — Recherche pédagogique spécialisée depuis l'Accueil (explicit) As a Visiteur public, I should saisir une requête de recherche pédagogique et la soumettre depuis la barre de recherche de l'Accueil, afin de trouver du savoir pédagogique.

  • Entrée : terme saisi dans la barre à bordure 3px.
  • Résultat observable : soumission déclenchée par le bouton rouge rectangulaire « RECHERCHER » ; la requête est traitée par le moteur de recherche pédagogique.
  • Échec / récupération : requête vide refusée avec indication ; erreur de service signalée sans simuler un résultat.
  • Continuation : consultation des résultats.
  • Accès : anonyme.
Page 9 of 26

FR-03 — Découverte de ressources éducatives (explicit) As a Visiteur public, I should consulter la présentation et les entrées de découverte des ressources éducatives, afin d'identifier des ressources pertinentes.

  • Résultat observable : sections de ressources éducatives rendues dynamiquement.
  • Échec / récupération : section en état vide explicite si aucune ressource publiée.
  • Accès : anonyme.

FR-04 — Présentation de l'IA éducative (explicit) As a Visiteur public, I should consulter la présentation de l'intelligence artificielle éducative, afin de comprendre cette capacité de la plateforme.

  • Résultat observable : section IA éducative rendue, signalée visuellement (bloc jaune).
  • Échec / récupération : état vide explicite.
  • Accès : anonyme.

FR-05 — Signalement des modes de démonstration et prérequis (explicit) As a Visiteur public, I should voir clairement identifiés les modes de démonstration et les prérequis des intégrations externes, afin de ne pas confondre une démonstration avec une fonctionnalité de production opérationnelle.

  • Résultat observable : bandeau DemoNotice visible sur l'Accueil listant les intégrations concernées et leurs prérequis.
  • Accès : anonyme.
Page 10 of 26

FR-06 — SEO technique et international des pages publiques (explicit) As a Visiteur public, I should recevoir des pages publiques dotées de métadonnées SEO techniques et internationales correctes, afin de les trouver et de les lire dans ma langue.

  • Résultat observable : titre, description, lang, hreflang et indexation rendus côté serveur.
  • Échec / récupération : métadonnées invalides bloquées à la publication par l'éditeur.
  • Accès : anonyme.

FR-07 — Support international (variantes linguistiques) (explicit) As a Visiteur public, I should basculer entre les variantes linguistiques publiées, afin de consulter les pages dans ma langue.

  • Résultat observable : changement de langue servi par l'API ; hreflang cohérent.
  • Échec / récupération : variante non publiée non proposée.
  • Accès : anonyme.

FR-08 — Établissement de l'identité de l'éditeur (required_inference) As an Éditeur de contenu public, I should me connecter avec les identifiants provisionnés par un administrateur, afin d'accéder à mon espace de gestion des pages publiques.

  • Déclencheur : soumission du formulaire de Connexion.
  • Résultat observable : session établie, redirection vers Contenus.
  • Échec / récupération : identifiants invalides → message générique ; compte non provisionné → message dédié ; nouvelle tentative possible.
  • Continuation : accès à Contenus.
  • Accès : page Connexion anonyme ; Contenus protégé.
Page 11 of 26

FR-09 — Création de pages publiques (required_inference) As an Éditeur de contenu public, I should créer une page publique avec son contenu, afin d'enrichir l'offre publique.

  • Résultat observable : page créée en statut brouillon, visible dans la liste.
  • Échec / récupération : validation par champ, modifications conservées.
  • Continuation : édition puis publication.
  • Accès : protégé (session éditeur).

FR-10 — Mise à jour des contenus dynamiques (required_inference) As an Éditeur de contenu public, I should éditer le contenu d'une page publique existante, afin que les visiteurs disposent de contenus à jour.

  • Résultat observable : contenu sauvegardé, date de modification mise à jour, page publique reflétant la modification.
  • Échec / récupération : erreur de sauvegarde signalée, contenu non perdu.
  • Accès : protégé.

FR-11 — Gestion des métadonnées SEO techniques et internationales (required_inference) As an Éditeur de contenu public, I should éditer les métadonnées SEO (titre, description, hreflang) d'une page publique, afin qu'elle soit indexable et cohérente par langue.

  • Résultat observable : métadonnées enregistrées et rendues sur la page publique.
  • Échec / récupération : hreflang invalide rejeté avec message.
  • Accès : protégé.
Page 12 of 26

FR-12 — Gestion des variantes linguistiques (required_inference) As an Éditeur de contenu public, I should gérer les variantes linguistiques d'une page publique, afin de servir un public international.

  • Résultat observable : variantes listées, publiables individuellement.
  • Échec / récupération : variante incomplète signalée.
  • Accès : protégé.

FR-13 — Publication / dépublication (required_inference) As an Éditeur de contenu public, I should publier ou dépublier une page publique, afin de contrôler ce qui est visible publiquement.

  • Résultat observable : statut mis à jour ; page publique visible ou retirée.
  • Échec / récupération : confirmation requise ; échec signalé.
  • Accès : protégé.

FR-14 — Provisionnement administrateur de l'éditeur (required_inference) As an Éditeur de contenu public, I should disposer d'un compte provisionné par un administrateur avant ma première connexion, afin d'accéder à l'espace protégé.

  • Résultat observable : compte existant permettant la connexion.
  • Échec / récupération : compte absent → message dédié à la connexion.
  • Accès : hors module (provisionnement administrateur).

FR-15 — Source de données applicative (required_inference) As a Système applicatif, I should servir les contenus publics depuis une base applicative persistante, afin que les pages soient dynamiques et à jour.

  • Résultat observable : contenus lus/écrits en base, reflétés sur les pages publiques.
  • Échec / récupération : erreur de base → page de repli.
  • Accès : interne.
Page 13 of 26

FR-16 — Documentation des prérequis et modes de démonstration (required_inference) As an Éditeur de contenu public, I should disposer d'une documentation des prérequis d'intégration externe et des modes de démonstration, afin d'exploiter le module sans simuler une production.

  • Résultat observable : documentation livrée ; modes de démonstration identifiés sur l'Accueil.
  • Accès : documentation livrée avec le module.

FR-17 — Tests automatisés (explicit) As a Système applicatif, I should être couvert par des tests automatisés (front, API, SEO), afin de garantir la fiabilité du module.

  • Résultat observable : suite de tests exécutable en CI.

FR-18 — Préparation au déploiement (explicit) As a Système applicatif, I should être empaqueté et documenté pour le déploiement (DevOps / Cloud), afin d'être déployable.

  • Résultat observable : configuration de déploiement et documentation.

4. User Personas

Page 14 of 26

Visiteur public

Contexte produit : enseignant, responsable d'établissement, chercheur, concepteur de programmes ou acheteur du secteur éducatif, souvent international, qui arrive sur EDUSEARCH ADAMS sans compte.

Objectif principal : découvrir de façon fiable et accessible les pages publiques — recherche pédagogique, ressources éducatives, présentation de l'IA éducative — et décider de poursuivre.

Responsabilités acceptées : consulter les pages publiques dynamiques ; soumettre une recherche pédagogique ; parcourir les ressources éducatives ; comprendre l'IA éducative ; lire les signalements de démonstration et prérequis ; changer de langue.

Entrées / décisions : requête de recherche ; choix de langue ; décision de poursuivre ou non.

Interactions : avec le Système applicatif (rendu des pages, API) ; indirectement avec l'Éditeur de contenu public, dont les publications déterminent ce qu'il voit.

Succès observable : pages chargées, contenus à jour, recherche soumise, langue choisie, modes de démonstration compris.

Ce qui distingue ce rôle : il n'a aucune identité applicative et ne modifie aucun contenu ; son travail est la lecture et la recherche.

Page 15 of 26

Éditeur de contenu public

Contexte produit : responsable de la production et de la mise à jour des pages publiques autonomes et dynamiques (contenus, métadonnées SEO, structure des pages).

Objectif principal : que les visiteurs publics disposent de contenus à jour, indexables et cohérents.

Responsabilités acceptées : se connecter avec un compte provisionné ; créer des pages publiques ; éditer contenus ; gérer métadonnées SEO techniques et internationales ; gérer variantes linguistiques ; publier / dépublier.

Entrées / décisions : identifiants provisionnés ; contenus saisis ; métadonnées SEO ; décision de publication.

Interactions : avec l'administrateur (provisionnement préalable) ; avec le Système applicatif (API, base) ; avec le Visiteur public (destinataire de ses publications).

Succès observable : pages publiques publiées, dynamiques et maintenues.

Ce qui distingue ce rôle : il détient l'identité applicative et l'autorité de publication ; son travail est la production éditoriale et SEO, pas la consultation.

5. Core User Flows

Page 16 of 26

Flux A — Découverte publique par le Visiteur public

  1. Le Visiteur public ouvre l'Accueil (anonyme). Le Système applicatif rend la page depuis la source de données applicative (FR-01, FR-15).
  2. Il lit le bloc héros « TROUVEZ LE SAVOIR QUI ENSEIGNE » et les micro-labels « RECHERCHE PÉDAGOGIQUE · RESSOURCES ÉDUCATIVES · IA ÉDUCATIVE ».
  3. Il consulte le bandeau DemoNotice signalant les modes de démonstration et prérequis (FR-05).
  4. Il saisit une requête dans la barre de recherche et clique « RECHERCHER » (FR-02). Résultat observable : requête soumise au moteur de recherche pédagogique.
    • Échec : requête vide → indication ; service indisponible → message sans résultat simulé. Il peut réessayer.
  5. Il parcourt les sections de ressources éducatives (FR-03) et d'IA éducative (FR-04).
  6. Il choisit éventuellement une variante linguistique (FR-07) ; la page est re-servie dans la langue choisie avec hreflang cohérent (FR-06).
  7. Continuation : il peut accéder à la Connexion via la navigation, ou quitter.
Page 17 of 26

Flux B — Connexion de l'Éditeur de contenu public

  1. Prérequis : un administrateur a provisionné le compte de l'éditeur (FR-14).
  2. L'Éditeur ouvre la Connexion (anonyme) et saisit identifiant et secret.
  3. Il soumet ; le bouton est désactivé pendant le traitement.
  4. Succès : session établie, redirection vers Contenus (FR-08).
  5. Échec : identifiants invalides → message générique ; compte non provisionné → message dédié. Le champ identifiant est conservé ; nouvelle tentative possible.
  6. Continuation : il travaille dans Contenus, ou revient à l'Accueil.

Flux C — Création et publication d'une page publique par l'Éditeur

  1. Depuis Contenus (protégé), l'Éditeur consulte la liste des pages publiques (statut, variantes, dernière modification).
  2. Il crée une page publique (FR-09) : elle apparaît en brouillon.
  3. Il édite le contenu (FR-10) et enregistre ; la date de modification est mise à jour.
    • Échec : erreur de sauvegarde signalée, contenu conservé dans le formulaire.
  4. Il renseigne les métadonnées SEO (titre, description, hreflang) (FR-11).
    • Échec : hreflang invalide rejeté avec message par champ.
  5. Il ajoute les variantes linguistiques (FR-12) ; une variante incomplète est signalée.
  6. Il publie (FR-13) après confirmation. Résultat observable : statut « publié ».
  7. Continuation : le Visiteur public voit la page mise à jour sur l'Accueil (Flux A, étape 1).
Page 18 of 26

Flux D — Mise à jour d'un contenu existant

  1. L'Éditeur ouvre Contenus, sélectionne une page publiée.
  2. Il modifie le contenu et/ou les métadonnées SEO, enregistre (FR-10, FR-11).
  3. Résultat observable : la page publique reflète la modification au prochain chargement.
  4. Récupération : en cas d'échec, il réessaie sans perte de saisie.
  5. Continuation : il peut dépublier (FR-13) si le contenu ne doit plus être visible.

6. Visuals Colors and Theme

Muse : Paula Scher — la typographie comme architecture. Registre : échelle d'institution publique avec confiance créative ; un outil de recherche qui se comporte comme une affiche.

Palette (mode clair) :

RôleHex
Fond (papier chaud)#F4EFE6
Surface#FFFFFF
Texte / filets#0E0E0C
Primaire (rouge affiche)#E01B1B
Accent (jaune, surfaces IA)#F2C200
Atténué (métadonnées)#6B665C
Code catégorie tertiaire (teal, chips uniquement)#0B7C74

Aucun dégradé, aucune ombre, aucun bleu-indigo.

Page 19 of 26

Typographie :

  • Titres : Anton, tout en majuscules, tracking -0.02em, interligne 0.86, colonnes de mots empilées remplissant le conteneur.
  • Sous-titres et labels : Archivo Uppercase, poids 600–700, tracking +0.08em.
  • Corps : Archivo Regular 400, 17–19px, interligne 1.55 ; données et métadonnées en Archivo 500 avec chiffres tabulaires.
  • Échelle : display clamp(56px, 11vw, 160px) ; titre de section clamp(40px, 6vw, 88px) ; sous-titre 28/24/20 ; corps 19/17/16 ; label 13px majuscules trackées ; légende 12px. Le display ne descend jamais sous 56px sur mobile et ne coupe jamais un mot.

Formes : angles vifs partout (rayon 0 sur cartes, boutons, champs, cadres). Filets noirs de 3px entre sections. Blocs de couleur rectangulaires butant directement contre la typographie. Chips de catégorie rectangulaires à bordure noire 2px et remplissage plein. Une bande diagonale à 12° par page comme transition de section. Aucun blob, aucune pastille arrondie, aucune ombre douce.

Mise en page : grille poster visible de 12 colonnes, gouttières 24px, marges extérieures 24px (mobile) / 48px (tablette) / 80px (desktop). Sections alternant noir plein cadre, blocs rouge/jaune plein cadre et fond papier. Compositions asymétriques : colonnes de largeur inégale, titre surdimensionné sur 9 colonnes, rail de métadonnées de 3 colonnes. Résultats et listes en grilles poster denses à lignes réglées. Navigation : barre noire horizontale, liens majuscules trackés, champ de recherche rouge ; sur mobile, index empilé numéroté (01 Accueil, 02 Recherche, 03 Ressources, 04 IA, 05 Connexion).

Page 20 of 26

Imagerie : la typographie est l'image. Découpes photographiques monochromes à fort contraste (lecture, enseignement, étude), traitées en duotone noir/papier, croppées à ras contre un bloc de couleur. Schémas et aperçus de résultats en traits noirs plats sur papier. Aucun vernis stock, aucun rendu 3D, aucune illustration décorative.

7. Signature Design Concept

« L'affiche qui cherche » — L'Accueil est une affiche imprimée qui se trouve être interactive.

  • Fond papier chaud #F4EFE6 plein viewport, scindé par un bloc rouge #E01B1B occupant les 5 colonnes de droite sur 12.
  • Titre « TROUVEZ LE SAVOIR QUI ENSEIGNE » en Anton clamp(56px, 11vw, 160px), empilé sur 3–4 lignes dans les 7 colonnes de gauche ; le mot « SAVOIR » est inversé en papier sur le bloc rouge, la typographie traversant la frontière de couleur.
  • Sous le titre, une barre de recherche pleine largeur à bordure noire 3px et bouton rouge rectangulaire « RECHERCHER ».
  • Un filet noir fin sous la barre porte trois micro-labels majuscules : « RECHERCHE PÉDAGOGIQUE · RESSOURCES ÉDUCATIVES · IA ÉDUCATIVE ».
  • Aucun sous-texte centré, aucun dégradé, aucune carte flottante.
  • Le bandeau DemoNotice s'insère comme un bloc jaune #F2C200 à bordure noire 2px, cohérent avec la composition poster.

Tout texte lisible et tout contrôle restent entiers dans le viewport et leur conteneur à 375px, 768px et 1280px ; le geste de débordement est porté par l'imagerie et la décoration, jamais par le texte.

Page 21 of 26

8. Interaction Model & Motion Direction

Interaction Model: Animated Motion Tempo: expressive Hero Dimensionality: flat

Landing Hero Motion Brief

  • Sujet focal : le titre Anton surdimensionné traversant le bloc rouge, avec le mot « SAVOIR » inversé.
  • Thèse entrée → transformation → résultat : au chargement, chaque mot du titre monte de 24px avec un décalage de 40ms ; un bloc de couleur balaie la frontière de section à l'entrée en vue ; le résultat est l'affiche complète et stable, avec la barre de recherche prête à la saisie.
  • Vocabulaire de mouvement : révélations de mots échelonnées, balayage de bloc de couleur, marquee lent de termes pédagogiques, bascule instantanée des chips au survol (sans easing théâtral). Aucun rebond, aucune dérive parallaxe.
  • Première image composée : fond papier, bloc rouge à droite, titre empilé à gauche, barre de recherche et micro-labels déjà en place ; les mots apparaissent en séquence sans déplacer la mise en page.
  • État prefers-reduced-motion : état final rendu immédiatement ; le marquee est statique et s'enroule en lignes lisibles ; aucune animation de révélation ni de balayage.
Page 22 of 26

9. Non-Functional Requirements

  • NFR-01 — Sécurité (explicit) : le module est sécurisé ; l'espace Contenus est protégé par session ; les secrets ne sont jamais exposés côté client ; messages d'erreur d'authentification non révélateurs.
  • NFR-02 — Accessibilité (explicit) : le module est accessible ; navigation clavier, contrastes conformes, prefers-reduced-motion respecté, textes lisibles entiers à 375/768/1280px.
  • NFR-03 — Évolutivité (explicit) : architecture modulaire et réutilisable permettant l'ajout de pages et de variantes linguistiques sans refonte.
  • NFR-04 — SEO technique et international (explicit) : rendu côté serveur, lang, hreflang, titres et descriptions par page et par variante.
  • NFR-05 — Confidentialité et conformité (explicit) : minimisation des données, pas de collecte non nécessaire, documentation de conformité.
  • NFR-06 — Tests automatisés (explicit) : couverture front, API et SEO exécutable en CI.
  • NFR-07 — Préparation au déploiement (explicit) : configuration DevOps / Cloud documentée, variables d'environnement listées.
  • NFR-08 — Intégrations externes honnêtes (explicit) : toute intégration externe, clé API ou service payant est encapsulée, documentée, avec mode de démonstration identifié ; aucune simulation présentée comme production.
  • NFR-09 — Fonctionnalité réelle (explicit) : les fonctionnalités réalisables dans l'environnement de développement sont implémentées, pas maquettées.
Page 23 of 26

10. Tech Stack

  • Front-end : React (application web moderne), rendu côté serveur pour le SEO.
  • Back-end : Python / FastAPI, servant l'API des contenus publics, l'authentification de l'éditeur et les métadonnées SEO.
  • Stockage : base de données relationnelle persistante (contenus publics, variantes linguistiques, métadonnées SEO, comptes éditeurs).
  • Conteneurisation : Docker / docker-compose pour l'exécution locale et la préparation au déploiement.
  • Kubernetes : uniquement si le déploiement cible l'exige ; non requis par défaut.
  • Tests : suite automatisée front, API et SEO.
Page 24 of 26

11. Assumptions and Constraints

Contraintes explicites :

  • Ne pas produire une simple maquette visuelle, une landing page isolée ou un prototype statique.
  • Les fonctionnalités doivent être réellement fonctionnelles lorsqu'elles sont réalisables dans l'environnement de développement.
  • Toute intégration externe, clé API, service payant ou configuration d'infrastructure nécessaire : intégration propre, prérequis documentés, mode de démonstration clairement identifié, sans simuler une production comme opérationnelle.
  • Le module doit être sécurisé, accessible, évolutif, conforme aux exigences de confidentialité et de conformité.
  • Le module doit être documenté et préparé au déploiement (DevOps / Cloud).
  • Le module doit inclure des tests automatisés (QA).

Hypothèses (étroites) :

  • [Hypothèse] Le compte de l'Éditeur de contenu public est provisionné par un administrateur hors du module avant la première connexion ; aucune auto-inscription publique n'est fournie.
  • [Hypothèse] Les intégrations externes non configurées dans l'environnement de développement s'exécutent en mode démonstration identifié, conformément à la contrainte explicite.
  • [Hypothèse] Les variantes linguistiques publiées sont gérées par l'Éditeur ; aucune traduction automatique n'est supposée.
Page 25 of 26

12. Glossary

  • Page publique : page autonome et dynamique servie anonymement, alimentée par la source de données applicative.
  • Contenu public : texte et structure d'une page publique, éditable par l'Éditeur.
  • Variante linguistique : version d'une page publique dans une langue donnée, avec hreflang associé.
  • Métadonnée SEO : titre, description, lang, hreflang et règles d'indexation d'une page publique.
  • Mode de démonstration : exécution identifiée d'une intégration externe non configurée, explicitement signalée comme non productive.
  • Éditeur de contenu public : persona humain authentifié responsable de la production et de la maintenance des pages publiques.
  • Visiteur public : persona humain anonyme consultant les pages publiques.
  • Provisionnement administrateur : création préalable du compte éditeur par un administrateur, hors module.
Page 26 of 26
Accueil design preview
Accueil: Ouvrir la page publique
Connexion: Accéder à la connexion
Connexion: 1. Saisir ses identifiants
Connexion: 2. Soumettre le formulaire
Connexion: 3. Corriger des identifiants invalides
Connexion: 4. Lire le message de compte non provisionné
Contenus: Consulter la liste des pages
Contenus: Créer une page publique
Contenus: Éditer le contenu
Contenus: 1. Enregistrer le contenu
Contenus: 1. Renseigner les métadonnées SEO
Contenus: 2. Corriger un hreflang invalide
Contenus: Gérer les variantes linguistiques
Contenus: Publier après confirmation
Contenus: Sélectionner une page publiée
Contenus: Modifier contenu et SEO
Contenus: 2. Réessayer sans perte de saisie
Contenus: Dépublier une page
Contenus: Se déconnecter
Accueil: Revenir à l'accueil
Accueil design preview
Accueil: Ouvrir la page publique
Connexion: Accéder à la connexion
Connexion: 1. Saisir ses identifiants
Connexion: 2. Soumettre le formulaire
Connexion: 3. Corriger des identifiants invalides
Connexion: 4. Lire le message de compte non provisionné
Contenus: Consulter la liste des pages
Contenus: Créer une page publique
Contenus: Éditer le contenu
Contenus: 1. Enregistrer le contenu
Contenus: 1. Renseigner les métadonnées SEO
Contenus: 2. Corriger un hreflang invalide
Contenus: Gérer les variantes linguistiques
Contenus: Publier après confirmation
Contenus: Sélectionner une page publiée
Contenus: Modifier contenu et SEO
Contenus: 2. Réessayer sans perte de saisie
Contenus: Dépublier une page
Contenus: Se déconnecter
Accueil: Revenir à l'accueil