Update public/index.html

public/index.html

@@ -517,7 +517,98 @@ body {
 
     </section><!-- /Services Section -->
 
-   
+   <!-- Neue section in Juni 2025 -->
+
+        <!-- Arbeitsprozess Section -->
+          <section id="arbeitsprozess" class="arbeitsprozess section" style="padding: 60px 20px; background: #f9f9f9;">
+            <div class="container">
+              <h2 style="text-align:center; margin-bottom: 40px;">Arbeitsprozess der Arbeitspakete</h2>
+
+              <div style="max-width: 1000px; margin: 0 auto; position: relative;">
+
+                <!-- AP-Boxen als flexibles Grid -->
+                <div style="display: flex; flex-wrap: wrap; justify-content: center; gap: 20px;">
+
+                  <!-- AP1 -->
+                  <a href="ki-kompetenzen.html" class="ap-box" style="flex: 1 1 300px; background: #00bcd4; color: white; padding: 20px; border-radius: 8px; text-decoration: none; box-shadow: 0 3px 6px rgba(0,0,0,0.1);">
+                    <h3>AP 1: Kompetenzmatrix für KI</h3>
+                    <p>Interdisziplinäre Kompetenzmatrix zur Orientierung und Validierung mit Learning Analytics.</p>
+                  </a>
+
+                  <!-- Pfeil -->
+                  <div style="align-self: center; font-size: 24px; color: #00bcd4;">→</div>
+
+                  <!-- AP2 -->
+                  <a href="ki-ethik.html" class="ap-box" style="flex: 1 1 300px; background: #f44336; color: white; padding: 20px; border-radius: 8px; text-decoration: none; box-shadow: 0 3px 6px rgba(0,0,0,0.1);">
+                    <h3>AP 2: Ethische Leitlinien</h3>
+                    <p>Werterahmen und konkrete ethische Leitlinien für den Umgang mit KI in der Hochschulbildung.</p>
+                  </a>
+
+                  <!-- Pfeil -->
+                  <div style="align-self: center; font-size: 24px; color: #f44336;">→</div>
+
+                  <!-- AP3 -->
+                  <a href="learning-analytics.html" class="ap-box" style="flex: 1 1 300px; background: #ff9800; color: white; padding: 20px; border-radius: 8px; text-decoration: none; box-shadow: 0 3px 6px rgba(0,0,0,0.1);">
+                    <h3>AP 3: Learning-Analytics-Infrastruktur</h3>
+                    <p>Technische Infrastruktur und KI-gestützte Werkzeuge für Learning Analytics und Interaktionsanalysen.</p>
+                  </a>
+
+                </div>
+
+                <!-- Zweite Reihe -->
+                <div style="display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 40px;">
+
+                  <!-- AP4 -->
+                  <a href="adaptives-testen.html" class="ap-box" style="flex: 1 1 300px; background: #00bcd4; color: white; padding: 20px; border-radius: 8px; text-decoration: none; box-shadow: 0 3px 6px rgba(0,0,0,0.1);">
+                    <h3>AP 4: Adaptive Tests</h3>
+                    <p>Leistungsadaptive Tests mit KI-Methoden zur Bewertung und Schwierigkeitsvorhersage.</p>
+                  </a>
+
+                  <!-- Pfeil -->
+                  <div style="align-self: center; font-size: 24px; color: #00bcd4;">→</div>
+
+                  <!-- AP5 -->
+                  <a href="personalisiertes-lernen.html" class="ap-box" style="flex: 1 1 300px; background: #009688; color: white; padding: 20px; border-radius: 8px; text-decoration: none; box-shadow: 0 3px 6px rgba(0,0,0,0.1);">
+                    <h3>AP 5: Fachspezifische Programmierung</h3>
+                    <p>Individuelle Lernpfade und Aufgaben mit KI-Anpassung für Programmierfähigkeiten.</p>
+                  </a>
+
+                  <!-- Pfeil -->
+                  <div style="align-self: center; font-size: 24px; color: #009688;">→</div>
+
+                  <!-- AP6 -->
+                  <a href="study-dean-cockpit.html" class="ap-box" style="flex: 1 1 300px; background: #3f51b5; color: white; padding: 20px; border-radius: 8px; text-decoration: none; box-shadow: 0 3px 6px rgba(0,0,0,0.1);">
+                    <h3>AP 6: KI-Kompetenz stärken</h3>
+                    <p>Weiterbildungsangebote für Studierende und Lehrende zur Stärkung der KI-Kompetenz.</p>
+                  </a>
+
+                </div>
+
+                <!-- Dritte Reihe -->
+                <div style="display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 40px;">
+
+                  <!-- AP8 -->
+                  <a href="generative-ki-schreibseminar.html" class="ap-box" style="flex: 1 1 300px; background: #ffeb3b; color: #333; padding: 20px; border-radius: 8px; text-decoration: none; box-shadow: 0 3px 6px rgba(0,0,0,0.1);">
+                    <h3>AP 8: Textgenerierende KI in der Lehre</h3>
+                    <p>Didaktisch reflektierter Einsatz von KI-Systemen wie ChatGPT in Schreibseminaren und Programmiermodulen.</p>
+                  </a>
+
+                  <!-- Pfeil -->
+                  <div style="align-self: center; font-size: 24px; color: #ffeb3b;">→</div>
+
+                  <!-- AP7 -->
+                  <a href="projekt-evaluation.html" class="ap-box" style="flex: 1 1 300px; background: #e91e63; color: white; padding: 20px; border-radius: 8px; text-decoration: none; box-shadow: 0 3px 6px rgba(0,0,0,0.1);">
+                    <h3>AP 7: Evaluation & Projektverankerung</h3>
+                    <p>Evaluation, Dissemination und Vorbereitung der Integration in den Lehrplan.</p>
+                  </a>
+
+                </div>
+
+              </div>
+            </div>
+          </section>
+
+   <!-- ende neue section in Juni 2025-->
 
          <!-- Portfolio Section -->
 <section id="portfolio" class="portfolio section">