deepwhy/deepwhy-skill

Chaîne de Connaissances DeepWhy

Créez une expérience d'exploration des connaissances, et non un long article avec une table des matières. La surface principale est une chaîne compacte et interactive de 3 à 6 idées qui progresse d'un phénomène familier vers un mécanisme, un principe, une théorie, une frontière actuelle ou une limite connue.

L'expérience d'apprentissage doit aider l'apprenant à comprendre, et non simplement à recevoir une explication bien sourcée. Organisez chaque idée centrale autour d'une scène familière et d'une métaphore utilisable. Montrez cette métaphore en action lorsque le changement ou la causalité est en jeu, puis reliez-la au mécanisme réel en langage simple. La vidéo est une deuxième explication ou une confirmation du monde réel pour le même nœud, jamais un cours générique utilisé pour remplir un quota.

Privilégiez une métaphore d'ancrage au niveau de la chaîne. Réutilisez-la et approfondissez-la à travers les nœuds adjacents chaque fois qu'elle explique encore la nouvelle question ; changez uniquement lorsque l'ancien modèle a atteint une véritable limite. L'apprenant doit accumuler un modèle mental en évolution, et non collectionner des exemples sans lien de carte en carte.

Le livrable par défaut est un seul fichier HTML autonome. Il doit préserver une expérience locale utile sans étape de construction : la sélection de nœuds, la navigation précédent/suivant, les branches, les onglets de détail, le filtrage chronologique, le feedback d'évaluation, les dossiers d'arrière-plan et l'export JSON utilisent tous du CSS et du JavaScript embarqués. Les articles externes, vidéos, images et DeepWhy lui-même nécessitent toujours un réseau.

Les visuels porteurs de connaissances doivent rester lisibles : aucune illustration, diagramme, animation ou superposition ne peut couvrir du texte, des annotations, des contrôles, des légendes ou des marques critiques. Lorsqu'une relation est naturellement temporelle ou causale, privilégiez une animation intentionnelle à un instantané statique.

Lisez uniquement ce dont la tâche a besoin

• Avant la recherche, lisez references/research-playbook.md.
• Avant de planifier la chaîne, lisez references/knowledge-chain.md.
• Avant de concevoir des métaphores, des animations ou des appariements vidéo, lisez references/teaching-progression.md.
• Avant de choisir Manim, lisez references/manim-animation.md.
• Avant de rédiger un laboratoire au niveau d'un nœud, lisez references/interactive-labs.md.
• Avant de rédiger du JSON, lisez references/content-contract.md et assets/content.schema.json.
• Avant de choisir ou d'adapter le système visuel, lisez references/visual-design-system.md et references/design-presets.md.
• Avant de composer la coque de la page, lisez references/learning-layout.md et references/page-delivery.md.
• Avant le QA final, lisez references/evaluation-cases.md.

Partez de assets/template.html, pas d'une page vierge. Utilisez le modèle et les scripts comme des contrats structurels, et non comme des sources de faits.

Construisez l'expérience d'apprentissage

1. Cadrez l'apprenant et la question. Extrayez le sujet, la question réelle, les connaissances préalables probables et la profondeur visée. Conservez une prémisse fausse dans meta.premiseCheck, marquez-la corrected, expliquez-la brièvement et continuez avec la question corrigée. Ne vous arrêtez pas à la correction.

2. Concevez le parcours pédagogique avant de rechercher les détails. Pour chaque nœud central, identifiez :

   scène reconnaissable → une métaphore → 2-4 correspondances explicites → temps causal animé → règle en langage simple → vidéo pertinente → vérification de transfert → limite de la métaphore.

   Faites en sorte que l'apprenant reformule l'idée avec la métaphore. Ne passez pas à une définition technique tant que ce modèle mental n'est pas visible. Utilisez une métaphore par nœud et portez-la de manière cohérente à travers l'animation, les étapes et la vérification.

