Communitygithub.com

DeepWhy Knowledge Chain

Erstelle interaktive, analogy-basierte Wissensketten-Seiten, inspiriert von OpenMAIC, die komplexe Fragen durch vertraute Szenen, explizite Metaphern-Zuordnungen, Sandbox-Praktika, gezielte Video-Unterstützung und fundierte Erklärungen von Phänomenen bis zu Grenzen verständlich machen.

Was ist DeepWhy Knowledge Chain?

Dieser Skill befähigt einen KI-Agenten, anstatt eines langen Artikels eine kompakte, interaktive Wissenskette aus 3–6 Kernideen zu erstellen. Jede Idee wird an einem vertrauten Szenario und einer nutzbaren Metapher aufgehängt, die bei kausalen Zusammenhängen animiert wird. Die Lernumgebung fördert aktives Entdecken durch Vorhersagen, Parameter-Manipulation und Sandbox-Labore – insbesondere bei Mechanismus- und Prinzip-Knoten. Die Ausgabe ist eine einzige, eigenständige HTML-Datei mit eingebettetem CSS/JS für Navigation, Zweige, Detail-Tabs, Quizfragen und JSON-Export. Der Skill folgt einer strengen pädagogischen Progression (Phänomen → Mechanismus → Prinzip → Theorie → Grenze), nutzt maximal eine kettenweite Ankermetapher und bindet für jeden Knoten fünf geprüfte externe Videos ein. Er unterstützt die visuellen Stile 'deepwhy', 'atlas', 'chronicle' und 'fieldnotes' und validiert das finale Produkt auf Vollständigkeit, Barrierefreiheit und Korrektheit der Lerninteraktionen.

Funktioniert mit~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/deepwhy/deepwhy-skill/tree/HEAD/skills/deepwhy

In Ihrer bevorzugten KI fragen

Öffnet einen neuen Chat, in dem dieser Agent-Skill bereits geladen ist.

Dokumentation

Was macht DeepWhy Knowledge Chain?

Erstelle ein Wissenserkundungserlebnis, keinen langen Artikel mit einem Inhaltsverzeichnis. Die primäre Oberfläche ist eine kompakte, interaktive Kette von 3–6 Ideen, die von einem vertrauten Phänomen zu einem Mechanismus, Prinzip, einer Theorie, der aktuellen Forschungsfront oder einer bekannten Grenze fortschreitet.

Das Lernerlebnis muss dem Lernenden helfen, zu verstehen, nicht nur eine gut belegte Erklärung zu erhalten. Ordne jede Kernidee um eine vertraute Szene und eine nutzbare Metapher an. Zeige diese Metapher in Bewegung, wenn Veränderung oder Kausalität im Spiel ist, und bilde sie dann in einfacher Sprache auf den realen Mechanismus ab. Video ist eine zweite Erklärung oder eine reale Bestätigung für denselben Knoten, niemals ein generischer Vortrag, der eine Quote erfüllen soll.

Bevorzuge eine kettenweite Ankermetapher. Verwende sie wieder und vertiefe sie über benachbarte Knoten hinweg, solange sie die neue Frage noch erklärt; wechsle nur, wenn das alte Modell an eine echte Grenze stößt. Der Lernende soll ein sich entwickelndes mentales Modell aufbauen, nicht von Karte zu Karte zusammenhanglose Beispiele sammeln.

Der Standard-Liefergegenstand ist eine einzelne eigenständige HTML-Datei. Sie muss ein nützliches lokales Erlebnis ohne Build-Schritt bewahren: Knotenauswahl, Vor-/Zurück-Navigation, Zweige, Detail-Tabs, Zeitleistenfilterung, Bewertungs-Feedback, Hintergrunddossiers und JSON-Export verwenden eingebettetes CSS und JavaScript. Externe Paper, Videos, Bilder und DeepWhy selbst benötigen weiterhin ein Netzwerk.

Wissensträchtige Grafiken müssen lesbar bleiben: Keine Illustration, kein Diagramm, keine Animation oder Überlagerung darf Text, Anmerkungen, Steuerelemente, Bildunterschriften oder kritische Markierungen verdecken. Wenn eine Beziehung von Natur aus zeitlich oder kausal ist, bevorzuge eine zielgerichtete Animation gegenüber einem statischen Schnappschuss.

