Wir verwenden Cookies, um die korrekte Funktionsweise dieser Website sicherzustellen, Ihnen den bestmöglichen Service zu bieten, die Benutzerfreundlichkeit zu verbessern und unsere Website zu optimieren.

Akzeptieren

Deaktivieren

Preis in 2 Minuten einfach ermitteln

Konfigurator starten

22 February 2020

Progressive Web Applikationen (PWA) revolutionieren Apps

Die Diskussionen starten schon vor der ersten Codezeile. Soll eine Native App oder eine Webapp entwickelt werden? PWA soll die Entscheidung erleichtern.

Angebot online berechnen

Native Apps sind verlockend, denn Sie bieten vollen Zugriff auf Systemressourcen wie NFC, Bluetooth, WLAN etc. Ein riesiger Vorteil ist auch die Offline-Fähigkeit. Gerade das "supergut ausgebaute" Deutsch Mobilfunknetz stellt Nutzer einer Website auf eine Geduldsprobe.

Systemressourcen und Offline-Fähigkeit klingen verführerisch oder? Dann lies weiter, denn es gibt nichts umsonst. Diese Regel gilt auch in der Welt der Softwareentwicklung.

Denn obwohl der Smartphonemarkt von mittlerweile nur noch zwei Betriebssystemen dominiert wird, ist das Entwickeln von nativen Apps wesentlich zeitaufwendiger als das Entwickeln einer Website. Die Probleme fangen bei der Wahl des Frameworks an. Nehme ich React Native oder doch IONIC? Und was ist eigentlich dieses Flutter?

Weiter geht es mit der Entwicklungsumgebung. Du möchtest deine App für IOS entwickeln? Dann brauchst du zwingen eine OSX-Entwicklungsumgebung. Continous Integration und Zertifikathandling sind ein paar weitere Schlagwörter, die uns Softwareentwicklern das Leben mit nativen Apps erschweren.

Mobile First – Progressive Web App zur Rettung

Eine lange herbeigesehnt Alternative zu den nativen Apps sind Website die sich ähnlich verhalten wie native Apps. Dem Nutzer soll kaum auffallen, dass es sich gerade um eine Website handelt. Vielmehr soll die Website wirken wie eine richtige App. Progressive Webapplikation versuchen genau hier anzusetzen und versprechen Lösungen für einige der Probleme.

Vorteile für den Betreiber

Einfach Entwicklung durch bekannte Programmiersprachen

Javascript, HTML, CSS - Thats It. Mehr brauchst du nicht um eine funktionierend PWA zu erstellen. Doch Hand aufs Herz, in Zeiten von Typescript, Less, Webpack und Co. entwickelt kaum jemand in purem Javascript und co.

Shoutouts gehen hier an Preact, die es extrem einfach machen eine Progressive Web Application zu entwickeln. Es würde den Rahmen dieses Beitrags sprengen hier ins Detail zu gehen.

Mehr Informationen zu Preact

Continuous Integration (CI) Pipeline - Easy

Im Vergleich zu der Entwicklung einer nativen App ist das Aufsetzen einer Continuous Integration Pipeline für eine Website ein Kinderspiel. Egal ob Bitbucket, GitLab oder Codrops. Eine ausführliche Erklärung, wie du eine Continuous Integration Pipeline aufsetzt, würde den Rahmen sprengen, deshalb empfehlen wir diesen Beitrag zum Aufsetzen einer CI Pipeline.

CI Anbieter

Schnelle Iterationszyklen

Schnelle Iterationszyklen sind ein Segen für Nutzer und Betreiber. Fehler müssen schnell gefixt werden, neue Features sollen möglichst schnell ausgeliefert und getestet werden. Mit einer guten PWA und einer guten CI-Pipeline steht dem nichts im Wege.

Build Once run everywhere

Die PWA bietet einen weiteren Vorteil. Denn nicht nur mobile Endgeräte profitieren von den Features. Google Chrome, Firefox und Co implementieren den Standard wie ihre Pendants auf dem mobilen Endgerät.

Frühlingssonne tanken.

Die Wettervorhersagen für Videobakers-Kunden sind günstig: Bis 31. August gibt es zu jedem Video zwei kostenlose Untertitel in den Sprachen Ihrer Wahl.

Vorteile für den Nutzer

Offline Fähigkeit

Der wohl attraktivste Pluspunkt einer PWA ist die Offline-Fähigkeit. Du hast richtig gehört. Eine Website, die ohne Internet funktioniert. Einzige Bedienung: Du musst die Seite vorher einmal besucht haben.

Besuchst du beispielsweise abends eine Website und bist am nächsten Tag im Zug, ohne stabiles Internet, wirst du die Website ganz ohne Internetzugriff besuchen können. Vorausgesetzt natürlich der Softwareentwickler der Website hat die Software richtig entwickelt.

Für den offline Modus sind Service Worker verantwortlich. Service Worker prüfen, ob die eine Netzwerkverbindung besteht. Besteht eine Netzwerkverbindung, so lädt der Service Worker die Datei von dem Server herunter. Besteht allerdings keine Netzwerkverbindung prüft der Service Worker ob die angeforderte Ressource im Cache vorhanden ist und liefert diese aus.

PWA Netzwerkgrafik

App Icon auf dem Homescreen

Ein großer Vorteil einer App, ist das Icon auf dem Homescreen. Denn der Nutzer sieht es unter Umständen jeden Tag und besucht deine App häufiger. Progressive Web Applikationen bieten auch hier die Möglichkeit ein App Icon auf dem Homescreen zu platzieren. Sobald der Nutzer die Website besucht, wird er gefragt, ob er die App ‚installieren‘ möchte. Schlicht und ergreifend wird einfach eine Verlinkung auf den Homescreen gepackt.