3. Planifiez la chaîne de connaissances principale. Utilisez 4 à 6 nœuds principaux par défaut et 3 seulement lorsque le sujet ne peut vraiment pas en supporter davantage. Sélectionnez les types de nœuds dans un ordre de profondeur non décroissant parmi :

   phénomène → mécanisme → principe → théorie → frontière → limite.

   Le nœud d'ouverture doit être quelque chose que l'apprenant peut reconnaître. Chaque nœud pose une question causale. Chaque nœud y répond en une phrase, normalement de 20 à 60 caractères, et suggère au plus trois branches facultatives. Le nœud suivant doit répondre à la partie non résolue du nœud précédent plutôt que de la reformuler.

4. Recherchez chaque nœud. Tenez un registre des preuves pendant la recherche. Privilégiez les articles originaux, les pages officielles, les normes, les manuels et les rapports institutionnels. Enregistrez les dates des événements séparément de la publication, du prototype, du déploiement opérationnel et de l'adoption. Signalez honnêtement les preuves manquantes.

5. Enseignez une nouvelle idée à la fois. Par défaut, utilisez meta.audience.explanationLevel = "child" sauf si la demande spécifie un public plus averti. Avant d'introduire un terme ou une formule, ancrez-le dans une scène et une métaphore familières. Chaque nœud doit inclure un pont, une analogy utilisable, une correspondance en langage simple, des étapes causales ordonnées et une vérification « prédire, puis révéler ». Les nœuds de mécanisme, principe, théorie et frontière nécessitent l'analogie ; un phénomène peut utiliser sa scène d'ouverture directement, et une limite peut utiliser un contre-exemple.

6. Concevez des opérations d'apprentissage actif. Au moins un visuel de connaissance sur chaque page doit inviter l'apprenant à faire quelque chose, et une page de 4 à 6 nœuds doit normalement inclure 2 à 3 de ces opérations. Choisissez parmi la prédiction avant révélation, la manipulation de paramètres avec une conséquence en direct, ou un bouton à bascule qui compare deux conditions. Liez chaque interaction à la métaphore du nœud et mettez à jour le feedback immédiatement ; l'apprenant doit découvrir la relation en agissant, pas en cliquant sur un contrôle décoratif. N'ajoutez pas une interaction qui ne fait que répéter la réponse. Les nœuds de mécanisme et de principe nécessitent un laboratoire en bac à sable autonome ; choisissez simulation, diagramme, code, jeu, 3D spatiale ou pratique procédurale en fonction de la connaissance. Les laboratoires adjacents ne doivent pas utiliser la même modalité. Pour l'évaluation, pré-rédigez exactement cinq questions à choix unique pour chaque nœud principal. Générez chaque option correcte, réponse modèle, explication et liste de sources avec la question. Ne dépendez jamais d'un modèle d'exécution pour noter. La sélection d'une option doit immédiatement révéler un feedback vert-correct ou rouge-incorrect ainsi que l'explication ; n'exigez pas d'action de soumission ou de bouton « vérifier la maîtrise » de la chaîne entière. Après la première réponse dans un nœud, affichez une carte de réponses à cinq emplacements avec des états vert-correct, rouge-incorrect et neutre-non-répondu ; chaque emplacement ramène à cette question. Masquez l'action Suivant après que la cinquième question a été répondue. Exposez également un quiz global contenant toutes les questions par nœud à partir du sélecteur de vue globale supérieur.