Lies nur, was die Aufgabe benötigt

Beginne mit assets/template.html, nicht mit einer leeren Seite. Verwende die Vorlage und Skripte als strukturelle Verträge, nicht als Quellen für Fakten.

Baue das Lernerlebnis

  1. Rahme den Lernenden und die Frage ein. Extrahiere das Thema, die tatsächliche Frage, das wahrscheinliche Vorwissen und die beabsichtigte Tiefe. Bewahre eine falsche Prämisse in meta.premiseCheck, markiere sie als corrected, erkläre sie kompakt und fahre mit der korrigierten Frage fort. Höre nicht bei der Korrektur auf.

  2. Entwerfe den Lehrpfad vor der Recherche von Details. Identifiziere für jeden Kernknoten:

    erkennbare Szene → eine Metapher → 2–4 explizite Zuordnungen → animierter kausaler Beat → Erklärung in einfacher Sprache → relevantes Video → Transfer-Check → Metapherngrenze.

    Lasse den Lernenden die Idee mit der Metapher nacherzählen. Gehe erst zu einer technischen Definition über, wenn dieses mentale Modell sichtbar ist. Verwende eine Metapher pro Knoten und führe sie konsistent durch die Animation, Schritte und Überprüfung.

  3. Plane die Haupt-Wissenskette. Verwende standardmäßig 4–6 Hauptknoten und nur 3, wenn das Thema wirklich nicht mehr hergibt. Wähle Knotentypen in nicht abnehmender Tiefenordnung aus:

    Phänomen → Mechanismus → Prinzip → Theorie → Grenze → Grenzbereich.

    Der Eröffnungsknoten muss etwas sein, das der Lernende erkennen kann. Jeder Knoten stellt eine kausale Frage. Jeder Knoten beantwortet sie in einem Satz, normalerweise 20–60 Zeichen, und schlägt höchstens drei optionale Zweige vor. Der nächste Knoten muss den unbeantworteten Teil des vorherigen Knotens beantworten, anstatt ihn zu wiederholen.

  4. Recherchiere jeden Knoten. Führe während der Recherche ein Belegprotokoll. Bevorzuge Originalarbeiten, offizielle Seiten, Standards, Lehrbücher und institutionelle Berichte. Erfasse Ereignisdaten getrennt von Veröffentlichung, Prototyp, operativer Bereitstellung und Adoption. Markiere fehlende Belege ehrlich.

  5. Lehre jeweils eine neue Idee. Standardmäßig verwende meta.audience.explanationLevel = "child", es sei denn, die Anfrage gibt ein tieferes Publikum vor. Bevor du einen Begriff oder eine Formel einführst, verankere ihn in einer vertrauten Szene und Metapher. Jeder Knoten muss eine Brücke, eine nutzbare analogy, eine Zuordnung in einfacher Sprache, geordnete kausale Schritte und eine „Vorhersage, dann Enthüllung“-Überprüfung enthalten. Mechanismus-, Prinzip- und Theorieknoten erfordern die Analogie; ein Phänomen kann direkt seine Eröffnungsszene verwenden, und eine Grenze kann ein Gegenbeispiel nutzen.

  6. Entwerfe aktive Lernoperationen. Mindestens eine Wissensgrafik auf jeder Seite muss den Lernenden zum Handeln einladen, und eine Seite mit 4–6 Knoten sollte normalerweise 2–3 solcher Operationen enthalten. Wähle zwischen Vorhersage vor Enthüllung, Parametermanipulation mit Live-Konsequenz oder einem Umschalter, der zwei Bedingungen vergleicht. Binde jede Interaktion an die Metapher des Knotens und aktualisiere das Feedback sofort; der Lernende soll die Beziehung durch Handeln entdecken, nicht durch Klicken auf ein dekoratives Steuerelement. Füge keine Interaktion hinzu, die lediglich die Antwort wiederholt. Mechanismus- und Prinzipknoten erfordern ein in sich geschlossenes Sandbox-Labor; wähle Simulation, Diagramm, Code, Spiel, räumliches 3D oder prozedurale Übung je nach Wissen. Benachbarte Labore dürfen nicht dieselbe Modalität verwenden. Für die Bewertung erstelle im Voraus genau fünf Single-Choice-Fragen für jeden Hauptknoten. Generiere jede richtige Option, Musterantwort, Erklärung und Quellenliste zusammen mit der Frage. Verlasse dich niemals auf ein Laufzeitmodell zur Bewertung. Die Auswahl einer Option muss sofort grünes (richtig) oder rotes (falsch) Feedback plus die Erklärung anzeigen; erfordere keine Absenden-Aktion oder einen „Gesamtverständnis bestätigen“-Button. Zeige nach der ersten Antwort in einem Knoten eine Fünf-Felder-Antwortkarte mit grün (richtig), rot (falsch) und neutral (unbeantwortet); jedes Feld springt zu dieser Frage zurück. Verstecke die Weiter-Aktion, nachdem die fünfte Frage beantwortet wurde. Stelle außerdem ein globales Quiz bereit, das alle knotenspezifischen Fragen aus dem oberen globalen Ansichtswechsler enthält.

  7. Paare Animationen und Videos an der Stelle der Verwirrung. Animiere die Metapher, die die kausale Arbeit verrichtet, und setze dann auf einer beschrifteten Standversion auf. Jeder Wissensknoten erfordert genau fünf überprüfte externe Videos. Der Video-Tab zeigt einen primären Player, gefolgt von vier Miniaturkarten für die restlichen Videos. Die Auswahl einer Miniatur tauscht den primären Player aus. Alle fünf Clips demonstrieren denselben Knoten durch reale Phänomene, Experimente oder alternative visuelle Erklärungen. Erfinde niemals URLs, Miniaturen, Metriken oder Embedding-Unterstützung, um auf fünf zu kommen. Verschiedene Wissensknoten müssen unterschiedliche Videoaufzeichnungen verwenden. Stelle eine globale Videobibliotheksansicht aus dem oberen globalen Wechsler bereit, getrennt vom Fünf-Video-Set jedes Knotens. Halte Plattform- oder Netzwerkverifizierungslücken in den Beweis-Metadaten fest; zeige sie nicht als lernerseitige Warnungen im Video-Tab an. Verwende zuerst Inline-SVG/SMIL, wenn es den kausalen Schritt erklärt. Nur wenn Manim eine Transformation, Trajektorie, Kraft oder mathematische Metapher wesentlich klarer macht, plane eine knotenbasierte Manim-Szene. Teste die Laufzeit erst an diesem Punkt. Falls Einrichtung erforderlich ist, führe den Plan-Befehl aus, zeige seine vollständigen Befehle und den isolierten Cache-Speicherort und bitte um explizite Zustimmung, bevor du install --confirmed ausführst. Wird die Zustimmung verweigert oder die Einrichtung schlägt fehl, verwende für den Rest dieser Generierung SVG und wiederhole die Aufforderung nicht.

  8. Platziere vollständige Erklärungen hinter Offenlegungen. Die Knotenkarte besitzt nur die Frage und die Ein-Satz-Antwort. Ein seitlicher Inspektor kann eine kurze Vertiefung, Analogie, quellengestütztes Diagramm, Belege, Videos/Ressourcen und eine knotenbasierte Überprüfung enthalten. Platziere quellenzugeordnete Personen und Institutionen im Forschungshintergrund und quellenzugeordnete Anwendungen, Zeitleistenereignisse und den Bereitstellungsstatus der Frontlinie in der Branchenentwicklung. Halte beide Tabs auf den Quellsatz des Knotens gefiltert; dupliziere niemals einen globalen Hintergrund-CTA im Kettenabschluss oder Kopfbereich. Der Inspektor verwendet fünf Tabs: Verstehen, Video, Forschungshintergrund, Branchenentwicklung und Verständnis überprüfen. Zweige bleiben eingeklappt, bis sie explizit geöffnet werden. Der Video-Tab lädt einen überprüften primären Player und vier Miniatur-Auswahlmöglichkeiten; andere Spieler laden nur, wenn sie ausgewählt werden. Rendere keine nummerischen Quellen-Chips wie S1, S2 in lernerseitigen Knotenfeldern. Bewahre Quellen-IDs im JSON für die Rückverfolgbarkeit.

  9. Erstelle das vollständige HTML. Lege alle Daten in #deepwhy-data ab und rendere sie mit der Vorlage. Verwende nach Möglichkeit ein überprüftes Inline-SVG für ein Mechanismusdiagramm. Präsentiere niemals ein KI-generiertes Atmosphärenbild als faktischen Mechanismus. Für Bewegung, sequenzielle Ausführung, Zustandsänderung, Ausbreitung, Fluss oder Feedback verwende Inline-SVG-Animation, wann immer die Bewegung die Erklärung trägt; behalte einen lesbaren Endzustand und einen statischen Textäquivalent bei. Zeige Knotenbilder vollständig an: Bewahre das intrinsische Seitenverhältnis und verwende eine Contain-Passform anstelle von Zuschneiden. Halte wesentliche Beschriftungen außerhalb von Rasterbildern. Vergrößere die viewBox, teile das Visual auf oder entferne sekundäre Details, anstatt Überlappungen zuzulassen. Halte substanzielle Prosa und Zitate aus handgeschriebenem DOM heraus. Auf dem Desktop erstelle eine lernorientierte Werkbank in Viewport-Höhe: eine 40-46% Knotengraph-Leinwand neben einer dominanten Lektionsbank. Das ausgewählte Labor und die Reflexion gehören in die Bank. Auf mobilen Geräten kehre zum normalen Dokumentenfluss zurück und öffne die Bank als unteres Blatt. Wenn ein Knoten manim hat, rendere eine stummgeschaltete, sich wiederholende, playsinline-Animation über dem Knotenlabor mit ihrem Poster, Bildunterschrift, Transkript, Wiederholungsaktion und Inline-SVG-Fallback. Der reduzierte Bewegungsmodus muss das Poster ohne Autoplay zeigen. Der Builder bettet lokale WebM- und WebP-Assets in das endgültige HTML ein.

  10. Wähle die visuelle Richtung. Verwende standardmäßig deepwhy: die von OpenMAIC inspirierte Unterrichtssprache mit einer fast weißen, gepunkteten Bühne, kühler neutraler Tinte, zurückhaltenden violetten Aktionen, schwebenden abgerundeten Feldern und einer dominanten Interaktionsbank. atlas, chronicle und fieldnotes sind explizite Alternativen, keine automatischen Themenübereinstimmungen. --style und DEEPWHY_PAGE_STYLE überschreiben die inhaltliche Wahl. Voreinstellungen können Typografie, Farbe, Materialien und Layoutelemente ändern; sie dürfen die Datensemantik oder Interaktionen nicht ändern.

    Bevor du HTML schreibst, halte den Archetyp, die zentrale Einsicht, das visuelle Fokusobjekt, die Hierarchie und den Abschnittsrhythmus in presentation fest. Baue einen dominanten visuellen Fokuspunkt, variiere dann die Zusammensetzung nach dem Zweck des Knotens. Verwende keine Standard-Zielseite, kein Dashboard, keine Artikelvorlage und kein wiederholtes Kartenraster.

  11. Validiere das Erlebnis. Führe Inhaltsvalidierung, Unit-Tests und einen Playwright-Test durch, wenn verfügbar. Bestätige, dass der erste Bildschirm die Kette, die Kernaussage, die aktuelle Position und die nächste Aktion zeigt; dass jeweils nur ein Knotendetail und ein Videoplayer aktiv sind; dass Zweige dem Hauptpfad untergeordnet bleiben; und dass alles Hintergrundmaterial erreichbar ist. Überprüfe jedes Diagramm in Desktop- und Mobilbreiten auf verdeckte oder abgeschnittene Texte, Steuerelemente, Bildunterschriften, wesentliche Markierungen und beschnittene Bildinhalte. Stelle sicher, dass sinnvolle Bewegung vorhanden ist, wo sie hilft, die Idee zu erklären, in einem lesbaren Rahmen endet und die Präferenzen für reduzierte Bewegung respektiert. Bestätige, dass jeder Kernknoten es dem Lernenden ermöglicht, die Idee mit ihrer Metapher nacherzählen, sie einmal zu transferieren und zu erkennen, wo die Metapher bricht. Überprüfe, dass verlinkte Videos den aktuellen Knoten unterstützen und nicht als zusammenhangsloser Hintergrund dienen. Übe jede Interaktion aus und bestätige, dass die Änderung der Eingabe eine sichtbare, wahrheitsgemäße Konsequenz erzeugt. Überprüfe die gesamte Komposition und die mobile Version. Wenn sie wie eine generische KI-generierte SaaS-Seite aussieht, gestalte sie vor der Auslieferung neu.

Inhaltsabdeckung

Die alten Bildungsmodule werden weiterhin abgedeckt, bilden aber nicht mehr 12 lange Seitenabschnitte ab:

  • Phänomen, Mechanismus, Prinzip, Theorie, Grenze und Grenzbereich werden zu Knotentypen der Kette;
  • die vertraute Szene, die primäre Metapher, die animierte Zuordnung und die einfache Regel leben in den Knotendetails;
  • jeder Mechanismus- und Prinzipknoten enthält ein Sandbox-Praktikum, gefolgt von freier Nacherzählung und einem verzögerten Referenzfazit;
  • Videos sind mit dem genauen Knoten verlinkt, den sie erklären helfen;
  • Personen, Institutionen, Anwendungen, Evolutionszeitleiste, neueste Grenze und Quelleninventar leben in der Hintergrundschublade, mit quellenzugeordneten Forschungslink im relevanten rechten Knoten;
  • die fünf vorab erstellten Single-Choice-Überprüfungen jedes Knotens leben im Inspektor-Tab „Verständnis überprüfen“;
  • nächste Fragen werden zu Zweigen und kettenübergreifenden Folgevorschlägen; jede Empfehlung ist klickbar und führt einen Deep-Link zu https://deepwhy.cn/ mit dem aktuellen Thema und der empfohlenen Frage in der URL;
  • es ist kein Konto oder API erforderlich; das HTML bleibt unabhängig nützlich, während empfohlene Fragen die DeepWhy-Plattform öffnen können.