Push Notifications

PWA ermöglichen es dem Nutzer einfach Push notification anzuzeigen. Hier ist aus User Experience allerdings Vorsicht geboten, den nicht immer werden Notifications dankend angenommen

Nachteile

Das kling alles sehr gut, doch leider haben wir den Heiligen Gral der App Entwicklung noch nicht gefunden. Zumindest noch nicht. Obwohl PWAs wohl eine Vielzahl von nativen Apps ablösen wird, gibt es einige Anwendungsfälle, bei denen eine native App unabdingbar ist.

Zugriff auf Systemressourcen

Du brauchst Zugriff auf Betriebssystem-Schnittstellen, wie zum Beispiel NFC? Aktuell führt leider kein Weg an einer nativen App vorbei. Doch auch hier ist Rettung auf dem Weg. In naher Zukunft wird es wohl möglich sein auf einige der Systemressourcen (Bluetooth, NFC etc.) aus einer Website zuzugreifen. Mehr Informationen dazu findest du hier: WhatWebCanDo

App store

Du möchtest deine App im App Store sehen? Auch hier führt dann kein Weg an einer nativen App vorbei. Schade.

Fazit

Letztendlich ist zu sagen, dass sowohl native Apps als auch für PWA derzeit eine Daseinsberechtigung haben. Die Vor- und Nachteile der Technologien sollten vorsichtige abgewogen werden. Progressive Webapplikationen ebnen den Weg zu einer vereinheitlichen Softwarenwicklung.

Jetzt beraten lassen Preis Online berechnen

Ihre Ansprechpartner

Mein Team und ich stehen Ihnen gerne jederzeit für alle Fragen rund um Ihr Erklärfilm-Projekt zur Verfügung. Rufen Sie einfach spontan an oder schreiben Sie uns eine Mail!

+41 43 50 52 581

[email protected]

Ferhat Kocak

Unser Videoexperte für Ihre Fragen

Jetzt kontaktieren

Jetzt direkt loslegen

Schritt 1: Kick-Off-Formular ausfüllen

Wir sind Experten in unserem Gebiet - doch bei Ihrer Idee sind Sie der wahre Profi.

Um Ihr Produkt zu verstehen und Ihnen einen maßgeschneiderten Lösungsansatz präsentieren zu können, wollen wir mehr über Sie und Ihr Produkt erfahren.

Dazu finden Sie in unserem Kick-Off-Formular die wichtigsten Fragen.

Zum Kick-Off-Formular

Schritt 2. Erstgespräch

In einem unverbindlichen 30-minütigen Gespräch präsentieren wir Ihnen dann unsere Ideen.
Von der Zielgruppenansprache, über den Inhalt bis hin zur Gestaltung des Videos und dessen Verwendung berät Sie Ihr zukünftiger Projektbetreuer persönlich.

Schritt 3. Wir erstellen Ihr Video.

In unserem vierstufigen Produktionsprozess wird unser gesamtes Team für Sie so richtig kreativ - natürlich sind Sie bei der Produktion live dabei und dürfen uns stets Ihr Feedback mitteilen.

Wir überlegen uns, wie wir den Knoten im Kopf Ihres Kunden lösen, um Ihrem Produkt zu mehr Aufmerksamkeit und Erfolg zu verhelfen.

Schritt 4. Einbindung des Videos

Das beste Erklärvideo der Welt hilft Ihnen nicht, wenn es nicht richtig in Szene gesetzt wird. Wir wissen genau, wie effektiv ein Video sein kann und wo es eingebunden werden sollte, damit es das volle Potenzial entfalten kann. Egal ob als Werbemittel in Facebook Ads oder als Kundenmagnet auf Ihrer Website. Wir wissen, was zu tun ist und stehen Ihnen selbstverständlich als kompetenter Partner zur Seite.

Jetzt Kontakt aufnehmen

Aktuelle Blogbeiträge

Immer auf dem laufenden bleiben - Mit den neusten Videobakers Blogbeiträgen.

6 August 2021

Flat Design Animation: Alles, was Sie wissen müssen

22 February 2020

Progressive Web Applikationen (PWA) revolutionieren Apps

21 February 2020

Mit Video den Umsatz steigern und höhere Conversionrates

13 April 2020

Die Dispositions-Software für Fahrdienste und Transporte

22 October 2020

Den passenden Erklärvideo Sprecher für Ihr Projekt

12 July 2021

5 Gründe, warum Video Marketing echten Erfolg bringt

18 July 2021

3 Dinge, die Sie mit einem animierten Erklärfilm tun können

21 February 2020

Die 10 besten Erklärvideo Tools für Erklärvideos

5 December 2020

Wie Sie Ihr Corporate Design im Video richtig umsetzen.

Unsere Bewertungen

Unsere Bewertungen von Google, ProvenExpert und co.

Markus Hauken

Sehr empfehlenswert, gute Qualität, faire und passende Preisgestaltung und vor allem sehr angenehmen Zusammenarbeit und Kommunikation. Kundenorientiert und flexibel, bedingt durch eine Umfirmierung mussten wir ein gerade fertig gestelltes Video nochmals anpassen, dies wurde sehr schnell und zu einem minimalen Aufpreis schnell und unkompliziert gelöst.

M. Oschmann

Wir sind absolut begeistert von den Videobakers.
Von der Projektabwicklung bis zum hervorragenden Ergebnis war alles Super. Wir wünschen dem ganzen Team weiterhin viel Erfolg. Herzlichen Dank!

Christian Kühn

Top Ergebnisse, super nette Ansprechpartner und stets professionell sowie flexibel. Ganz klare 5 Sterne! Weiter so Videobakers!