Commit bee4afbf authored by Traboulsi's avatar Traboulsi
Browse files

Update public/learning-analytics.html

parent 5711254a
Pipeline #11322 passed with stage
in 9 seconds
......@@ -17,85 +17,10 @@
<link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
<link href="assets/css/main.css" rel="stylesheet">
</head>
<style>
.content-section {
margin-top: 20px;
}
.content-section h2 {
margin-top: 30px;
}
.content-section p {
margin-bottom: 20px;
line-height: 1.6;
}
.content-section img {
max-width: 100%;
height: auto;
}
.feedback-types ul {
list-style-type: disc;
padding-left: 20px;
}
.feedback-types li {
margin-bottom: 10px;
}
.feedback-model-description {
background-color: #e6f0ff;
border-left: 5px solid #003366;
}
.interactive-element {
cursor: pointer;
margin: 10px 0;
padding: 10px;
background: #f8f9fa;
border: 1px solid #ddd;
border-radius: 8px;
}
.interactive-element:hover {
background-color: #e2e6ea;
}
.interactive-content {
display: none;
margin-top: 10px;
padding: 10px;
background: #e9ecef;
border: 1px solid #ced4da;
border-radius: 8px;
}
img {
max-width: 100%;
height: auto;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', function () {
var elements = document.querySelectorAll('.interactive-element');
elements.forEach(function (element) {
element.addEventListener('click', function () {
var content = this.nextElementSibling;
if (content.style.display === 'block') {
content.style.display = 'none';
} else {
content.style.display = 'block';
}
});
});
document.addEventListener('keydown', function (e) {
if (e.key === 'Escape') {
var modals = document.querySelectorAll('.modal');
modals.forEach(function (modal) {
modal.classList.remove('show');
modal.style.display = 'none';
});
}
});
});
</script>
</head>
<body>
<header id="header" class="header d-flex align-items-center fixed-top">
<header id="header" class="header d-flex align-items-center fixed-top">
<div class="container-fluid container-xl position-relative d-flex align-items-center">
<a href="index.html" class="logo d-flex align-items-center me-auto">
<img src="https://www.hft-stuttgart.de/typo3conf/ext/hft_sitepackage/Resources/Public/img/HFT_logo.svg" alt="">
......@@ -112,145 +37,61 @@
<i class="mobile-nav-toggle d-xl-none bi bi-list"></i>
</nav>
</div>
</header>
<main>
<p>
<br>
</p>
<section class="hero-section d-flex align-items-center" style="background: #003366; color: white; padding: 60px 0;">
<div class="container text-center">
<h1 style="font-size: 2.5rem;">Learning Analytics Infrastruktur</h1>
<p class="lead">Personalisierte Lernunterstützung durch datengestützte Analyse und Feedbacksysteme</p>
</div>
</section>
<section class="container content-section">
<h1>Arbeitspaket 3: Aufbau und Entwicklung der Learning Analytics und KI-Infrastruktur</h1>
<h2>Inhaltsverzeichnis</h2>
<ul>
<li><a href="#ziel">Ziel des Arbeitspakets</a></li>
<li><a href="#technische-grundlage">Technische Grundlage</a></li>
<li><a href="#befragungen">Befragungen zur Studierendenakzeptanz</a></li>
<li><a href="#weiterentwicklung">Weiterentwicklung der Infrastruktur</a></li>
<li><a href="#evaluierung">Evaluierung der Infrastruktur</a></li>
<li><a href="#dashboards">Dashboards und Feedbacksysteme</a></li>
<li><a href="#vr-interaktionsanalyse">VR-gestützte Interaktionsanalyse</a></li>
<li><a href="#digital-cockpits">Digital Educational Cockpits für Lehrende</a></li>
<li><a href="#ergebnisse">Ergebnisse und Ausblick</a></li>
</ul>
</section>
</header>
<section class="container content-section" id="ziel">
<h2>Ziel des Arbeitspakets</h2>
<p>Das Ziel von AP3 ist der Aufbau und die kontinuierliche Weiterentwicklung der Learning Analytics und KI-Infrastruktur im Rahmen des KNIGHT-Projekts. Diese Infrastruktur soll eine datengestützte Lernprozessanalyse und die Bereitstellung von personalisiertem Feedback ermöglichen, um die Lernprozesse von Studierenden zu unterstützen und zu optimieren.</p>
<img src="path/to/project-goal-image.jpg" alt="Projekt Ziel" class="img-fluid">
</section>
<section class="container content-section" id="technische-grundlage">
<h2>Technische Grundlage</h2>
<p>Die technische Basis der Infrastruktur bildet das Excalibur-Plugin, das an die Moodle-Umgebung angepasst wurde. Dies ermöglicht eine nahtlose Integration von Dashboards für Studierende und Lehrende und bietet eine benutzerfreundliche Oberfläche, die den Zugriff auf Lernanalysen erleichtert.</p>
<img src="path/to/architecture-diagram.png" alt="Systemarchitektur" class="img-fluid">
</section>
<section class="container content-section" id="befragungen">
<h2>Befragungen zur Studierendenakzeptanz</h2>
<p>Zu Beginn und Ende des Semesters wurden Studierende zu ihrer Akzeptanz der Learning Analytics Infrastruktur befragt. Diese Umfragen lieferten wertvolle Erkenntnisse, die in die Weiterentwicklung der Infrastruktur einfließen.</p>
<img src="path/to/survey-results-graph.png" alt="Befragungsergebnisse" class="img-fluid">
</section>
<section class="container content-section" id="weiterentwicklung">
<h2>Weiterentwicklung der Infrastruktur</h2>
<p>Die Infrastruktur wurde kontinuierlich weiterentwickelt, insbesondere mit der Integration von VR-Datenquellen und der Anbindung an eine NoSQL-Datenbank (MongoDB), um interaktive Lernumgebungen zu unterstützen.</p>
<img src="path/to/future-development-roadmap.jpg" alt="Zukünftige Entwicklungen" class="img-fluid">
</section>
<main id="main" class="container" style="padding-top: 120px;">
<section class="container content-section" id="evaluierung">
<h2>Evaluierung der Infrastruktur</h2>
<p>Die Infrastruktur wurde in mehreren Pilotkursen evaluiert, wobei technische Funktionalität, Akzeptanz und Lernerfolg im Fokus standen. Erste Ergebnisse wurden bereits auf internationalen Konferenzen präsentiert.</p>
<img src="path/to/evaluation-results.jpg" alt="Evaluierung Ergebnisse" class="img-fluid">
</section>
<section class="section">
<div class="container">
<h2>AP 3: Aufbau und iterative Entwicklung der technischen LA- und KI-Infrastruktur</h2>
<section class="container content-section" id="dashboards">
<h2>Dashboards und Feedbacksysteme</h2>
<p>Die Dashboards bieten eine detaillierte Visualisierung der Aktivitäten von Studierenden und Lehrenden. So können Fortschritte verfolgt und verschiedene Feedbackarten bereitgestellt werden, um die Lernprozesse zu unterstützen.</p>
<img src="path/to/dashboard-screenshot.png" alt="Dashboard Screenshot" class="img-fluid">
</section>
<h3>AP 3.1 LA-Infrastruktur</h3>
<p>Das an der RWTH Aachen entwickelte <strong>Excalibur-Plugin</strong> integriert Dashboards direkt in Moodle und vereinfacht den Zugriff für Studierende erheblich.</p>
<p>Erhebungen zur Studierendenakzeptanz wurden über Umfragen durchgeführt und veröffentlicht. Parallel erfolgt die Integration weiterer Datenquellen wie AR/VR-Plattformen in eine zentrale MongoDB-Datenbank.</p>
<section class="container content-section" id="vr-interaktionsanalyse">
<h2>VR-gestützte Interaktionsanalyse</h2>
<p>In der ersten Phase der Entwicklung werden VR-Technologien eingesetzt, um Interaktionen in virtuellen Lernumgebungen zu analysieren, einschließlich Augenbewegungen, Gestik und Sprachinteraktionen.</p>
<video controls class="img-fluid">
<source src="path/to/vr-demo-video.mp4" type="video/mp4">
Ihr Browser unterstützt kein HTML5-Video.
</video>
</section>
<h3>AP 3.2 Digital Educational Mirror / Personal Trainer</h3>
<p>Das Moodle-Plugin Excalibur wird in Mathematik- und Logistik-Kursen verwendet, zeigt aber Einschränkungen (nur tägliche Updates, eingeschränkte Dashboard-Anpassung). Parallel wird eine flexiblere, Echtzeit-fähige Grafana-Lösung entwickelt.</p>
<section class="container content-section" id="digital-cockpits">
<h2>Digital Educational Cockpits für Lehrende</h2>
<p>Lehrende können über das Digital Educational Cockpit die Aktivitäten der Studierenden überwachen und auswerten. Dies umfasst die Nutzung von Online-Modulen und die Teilnahme an Trainingsmaßnahmen.</p>
<img src="path/to/cockpit-screenshot.jpg" alt="Digital Cockpit" class="img-fluid">
</section>
<img src="placeholder-excalibur-student-dashboard.png" alt="Excalibur Dashboard Studierendenansicht" class="img-fluid mb-3">
<p class="fst-italic">Abbildung: Excalibur LA-Dashboard, Studierenden-Sicht (Video Analytics, WiSe 2024/25)</p>
<section class="container content-section" id="ergebnisse">
<h2>Ergebnisse und Ausblick</h2>
<p>Das Projekt hat bereits vier GPU-Workstations und einen GPU-Server installiert. Diese werden für Forschung und Studienprojekte verwendet und sollen die Infrastruktur weiter optimieren.</p>
</section>
<h3>AP 3.3 Digitaler Assistent für die Interaktionsanalyse</h3>
<p>Da Kooperationen mit Drittanbietern wie Zoom schwierig sind, werden eigene VR-basierte Lösungen zur Erfassung von Interaktionen (z.B. Augenbewegungen, Gestik, Mimik) entwickelt. Diese bieten langfristig eine flexiblere und anpassbare Möglichkeit zur Analyse des Lernverhaltens in kollaborativen virtuellen Umgebungen.</p>
</main>
<h3>AP 3.4 Digital Educational Lecture Cockpit</h3>
<p>Dieses Dashboard ermöglicht Lehrenden, Lernaktivitäten wie Videoabrufe und Übungen der Studierenden zu verfolgen. Das Cockpit wurde im WiSe 2024/25 mit Excalibur in Moodle umgesetzt und wird parallel mit flexiblen Grafana-Lösungen weiterentwickelt.</p>
<!-- added-->
<img src="placeholder-excalibur-lecturer-dashboard.png" alt="Excalibur Dashboard Lehrendenansicht" class="img-fluid mb-3">
<p class="fst-italic">Abbildung: Excalibur LA-Dashboard, Lehrenden-Sicht (Video Analytics, WiSe 2024/25)</p>
<section class="container content-section">
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#feedbackModal">
Mehr zum Feedback-Modell erfahren
</button>
</section>
<h3>AP 3.5–3.7 Study Dean Cockpit</h3>
<p>Das Study Dean Cockpit wurde konzipiert (2022) und in der Informatik (2024) umgesetzt. Die Datenqualität erforderte Migration und Synchronisationsstrategien, um Inkonsistenzen zu beheben. Der Roll-out inklusive Monitoring mit Grafana, Loki, Prometheus und ArgoCD ist in Vorbereitung.</p>
<!-- Modal -->
<div class="modal fade" id="feedbackModal" tabindex="-1" aria-labelledby="feedbackModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="feedbackModalLabel">Feedback-Modell im Detail</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<p>Das entwickelte Feedback-Modell unterscheidet zwischen verhaltensbasiertem Feedback, performancebasiertem Feedback und emotionalem Feedback. Es wurde speziell für die Integration in digitale Lernumgebungen entwickelt und basiert auf Ergebnissen aus der Lernforschung.</p>
<div class="bg-light p-3 mt-4 rounded">
<h4>Meilensteine (Auswahl)</h4>
<ul>
<li><strong>Verhaltensbasiert:</strong> Rückmeldungen zur Interaktion mit Lerninhalten</li>
<li><strong>Performancebasiert:</strong> Rückmeldung zu Ergebnissen von Tests oder Aufgaben</li>
<li><strong>Emotional:</strong> Erkennung von Frustration oder Motivation und entsprechende Rückmeldung</li>
<li>M3.1a: Aufbau der LA-Infrastruktur für erste Anwendungen</li>
<li>M3.1b: Veröffentlichung zur LA-Infrastruktur (IEEE Access 2024)</li>
<li>M3.2: Digital Educational Personal Trainer</li>
<li>M3.3a: Konzept für digitalen Interaktionsassistenten abgeschlossen</li>
<li>M3.4: Digital Educational Lecture Cockpit erfolgreich umgesetzt</li>
<li>M3.5: Study Dean Cockpit-Konzeption abgeschlossen</li>
<li>M3.6: Study Dean Pilot in der Informatik abgeschlossen</li>
</ul>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Schließen</button>
</div>
</div>
</div>
</div>
<!-- end of added-->
<footer id="footer" class="footer">
<div class="container">
<p>Zurück zur <a href="index.html">Startseite</a></p>
<p>&copy; 2024 KNIGHT Project. All rights reserved.</p>
</div>
</footer>
<a href="#" class="back-to-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>
</section>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/js/main.js"></script>
</main>
<footer class="text-center mt-5 p-4 bg-light">
<p>KNIGHT – Sachlicher Zwischenbericht 2024 | Teilprojekt 1.3 – AP 3</p>
</footer>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment