Zum Inhalt springen
Milena Hagen

Projekte / App-Entwicklung

Behördenpost verstehen, ohne sie aus der Hand zu geben.

Eine Web-App, die Rechnungen, Mahnungen und Behördenbriefe einordnet: Beträge, Fristen und nächste Schritte, jeweils mit Fundstelle im Original. Die Dokumente werden standardmäßig nur im Browser verarbeitet.

Leistung
Konzept, Gestaltung, Umsetzung
Art
Web-App, als App installierbar
Technik
Next.js, Texterkennung und Spracheingabe im Browser
Intro der App · 30 SekundenAnimation in Code (GSAP), Figur und Videovorschauen KI-generiert

01 · Ausgangslage

Hilfe holen hieß bisher: Daten abgeben

Wer einen Brief vom Amt, von der Versicherung oder vom Vermieter nicht versteht, lädt ihn bei einem Onlinedienst hoch. Mit dem Brief gehen Name, Anschrift, Kontonummer und oft auch Gesundheitsdaten an einen fremden Server.

Gesucht war ein Werkzeug, das Klarheit schafft, ohne diesen Preis zu verlangen, und das auch Menschen bedienen können, die mit Technik wenig Erfahrung haben.

02 · Aufgabe

Was die App leisten musste

  • Das Wichtige aus einem Dokument sichtbar machen: Beträge, Fristen, Absender und nächste Schritte.
  • Jede Angabe nachvollziehbar halten, mit Fundstelle und Seite im Original.
  • Persönliche Angaben so schwärzen, dass sie sich nicht wiederherstellen lassen.
  • Ohne Konto auskommen, und das Original verlässt das Gerät nicht.
  • Ruhig und verständlich bleiben, auch auf dem Handy und für ungeübte Hände.

03 · Lösung

Ein Werkzeug, das zeigt, woher jede Angabe kommt

Der Brief-Versteher nimmt ein Foto, eine PDF, gesprochene Sprache oder eingefügten Text entgegen. Erkannte Beträge und Fristen erscheinen mit Fundstelle, Seitenzahl und Sicherheitsstufe; als bestätigt gilt eine Angabe erst, wenn sie am Original geprüft ist. Fristen lassen sich mit zwei Erinnerungen in den eigenen Kalender übernehmen.

Sensible Angaben wie IBAN, Steuer-ID, Versicherungsnummer oder Diagnosen werden erkannt und in eine flache PDF-Kopie eingebrannt, die keine auslesbare Textebene mehr hat. Eine Farbampel zeigt bei jedem Schritt, wo die Daten bleiben: grün auf dem Gerät, blau nur bewusst gespeichert, orange, wenn ein externer Dienst möglich ist.

Rund um das Werkzeug: 25 Musterschreiben, 45 Soforthilfe-Situationen, sechs geführte Assistenten und ein Videokurs mit 15 Folgen.

Eingangsbereich des Brief-Versteher mit den Wegen Foto oder Datei, Sprechen und Text einfügen sowie den Zielen Schreiben verstehen, Frist oder Forderung prüfen, Antwort vorbereiten
EingangFoto, PDF, Sprache oder Text, dazu das Ziel: verstehen, Frist prüfen, Antwort vorbereiten.
Abschnitt Die App zeigt, woher eine Angabe kommt mit den drei Schritten Lokal lesen, Selbst prüfen und Sicher handeln
PrinzipLokal lesen, selbst prüfen, sicher handeln: Keine Angabe ohne Herkunft.

04 · Technik

Rechnen im Browser statt auf dem Server

Grundlage
Next.js 16, React 19, TypeScript, Tailwind CSS 4
Texterkennung
pdf.js für den Text aus PDFs, Tesseract.js für Fotos und gescannte Seiten; beides läuft im Browser, die Sprachdaten kommen vom eigenen Server
Spracheingabe
Whisper (tiny) lokal im Browser über WebAssembly, das Modell wird vom eigenen Server geladen
Schwärzen
Seiten werden als Bild gerendert, Schwärzungen eingebrannt und mit pdf-lib als neue PDF ohne Textebene ausgegeben
Speicher
ohne Konto; ein freiwilliger Ergebnis-Tresor liegt nur im Browser (IndexedDB)
App
installierbar über Web-App-Manifest, Service Worker mit Offline-Seite
Sicherheit
Content-Security-Policy mit Nonce, Verbindungen nur zur eigenen Domain
Qualität
automatisierte Tests mit Vitest und Playwright, Barrierefreiheitsprüfung mit axe, Gerätetests auf iPhone, iPad und Mac

05 · Worauf es ankam

Vertrauen durch Sichtbarkeit

Vertrauen entsteht hier nicht durch ein Versprechen, sondern dadurch, dass man es sehen kann: Jede Angabe hat eine Fundstelle, jeder Datenweg eine Farbe.

Kennenlernen anfragen