VERFÜGBAR 2021

Das
Tutorensystem
für Schulen!

Ein Diplomprojekt der HTL-Donaustadt.

Das Projekt

Diplomarbeitsüberblick

Hier findest du Informationen über unser Projekt.

Was ist tulio?

Bei tulio handelt es sich um ein elektronisches Tutorensystem - in Form einer mobilen App - welches Schüler, die in bestimmten Fächern Nachhol- oder Unterstützungsbedarf haben, mit Schülern/Schülerinnen vernetzt. Sehe dir hier unser Projektvideo an!

Wie funktoniert tulio?

Jeder Schüler/jede Schülerin kann sich in der App anmelden und seine/ihre Hilfe anbieten. Es werden jedoch nur Schüler/Schülerinnen aus der gleichen Schule miteinander vernetzt.

Die Idee hinter tulio

Ein Tutorensystem existiert bereits seit mehreren Jahren an der HTL Donaustadt - jedoch in Form von einfachen Listen. Die App soll diese Listen ablösen und Schülern/Schülerinnen eine digitale Plattform für den Wissensaustausch bieten.

Welche Technologie verwendet tulio?

In unserm Projekt unterscheiden wir zwischen Frontend und Backend. Bernhard beschäftigt sich mit technologien wie HTML, CSS und JavaScript und ist daher für das Frontend zuständig. Für das Backend verwendet Xaver mySQL um Datenbanken zu managen. Für mehr Informationen klick hier.


Mach dir selbst einen Eindruck

Seh dir unser Projektvideo an!

Hilfe anfragen
Home
Login
Einstellung

Unser Team

Hier findest du Informationen über die Personen hinter tulio und deren Funktion im Projekt.

Portrait von Bernhard Stübler
Bernhard Stübler

At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Portrait von Xaver Drabik
Xaver Drabik

At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Portrait von Fabian Trinko
Fabian Trinko

At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Dipl.-Ing. Erik Sacher

Betreuer des Diplomprojekts


Die Technologie

Technologieüberblick

Hier findest du Informationen über die Technologien die wir verwenden.

Das Frontend:

Unter dem Begriff „Frontend“ versteht man den Teil einer Applikation, den der Endbenutzer zu Gesicht bekommt. Das Frontend ist somit quasi die Brücke zwischen dem Endbenutzer und dem Gehirn einer App – dem sogenannten „Backend“.
Das Frontend lässt sich in drei wichtige Sprachen eingliedern:

HTML (Hypertext Markup Language)
Die Auszeichnungssprache HTML kümmert sich um den Inhalt und die Struktur/Layout einer Webseite.

CSS (Cascading Style Sheets)
CSS ist für das Aussehen einer Webseite zuständig. Mit sogenannten CSS-Regeln lassen sich Webelemente, welche man zuvor mit HTML erstellt hat, gestalten.

JavaScript
JavaScript übernimmt die Logik eines Frontends. Die Skriptsprache kümmert sich zum Beispiel um die Verarbeitung von Benutzerinteraktionen.

Das Backend:

Unter dem Begriff „Backend“ versteht man den Teil einer Applikation, den der Endbenutzer nicht zu Gesicht bekommt. Das Backend ist somit das "Gehirn" einer App.
Das Backend verwendet verschiendene Technologien:

Node.js
Node.js ist eine Webtechnologie, die es ermöglicht die gleiche Programmiersprache sowohl auf Server und Client zu verwenden, in unserem Fall ist das JavaScript. Die Technologie strahlt vor allem in bei der Geschwindigkeit und Skalierbarkeit von Input- und Outputvorgängen.

REST-API
Die REST-Api stellt eine Schnittstelle zwischen Frontend-code und Backend-code/Daten dar. Diese Schnittstelle basiert auf Web-Standards und benutzt das HTTP-Protokoll.

Das Branding:

Beim erstellen der Corporate Identity wird festgelegt wie das fertie Produkt aussehen soll. Dazu zählt z.B. das Erstellen eines Logos oder eines Styleguides.

Adobe Illustrator (AI)
Mit Illustrator ist es sehr einfach Logos zu erstellen, da das Programm mit Vektorgrafiken arbeitet. Das bedeuted, dass z.B. ein Logo nicht zu Pixeln beginnen kann, solange dieses als Vektorgrafik gespeichert wird.

Adobe Experience Design (XD)
Mit Adobe XD können gnaz einfach Website-Prototypen erstellt werden. Mithilfe des fertigen Prototypen ist es dann wesentlich einfacher die App mit HTML/CSS umzusetzen.

Ebenfalls werden Farben sowie Schriftarten festgelegt, damit diese dann über das ganze Projekt einheitlich verwendet werden.

Die Präsentationswebsite:

In unserm Projekt unterscheiden wir zwischen Frontend und Backend. Bernhard beschäftigt sich mit technologien wie HTML, CSS und JavaScript und ist daher für das Frontend zuständig. Für das Backend verwendet Xaver mySQL um Datenbanken zu managen. Für mehr Informationen klick hier.