6 Schritte um eine Web-App Programmierung zu starten

Wir bei Codista entwickeln Apps für mittelständische und große Unternehmen. Meist sind dies Web-Apps. Mit diesem Artikel wollen wir einen Überblick geben wie die Entwicklung einer Web-App gestartet werden kann. Wir starten einleitend mit einer Abgrenzung von Web-Apps zu mobile Apps und Websites.

Unterschied Mobile App vs. Web-App

Mobile Apps sind auf mobilen Endgeräten (Smartphones, Tablets) nutzbar und werden über App-Stores installiert. Mobile Apps können auf verschiedene Funktionen des Betriebssystems zugreifen, die von Web-Apps (auch Progressive Web Apps, abgekürzt PWA, genannt) nicht genutzt werden können. Diese Einschränkung ergibt sich dadurch, dass Web-Apps, wie der Name schon sagt, mit Web-Technologien programmiert werden und Web-Technologien gewisse native Gerätefunktionalitäten nicht oder nur eingeschränkt nutzen können. Bluetooth, NFC und Geofencing sind Beispiele für Funktionalitäten die von Web-Apps nicht oder nur eingeschränkt genutzt werden können. GPU-intensive Anwendungen oder umfangreiche Datenspeicherung auf dem Gerät um offline Funktionalitäten zu gewährleisten sind weitere Beispiele bei denen Web-Apps an ihre Grenzen kommen und native Apps die bessere Lösung sind.

Unterschied Web-App zu normaler Website

Die Grenzen zwischen einer "normalen" Website und einer Web-App sind eher fließend, als dass man diese klar ziehen könnte. Trotzdem versuchen wir uns an einer Definition. Sowohl Websites als auch Web-Apps sind über einen Browser aufrufbar und werden unter Nutzung von Web-Technologien programmiert. Websites bestehen dabei hauptsächlich aus Text, Bild, Videos und haben meist nur wenige Interaktionsmöglichkeiten (wie zum Beispiel ein Kontaktformular oder kleinere Animationen). Websites auf denen User mehr tun können als wie „nur“ Text, Bild und Ton zu „konsumieren“ werden als Web-Apps, Web Applikationen, Portale und Plattformen bezeichnet. Beispiele für Funktionalitäten, die über eine Standard-Website hinausgehen, sind:

• User können sich einloggen
• User können suchen
• User können buchen und kaufen
• User können mit anderen Usern der Website interagieren
• Komplexe Datenstände werden in einer Datenbank gespeichert
• User können Daten abfragen und darstellen
• User können Datensätze erstellen, editieren und löschen
• User können Prozesse starten
• Prozesse werden automatisch ausgeführt
• Im Hintergrund interagiert die Applikation mit verschiedensten anderen Systemen (ERP, Mail, CRM, AI-Systemen, etc)
• .. und vieles mehr

6 Schritte um eine Web-App Programmierung zu starten

Aus unserer Sicht kann die Web-App Programmierung in sechs aufeinanderfolgende Schritte unterteilt werden. Auf diese Schritte gehen wir folgend ein.

• Vision definieren
• Problem und Nutzen validieren
• Konzept erstellen
• Konzept validieren
• Ressourcenplanung und Kompetenzerhebung
• App Agentur beauftragen

Vision definieren

Jedes ambitionierte Unterfangen sollte mit der Formulierung einer Vision beginnen. Je klarer diese Vision ist, umso einfacher werden die nachfolgenden Schritte. Die Vision sollte das zu lösende Problem, die zu stillenden Bedürfnisse, die potentiellen User und das Marktpotential beschreiben. Je detaillierter und durchdachter diese Formulierung geschieht, umso einfacher können Stakeholder (andere Abteilungen, Vorgesetzte, Partner, Mitarbeiter) von der Idee überzeugt und die notwendigen Ressourcen gesichert werden.

Problem und Nutzen validieren

