Mobile App für Android und iOS für die Marc AG mit Flutter und Drupal-Backend
Für die Marc AG entwickelte RealizationZone eine neue mobile App für iOS und Android. Sie bündelt das bestehende Web- und Kundenportal, Inhalte der Unternehmenswebsite und die direkte Kundenkommunikation über Push-Nachrichten in einer zentralen Anwendung.
Statt sämtliche bestehenden Funktionen für zwei mobile Betriebssysteme vollständig neu zu programmieren, setzte RealizationZone auf einen wirtschaftlichen Hybrid-App-Ansatz mit Flutter. Ein separates Drupal-App-Backend ermöglicht die zentrale Konfiguration wichtiger Einstellungen und unterstützt den langfristig betreuten Betrieb.
Ausgangslage
Die Marc AG verfügte bereits über eine mobile App. Diese war jedoch aufgrund fehlender Wartung und ausbleibender technischer Aktualisierungen nicht mehr funktionstüchtig.
Für die neue Lösung sollte nicht nur die bestehende App ersetzt werden. Entscheidend war auch, eine technische Grundlage zu schaffen, die laufend betreut, aktualisiert und bei neuen Anforderungen weiterentwickelt werden kann.
Parallel zur App bestanden bereits mehrere digitale Angebote:
- ein Web- und Kundenportal
- die öffentliche Website der Marc AG
- ein WhatsApp-Business-Kanal
Diese Systeme enthielten bereits wichtige Funktionen und Informationen. Eine vollständige Neuentwicklung aller Inhalte und Portalprozesse innerhalb separater nativer Apps wäre mit zusätzlichem Entwicklungs-, Pflege- und Synchronisationsaufwand verbunden gewesen.
Gesucht war deshalb eine Lösung, die vorhandene Systeme weiterverwendete, sie mobil zusammenführte und gleichzeitig eine klare, appgerechte Navigation bot.
Herausforderung
Die zentrale Herausforderung bestand darin, eine veraltete Anwendung durch eine langfristig wartbare App zu ersetzen, ohne die bestehenden digitalen Systeme unnötig zu duplizieren.
Die neue Anwendung musste mehrere Anforderungen verbinden:
- Entwicklung für Android und iOS
- wirtschaftliche Umsetzung innerhalb des vorgegebenen Budgets
- Integration des bestehenden Kundenportals
- Integration der bestehenden Website
- klare mobile Navigation
- direkte Kommunikation über Push-Nachrichten
- zentrale Verwaltung wichtiger App-Einstellungen
- Anpassbarkeit von Links und Startseite
- kontrollierter Wartungsmodus
- langfristige Betreuung nach der Entwicklung
Eine weitere Anforderung betraf Änderungen an den eingebundenen Zielseiten. URLs, Navigationsziele oder die Startseite können sich im Laufe des Betriebs ändern. Würden solche Angaben ausschliesslich fest in der App hinterlegt, könnte bereits eine einfache URL-Anpassung ein neues App-Update und eine erneute Einreichung bei den Plattformbetreibern erforderlich machen.
Die Konfiguration musste deshalb teilweise aus der eigentlichen App herausgelöst und über ein separates Backend administrierbar gemacht werden.
Zielsetzung
Das Projekt verfolgte vier zentrale Ziele.
1. Ablösung der bestehenden App
Die nicht mehr funktionstüchtige Anwendung sollte durch eine moderne App für iOS und Android ersetzt werden.
2. Nutzung bestehender Systeme
Kundenportal und Website sollten nicht nochmals vollständig innerhalb der App entwickelt werden. Stattdessen sollten die bestehenden Lösungen über eine geeignete mobile Navigation zugänglich gemacht werden.
3. Direkte Kundenkommunikation
Die Marc AG sollte Kunden über Push-Nachrichten direkt informieren können. Empfangene Mitteilungen sollten in einem Nachrichtencenter auffindbar bleiben.
4. Langfristige Wartbarkeit
App und Backend sollten laufend überwacht, aktualisiert und betreut werden können. Konfigurierbare Einstellungen sollten verhindern, dass jede kleinere Änderung eine neue App-Version erfordert.
Umsetzung
RealizationZone entwickelte die neue Anwendung als plattformübergreifende Hybrid App mit Flutter. Damit konnte eine gemeinsame technische Grundlage für Android und iOS genutzt werden.
Die App erhielt eine native Navigation mit drei zentralen Bereichen.
Portal
Der Bereich «Portal» führt zum bestehenden Web- und Kundenportal der Marc AG. Kunden können dadurch über die mobile App auf die bereits vorhandenen Portalangebote zugreifen.
Eine sichere Speicherfunktion vereinfacht die erneute Anmeldung. Die genaue technische Umsetzung der Authentifizierung und Speicherung ist nicht Bestandteil dieser öffentlichen Projektdokumentation.
Über Marc AG
Der Bereich «Über Marc AG» integriert den Zugang zur bestehenden Unternehmenswebsite. Informationen müssen dadurch nicht parallel in App und Website gepflegt werden.
Die Website bleibt das führende System für die entsprechenden Unternehmensinhalte, während die App einen zentralen mobilen Einstieg bietet.
Nachrichten
Der Bereich «Nachrichten» dient als Nachrichtencenter für empfangene Push-Mitteilungen. Neue Nachrichten werden zusätzlich über einen Counter in der Navigation sichtbar gemacht.
Ergänzend ist der WhatsApp-Business-Kanal der Marc AG verknüpft. Damit verbindet die App unterschiedliche Kommunikationsmöglichkeiten innerhalb einer gemeinsamen Navigation.
Technische Lösung
Gemeinsame App-Basis mit Flutter
Für die Entwicklung kam Flutter zum Einsatz. Der plattformübergreifende Ansatz ermöglicht eine gemeinsame Projektbasis für iOS und Android.
Die Flutter-Entwicklung eignete sich für dieses Projekt insbesondere deshalb, weil keine zwei vollständig getrennten Anwendungen mit unabhängigem Funktionsumfang aufgebaut werden mussten.
Der Ansatz reduziert doppelte Entwicklungs- und Pflegeprozesse und schafft eine konsistente Grundlage für Navigation, Konfiguration und Weiterentwicklung.
Integration vorhandener Websysteme
Kundenportal und Unternehmenswebsite bestanden bereits und wurden weiterhin als eigenständige digitale Systeme genutzt.
Die App übernimmt deshalb nicht sämtliche Funktionen dieser Plattformen. Sie bildet vielmehr eine mobile Zugangsschicht, die bestehende Inhalte und Anwendungen in einer zentralen Navigation zusammenführt.
Dadurch können vorhandene Investitionen weitergenutzt werden. Gleichzeitig muss die Marc AG Inhalte und Portalfunktionen nicht parallel in mehreren Systemen pflegen.
Drupal als App-Backend
Für die Administration der App wurde eine separate Drupal-Instanz aufgebaut.
Das Drupal-App-Backend verwaltet zentrale Basiseinstellungen der Anwendung. Dazu gehören insbesondere:
- Navigationslinks
- Ziel-URLs
- definierte Startseite
- Wartungsmodus
- Informationsnachricht für den Wartungsfall
- Versand von Push-Nachrichten
- Ziellinks innerhalb von Push-Nachrichten
Durch die konfigurierbaren Ziel-URLs können bestimmte Änderungen im Backend vorgenommen werden. Eine neue App-Version ist nicht für jede Anpassung einer eingebundenen Adresse erforderlich.
Push-Nachrichten und Nachrichtencenter
Push-Nachrichten können über das App-Backend an Android- und iOS-Geräte versendet werden.
Eine Nachricht besteht aus Text und einem optionalen Ziellink. Damit können Kunden nicht nur auf neue Informationen aufmerksam gemacht, sondern auch direkt zu einem passenden Inhalt oder Angebot geführt werden.
Empfangene Nachrichten werden zusätzlich im Nachrichtencenter der App gesammelt. Der Nachrichtencounter macht neue Mitteilungen innerhalb der Navigation sichtbar.
Kontrollierter Wartungsmodus
Über das Backend kann ein Wartungsmodus aktiviert werden.
In diesem Zustand leitet die App auf einen Wartungsbildschirm weiter und zeigt eine definierte Informationsnachricht an. Die übrige Navigation wird vorübergehend gesperrt.
Damit lässt sich bei technischen Arbeiten oder vorübergehend nicht verfügbaren Zielsystemen eine kontrollierte Benutzerführung sicherstellen. Statt fehlerhafte oder unvollständige Inhalte anzuzeigen, erhalten Nutzer eine klare Information.
Open-Source-Grundlage
Flutter und Drupal bilden gemeinsam eine offene und erweiterbare technische Basis. Der Einsatz etablierter Open-Source-Technologien unterstützt eine nachvollziehbare Architektur ohne Bindung an ein geschlossenes App-Baukastensystem.
Für die langfristige Tragfähigkeit einer App ist jedoch nicht allein die Wahl der Technologie entscheidend. Ebenso wichtig sind regelmässige Aktualisierungen, Monitoring, klare Zuständigkeiten und eine kontinuierliche technische Betreuung.
Ergebnis und Nutzen
Neue App für Android und iOS
Die nicht mehr funktionstüchtige bestehende Anwendung wurde durch eine neue mobile App mit modernisiertem Design und klarerer Struktur ersetzt.
Die gemeinsame Flutter-Basis schafft eine einheitliche Grundlage für beide mobilen Plattformen.
Zentraler mobiler Zugang
Kunden erhalten über eine einzige Anwendung Zugriff auf:
- das bestehende Web- und Kundenportal
- die Website der Marc AG
- empfangene Push-Nachrichten
- den WhatsApp-Business-Kanal
Die App bündelt damit verschiedene digitale Angebote, ohne dass alle Funktionen nochmals vollständig neu entwickelt werden müssen.
Weiterverwendung bestehender Investitionen
Das vorhandene Kundenportal und die bestehende Website bleiben zentrale Bestandteile der digitalen Infrastruktur.
Statt parallele Systeme aufzubauen, sind die bestehenden Angebote in die mobile Benutzerführung integriert. Dies reduziert unnötige Doppelentwicklungen und vereinfacht die laufende Pflege.
Wirtschaftlicher Hybrid-App-Ansatz
Die gemeinsame App-Basis für iOS und Android vermeidet zwei vollständig getrennte Entwicklungen.
Gerade bei einem Projekt, das hauptsächlich bestehende Websysteme bündelt und um mobile Funktionen ergänzt, bietet dieser Ansatz ein ausgewogenes Verhältnis zwischen Benutzererlebnis, Funktionsumfang, Budget und Wartbarkeit.
Flexible Konfiguration
Navigationsziele, URLs und Startseite können über das Drupal-Backend angepasst werden.
Damit lassen sich bestimmte betriebliche Änderungen vornehmen, ohne dass dafür jedes Mal der vollständige App-Update-Prozess durchlaufen werden muss.
Direkte Kundeninformation
Push-Nachrichten ergänzen Website, Portal und WhatsApp um einen weiteren direkten Kommunikationskanal.
Das integrierte Nachrichtencenter sorgt dafür, dass empfangene Mitteilungen auch nach der ersten Anzeige auffindbar bleiben.
Kontrollierbarer Betrieb
Der Wartungsmodus erlaubt es, Nutzer bei technischen Arbeiten gezielt zu informieren und die übrige Navigation vorübergehend zu sperren.
Dies schafft eine bessere Grundlage für geplante Wartungsfenster und kontrollierte technische Eingriffe.
Langfristige Betreuung
RealizationZone übernahm nicht nur die Entwicklung, sondern auch Monitoring, laufende Updates, Sicherheitsupdates sowie technische Unterstützung.
Professionelle Wartung und Support reduzieren das Risiko, dass eine Anwendung durch ausbleibende Aktualisierungen erneut technisch veraltet oder nicht mehr mit neuen Betriebssystemversionen kompatibel bleibt.
Fazit
Die mobile App für die Marc AG zeigt, wie bestehende digitale Lösungen wirtschaftlich in eine zentrale Anwendung für iOS und Android integriert werden können.
Statt Kundenportal und Website vollständig neu zu entwickeln, kombinierte RealizationZone die vorhandenen Systeme mit einer appgerechten Navigation, Push-Nachrichten, Nachrichtencenter und WhatsApp-Verknüpfung.
Flutter bildet eine gemeinsame Grundlage für beide mobilen Plattformen. Das separate Drupal-App-Backend ermöglicht die zentrale Administration wichtiger Einstellungen und reduziert die Abhängigkeit von App-Updates bei einfachen URL- oder Navigationsänderungen.
Die Verbindung aus App-Entwicklung, Systemintegration, Open Source und laufender technischer Betreuung bildet eine wartbare Lösung für die langfristige Zusammenarbeit.
Häufige Fragen zur Flutter App mit Drupal-Backend
Nicht zwingend. Wenn ein bestehendes Portal bereits mobil nutzbar ist und die benötigten Funktionen zuverlässig bereitstellt, kann es in eine App integriert werden. Die App kann dabei als zentrale mobile Zugangsschicht dienen und das Portal um native oder appnahe Funktionen wie Navigation, Push-Nachrichten, Nachrichtencenter oder sichere Anmeldeunterstützung ergänzen.
Ob eine Integration genügt oder einzelne Funktionen nativ umgesetzt werden sollten, hängt von Benutzerführung, Sicherheitsanforderungen, Offline-Bedarf und gewünschter Geräteintegration ab.
Flutter eignet sich für Projekte, bei denen Android und iOS mit einer gemeinsamen technischen Grundlage bedient werden sollen. Dies ist besonders interessant, wenn Funktionen und Benutzerführung auf beiden Plattformen weitgehend übereinstimmen. Eine gemeinsame Basis kann doppelte Entwicklungs- und Wartungsprozesse reduzieren.
Die konkrete Eignung sollte trotzdem anhand von Gerätefunktionen, Sicherheitsanforderungen, Integrationen und gewünschtem Benutzererlebnis geprüft werden.
Drupal übernimmt in diesem Projekt zentrale Konfigurations- und Kommunikationsaufgaben. Navigationslinks, Ziel-URLs, Startseite, Wartungsinformationen und Push-Nachrichten lassen sich damit ausserhalb der eigentlichen App verwalten.
Das Backend macht ausgewählte Anpassungen administrierbar, ohne die gesamte Konfiguration fest in der App hinterlegen zu müssen.
Ja, sofern die entsprechenden Ziel-URLs bewusst als konfigurierbare Werte im Backend geführt werden. Dadurch kann beispielsweise eine neue Adresse für ein Portal oder eine Website im Backend hinterlegt werden. Eine erneute App-Einreichung ist für eine solche Konfigurationsänderung nicht zwingend erforderlich.
Änderungen an der eigentlichen App-Logik, an nativen Funktionen oder am Design benötigen dagegen weiterhin eine neue App-Version.
Drupal kann als Administrationsoberfläche für die Erfassung und Auslösung von Push-Nachrichten dienen. Im Projekt der Marc AG lassen sich Nachrichten mit Text und Ziellink an Android und iOS versenden. Empfangene Mitteilungen werden zusätzlich in einem Nachrichtencenter innerhalb der App dargestellt.
Die genaue technische Architektur des Push-Dienstes hängt vom jeweiligen Projekt, den Plattformanforderungen und den benötigten Zielgruppenfunktionen ab.
Zur App-Wartung gehören je nach Vereinbarung:
- Aktualisierungen für neue iOS- und Android-Versionen
- Updates eingesetzter Frameworks und Abhängigkeiten
- Sicherheitsupdates
- Überwachung zentraler Dienste
- Fehleranalyse und Support
- Anpassungen an geänderte Zielsysteme
- Weiterentwicklung von Funktionen
- Prüfung der App nach Änderungen durch Plattformbetreiber
Eine App sollte deshalb nicht als einmalig abgeschlossenes Produkt betrachtet werden. Sie benötigt über ihren gesamten Lebenszyklus klare technische Zuständigkeiten.
Zusammenarbeit mit RealizationZone
Die App für die Marc AG war nicht nur eine technische Ersatzlösung. Sie bildet eine betreute Grundlage, auf der bestehende digitale Systeme mobil zusammengeführt und bei Bedarf weiterentwickelt werden können.
RealizationZone begleitete das Projekt als technologischer Partner mit Leistungen in den Bereichen:
- App- und Software-Entwicklung
- Flutter-Entwicklung
- Drupal-Backend
- Integration bestehender Systeme
- Push-Kommunikation
- App-Konfiguration
- Monitoring
- Wartung und Support
- technische Weiterentwicklung
Ähnliches App-Projekt besprechen
Besteht bereits ein Kundenportal, eine Website oder eine Webapplikation, die künftig auch über eine mobile App zugänglich sein soll?
RealizationZone prüft die vorhandenen Systeme, die Anforderungen an iOS und Android sowie mögliche Integrationen. Sie erhalten eine unverbindliche technische Einschätzung dazu, ob eine Flutter App, eine Hybrid-Lösung oder ein anderer Ansatz für Ihr Vorhaben sinnvoll ist.