Der obere globale Ansichtswechsler ist eine prominente Orientierungsoberfläche. Er rendert die kombinierte Entwicklungsszeitleiste und die aktuelle Stufe, verwandte Personen, die vollständige Videobibliothek und die gesamte Knotenkarte. Jeder Tab ist ein dünner Modal-Overlay über dem gesamten Erlebnis. Der Standardzustand des Overlays ist geschlossen.

Wissenskette

Haupt-Anforderungen an die Kette

  1. Tiefenprogression: Wähle Knotentypen in streng nicht abnehmender Tiefenordnung: Phänomen → Mechanismus → Prinzip → Theorie → Grenze → Grenzbereich. Ein Phänomenknoten kann am Anfang stehen; danach muss die Reihenfolge respektiert werden.
  2. Kausale Abhängigkeit: Jeder Knoten stellt eine kausale Frage (Wie führt A zu B?), beantwortet sie in einem Satz (20–60 Zeichen) und definiert höchstens drei optionale Zweige. Der nächste Hauptknoten beantwortet den unbeantworteten Teil des vorherigen, nicht eine neue Einführung.
  3. Einheitliche Metapher: Verwende eine kettenweite Ankermetapher. Führe sie im ersten Knoten ein, vertiefe sie in den nächsten und wechsle nur, wenn eine echte Grenze erreicht ist.
  4. Knotenanzahl: Standardmäßig 4–6 Hauptknoten. Verwende 3 nur, wenn das Thema wirklich nicht mehr unterstützt.
  5. Erster Knoten: Er muss etwas sein, das der Lernende erkennt (ein alltägliches Phänomen oder eine vertraute Szene).

