345 lines
12 KiB
HTML
345 lines
12 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
<html lang="en">
|
|||
|
<head>
|
|||
|
<meta charset="UTF-8" />
|
|||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|||
|
<title>Chatbot HSMA</title>
|
|||
|
<style>
|
|||
|
body {
|
|||
|
margin: 0;
|
|||
|
padding: 0;
|
|||
|
font-family: Arial, sans-serif;
|
|||
|
}
|
|||
|
|
|||
|
.main-container {
|
|||
|
display: flex;
|
|||
|
width: 100%;
|
|||
|
padding: 20px;
|
|||
|
}
|
|||
|
|
|||
|
.sample-questions {
|
|||
|
padding: 20px;
|
|||
|
border-radius: 8px;
|
|||
|
background-color: #e6f2ff; /* Hintergrundfarbe */
|
|||
|
height: 30%;
|
|||
|
}
|
|||
|
.aufgabenstellung {
|
|||
|
padding: 20px;
|
|||
|
border-radius: 8px;
|
|||
|
background-color: #e6f2ff; /* Hintergrundfarbe */
|
|||
|
}
|
|||
|
|
|||
|
.sample-questions h3,
|
|||
|
.sample-questions h4 {
|
|||
|
font-weight: bold;
|
|||
|
margin-top: 15px;
|
|||
|
color: #2c3e50; /* Dunkles Blau für Überschriften */
|
|||
|
}
|
|||
|
.aufgabe-title {
|
|||
|
font-weight: bold;
|
|||
|
margin-top: 15px;
|
|||
|
font-size: 20px;
|
|||
|
color: #2c3e50; /* Dunkles Blau für Überschriften */
|
|||
|
}
|
|||
|
.sample-questions ul,
|
|||
|
.aufgabenstellung ul {
|
|||
|
list-style-type: none;
|
|||
|
padding-left: 0;
|
|||
|
}
|
|||
|
|
|||
|
.sample-questions li,
|
|||
|
.aufgabenstellung li {
|
|||
|
margin-bottom: 10px;
|
|||
|
}
|
|||
|
|
|||
|
.container {
|
|||
|
display: flex;
|
|||
|
align-items: flex-start;
|
|||
|
width: 100%;
|
|||
|
max-width: 100%;
|
|||
|
}
|
|||
|
iframe {
|
|||
|
position: relative;
|
|||
|
left: -20px;
|
|||
|
margin-right: -100px;
|
|||
|
}
|
|||
|
.aufgabenstellung {
|
|||
|
flex: 1;
|
|||
|
margin-right: 20px;
|
|||
|
}
|
|||
|
|
|||
|
#resetChat {
|
|||
|
display: inline-block;
|
|||
|
padding: 10px 15px 10px;
|
|||
|
margin: 10px 0;
|
|||
|
background-color: #007bff;
|
|||
|
color: white;
|
|||
|
border: none;
|
|||
|
cursor: pointer;
|
|||
|
border-radius: 4px;
|
|||
|
}
|
|||
|
|
|||
|
.content {
|
|||
|
width: 100%;
|
|||
|
flex: 1;
|
|||
|
margin-right: 20px;
|
|||
|
}
|
|||
|
</style>
|
|||
|
</head>
|
|||
|
<body>
|
|||
|
<div class="main-container">
|
|||
|
<div class="container">
|
|||
|
<!-- Content-Bereich -->
|
|||
|
<div class="content">
|
|||
|
<div class="aufgabenstellung">
|
|||
|
<h2>Aufgabenstellung</h2>
|
|||
|
<p>
|
|||
|
Du hast die Gelegenheit, mit einem spezialisierten Chatbot zu
|
|||
|
interagieren, der entwickelt wurde, um Informationen und
|
|||
|
Empfehlungen bezogen auf Ihre Hochschule zu liefern. Der Chatbot
|
|||
|
verfügt über eine Vielzahl von Daten und kann bei vielen
|
|||
|
verschiedenen Anfragen assistieren. Im Folgenden findest du eine
|
|||
|
Liste von Aufgaben, die dem Chatbot gestellt werden können , um
|
|||
|
seine Fähigkeiten zu evaluieren. Bitte beachte die vorgegebenen
|
|||
|
Formulierungen und Szenarien, um einheitliche Ergebnisse zu
|
|||
|
gewährleisten.
|
|||
|
</p>
|
|||
|
<p>
|
|||
|
Wenn du bei der Durchführung der Aufgaben auf Probleme stoßt, etwa
|
|||
|
wenn der Chatbot nicht reagiert, dann kannst du die Konversation
|
|||
|
mit dem folgenden Button neu starten. Beachten jedoch, dass der
|
|||
|
Chatbot bei intensiven KI-Suchen für Empfehlungen und Ähnliches
|
|||
|
bis zu 30 Sekunden benötigen kann, um passende Ergebnisse zu
|
|||
|
liefern.
|
|||
|
</p>
|
|||
|
<button id="resetChat">
|
|||
|
Neustarten (Chat-Session zurücksetzen)
|
|||
|
</button>
|
|||
|
<br />
|
|||
|
<br />
|
|||
|
|
|||
|
<div class="aufgabe-title">
|
|||
|
Aufgabe 1: Empfehlungen Wahlpflichtmodule
|
|||
|
</div>
|
|||
|
<p>
|
|||
|
Der Chatbot kann Wahlpflichtmodule aus dem Informatik Bachelor
|
|||
|
Studiengang Empfehlen.
|
|||
|
</p>
|
|||
|
<p><b>Aufgabe 1.1</b></p>
|
|||
|
<p>
|
|||
|
Schreibe dem Chatbot die Nachricht:
|
|||
|
<i>"Empfehlungen für Wahlpflichtmodule"</i> oder klicke auf den
|
|||
|
Button.
|
|||
|
</p>
|
|||
|
<p>
|
|||
|
Antworte auf die Frage
|
|||
|
<i>"Welche Themen interessieren dich besonders?"</i> <br />
|
|||
|
mit: <br />
|
|||
|
<i
|
|||
|
>"Ich habe Interesse an Natural Language Processing und
|
|||
|
Künstliche Intelligenz im Medizinischen Bereich."</i
|
|||
|
>
|
|||
|
</p>
|
|||
|
<p>
|
|||
|
Antworte auf die Frage
|
|||
|
<i>"Welche Kurse hast du in der Vergangenheit belegt?"</i>
|
|||
|
<br />mit:<br />
|
|||
|
<i
|
|||
|
>"Ich habe bereits die Kurse Grundlagen der Neuronalen Netze
|
|||
|
(GNN) und Machine Learning belegt"</i
|
|||
|
>"
|
|||
|
</p>
|
|||
|
<p>
|
|||
|
Anworte auf die Frage <br />
|
|||
|
<i
|
|||
|
>"Welche Art von Karriere möchtest du nach dem Studium
|
|||
|
anstreben?"</i
|
|||
|
>
|
|||
|
<br />mit:<br />
|
|||
|
<i
|
|||
|
>"Ich möchte als Softwareentwickler arbeiten. Dabei möchte ich
|
|||
|
insbesondere AI Systeme entwickeln."</i
|
|||
|
>
|
|||
|
</p>
|
|||
|
Nun solltest du nach kurzer Zeit (ca. 30 Sekunden) eine Liste an
|
|||
|
Modulen erhalten.
|
|||
|
<br />
|
|||
|
<br />
|
|||
|
<p><b>Aufgabe 1.2</b></p>
|
|||
|
|
|||
|
Wiederhole den Prozess. Dabei kannst du nun frei Wählen, nach
|
|||
|
welchen Modulen du suchen möchtest.
|
|||
|
<br />
|
|||
|
<br />
|
|||
|
<div class="aufgabe-title">Aufgabe 2: Studienprüfungsordnung</div>
|
|||
|
<p><b> Aufgabe 2.1</b></p>
|
|||
|
<p>
|
|||
|
Frage den Chatbot: <i>"Wie kann man Elternzeit beantragen?"</i>
|
|||
|
</p>
|
|||
|
<p><b> Aufgabe 2.2 </b></p>
|
|||
|
<p>
|
|||
|
Wiederhole den Prozess. Dabei kannst du die Frage über inhaltliche
|
|||
|
Themen in der Studienprüfungsordnung frei Formulieren.
|
|||
|
</p>
|
|||
|
<br />
|
|||
|
<div class="aufgabe-title">
|
|||
|
Aufgabe 3: Experten für ein Fachgebiet finden
|
|||
|
</div>
|
|||
|
<p><b> Aufgabe 3.1 </b></p>
|
|||
|
<p>
|
|||
|
Der Chatbot kann Experten aus der Faktuktät für Informatik für
|
|||
|
eine gegebene Fachrichtung identifizieren und vorschlagen.
|
|||
|
</p>
|
|||
|
<p>
|
|||
|
Schreibe dem Chatbot die Nachricht "Expertensuche durchführen"
|
|||
|
oder klicke auf den Button.
|
|||
|
</p>
|
|||
|
<p>
|
|||
|
Antworte auf die Frage <br />
|
|||
|
<br />
|
|||
|
<i>"In welchem Bereich suchst du einen Experten?"</i> <br />
|
|||
|
<br />
|
|||
|
mit:
|
|||
|
</p>
|
|||
|
<p>
|
|||
|
"<i
|
|||
|
>Ich suche jemanden der sich im Bereich Natural Language
|
|||
|
Processing auskennt und Machine Learning. Insbesondere für den
|
|||
|
Fachbereich Medizin."</i
|
|||
|
>
|
|||
|
</p>
|
|||
|
<p>
|
|||
|
Der Chatbot sucht nun mittels KI Techniken nach passenden
|
|||
|
Expertern. Dieser Prozess kann bis zu 30 Sekunden dauern
|
|||
|
</p>
|
|||
|
<p><b> Aufgabe 3.2 </b></p>
|
|||
|
<p>
|
|||
|
Wiederhole den Prozess. Dabei kannst du nun frei Wählen, in
|
|||
|
welchem Fachbereich du Experten suchen möchtest.
|
|||
|
</p>
|
|||
|
<br />
|
|||
|
<br />
|
|||
|
<div class="aufgabe-title">
|
|||
|
Aufgabe 4: Allgemeine Hochschulfragen
|
|||
|
</div>
|
|||
|
<p><b>Aufgabe 4.1</b></p>
|
|||
|
<p>
|
|||
|
Bitte den Chatbot die etwas über Mars oder Inno.space zu erzählen:
|
|||
|
<i>"Erzähle mir etwas über Mars"</i> <br />
|
|||
|
<i>"Wo finde ich den Mars-Raum?"</i>
|
|||
|
<br />
|
|||
|
Frage anschließend nach, wo du einen 3D Drucker findest.
|
|||
|
</p>
|
|||
|
<p><b>Aufgabe 4.2</b></p>
|
|||
|
|
|||
|
Wiederhole den Prozess. Dabei kannst du nun frei Wählen wonach du
|
|||
|
Fragen möchtest
|
|||
|
<br />
|
|||
|
<br />
|
|||
|
<div class="aufgabe-title">
|
|||
|
Vielen Dank für die Teilnahme! <br />
|
|||
|
|
|||
|
Bitte fülle nun die folgende Umfrage aus:
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<div class="sample-questions">
|
|||
|
<h3>Beispielfragen:</h3>
|
|||
|
|
|||
|
<h4>Allgemeine Fragen über die Hochschule:</h4>
|
|||
|
<ul>
|
|||
|
<li>Erzähle mir etwas über Mars</li>
|
|||
|
<li>Erzähle mir etwas über Inno Space</li>
|
|||
|
<li>Wo befindet sich der Mars-Raum?</li>
|
|||
|
<li>Wo finde ich einen 3D-Drucker?</li>
|
|||
|
<li>Wo finde ich den Lehrveranstaltungsplan?</li>
|
|||
|
<li>Welche Studienangebote hat die Hochschule?</li>
|
|||
|
<li>Wie setze ich mein Passwort für das Hochschulportal zurück?</li>
|
|||
|
<li>
|
|||
|
An wen kann ich mich wenden, wenn ich mein Passwort und meine
|
|||
|
zentrale Kennung vergessen habe?
|
|||
|
</li>
|
|||
|
<li>
|
|||
|
An wen kann ich mich wenden, wenn ich die Matrikelnummer vergessen
|
|||
|
habe?
|
|||
|
</li>
|
|||
|
<li>Erzähle mir etwas über Mars</li>
|
|||
|
<li>Wie beantrage ich Elterngeld?</li>
|
|||
|
<li>Wo befindet sich der Lasercutter?</li>
|
|||
|
</ul>
|
|||
|
|
|||
|
<h4>Studienprüfungsordnung Fragen:</h4>
|
|||
|
<ul>
|
|||
|
<li>Darf ich die Frist der Bachelorthesis verlängern?</li>
|
|||
|
<li>Wieviele Präsenztage muss ich im Pflichtpraktikum ableisten?</li>
|
|||
|
<li>
|
|||
|
Was sind die Voraussetzungen für das Praktische Studiensemester?
|
|||
|
</li>
|
|||
|
<li>Welche Vorteile haben Studierende mit Kindern?</li>
|
|||
|
<li>Wie kann man Elternzeit beantragen?</li>
|
|||
|
<li>Muss ich bei einer Online Prüfung meine Identität nachweisen?</li>
|
|||
|
<li>
|
|||
|
In welchem Absatz finde ich Informationen zu "Muss ich bei einer
|
|||
|
Online Prüfung meine Identität nachweisen?"
|
|||
|
</li>
|
|||
|
<li>Wie oft darf ich eine Prüfung wiederholen?</li>
|
|||
|
<li>
|
|||
|
Wann wird mein Zeugnis, nach bestehen der Bachelorarbeit,
|
|||
|
ausgestellt?
|
|||
|
</li>
|
|||
|
<li>Wie lange dauert die Ausstellung meines Zeugnisses?</li>
|
|||
|
<li>Was weißt du über Mutterschutz im Studium?</li>
|
|||
|
<li>
|
|||
|
Wie lange werden meine Daten und Prüfungsleistungen von der
|
|||
|
Hochschule gepeichert?
|
|||
|
</li>
|
|||
|
<li>Welche Zuständigkeiten hat der Prüfungsausschuss?</li>
|
|||
|
</ul>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
<script>
|
|||
|
document.addEventListener("DOMContentLoaded", function () {
|
|||
|
localStorage.removeItem("chat_session");
|
|||
|
});
|
|||
|
document
|
|||
|
.getElementById("resetChat")
|
|||
|
.addEventListener("click", function () {
|
|||
|
window.location.reload();
|
|||
|
});
|
|||
|
!(function () {
|
|||
|
let e = document.createElement("script"),
|
|||
|
t = document.head || document.getElementsByTagName("head")[0];
|
|||
|
(e.src =
|
|||
|
"https://cdn.jsdelivr.net/npm/rasa-webchat@1.x.x/lib/index.js"),
|
|||
|
// Replace 1.x.x with the version that you want
|
|||
|
(e.async = !0),
|
|||
|
(e.onload = () => {
|
|||
|
window.WebChat.default(
|
|||
|
{
|
|||
|
customData: { language: "en" },
|
|||
|
hideWhenNotConnected: false,
|
|||
|
|
|||
|
initPayload:
|
|||
|
'/get_started{"reader_model":"GPT","retrieval_method_or_model":"distilbert", "rerank":false}',
|
|||
|
title: "Chatbot HSMA",
|
|||
|
socketUrl: "http://localhost:5005",
|
|||
|
},
|
|||
|
null
|
|||
|
);
|
|||
|
setTimeout(() => {
|
|||
|
const launcher = document.querySelector(".rw-launcher");
|
|||
|
const localStorageChatSession =
|
|||
|
localStorage.getItem("chat_session");
|
|||
|
const data = JSON.parse(localStorageChatSession);
|
|||
|
if (launcher && !data?.params?.isChatOpen) {
|
|||
|
launcher.click();
|
|||
|
}
|
|||
|
}, 4000);
|
|||
|
}),
|
|||
|
t.insertBefore(e, t.firstChild);
|
|||
|
})();
|
|||
|
</script>
|
|||
|
</body>
|
|||
|
</html>
|