Fakultät Medien

Kreativität, kritisches Denken und gesellschaftliche Verantwortung - das ist die Fakultät Medien!
 

Multiplattform-Applikation auf Basis aktueller Web-Technologien

|

Die Zentralisierung des Codes, ist ein Meilenstein auf dem Weg zu modernen Webseiten. Dieses Projekt befasst sich mit der einmaligen Entwicklung von Code und dem Transfer auf alle gängigen Plattformen.

Das Projekt Multiplattform-Applikation beschäftigt sich mit der einmaligen Entwicklung von Code auf Basis aktueller Web-Technologien, welcher im Nachgang auf alle gängigen Plattformen transferiert werden kann. Hier befasste sich die Projektgruppe im ersten Schritt mit der Evaluation diverser Lösungsmöglichkeiten für eine Multiplattform-Applikation. Hier wurden konventionelle Methoden wie beispielsweise der Aufwand der Programmierung einer reinen nativen App, mit dem Aufwand von alternativen, modernen und weniger erforschten Methoden verglichen. Darauf aufbauend wurde das Backend, sowie das Frontend einer Progressive Web App entwickelt.

Eine Progressive Web App, oder kurz PWA, ist eine auf HTML, CSS und JavaScript basierende Website, die aber Vorteile einer nativen App mit sich bringt. Durch die "Service Worker" kann die Funktion der App auch offline gewährleistet werden und zudem lässt sich die PWA, auf beinahe allen gängigen Plattformen nutzen, ohne dass der Code jedes Mal neu geschrieben werden muss.

Das Backend umfasst Service Worker, eine Wetter-Api und wurde mit in Verbindung mit einem Node.js-Server entwickelt. Mit diesen Technologien ist es möglich beispielsweise Wetterabfragen zu realisieren. Diese analysieren den Standort und geben passend dafür die aktuelle Wetterlage aus. Je nach Wettersituation ändern sich Icons und Text automatisch auf Anfrage des Nutzers. Außerdem bieten diese Technologien auch die Möglichkeiten die aktuelle Wetterlage per Pushnachricht auf Knopfdruck an den Benutzer zu senden.

Im Frontend der Progressive Web App lag der Fokus auf der Responsivität aller Website-Elemente, sowie der Entwicklung einer simplen und benutzerfreundlichen Navigation. Diese sollte auf jedem Endgerät einfach und intuitiv benutzbar sein. Auch Farbschema, Schrift und Layout, sollen eine angenehme und übersichtliche Atmosphäre für den Benutzer erschaffen. Aus Demonstrationszwecken wurden außerdem einige Unterseiten mit Content gefüllt, um unter anderem die Responsivität besser zu verdeutlichen. Alle Icons sind eigens für die Website entstanden und wurden von einem Projektgruppenmitglied kreiert.

Das Ziel der Projektarbeit bestand nicht darin, eine in allen Gesichtspunkten einwandfreie Progressive Web App zu programmieren, sondern die verschiedenen Möglichkeiten gegeneinander aufzuwiegen und zu vergleichen. Zwar strebten wir trotzdem eine Progressive Web App an, die aus unserer Sicht alle wichtigen Eigenschaften funktionstüchtig abdeckt, jedoch gilt es festzuhalten, dass der Fokus in der Überprüfung der Umsetzbarkeit einer PWA lag. Den Schwerpunkt legten wir mit unserem Betreuer Prof. Dr. Riempp, auf die Erstellung eines ersten Leitfadens und einem Grundverständnis von Progressive Web Apps. Der Grund für diese Entscheidung lag daran, dass die Progressive Web Apps noch ein relativ unerforschtes Gebiet der Website-Entwicklung sind und wir daher diese Technik erst einmal kennenlernen und für spätere Nachfolger anhand von Dokumentationen und Aufzeichnungen verständlich machen wollten.

Der gesamte Ablauf des Projekts wurde durch ein Gruppenmitglied, welches für das Projektmanagement zuständig war geleitet, organisiert und die Arbeitsabläufe und Meetings dokumentiert.

 

Projektteam:
Niklas Armbruster, Sabrina Mader, Adrian Mosquera Rodriguez, Benjamin Adolph, Oliver Fels

Projektbetreuung:
Prof. Dr. Roland Riempp