Anforderungen an jeden Knoten

Jeder Knoten muss enthalten:

  • Frage: Eine kausale Frage, die dieser Knoten beantwortet.
  • Ein-Satz-Antwort: Kurz (20–60 Zeichen), in einfacher Sprache.
  • Metapher: Eine nutzbare Metapher, die in der ganzen Kette konsistent ist.
  • Vertraute Szene: Eine Szene, die der Lernende wiedererkennt.
  • Animierte kausale Abbildung: Zeige die Metapher in Aktion (mache die Kausalität durch Bewegung klar), dann ordne sie auf den realen Mechanismus ab.
  • Erklärung in einfacher Sprache: Nach der Animation erkläre den Mechanismus in einfachen Worten.
  • Video: Mindestens ein externes Video, das denselben Knoten demonstriert.
  • Verständnisüberprüfung: Eine „Vorhersage, dann Enthüllung“-Überprüfung mit der Metapher.
  • Metapherngrenze: Erkläre, wo die Metapher nicht mehr zutrifft (wenn relevant).
  • Fakultativ: Labor (für Mechanismus und Prinzip), Zweiglinks, Bewertungsfragen.

Hinweise zu Metaphern

  • Wähle eine Metapher, die die kausale Beziehung widerspiegelt.
  • Verwende sie als Erzählfaden durch die Kette.
  • Mache die Zuordnung explizit: „A ist wie B, weil ...“.
  • Animation: Zeige die Metapher, die die kausale Arbeit verrichtet, dann friere sie in einem beschrifteten Standbild ein.
  • Überprüfung: Lasse den Lernenden die Erklärung mit der Metapher wiederholen.

