Mobile App für Android und iOS für die BAYO Solutions AG mit Flutter und Drupal-Backend

Für die BAYO Solutions AG entwickelte RealizationZone eine hybride Mobile App für iOS und Android. Die App macht das bestehende Web- und Kundenportal mobil verfügbar und ergänzt es um native Bedienelemente, eine dynamische Darstellung sowie eine zentrale App-Konfiguration.

Anstatt die umfangreichen Funktionen der bestehenden Broker-Software vollständig neu zu entwickeln, wurden vorhandene digitale Komponenten gezielt zusammengeführt. Dadurch entstand eine wirtschaftliche, erweiterbare und langfristig wartbare App-Lösung.

Das Projekt zeigt, wie sich ein bestehendes Kundenportal mit professioneller App-Entwicklung für iOS und Android effizient um einen mobilen Zugang ergänzen lässt.

Screenshots der iOS- und Android-App der BAYO Solutions AG.

Ausgangslage

Die BAYO Solutions AG hatte bereits eine umfassende Broker-Software als Webapplikation entwickelt. Versicherungsbroker konnten darin ihre Kundendaten, Policen, Dokumente, Schadenfälle und weitere Geschäftsprozesse verwalten.

Auch für die Kundschaft der Broker bestand ein geschütztes Webportal. Dort konnten sich Endkunden anmelden, Versicherungsinformationen einsehen, Dokumente austauschen, Schadenmeldungen übermitteln und mit ihrem Broker kommunizieren.

BAYO wollte diesen digitalen Zugang zusätzlich als Mobile App für iOS und Android anbieten. Die Endkunden sollten die bekannten Funktionen des Kundenportals bequem über eine App aufrufen können.

Eine vollständige Neuentwicklung sämtlicher Portalprozesse als separate native App hätte jedoch einen erheblichen Entwicklungs-, Abstimmungs- und Wartungsaufwand verursacht.

Herausforderung

Die zentrale Herausforderung bestand darin, die bereits vorhandene Software sinnvoll mobil verfügbar zu machen, ohne bestehende Funktionen doppelt zu entwickeln.

Gleichzeitig musste sich die App wie eine eigenständige, professionell integrierte Anwendung verhalten. Dazu gehörten eine appgerechte Navigation, die dynamische Darstellung unterschiedlicher Broker-Logos, Mehrsprachigkeit sowie die Unterstützung von Hell- und Dunkelmodus.

Da verschiedene Broker das Portal mit eigener visueller Identität nutzen, durfte die App nicht starr auf ein einzelnes Logo oder eine einzelne Darstellung ausgelegt sein.

Auch betriebliche Anforderungen waren zu berücksichtigen. Konfigurationen sollten möglichst ohne erneute Veröffentlichung einer App-Version angepasst werden können. Bei Wartungsarbeiten am Portal mussten App-Benutzer zuverlässig informiert und vor dem Zugriff auf vorübergehend nicht verfügbare Funktionen geschützt werden.

Zielsetzung

Ziel war eine moderne App für iOS und Android, welche die bestehende BAYO-Plattform mobil ergänzt und deren vorhandene Funktionen weiterverwendet.

Die App sollte:

  • Endkunden einen einfachen mobilen Zugang zum Kundenportal ermöglichen
  • bestehende Portalprozesse nutzbar machen, ohne sie vollständig neu zu programmieren
  • für unterschiedliche Broker und deren visuelle Identität funktionieren
  • Deutsch, Englisch, Französisch und Italienisch unterstützen
  • zentrale Einstellungen ohne neues Store-Release anpassbar machen
  • sichere Navigation innerhalb definierter Portalbereiche gewährleisten
  • kontrollierte Wartungsunterbrüche ermöglichen
  • eine stabile Basis für schrittweise Erweiterungen schaffen
  • langfristig durch einen technologischen Partner betreut werden

Umsetzung

Hybridansatz statt vollständiger Neuentwicklung

RealizationZone integrierte das bestehende Web- und Kundenportal in eine hybride App für iOS und Android.

