Die HBKapp

Die HBKapp in Benutzung. Ein Student der HBKsaar bedient die HBK App.

Update 2018: Durch einen Neubau der HBK Website funktioniert das Vorlesungsverzeichnis der HBKapp nicht mehr richtig. Meine HBKapp Redux steht aber als Progressive WebApp bereit und hat die alte Version der HBKapp abgelöst.

Vorsicht, viel Text voraus! Dieser Artikel befasst sich mit der HBKapp, wie sie aufgebaut ist und was man damit alles anstellen kann (und was noch nicht). Downloaden könnt ihr die App für Android im Google Play Store bereits hier.

Ziel

Ziel des Projekts ist es, eine App zu erstellen, die das Leben an der HBK erleichtern soll. Sie fungiert als Enzyklopädie, Vorlesungsverzeichnis und ermöglicht das Speichern und Verwalten des Modulplans und favoritisierter Vorlesungen. Sie enthält außerdem alle aktuellen Termine des Semesters.

Ansprüche

Die HBKapp soll eine einfach zu bedienende, performante App sein. Sie soll für Android & Apple verfügbar sein, am besten mit einer gemeinsamen Codebasis, um Aufwand zu sparen. Die HBKapp darf das Smartphone / Tablet nicht verlangsamen oder die Lebensdauer einer Akkuladung merklich verkürzen.

Im Vordergrund steht die intuitive Nutzung der App durch den Nutzer. Eine einfache Navigation, in der alle Funktionalitäten der App von jeder Ansicht in höchstens zwei Schritten erreichbar sein sollen ist daher Pflicht. Ebenso die Verwendung von Best Practices wie Transitions, Navigation per “Back-Button” (wenn möglich / je nach Gerät) u.Ä..

Wichtig ist ebenfalls, dass Vorlesungen, Termine und Fragen stets aktuell sein sollen und ohne umständliche App-Updates aktualisiert werden können. Vorlesungen und Fragen sollen außerdem durchsuch- und sortierbar sein, in Echtzeit, d.h. ohne Wartezeit für den Nutzer. Offline-Verfügbarkeit ist ein weiterer wichtiges Feature, das die App erfüllen muss.

User Interface

screens

Die Benutzeroberfläche der App besteht aus einer Titelleiste, einer Navigationsleiste und einem Fenster für Inhalte (Hauptfenster). Das Hauptfenster zeigt dabei die angeforderten Inhalte an, sie nimmt den meisten Platz ein.

Die Titelleiste zeigt den derzeitigen Standort innerhalb der App an und bietet kontextabhängig unterschiedliche Funktionen, wie z.B. “Zurück”, “Suchen” und “Favorit”.
Die Navigationsleiste besteht aus Tabs, mit denen man alle Kategorien der App erreichen kann (zurzeit: myHBK, FAQ, Infos zur App). Diese können noch um 1 bis 2 Tabs erweitert werden, ohne an Usability (= Nutzbarkeit, Einfachheit der Nutzung, angenehmes Nutzen) zu verlieren. So können auch im Nachhinein noch größere Features nahtlos in die App integriert werden, ohne die Navigation komplett erneuern zu müssen.

Funktionalität

IMG_8986

Die App umfasst 4 Hauptfeatures, vollgepackt mit Funktionalität für den Nutzer. Diese 4 Features kann man unterteilen in Vorlesungen, Modulplan, Termine und FAQ.

Vorlesungen

Die HBKapp bietet einem die Möglichkeit, sich alle Vorlesungen des aktuellen Semesters anzuschauen. Man kann sie außerdem nach Datum oder Name sortieren, so dass man am Beginn eines neuen Semesters immer sehen kann, welche Vorlesungen neu dazu gekommen sind – ein deutlicher Vorteil gegenüber der Online Version des Vorlesungsverzeichnisses der HBKsaar.
Desweiteren kann man Vorlesungen nach Belieben filtern, d.h. nach Professoren, Titel, Stichwörtern oder sogar Uhrzeit. Als zusätzliches Features bietet die App es auch an, Vorlesungen als Favoriten zu markieren, um sie für später zu speichern. Alle Vorlesungen sind auch ohne Internetverbindung verfügbar.

Modulplan

Das Modulplan Feature der HBKapp ermöglicht es jedem Studenten, den Überblick über seinen Studienverlauf zu behalten. Man kann den eigenen Studiengang & angestrebten Abschluss wählen und sieht dann, welche Module es für den Abschluss zu erfüllen gilt. Außerdem kann man seine Vorlesungen in die einzelnen Module eintragen, um zu schauen, welche Module man dieses Semester mit welcher Vorlesung verknüpft. Zusätzlich kann man auch einzelne Module abhaken, um zu wissen, welche man bereits abgeschlossen hat, und welche es noch zu machen gilt. So kann man sein Semester planen und weiß immer, wie das eigene Studium verläuft.

