🇬🇧
Zurück zu IBM / Barmer
Barmer Logo

Barmer App - Bonus Modul

IBM iX / Barmer

Senior Frontend Developer

Die Barmer App ist die offizielle Mobile-App von Barmer, einer der größten gesetzlichen Krankenkassen Deutschlands. Das Bonus Modul belohnt Mitglieder für gesunde Gewohnheiten und Vorsorge. Mitglieder können Geldprämien erhalten, indem sie Gesundheitsaktivitäten wie Impfungen, Check-ups, Sportvereinsmitgliedschaften und mehr dokumentieren. Die Bonus-Funktion steht auch als eigenständige Web-App zur Verfügung.

Projektüberblick

Als Senior Frontend Developer habe ich über 230 Commits im Bonus Modul geliefert, über die React Native Mobile-App, die React Web-App und Shared Packages hinweg. Das Projekt ist als Monorepo organisiert, mit separaten Apps für Mobile (iOS/Android) und Web, die Business Logic und UI-Komponenten über interne Packages teilen.

Wichtige Beiträge

Beleg-Upload Flow

Kompletten Workflow für Beleg-Uploads umgesetzt, inklusive Foto-Upload und Validierung. Enthalten sind Dateigrößen-Validierung (max 16MB), Dokumentenlimits und sauberes Error Handling mit userfreundlichem Feedback.

Timeline & Activity Tracking

Timeline Interface für Bonus-Aktivitäten, Status und Auszahlungsverlauf gebaut. Detailansichten mit Status-Chips, Last-Updated Indikatoren und korrekter Back Navigation über Web und Mobile implementiert.

Alert & Notification System

Alert-System (B300 Alerts) für wichtige Nutzerkommunikation entwickelt, inklusive Bestätigungen, Ablehnungen und Infomeldungen. Dismissible Hints mit Accessibility-Support umgesetzt.

Accessibility Improvements

Component Accessibility verbessert, inklusive korrekter Role Ansagen für Buttons, Selects und Bottom Sheets. Probleme behoben, bei denen interaktive Elemente ihren Zweck nicht korrekt an Screenreader kommunizierten.

UI Component Fixes

Zahlreiche UI Issues behoben, u.a. Header Truncation im Dashboard, Landscape Scrolling für Error Messages, konsistente Input Abstände, Dialog Scrollbarkeit auf iOS und korrektes Labeling für Drei-Punkte-Menüs.

Opt-Out & Settings

Opt-Out Flow für Nutzer implementiert, die das Bonusprogramm verlassen möchten, inklusive Screen Layouts, Confirmation Dialogs und Backend- Integration.

Dynamic Content

Dynamische Hint-Texte gebaut, die sich je Bonuszeitraum und Submission Status anpassen. Nutzer erhalten so stets relevante Infos zu ihrem Bonusstatus und möglichen Aktionen.

Technologie-Stack

Mobile

  • React Native
  • TypeScript
  • Barmer Puls UI
  • Inversify (DI)

Web

  • React
  • TypeScript
  • Barmer Puls UI
  • Shared Components

Architecture

  • Lerna Monorepo
  • Yarn Workspaces
  • Nx
  • Shared Packages

Testing

  • Jest
  • React Testing Library
  • ESLint
  • Husky