Dieser Ansatz ermöglichte es, die bereits entwickelten Funktionen und Prozesse der BAYO-Software weiterzuverwenden. Gleichzeitig konnten gezielt native App-Elemente ergänzt werden, wo sie für Bedienung, Darstellung und Betrieb einen konkreten Mehrwert boten.

Die plattformübergreifende Umsetzung erfolgte mit Flutter für iOS und Android. Dadurch basieren beide App-Versionen auf einer gemeinsamen Codebasis.

Native Navigation innerhalb der App

Die App erhielt einen nativen Header mit Bedienelementen, die den Nutzern aus mobilen Browsern vertraut sind:

  • Navigation zur vorherigen oder nächsten Seite
  • erneutes Laden der aktuellen Ansicht
  • Löschen des App-Caches
  • dynamische Anzeige des jeweiligen Broker-Logos

Das Broker-Logo wird aus dem Webportal ausgelesen und im nativen App-Header dargestellt. Die App kann dadurch für verschiedene Broker eingesetzt werden, ohne dass für jedes Unternehmen eine separate App-Version notwendig ist.

Zentrale Konfiguration über Drupal

Für die Administration der App entwickelte RealizationZone eine separate Drupal-Lösung als App-Backend.

Über dieses Backend lassen sich grundlegende App-Einstellungen verwalten. Dazu gehören insbesondere:

  • Startseite der App
  • Erkennung wichtiger Portalbereiche
  • erlaubte Ziel-URLs
  • Sicherheitsregeln für externe und interne Seiten
  • Wartungsmodus
  • Informationsnachricht für Wartungsunterbrüche

Der Zugang zum Backend ist mit Zwei-Faktor-Authentifizierung geschützt.

Konfigurierbare URL- und Sicherheitsregeln

Die App verwendet definierte Regeln, um festzustellen, welche Seiten innerhalb der Anwendung angezeigt werden dürfen.

Freigegebene Portalbereiche werden direkt in der App geöffnet. Nicht freigegebene URLs können je nach Konfiguration blockiert oder ausserhalb der App im regulären Browser geöffnet werden.

Anpassungen an Portaladressen oder wichtigen Zielseiten lassen sich über das Backend vornehmen. Dadurch ist nicht für jede Änderung ein neues App-Release notwendig.

Wartungsmodus mit Informationsbildschirm

Im Drupal-Backend lässt sich ein Wartungsmodus aktivieren. Ist dieser eingeschaltet, leitet die App die Benutzer auf einen eigenen Wartungsbildschirm weiter.

Eine konfigurierbare Nachricht informiert über den vorübergehenden Unterbruch. Gleichzeitig verhindert die App die weitere Navigation innerhalb des Portals.

Diese Funktion unterstützt kontrollierte Updates und Wartungsarbeiten an der zugrunde liegenden Softwareplattform.

Fallback bei nicht erreichbarem Backend

Beim Start ruft die App ihre Konfigurationsdaten über eine Schnittstelle aus dem App-Backend ab.

Sollte das Backend vorübergehend nicht erreichbar sein, greift die Anwendung auf lokal hinterlegte Basiskonfigurationen zurück. Dadurch bleibt die App nicht vollständig von der Erreichbarkeit des Konfigurationssystems abhängig.

Mehrsprachigkeit

Die App unterstützt Deutsch, Englisch, Französisch und Italienisch.

Nicht nur die Inhalte des Webportals, sondern auch native Texte und App-Elemente werden in der jeweils verwendeten Sprache dargestellt. Die mobile Anwendung fügt sich damit in die mehrsprachige Softwareumgebung von BAYO ein.

Automatischer Hell- und Dunkelmodus

Im Kundenportal können Benutzer zwischen einer hellen und einer dunklen Darstellung wechseln.

Die App erkennt den gewählten Modus über die Verbindung zum Webportal und passt die Farben der nativen App-Elemente entsprechend an. Dadurch entsteht eine konsistente Darstellung zwischen Portalinhalt und App-Oberfläche.

Sicherheit und laufender Betrieb

Neben den konfigurierbaren URL-Regeln und dem geschützten Backend wird die Lösung laufend technisch betreut.

