Final Arrangements: Memorial Planning App for Funeral Homes
A React codebase shipping three ways—web, Windows desktop, and iPad—used in person by family service counselors to walk families through funeral planning with dignity and live cost estimation.
A memorial planning app used at the kitchen table during family meetings. The same React codebase ships as a responsive web app, a Windows desktop application via Electron, and an iOS/iPad app via Capacitor, with deep platform integration and local-first data persistence.
- React 19
- React Router 7
- Vite 8
- Tailwind CSS v4
- GSAP
- rrweb
- Electron 42
- Capacitor 8
- IndexedDB
- TypeScript (as module type)
- electron-builder
- Tailwind @tailwindcss/vite
Final Arrangements is built for Van Hoosen Steel Funeral Home and used by family service counselor Justin Knalls to guide families through advance funeral planning in person. The app structures the conversation as six sequential chapters—Quick Intake, Vital Statistics, Final Wishes, Remembrance, and Estimate—plus counselor-only sections for session replay and settings. A handoff mechanism lets the counselor pass the iPad to the family for private time; if a PIN is set, the counselor surface locks automatically.
The codebase is a single React 19 + Vite build that ships three ways: as a static web app (with a Vite dev server for local work), as a Windows desktop app packaged with electron-builder (NSIS installer), and as an iOS app using Capacitor 8. Platform shims handle native affordances like haptics, camera access, and keyboard behavior; the Electron build runs in a sandboxed context with preload protection. Session recording uses rrweb to capture full replays of counselor-family conversations stored in IndexedDB, allowing counselors to revisit past meetings without retaking notes.
All planning state persists to localStorage after every change; recordings live in IndexedDB alongside a sync queue. A service worker caches the shell for offline resilience. When connectivity returns, the app drains the queue with exponential backoff. An estimate engine computes itemized costs from the family's wishes in real time, displayed in a collapsible right-hand rail (on iPad landscape) or a bottom sheet (on portrait). The design uses a deliberate color palette—cream canvas, sage accents, italic Instrument Serif headlines—and is intentionally paper-like to feel congruent with a funeral home's quiet, respectful context.
- Unified React codebase shipping as web, Electron desktop, and iOS (Capacitor) with thin platform shims for each surface
- Session replay via rrweb: counselors can revisit past family conversations from IndexedDB, useful for recalling what was discussed without retaking notes
- Handoff mode: counselor passes iPad to family; counselor-only chapters hide and device optionally locks behind a PIN with exponential backoff on failed attempts
- Live estimate engine with itemized funeral service costs computed in real time as families make selections, persisted and synced back to home office when online
- Local-first architecture: localStorage + IndexedDB + service worker = offline-capable app that drains a sync queue when connectivity returns with exponential backoff