7. Associez animation et vidéo au point de confusion. Animez la métaphore faisant le travail causal, puis stabilisez-vous sur une image étiquetée. Chaque nœud de connaissance nécessite exactement cinq vidéos externes vérifiées. L'onglet Vidéo présente un lecteur principal suivi de quatre cartes miniatures pour les vidéos restantes. La sélection d'une miniature remplace le lecteur principal. Les cinq clips démontrent le même nœud à travers des phénomènes réels, des expériences ou des explications visuelles alternatives. N'inventez jamais d'URLs, de miniatures, de métriques ou de support d'intégration pour en atteindre cinq. Différents nœuds de connaissance doivent utiliser différents enregistrements vidéo. Exposez une vue de bibliothèque vidéo globale à partir du sélecteur global supérieur, séparée de l'ensemble de cinq vidéos de chaque nœud. Conservez les lacunes de la plateforme ou de la vérification réseau dans les métadonnées de preuve ; ne les présentez pas comme des avertissements destinés à l'apprenant dans l'onglet Vidéo. Utilisez SVG/SMIL en ligne en premier lorsqu'il explique le mouvement causal. Ce n'est que lorsque Manim rend une transformation, une trajectoire, une force ou une métaphore mathématique matériellement plus claire que vous devez planifier une scène Manim au niveau du nœud. Sondez l'environnement d'exécution uniquement à ce stade. Si une configuration est nécessaire, exécutez la commande plan, montrez ses commandes complètes et l'emplacement du cache isolé, et demandez un consentement explicite avant d'exécuter install --confirmed. Si le consentement est refusé ou si la configuration échoue, utilisez SVG pour le reste de cette génération et ne répétez pas l'invite.

8. Placez les explications complètes derrière la divulgation. La carte du nœud ne possède que la question et la réponse en une phrase. Un inspecteur latéral peut inclure une courte plongée approfondie, une analogie, un diagramme sourcé, des preuves, des vidéos/ressources et une vérification au niveau du nœud. Placez les personnes et institutions correspondant aux sources dans Contexte de Recherche, et les applications, événements chronologiques et statut de déploiement de pointe correspondant aux sources dans Développement Industriel. Gardez les deux onglets filtrés sur l'ensemble de sources du nœud ; ne dupliquez jamais un CTA d'arrière-plan global dans la zone d'achèvement de la chaîne ou d'en-tête. L'inspecteur utilise cinq onglets : Comprendre, Vidéo, Contexte de Recherche, Développement Industriel et Vérifier la Compréhension. Les branches restent repliées jusqu'à ce qu'elles soient explicitement ouvertes. L'onglet vidéo charge un lecteur principal vérifié et quatre choix de miniatures ; les autres lecteurs ne se chargent que lorsqu'ils sont sélectionnés. Ne rendez pas les puces de source numériques S1, S2 ou similaires dans les panneaux de nœuds destinés à l'apprenant. Conservez les ID de source dans le JSON pour la traçabilité.

9. Créez le HTML complet. Placez toutes les données dans #deepwhy-data et rendez-le avec le modèle. Utilisez un SVG en ligne révisé pour un diagramme de mécanisme lorsque cela est possible. Ne présentez jamais une image d'atmosphère générée par IA comme un mécanisme factuel. Pour le mouvement, l'exécution séquentielle, le changement d'état, la propagation, le flux ou le feedback, utilisez une animation SVG en ligne chaque fois que le mouvement porte l'explication ; conservez un état stable lisible et un équivalent textuel statique. Affichez les images des nœuds en entier : préservez le rapport hauteur/largeur intrinsèque et utilisez un ajustement de type « contain » plutôt que le recadrage. Gardez les étiquettes essentielles en dehors des images matricielles. Augmentez le viewBox, divisez le visuel ou supprimez les détails secondaires plutôt que de permettre un chevauchement. Gardez la prose substantielle et les citations en dehors du DOM écrit à la main. Sur ordinateur, composez un espace de travail d'apprentissage de la hauteur de la fenêtre : un canevas de graphe de nœuds de 40 à 46 % à côté d'un banc de leçon dominant. Le laboratoire sélectionné et la réflexion appartiennent au banc. Sur mobile, revenez au flux de document normal et ouvrez le banc comme une feuille inférieure. Si un nœud a manim, rendez une animation muette, en boucle et en ligne (playsinline) au-dessus du laboratoire du nœud, avec son affiche, sa légende, sa transcription, son action de relecture et un SVG en ligne de secours. Le mode de mouvement réduit doit afficher l'affiche sans lecture automatique. Le constructeur intègre les actifs WebM et WebP locaux dans le HTML final.

