Mermaid

Mermaid-Diagramme fuer die ZHAW-BSc-Thesis

Erzeugt Mermaid-Code im wissenschaftlichen Minimalstil ruhig, lesbar, druckfreundlich. Diagramme sollen den Text ergaenzen, nicht ueberlagern kein Farbrauschen, keine Schatten, keine 3D-Effekte.

Workflow

1. Diagrammtyp bestimmen — kuratierte Liste unten zuerst pruefen.
2. Referenz lesen — nur die Datei fuer den gewaehlten Typ aus references/ laden (sind gross — nicht alle auf einmal).
3. Inhalt strukturieren — semantisch benannte Knoten, klare Labels, keine Fuellwoerter. Schweizer Hochdeutsch (siehe [[wiss-schreiben-bsc]]), d.h. ss statt scharfes-s, Schweizer Guillemets wenn benoetigt.
4. Style-Preset anwenden — Default ist scientific-minimal (s.u.). Farbakzent nur wenn der Inhalt es zwingend braucht (z.B. Hervorhebung eines DSR-Artefakts gegenueber Umgebung).
5. Output — Code in mermaid-Codefence, plus kurze Notiz, wohin die Datei gehoert (latex/figures/mermaid/<name>.mmd) und welche Bildunterschrift in LaTeX passt. Wenn der Output in die Thesis fliesst: Hinweis auf [[ki-deklaration-bsc]] geben.

Style-Presets (verbindlich)

Beide Presets nutzen das base-Theme — nur dieses ist anpassbar. Schrift wird auf eine neutrale Sans-Serif gestellt, damit Diagramme auch in einem Times-New-Roman-Fliesstext nicht typografisch durcheinanderwirken (Tufte-Konvention: Abbildungstext darf vom Fliesstext abweichen, solange er in sich konsistent ist).

Preset A — scientific-minimal (Default)

Reines Graustufenbild. Verwenden fuer fast alle Diagramme.

---
config:
  theme: base
  themeVariables:
    fontFamily: 'Inter, Helvetica Neue, Arial, sans-serif'
    fontSize: '14px'
    background: '#FFFFFF'
    primaryColor: '#F4F4F5'
    primaryTextColor: '#18181B'
    primaryBorderColor: '#3F3F46'
    secondaryColor: '#FAFAFA'
    secondaryTextColor: '#18181B'
    secondaryBorderColor: '#71717A'
    tertiaryColor: '#FFFFFF'
    tertiaryTextColor: '#18181B'
    tertiaryBorderColor: '#A1A1AA'
    lineColor: '#52525B'
    textColor: '#18181B'
    mainBkg: '#F4F4F5'
    noteBkgColor: '#FAFAFA'
    noteTextColor: '#18181B'
    noteBorderColor: '#A1A1AA'
    clusterBkg: '#FAFAFA'
    clusterBorder: '#A1A1AA'
    edgeLabelBackground: '#FFFFFF'
---

Preset B — scientific-accent (sparsam)

Wie A, ergaenzt um genau einen dezenten Blau-Akzent. Nur einsetzen, wenn exakt eine semantische Kategorie hervorgehoben werden soll (z.B. "DSR-Artefakt" vs. "Umweltvariablen", "Treatment" vs. "Kontrolle"). Maximal 1–2 Knoten pro Diagramm im Akzent — sonst entsteht Rauschen.

Akzentfarbe: #1E40AF (gedaempftes Indigo-Blau, gut druckbar in S/W als mittleres Grau). Anwendung per classDef/class:

flowchart LR
    A[Eingang] --> B[Verarbeitung]
    B --> C[Ergebnis]
    classDef accent fill:#DBE3F2,stroke:#1E40AF,color:#0B1F4F,stroke-width:1.5px
    class B accent

Stilregeln (immer)

• Eine Aussage pro Diagramm. Wenn zwei Aussagen drinstecken, sind es zwei Diagramme.
• Layout-Richtung: Flowcharts LR (Links→Rechts) bevorzugen — passt in den 12.4 cm breiten Textbereich der Thesis. Nur wenn Hierarchie dominant ist: TD.
• Beschriftungen: Vollstaendige Substantive, keine Verbalsaetze ("Datenbereinigung" statt "Daten werden bereinigt"). Knoten kurz halten (max. vier Woerter), Details in den Fliesstext.
• Kanten-Labels nur wenn sie Information tragen (Bedingung, Zahl, Verb). Pfeil-Stil: einfache durchgezogene Linie. Gestrichelt (-.->) nur fuer "optional/asynchron".
• Keine Emojis, keine Icons (fa:fa-*), keine Hintergrundbilder.
• Schriftgroessen nicht pro Knoten variieren — nur ueber themeVariables.
• Keine Subgraph-Verschachtelung tiefer als zwei Ebenen.
• Sprache: Deutsch, Schweizer Hochdeutsch. Englische Fachbegriffe unveraendert, wenn etabliert (z.B. Design Science Research).

