Handbuch

1. Installation

Dieses Template benötigt drei Komponenten. Die gesamte Einrichtung dauert etwa drei Minuten.

2. Konzept und Arbeitsweise

Dieses Template erzeugt einen vollständig statisch gehosteten akademischen Artikel mit interaktivem Quellenmanagement. Claude Code dient als Schreib- und Rechercheassistent — du behältst die inhaltliche Kontrolle.

Das Besondere am Konzept:

• Keine Datenbank, kein CMS. Alle Inhalte liegen als Markdown-Dateien und eine JSON-Quellendatei vor. Ein Python-Script baut daraus eine vollständige HTML-Seite und einen LaTeX-Export.
• Funktioniert lokal und online. Alle Seiten laufen direkt über file:// ohne Webserver — und genauso auf jedem normalen Hosting.
• KI als Assistent, nicht als Autor. Claude recherchiert Quellen, schlägt Strukturen vor und liefert Entwürfe. Du entscheidest, was bleibt, und überarbeitest.
• Zwei Export-Formate: HTML (mit interaktiven Funktionen) und LaTeX (für professionellen Druck via Overleaf).

Typischer Workflow:

1. Claude befüllt meta.json mit deinen Angaben
2. Recherchiert 5–10 Kernquellen → erster Build → du siehst sofort die Quellenübersicht
3. Legt Kapitelgerüste an → Build → du siehst die Seitenstruktur
4. Recherchiert weitere Quellen (bis 100–150) mit URL-Verifikation
5. Schreibt die Kapitel aus → Build nach jedem Kapitel
6. Erstellt die Präsentation mit KI-Folienbildern

3. Seiten und Navigation

4. Fachartikel — Funktionen

Der Fachartikel (standalone.html) enthält mehrere interaktive Elemente:

5. Export (LaTeX + Web-Paket)

Der ↓ Export-Button im Artikel öffnet ein Overlay mit zwei Tabs:

LaTeX-Optionen im Detail:

Die Seitenschätzung wird live berechnet und berücksichtigt alle vier Parameter. Die tatsächliche Seitenzahl kann durch Tabellen, Abbildungen und Formeln abweichen.

Download: Die .tex-Datei wird direkt im Browser generiert und heruntergeladen — kein Server nötig. Die Datei ist für pdflatex (Overleaf, TeX Live, MiKTeX) vorbereitet.

6. Quellenverzeichnis

Das interaktive Quellenverzeichnis bietet:

• Volltextsuche über Titel, Autoren, Abstract und Notizen
• Filter nach Typ (Journal, Konferenz, Buch, Preprint, Bericht, Web), Sprache, Badges und Score
• Sortierung nach Score, Jahr, Titel
• Zitations-Backlinks: Bei zitierten Quellen erscheinen ①②③-Symbole, die direkt zur Textstelle im Artikel springen
• Qualitätsbadges, Sternebewertung, Abstract-Vorschau, DOI/URL-Links

7. Badges — Bedeutung und Farben

Jede Quelle kann mehrere Badges tragen. Sie geben auf einen Blick Auskunft über Typ und Qualität:

8. Qualitätsbewertung (Score)

Jede Quelle erhält einen Score von 3–10. Er setzt sich aus drei Kriterien zusammen:

Score = Authority + Recency + Relevance (Maximum 10). Farbcodierung:

9. Relevanz-Kategorien anpassen

Die Relevanz-Dimension (1–3) muss zum Thema deines Artikels passen — nicht jeder schreibt über dasselbe Thema. Die Beschreibungen werden über content/meta.json gesteuert:

{
  "relevance_topic": "KI im Geometrieunterricht",
  "relevance_3": "Direkt: KI + Geometrie + Bildung",
  "relevance_2": "KI + Mathematik oder Geometrie + Didaktik",
  "relevance_1": "Allgemein KI-Bildung, Rahmendokumente"
}

