Update public/learning-analytics.html

public/learning-analytics.html

@@ -40,6 +40,7 @@
 </header>
 
 <main>
+  <main>
   <section class="container">
     <!-- Optional Intro Section if needed -->
   </section>
@@ -57,6 +58,26 @@
     </ul>
 
     <div class="container">
+      <style>
+        .image-frame {
+          width: 100%;
+          max-width: 600px;
+          height: 350px;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          overflow: hidden;
+          border: 1px solid #ddd;
+          margin: 1rem auto;
+          background: #f8f9fa;
+        }
+        .image-frame img {
+          height: 100%;
+          width: auto;
+          object-fit: contain;
+        }
+      </style>
+
       <h3>LA-Infrastruktur (AP 3.1)</h3>
       <ul>
         <li>Parallele Infrastrukturen: produktiv & forschungsorientiert</li>
@@ -65,20 +86,26 @@
         <li>Befragungen zu Studierendenakzeptanz via Unipark</li>
         <li>Externe Veröffentlichung: IEEE Access, LAK 2025, JOTED</li>
       </ul>
-      <img src="assets/img/LAs-figure.png" alt="LA Infrastruktur – Datenquellen" class="img-fluid mb-3">
-      <p class="fst-italic">Abbildung: Datenfluss und Feedback-Mechanismus der LA-Infrastruktur</p>
+      <div class="image-frame">
+        <img src="assets/img/LAs-figure.png" alt="LA Infrastruktur – Datenquellen">
+      </div>
+      <p class="fst-italic text-center">Abbildung: Datenfluss und Feedback-Mechanismus der LA-Infrastruktur</p>
 
       <h3>Digital Educational Mirror (AP 3.2)</h3>
       <p>Einsatz des Excalibur-Plugins in Lehrveranstaltungen der Mathematik und Logistik. Bietet datengestütztes Feedback für Studierende zu ihrem Lernverhalten.</p>
       <p>Alternative Umsetzung auf Basis von Grafana zur Überwindung technischer Limitierungen (z. B. Update-Intervalle, Visualisierungsoptionen).</p>
-      <img src="assets/img/digital-Eductional-Miror.png" alt="Excalibur Studierenden-Dashboard" class="img-fluid mb-3">
-      <p class="fst-italic">Abbildung: Excalibur – Studierendenansicht (Video Analytics, WiSe 2024/25)</p>
+      <div class="image-frame">
+        <img src="assets/img/digital-Eductional-Miror.png" alt="Excalibur Studierenden-Dashboard">
+      </div>
+      <p class="fst-italic text-center">Abbildung: Excalibur – Studierendenansicht (Video Analytics, WiSe 2024/25)</p>
 
       <h3>Digital Educational Lecture Cockpit (AP 3.4)</h3>
       <p>Für Lehrende bietet das Lecture Cockpit aggregierte Nutzungsdaten und Visualisierungen zur datenbasierten Steuerung der Lehre.</p>
       <p>Umgesetzt in Excalibur, mit geplanter Weiterentwicklung über Grafana-Dashboards.</p>
-      <img src="assets/img/digital-educational-lecture-cockpit.png" alt="Excalibur Lehrenden-Dashboard" class="img-fluid mb-3">
-      <p class="fst-italic">Abbildung: Excalibur – Lehrendenansicht (Lecture Cockpit, WiSe 2024/25)</p>
+      <div class="image-frame">
+        <img src="assets/img/digital-educational-lecture-cockpit.png" alt="Excalibur Lehrenden-Dashboard">
+      </div>
+      <p class="fst-italic text-center">Abbildung: Excalibur – Lehrendenansicht (Lecture Cockpit, WiSe 2024/25)</p>
 
       <h3>Digitaler Assistent zur Interaktionsanalyse (AP 3.3)</h3>
       <p>Analyse von VR-Interaktionen zur Unterstützung personalisierter Lernprozesse:</p>
@@ -87,8 +114,10 @@
         <li>Sprachverhalten & Interaktionsmuster</li>
         <li>VIPAs (Virtuelle Intelligente Pädagogische Agenten) als Feedbackinstanz</li>
       </ul>
-      <img src="assets/img/digital-assistent.png" alt="Virtuelle pädagogische Agenten (VIPAs)" class="img-fluid mb-3">
-      <p class="fst-italic">Abbildung: VIPA-Simulation in einer kollaborativen VR-Umgebung</p>
+      <div class="image-frame">
+        <img src="assets/img/digital-assistent.png" alt="Virtuelle pädagogische Agenten (VIPAs)">
+      </div>
+      <p class="fst-italic text-center">Abbildung: VIPA-Simulation in einer kollaborativen VR-Umgebung</p>
 
       <h3>Study Dean Cockpit (AP 3.5–3.7)</h3>
       <p>Konzeption, Umsetzung und Rollout eines datenbasierten Dashboards zur curricularen Steuerung und Lehrplanoptimierung für Studiendekan:innen:</p>