Diagrammtypen — kuratiert fuer die BSc-Thesis

Diese Auswahl ist fuer eine wirtschaftsinformatische DSR-Arbeit sinnvoll. Andere Typen koennen auf Wunsch verwendet werden, aber zuerst hinterfragen, ob sie zur Aussage passen.

Typ	Wann	Referenz
Flowchart	Prozesse, Entscheidungsbaeume, DSR-Zyklus	flowchart.md
Sequence	Interaktionen, API-Calls, Akteurs-Reihenfolge	sequenceDiagram.md
State	Zustaende eines Artefakts/Systems	stateDiagram.md
ER	Datenmodell, konzeptionelles Schema	entityRelationshipDiagram.md
Gantt	Zeitplan/Meilensteine	gantt.md
Timeline	Forschungs-/Projekthistorie	timeline.md
Quadrant	Positionierung (2x2-Analyse)	quadrantChart.md
Requirement	Anforderungs-Traceability (DSR)	requirementDiagram.md
Sankey	Fluesse, Konversion	sankey.md
XY-Chart	Linien-/Balkendiagramme aus Code	xyChart.md

Weitere Typen (Class, C4, Git, Mindmap, Pie, Kanban, Architecture, Block, Packet, Radar, Treemap, User Journey, ZenUML) sind unter references/ verfuegbar — fuer diese Thesis selten relevant. Pie-Charts grundsaetzlich vermeiden; ein Balkendiagramm ist lesbarer.

Konfiguration im Detail

• Theming — vollstaendige themeVariables-Liste
• Directives — Diagramm-spezifische Konfiguration
• Layouts — Layout-Algorithmen
• Configuration — globale Settings
• Tidy Tree — Tidy-Tree-Layout
• Math — LaTeX-Mathe-Support

Output-Konvention

1. Code als mermaid-Codefence ausgeben.
2. Frontmatter mit Preset A einbinden (oder B, falls Akzent noetig).
3. Knoten in semantischen IDs (benutzer, datenbank, dsrZyklus1) benennen, nicht A/B/C. Labels in den eckigen Klammern bleiben menschen-lesbar.
4. Nach dem Code-Block: eine Zeile mit Vorschlag fuer Dateinamen (latex/figures/mermaid/dsr-prozess.mmd) und eine Zeile mit LaTeX-Caption-Vorschlag.
5. Wenn das Diagramm in die Thesis kommt: kurzer Hinweis zur KI-Deklaration ([[ki-deklaration-bsc]]), da Mermaid-Code KI-generiert ist und das fertige Bild somit eine KI-erstellte Visualisierung ist.

Beispiel-Output — DSR-Zyklus (Hevner)

---
config:
  theme: base
  themeVariables:
    fontFamily: 'Inter, Helvetica Neue, Arial, sans-serif'
    fontSize: '14px'
    background: '#FFFFFF'
    primaryColor: '#F4F4F5'
    primaryTextColor: '#18181B'
    primaryBorderColor: '#3F3F46'
    lineColor: '#52525B'
    clusterBkg: '#FAFAFA'
    clusterBorder: '#A1A1AA'
---
flowchart LR
    umfeld[Umfeld<br/>Menschen, Organisation, Technologie]
    wissen[Wissensbasis<br/>Theorien, Methoden, Modelle]
    subgraph forschung[Design Science Research]
        direction TB
        bauen[Artefakt entwickeln] --> evaluieren[Artefakt evaluieren]
        evaluieren -.-> bauen
    end
    umfeld -- Anforderungen --> forschung
    forschung -- Anwendung --> umfeld
    wissen -- Grundlagen --> forschung
    forschung -- Beitrag --> wissen

Dateiname: latex/figures/mermaid/dsr-zyklus.mmd Caption-Vorschlag: «Design-Science-Research-Zyklus nach Hevner (2007).»

---

Anforderung der Nutzerin/des Nutzers: $ARGUMENTS