Termine

Das Termine-Feature hält genau das, was der Name vermuten lässt: Eine Übersicht über alle wichtigen Termine der HBK des aktuellen Semesters. Man kann sich das Semester aussuchen, um auch vergangene Termine einzusehen und hat so immer eine Übersicht, wann der nächste Schnellentwurf oder natürlich die Semesterferien stattfinden.

FAQ

Die Frequently Answered Questions der HBKapp beantworten frequentiert beantwortete Fragen, die Studenten der HBK oft stellen. Sie stellen damit eine Wissenssammlung, vor allem für neue Studenten, da. Fragen nach dem korrekten Ausfüllen und Abgeben von Scheinen, wo man etwas findet und was genau die Zwischenprüfung ist werden hier beantwortet.
Sollte eine Frage nicht beantwortet sein, bietet sich die Möglichkeit, sie zu stellen, so dass sie bald beantwortet werden kann und den FAQ hinzugefügt werden kann.

Einstellungen & Infos zur App

Hier finden sich Infos über die App und verschiedene Einstellungsmöglichkeiten für den Nutzer. Zu den Infos gehört beispielsweise die aktuelle App-Version sowie Informationen über den Entwickler.

Die Einstellungsmöglichkeiten sind aktuell sehr begrenzt, aber bereits für zukünftige Erweiterungen eingeplant (siehe Pläne).

Technik

technik

Framework

Die App arbeitet mit dem Ionic Frontend-Framework, welches wiederum auf AngularJS basiert. Ionic ist ein Framework zur Erstellung von Apps auf der Basis von HTML5, CSS und Javscript.
Mit Packaging Tools wie Cordova können diese für verschiedene Plattformen kompiliert werden, so dass man beispielsweise für Android und iOS eine gemeinsame Codebasis verwenden kann.

Offline-Funktionalität & On-The-Fly-Updates

Ein wichtiges Feature der App ist die volle Offline-Funktionalität, also das Erhalten des Funktionumfangs auch ohne Internetverbindung. Dies wird durch LocalStorage realisiert, also das Speichern von Daten auf dem Smartphone (im Gegensatz zum exklusiven Speichern in der Cloud). Gleichzeitig werden die Daten jedesmal aktualisiert, wenn sie abgerufen werden und eine aktive Internetverbindung vorhanden ist.

Die Daten, mit der die App gefüttert wird, stammen aus verschiedenen Quellen. Die Vorlesungen werden direkt aus der Datenbank der HBKsaar entnommen, für die App aufbereitet und dann als JSON-Datei übertragen. Die FAQ werden aus einem Google Spreadsheet als JSON exportiert und in die App eingefügt, was ein leichtes Aktualisieren der Daten in Echtzeit erlaubt.

Das Aktualisieren der Informationen (z.B. Vorlesungen, Termine und FAQ) geschieht dabei während der Laufzeit der App, so dass der Nutzer sofort sieht, wenn beispielsweise neue Vorlesungen dazu kommen, da diese dann ganz oben neu erscheinen. Diese Aktualisierung “On The Fly” spart ein Update der App über den Play/App Store und befreit den Nutzer damit von lästigen Updatemeldungen für einzelne Elemente.

Rückmeldungen

Splashscreen der HBKapp

Ausgestellt wurde die App am Rundgang 2016 der HBK Saar. Auf einem Android Tablet konnten sich Interessierte mit der App und ihren Funktionen auseinandersetzen. Die Rückmeldungen waren dabei je nach Zielgruppe gelangweilt bis sehr positiv – was aber auch zu erwarten war: Reguläre Besucher des Rundgangs konnten der App nicht viel abgewinnen, da sie auf Studenten als Zielgruppe ausgerichtet ist. Studenten der HBK hingegen, besonders, aber nicht nur, Erstsemester dagegen, waren begeistert von den Möglichkeiten, die die App bietet.
Als besonders beeindruckend empfanden die meisten die Möglichkeit, alle Vorlesungen in Echtzeit sortieren und durchsuchen zu können, da dies bis jetzt (Stand: Januar 2016) auf der Homepage der HBK (www.hbksaar.de) nicht möglich ist.

Ebenfalls sehr praktisch fanden die Studenten den persönlichen Modulplan, der eine bessere Organisation und einen besseren Überblick über das Studium ermöglicht.

Pläne

Die App ist ausgereift genug für ein Release im Apple App Store und auf Google Play, aber es gibt dennoch noch einige Features, die die Funktionalität und User Experience noch verbessern könnten. Einige dieser Ideen seien an dieser Stelle aufgeführt.

Individuelle Farbauswahl