In meiner langjährigen Erfahrung in der Entwicklung von digitalen Produkten habe ich schon allzu oft miterlebt, dass sich ambitionierte Personen in ihre Idee verlieben und dabei auf das Problem, die User und den Markt vergessen. Auch ich selbst habe diese Fehler schon begangen und bin mit der einen oder anderen Produktidee schon gescheitert. Daher ist es unerlässlich seine Vision und dabei getroffenen Annahmen so gut es geht zu validieren bevor mit der Entwicklung gestartet wird.

Möglichkeiten eine Idee zu validieren gibt es viele. Evaluierung des Marktpotentials auf Basis von No-Code Prototypen oder Wireframes sind eine Möglichkeit um mit einer zugänglichen Zielgruppe eine Idee zu validieren. Einfache Befragungen sind eine weitere Möglichkeit. Dieser Validierungsschritt erinnert uns auch immer wieder daran, wie wichtig es ist, mit den zukünftigen Usern in Austausch zu treten und wird sicherlich zu relevanten Einblicken und neuen Erkenntnissen führen.

Konzept erstellen

Auf Basis der Vision und dem validierten Nutzen besteht jetzt die Möglichkeit tief in Details abzutauchen. So genannte User Stories sind eine gute Möglichkeit um die Funktionalitäten der App zu beschreiben. "Als User möchte ich mich ohne Passwort unter Angabe meiner Email einloggen können" ist ein Beispiel für eine User Story. Oft gibt es in dieser Phase sehr viele Ideen. Es ist zu empfehlen jede Anforderung zu prüfen ob diese für eine erste Version relevant ist und ausreichend User-Nutzen stiftet.

Wenn dieser Schritt nicht gemacht wird, läuft man Gefahr sich auf unwesentliche Funktionalitäten zu konzentrieren. Auf Basis einer Liste an User Stories kann in einem zweiten Schritt ein gemeinsames Bild der App entwickelt werden. Die Visualisierung der Anwendung hilft allen Beteiligten sich die App vorzustellen, noch bevor die Programmierung startet. Die Visualisierung kann durch die kostengünstige Erstellung von Wireframes passieren. Immer öfters sehen wir auch, dass Kunden bereits Prototypen mithilfe von No-Code Tools entwickeln. Solche Prototypen helfen immens um das Konzept zu verstehen, zu validieren und helfen einem externen Dienstleister die Zielsetzung besser zu verstehen.

Konzept validieren

Das Konzept muss unbedingt validiert werden bevor Angebote eingeholt oder sogar mit der Entwicklung gestartet wird. Wir empfehlen hierfür das Konzept von Experten für die App-Entwicklung und Experten für UX für die Validierung zu beauftragen. Mit ihrer langjährigen Erfahrung können diese Experten potentielle Probleme und Unstimmigkeiten im Konzept rasch erkennen. Dieser Schritt wird das Risiko des Projekts stark reduzieren.

Ressourcenplanung und Kompetenzerhebung

Mit einem fertigen Konzept kann jetzt langsam aber sicher mit der Detailplanung gestartet werden. Für die Realisierung einer Web-App werden unterschiedliche Kompetenzen und Rollen benötigt. Je nach Größe des Projekts und des Unternehmens können dies die folgenden technischen Rollen sein:

• Frontend-Entwickler:
  • Kennt sich mit HMTL, CSS, JavaScript und Frameworks wie React oder Vue aus.
  • Fokus auf Benutzeroberfläche (UI) und Interaktion (UX)
• Backend-Entwickler:
  • Verantwortlich für die Serverlogik, Datenbanken und APIs
  • Kompetenzen in Programmiersprachen wie Python, Java oder Ruby
• DevOps Engineer:
  • Verantwortlich für Deployments und Server-Infrastruktur
  • Kompetenzen zum Beispiel in Betriebssystemen (Linux) und Gitlab
• Datenbankentwickler
  • Plant und optimiert Datenbankstrukturen
  • Gewährleistet eine performante und zuverlässige Datenverarbeitung- und Speicherung
• QA Engineer / Tester
  • Überprüft die Web-App auf Fehler und gewährleistet hohe Qualität durch automatisierte und manuelle Tests
  • Hat Erfahrung mit Tools wie pytest, Selenium und Playwright