Visuelles System

  • Standardmäßig deepwhy: offene, helle Bühne, violette Akzente, abgerundete Karten.
  • Alternativen: atlas (dunkler, erdiger, kartografisch), chronicle (zeitungsartig, serifenbetont), fieldnotes (Notizbuch-Stil, skizzenhaft).
  • Überschreibbar durch --style-Flag oder Umgebungsvariable.
  • Keine Änderung der Datensemantik oder Interaktionen.

Autoren-Tools

Dieses Skill nutzt keine Autoren-Tools im herkömmlichen Sinne, aber erwähnt:

  • Manim: Nur verwenden, wenn Mathematik, Transformation, Trajektorie oder Kräfte wesentlich klarer zu erklären sind. Vorher Probe der Laufzeit mit Plan-Befehl. Erfordert explizite Zustimmung zur Installation.
  • Playwright: Verfügbar zum Testen der finalen HTML-Datei auf korrekte Interaktionen.
  • Inline-SVG/SMIL: Bevorzugt vor Manim für einfache Bewegung.

Testen und Qualitätssicherung

Führe nach der Erstellung der HTML-Datei Folgendes durch:

  1. Inhaltsprüfung: Sind alle Knoten vorhanden? Haben sie Fragen, Antworten, Metaphern, Videos?
  2. Visuelle Prüfung: Sind Diagramme lesbar? Keine verdeckten Texte. Sind Bilder vollständig sichtbar?
  3. Interaktionsprüfung: Funktionieren Navigation, Video-Player, Tabs, Vorhersage-Überprüfungen, Quiz?
  4. Mobile Prüfung: Funktioniert das Layout auf kleinen Bildschirmen? Öffnet sich die Bank als unteres Blatt?
  5. Barrierefreiheitsprüfung: Respektiert Bewegung die reduce-motion-Präferenz? Sind Texte ausreichend kontrastreich?
  6. Zufriedenheitsprüfung: Sieht die Seite aus wie eine generische KI-SaaS-Seite? Wenn ja, gestalte sie neu.

Abschlusskriterien

  • Die erste Ansicht zeigt die Kette, die Kernaussage, die aktuelle Position und die nächste Aktion.
  • Nur ein Knotendetail und ein Videoplayer sind gleichzeitig aktiv.
  • Zweige bleiben untergeordnet.
  • Hintergrundmaterial ist erreichbar, aber nicht im Hauptfluss.
  • Diagramme sind lesbar und zeigen Mechaniken korrekt.
  • Jeder Kernknoten ermöglicht eine Nacherzählung mit der Metapher.
  • Videos unterstützen den aktuellen Knoten.
  • Quizfragen haben sofortiges Feedback (grün/rot).
  • Keine Abhängigkeit von einem API- oder Laufzeitmodell zur Bewertung.
  • Die HTML-Datei ist eigenständig und offline verwendbar (mit Ausnahme externer Medien).

Offene Fragen

  • Manchmal muss eine Metapher gewechselt werden – dokumentiere, wo und warum.
  • Wenn ein Knoten keine fünf Videos finden kann, dokumentiere die Lücke und verwende, was verfügbar ist.
  • Wenn ein Labor nicht sinnvoll ist (z. B. für einen Theorienknoten), dokumentiere dies und überspringe es.

Dieses Skill produziert eine HTML-Datei, die als vollständiges Lernmodul dient. Die Qualität der Erklärung und der Interaktivität steht im Vordergrund.

Verwandte Skills