Eine individuelle Farbauswahl ist etwas, das bereits am Rundgang öfter als Frage bzw. Wunsch geäußert wurde, und technisch auch ohne größere Probleme umzusetzen ist. Im Moment gleicht die App mit ihrem Rot der Farbgebung der HBKsaar Website (www.hbksaar.de, Stand: Januar 2016), aber die individuelle farbliche Gestaltung der App zu erlauben ist eine durchaus logische Konsequenz für eine Hochschulapp, deren Nutzer so divers und individuell sind wie die Hochschule selbst.

Interaktive Map

Eine interaktive Map der Hochschule ist ein ambitioniertes Feature, welches leider nicht ohne größere Mühen (gut) umgesetzt werden kann. Der Nutzen des Features ist allerdings genauso hoch: FAQ verlinken, Gebäudepläne, eine durchsuchbare Map mit Innenräumen und Stockwerken, Personal und mehr könnten mit einer gut aufgebauten und bedienbaren Map abgedeckt werden.
Der Einbau einer interaktiven Map war ursprünglich auch vorgesehen und sollte mit Google Indoors Beta (https://www.google.com/maps/about/partners/indoormaps/) realisiert werden, jedoch meldete sich dort keiner auf Anfragen, so dass das Feature leider in den Hintergrund rückte.

FAQ erweitern

Die FAQ-Sektion der App ist bei Weitem noch nicht vollständig. Sie umfasst bereits Antworten zu zahlreichen Fragen, die eine Umfrage unter Studierenden an der HBK ergeben hat, jedoch gibt es zweifelsohne noch mehr Fragen, die sich (nicht nur) Studienanfänger öfter stellen. Dank der Technik hinter den FAQ ist es möglich, diese ohne viel Aufwand zu erweitern, so dass neue Fragen und Antworten jederzeit hinzugefügt werden können – Ziel ist ein möglichst umfassendes Nachschlagewerk zu nahezu allen Aspekten an der HBK.

Notifications

Ein wünschenswertes Feature für die App wären Local-/Pushnotifications, also Benachrichtigungen, bei bestimmten Ereignissen, z.B. anstehenden Schnellentwürfen, neuen Vorlesungen oder Ähnlichem. Dies scheiterte bis jetzt vor allem an den platformspezifischen Plugins, die geräteabhängige Features wie Kamera oder eben auch Notifications steuern. Eine funktionierende Lösung zu finden ist sehr wünschenswert, da Notifications über anstehende Termine die Organisation des Studiums natürlich noch einmal erleichtern.

Resultat & eigene Einschätzung

Ich denke, die HBKapp ist eine kleine aber feine App, die Studenten der HBK Saar in ihrem Studienalltag unterstützen kann. Die verhältnismäßig kleine Anzahl an Features wird durch deren Nutzen wettgemacht – es war nie das Ziel, eine überladene App zu machen, die am Ende keiner verwendet. Stattdessen sollte eine schnelle, übersichtliche App erschaffen werden, die ganz gezielt die gravierendsten “Probleme” im Studium eines Studenten der HBK lösen sollte (ein langsames Vorlesungsverzeichnis, keine Anlaufstelle für den eigenen Modulplan außer jedes Mal das Sekretariat und eine steile Lernkurve über Studienverlauf und Hochschulalltag).

Die überwältigend positive Resonanz der Studenten, die die App getestet haben bestärkt mich in dem Glauben, dass die App für Studierende der Hochschule eine große Hilfe sein kann und wird, und dass es die Arbeit mehr als Wert war. Auch Lehrbeauftragte und Professoren der Hochschule waren begeistert von den Möglichkeiten der App, insbesondere dem schnelleren Vorlesungsverzeichnis. Einige sprachen sich für einen Artikel auf der Homepage der HBK Saar aus, um die App noch bekannter zu machen. Auch das hat mich sehr gefreut und mir den Eindruck vermittelt, dass ich mit meinem Projekt HBKapp eine gute Idee ordentlich umgesetzt habe.

Ich freue mich wirklich und ehrlich über jeden, dem die App helfen kann, sei es durch einen persönlichen Modulplan, eine beantwortete Frage, nicht verpassten Termin oder schneller gefundene Vorlesung. Für mich war und ist das Projekt ein voller Erfolg.

Zum Abschluss einige Stimmen zur App:

“Warum hab ich diese App nicht früher schon gehabt?”
Alexander Kopainski, Kommunikationsdesign

“Für einen unstrukturierten Studenten an einer unstrukturierten Hochschule das Allerbeste!”
– Ein anonymer unstrukturierter Student, Media Art & Design

Verweise

Ionic Framwork: http://ionicframework.com/
AngularJS: https://angularjs.org/
Apache Cordova: https://cordova.apache.org/