Zur Betreuung gehören:

  • Monitoring
  • technische Wartung
  • Fehlerbehebungen
  • laufende Updates
  • Sicherheitsupdates
  • Support
  • externe Security-Audits zur Identifikation möglicher Schwachstellen

Die kontinuierliche Wartung und der technische Support sind Bestandteil der langfristigen Zusammenarbeit.

Technische Lösung

Die Architektur verbindet drei bestehende beziehungsweise neu entwickelte Komponenten.

1. Flutter App

Die Flutter App bildet die mobile Anwendung für iOS und Android. Sie stellt den Portalbereich dar und ergänzt ihn um native Navigation, Sprachlogik, Logoanzeige, Cache-Funktionen sowie die Anpassung an den Hell- oder Dunkelmodus.

2. Bestehendes BAYO-Kundenportal

Geschäftslogik, Benutzerkonten, Policen, Dokumente, Kommunikationsfunktionen und digitale Broker-Services verbleiben im bestehenden Web- und Kundenportal.

Dadurch müssen diese komplexen Funktionen nicht parallel in einer separaten App-Logik gepflegt werden.

3. Drupal App-Backend

Das separate Drupal-System stellt zentrale Konfigurationsdaten über eine Schnittstelle bereit.

Es verwaltet unter anderem:

  • Start- und Zielseiten
  • zulässige Portalbereiche
  • Sicherheits- und Weiterleitungsregeln
  • Wartungsstatus
  • Wartungsnachrichten

Die App enthält zusätzlich eine lokale Fallback-Konfiguration für den Fall, dass die Schnittstelle vorübergehend nicht verfügbar ist.

Erweiterbare Architektur

Die technische Basis ist für eine schrittweise Weiterentwicklung ausgelegt.

Als mögliche spätere Ausbauschritte sind vorgesehen:

  • OAuth- oder SSO-Anmeldung
  • biometrisches Schnell-Login
  • automatisierte Push-Benachrichtigungen
  • Anbindung über ein App-Backend und Firebase
  • natives Notification Center für dauerhaft abrufbare Meldungen

Ergebnis und Nutzen

Mit der Mobile App verfügt BAYO über einen zusätzlichen digitalen Zugang zu seiner bestehenden Softwareplattform.

Mobiler Zugang für Endkunden

Kunden der Broker können über die App auf das bekannte Portal zugreifen. Versicherungsinformationen, Dokumente, Schadenmeldungen und Kommunikationsmöglichkeiten stehen damit auch über einen mobilen Zugang zur Verfügung.

Mehrwert für das BAYO-Produkt

Die App erweitert das Leistungsangebot der Broker-Software um einen wichtigen mobilen Kanal.

Broker können ihren Kunden neben dem Webportal zusätzlich eine App für iOS und Android anbieten. Dies stärkt die digitale Ausrichtung der gesamten Softwarelösung.

Nutzung vorhandener Investitionen

Bestehende Portalprozesse und Funktionen werden weiterverwendet, anstatt parallel neu entwickelt zu werden.

Dies reduziert Doppelspurigkeiten bei Entwicklung, Qualitätssicherung und späterer Wartung. Der Hybridansatz ermöglichte die Umsetzung innerhalb des vorgesehenen Budgetrahmens.

Zentrale Administration

Wichtige App-Einstellungen lassen sich über das Drupal-Backend anpassen.

Änderungen an Zielseiten, Sicherheitsregeln oder Wartungsinformationen erfordern dadurch nicht automatisch ein neues Release im Apple App Store oder Google Play Store.

Einheitliche Mehrsprachigkeit

Die App unterstützt die vier Sprachen Deutsch, Englisch, Französisch und Italienisch. Endkunden können den mobilen Zugang in der für sie passenden Sprache verwenden.

Konsistente Benutzererfahrung

Dynamische Broker-Logos und die automatische Anpassung an den Hell- oder Dunkelmodus sorgen dafür, dass Portal und native App-Elemente visuell zusammenpassen.

Langfristige Erweiterbarkeit

Die Architektur schafft eine belastbare Basis für zusätzliche Funktionen wie SSO, biometrische Anmeldung, Push-Benachrichtigungen und ein natives Notification Center.