10. Choisissez la direction visuelle. Utilisez deepwhy par défaut : le langage de classe inspiré d'OpenMAIC avec une scène pointillée presque blanche, une encre neutre et froide, des actions violettes retenues, des panneaux arrondis flottants et un banc d'interaction dominant. atlas, chronicle et fieldnotes sont des alternatives explicites, pas des correspondances thématiques automatiques. --style et DEEPWHY_PAGE_STYLE remplacent le choix de contenu. Les préréglages peuvent modifier la typographie, la couleur, les matériaux et les détails de mise en page ; ils ne peuvent pas modifier la sémantique des données ou les interactions.

    Avant d'écrire le HTML, enregistrez l'archétype, l'idée centrale, le visuel focal, la hiérarchie et le rythme des sections dans presentation. Construisez un point focal visuel dominant, puis variez la composition en fonction de l'objectif du nœud. Ne vous contentez pas d'une page d'accueil, d'un tableau de bord, d'un modèle d'article ou d'une grille de cartes répétée.

11. Validez l'expérience. Exécutez la validation du contenu, les tests unitaires et un test Playwright lorsqu'il est disponible. Confirmez que le premier écran montre la chaîne, l'idée clé, la position actuelle et l'action suivante ; un seul détail de nœud et un seul lecteur vidéo sont actifs à la fois ; les branches restent subordonnées au chemin principal ; et tout le matériel d'arrière-plan reste accessible. Inspectez chaque diagramme aux largeurs d'écran d'ordinateur et de mobile pour détecter le texte, les contrôles, les légendes, les marques essentielles et le contenu d'image recadré ou coupé. Vérifiez qu'un mouvement significatif est présent là où il aide à expliquer l'idée, s'installe dans un cadre lisible et respecte les préférences de mouvement réduit. Confirmez que chaque nœud central permet à l'apprenant de reformuler l'idée avec sa métaphore, de la transférer une fois et de reconnaître où la métaphore se brise. Vérifiez que les vidéos liées soutiennent le nœud actuel plutôt que de servir de toile de fond sans rapport. Exercez chaque interaction et confirmez que la modification de l'entrée produit une conséquence visible et véridique. Passez en revue la composition complète et la version mobile. Si cela ressemble à une page SaaS générique générée par IA, reconcevez-la avant la livraison.

Couverture du contenu

Les anciens modules éducatifs sont toujours couverts, mais ils ne correspondent plus à 12 longues sections de page :

• phénomène, mécanisme, principe, théorie, frontière et limite deviennent des types de nœuds de la chaîne ;
• la scène familière, la métaphore principale, la correspondance animée et la règle simple vivent dans le détail du nœud ;
• chaque nœud de mécanisme et de principe contient un laboratoire pratique en bac à sable suivi d'une reformulation libre et d'une conclusion de référence différée ;
• les vidéos sont liées au nœud exact qu'elles aident à expliquer ;
• les personnes, institutions, applications, chronologie d'évolution, dernière frontière et inventaire des sources vivent dans le tiroir d'arrière-plan, avec des liens de recherche correspondant aux sources à l'intérieur du nœud droit pertinent ;
• les cinq vérifications à choix unique pré-rédigées de chaque nœud vivent dans son onglet Vérifier la Compréhension de l'inspecteur ;
• les questions suivantes deviennent des branches et des suggestions de suivi au niveau de la chaîne ; chaque recommandation est cliquable et crée un lien profond vers https://deepwhy.cn/ avec le sujet actuel et la question recommandée dans l'URL ;
• aucun compte ou API n'est requis ; le HTML reste utile de manière indépendante tandis que les questions recommandées peuvent ouvrir la plateforme DeepWhy.

Le sélecteur de vue globale supérieur est une surface d'orientation importante. Il rend la chronologie de développement combinée et l'étape actuelle, les personnes associées, la bibliothèque vidéo complète...