forked from 1827133/BA-Chatbot
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>
|