Kreative Rollen und Kompetenzen die benötigt werden:

• UI/UX Designer
  • Entwickelt benutzerfreundliche und visuell ansprechende Wireframes und Designs
  • Verwendet Tools wie Figma, Sketch oder Adobe XD.
• Content Creator
  • Verantwortlich für Texte, Bilder und Videos, die in der App eingebunden werden.
  • Sorgt für eine konsistente Ansprache

Organisatorische Rollen die benötigt werden:

• Product Owner
  • Priorisiert Anforderungen und steuert die Produktentwicklung.
  • Kommuniziert zwischen Stakeholdern und dem Entwicklerteam
• Projektmanager
  • Plant und überwacht den Entwicklungsprozess
  • Stellt sicher, dass Zeitpläne und Budgets eingehalten werden
• Business Analyst
  • Analysiert Anforderungen und definiert klare Spezifikationen für das Team
  • Verbindet die Geschäftsziele mit der technischen Umsetzung

Man sieht, dass für die Entwicklung einer Web-App mitunter sehr viele unterschiedliche Kompetenzen benötigt werden. In kleineren Teams, wie wir es sind, übernehmen Personen meist mehrere Rollen gleichzeitig. Ich bin bei uns mitunter gleichzeitig Projektmanager, Datenbankentwickler, Backend-Entwickler und QA Engineer. Bei kleineren Projekten ist das gut möglich. Bei größeren Projekten werden die unterschiedlichen Rollen meist von einzelnen Personen abgedeckt.

Wenige Unternehmen haben intern Zugriff auf all diese Kompetenzen. Daher werden gerne App-Entwicklungs-Agenturen mit der Entwicklung der App beauftragt. Oft übernehmen wir dabei die gesamte Entwicklung und die Verantwortung für den Betrieb.

Wir haben sehr gute Erfahrung mit der Aufteilung von Verantwortlichkeiten gemacht. Strategie und Product Ownership sollten unbedingt intern, auf Seite des Kunden, verantwortet werden. UI/UX und Content Creation werden ebenfalls gerne vom Kunden übernommen. Weiters sollte eine gewisse Testing und Qualitätssicherungskultur auf Seiten des Kunden etabliert werden.

Abschließend kann ich empfehlen, dass ein realistischer Blick auf die internen Möglichkeiten und Ressourcen getätigt wird, um zu klären welche Aufgaben intern übernommen werden können und welche Aufgaben extern beauftragt werden sollten.

App Entwickler kontaktieren

Spätestens jetzt seid ihr bereit um eine spezialisierte App Entwicklungsagentur zu kontaktieren. Wir haben die Erfahrung gemacht, dass wir immer wieder Anfragen aus unserem Netzwerk erhalten. Bekannte und Freunde zu fragen ist, wenig überraschend, immer ein guter Weg um einen verlässlichen Dienstleister zu finden.

Bei der Auswahl eines Dienstleisters gibt es verschiedene Kriterien die es zu beachten gibt. Folgend Punkte die uns wichtig wären:

• Direkter Kontakt zu den Entwicklern ist möglich
• Es besteht eine gewisse Sympathie zu den handelnden Personen
• Die Entwicklung wird nicht ausgelagert
• Entwicklung basiert auf Basis Open Source Technologien
• Dienstleister setzt auf automatisierte Qualitätssicherung mittels Unit und Integration-Tests

Du möchtest eine App entwickeln lassen und suchst einen Partner?

Eine Web-App zu entwickeln, ist ein komplexer, aber spannender Prozess. Mit der richtigen Strategie und erfahrenen Partnern gelingt die Umsetzung reibungslos. Wenn du Unterstützung bei der Planung oder Entwicklung einer Web-App benötigst, helfen wir dir gerne weiter. Wir freuen uns über Deinen Anruf unter +43 1 997 425 610. Gerne kannst du uns auch eine Nachricht via email hello@codista.com hinterlassen oder direkt einen Termin buchen.