Neue Anforderungen können schrittweise priorisiert und umgesetzt werden, ohne die gesamte Lösung neu aufbauen zu müssen.

Nachhaltige technologische Basis

Flutter, Drupal und weitere Open-Source-Technologien ermöglichen eine kontrollierbare und langfristig weiterentwickelbare Lösung ohne unnötige proprietäre Abhängigkeiten.

Langfristige Betreuung

Monitoring, Wartung, Sicherheitsupdates und Support unterstützen einen stabilen Betrieb. BAYO verfügt damit nicht nur über eine entwickelte App, sondern über einen technologischen Partner für die weitere Pflege und den Ausbau der Lösung.

Fazit

Die BAYO Portal App verbindet die Vorteile eines bestehenden, funktionsreichen Kundenportals mit den Möglichkeiten einer mobilen Anwendung für iOS und Android.

Anstatt sämtliche Funktionen nativ neu zu entwickeln, wurden vorhandene Systeme gezielt zusammengeführt und mit nativen App-Elementen sowie einem konfigurierbaren Drupal-Backend ergänzt.

Das Resultat ist eine wirtschaftliche, mehrsprachige und erweiterbare App-Architektur. Sie schafft einen zusätzlichen digitalen Zugang für die Kunden der Broker und bildet gleichzeitig eine stabile Grundlage für zukünftige Ausbauschritte.

Häufige Fragen (FAQ) zur Mobile App

  • Eine Hybrid App ist besonders sinnvoll, wenn bereits eine leistungsfähige Webapplikation oder ein Kundenportal vorhanden ist. Bestehende Funktionen können weiterverwendet und gezielt um native App-Komponenten ergänzt werden. Das reduziert Entwicklungsaufwand, verhindert doppelte Geschäftslogik und erleichtert die spätere Wartung.

    Ob dieser Ansatz geeignet ist, hängt von den benötigten Gerätefunktionen, den Anforderungen an die Benutzerführung und der Architektur des bestehenden Systems ab.

  • Ja. Ein bestehendes Portal kann in eine mobile App integriert und mit nativen Funktionen ergänzt werden. Wichtig sind eine saubere Navigation, sichere Regeln für erlaubte Inhalte, eine mobile Darstellung des Portals sowie ein Konzept für Login, Downloads, externe Links und den laufenden Betrieb.

  • Ja. RealizationZone begleitet App-Projekte auch nach der ersten Umsetzung. Dazu können Monitoring, Updates, Sicherheitsaktualisierungen, Fehlerbehebungen, Support, Anpassungen an neue Betriebssystemversionen und die Entwicklung zusätzlicher Funktionen gehören.

  • Das Drupal-Backend ermöglicht die zentrale Verwaltung wichtiger App-Einstellungen. Zielseiten, erlaubte URLs, Wartungsstatus und Informationsnachrichten können angepasst werden, ohne jede Änderung direkt im App-Code vorzunehmen. Dadurch sinkt die Abhängigkeit von erneuten App-Store-Veröffentlichungen.

  • Die App verwendet konfigurierbare Regeln und eine Whitelist für freigegebene Portalbereiche. Nicht zugelassene Seiten können blockiert oder ausserhalb der App im regulären Browser geöffnet werden. Das Backend selbst ist zusätzlich durch Zwei-Faktor-Authentifizierung geschützt.

  • Ja. Die Architektur ist für einen schrittweisen Ausbau ausgelegt. Mögliche Erweiterungen umfassen OAuth oder SSO, biometrisches Schnell-Login, Push-Benachrichtigungen und ein natives Notification Center. Der genaue Ausbau kann nach Nutzen, Priorität und Budget etappenweise geplant werden.

Zusammenarbeit mit RealizationZone

Sie verfügen bereits über eine Webapplikation, ein Kundenportal oder eine digitale Plattform und möchten diese als App für iOS und Android anbieten?

RealizationZone prüft, welche bestehenden Komponenten weiterverwendet werden können, wo native Funktionen sinnvoll sind und welche Architektur langfristig zu Ihren Anforderungen passt.