Diese Texte erscheinen im Quellenverzeichnis bei der Bewertungsmethodik. Claude verwendet sie außerdem als Leitfaden, um neue Quellen korrekt einzuordnen.

Beispiel für ein anderes Thema:

{
  "relevance_topic": "Nachhaltigkeit in der Architekturausbildung",
  "relevance_3": "Direkt: Nachhaltige Architektur + Hochschuldidaktik",
  "relevance_2": "Architekturausbildung oder Nachhaltigkeitsdidaktik allgemein",
  "relevance_1": "Allgemeine Hochschuldidaktik, Rahmendokumente"
}

Wenn du die Felder nicht befüllst, verwendet build.py generische Fallback-Texte.

10. Abbildungen einbinden

Abbildungen werden im Ordner figures/ abgelegt und im Kapitel-Markdown referenziert:

![Beschriftung der Abbildung](figures/dateiname.png)

Der Build erzeugt daraus automatisch:

• HTML: <figure>-Element mit Abbildung N:-Nummerierung und Bildunterschrift
• LaTeX: \begin{figure}...\includegraphics...\caption{...}\end{figure} mit automatischer Nummerierung und Abbildungsverzeichnis

Unterstützte Formate: PNG, JPG, SVG (nur HTML), PDF (nur LaTeX).
Empfehlung für maximale Kompatibilität: PNG verwenden.

11. Build-System

Der gesamte Artikel wird durch ein einziges Python-Script erzeugt:

python3 build.py

Das Script liest:

• content/meta.json — Titel, Autoren, Abstract, Kapitelliste, Relevanz-Kategorien
• content/01_einleitung.md bis 10_ausblick.md — Kapitelinhalte (Markdown)
• sources/sources.json — alle Quellen mit Metadaten
• assets/css/paper.css — Stylesheet

Es erzeugt:

• standalone.html — vollständiger Artikel mit Zitationssystem und LaTeX-Export-Overlay
• standalone.tex — LaTeX-Datei (Farbe)
• standalone_sw.tex — LaTeX-Datei (Schwarz-Weiß)
• quellen.html wird aktualisiert (Quelldaten, Zitations-Backlinks und Relevanz-Texte eingebettet)

Zitationserkennung: Das Script erkennt automatisch alle APA-Zitate im Format (Nachname, Jahr) im Text, ordnet sie den Quellen in sources.json zu und erzeugt anklickbare Spans mit Quellenkarten-Overlay.

Wichtig: Nur das Format (Nachname, Jahr) wird erkannt — nicht [S001] oder andere Formate. Der Nachname muss exakt mit dem ersten Eintrag in authors in sources.json übereinstimmen.

12. Neue Quellen hinzufügen

Neue Quellen werden in sources/sources.json eingetragen. Die nächste freie ID steht im CLAUDE.md-File des Projekts.

Schema einer Quelle:

{
  "id": "S001",
  "title": "Titel des Werks",
  "authors": ["Nachname, V.", "Nachname2, V2."],
  "year": 2025,
  "journal": "Zeitschrift oder Verlag",
  "type": "journal",
  "lang": "en",
  "authority": 4,
  "recency": 3,
  "relevance": 3,
  "score": 10,
  "badges": ["peer", "openaccess"],
  "abstract": "Kurzzusammenfassung auf Deutsch.",
  "doi": "10.xxxx/xxxxx",
  "url": "https://...",
  "local": null,
  "retrieved": "2026-03-23",
  "notes": ""
}

Nach dem Eintrag: Im jeweiligen Kapitel-Markdown zitieren (Nachname & Nachname, Jahr) und im Literaturabschnitt am Kapitelende eine APA-7-Referenz ergänzen. Dann python3 build.py ausführen.

Zuletzt content/meta.json → source_count aktualisieren.

13. Präsentation

Die Präsentation (presentation/index.html) basiert auf Reveal.js 5.1.0 und bietet: