LifePixels

The Challenge

A personal development app concept needed to deliver a native iOS experience using React Native — smooth 60fps animations, haptic feedback, glassmorphic UI elements, and offline-first data architecture. The founder wanted users to feel like they were using a native Swift app, not a cross-platform wrapper. The additional challenge was building an offline-first sync system that handles conflicts gracefully when users make changes without internet connectivity.

Discovery Phase

We benchmarked three animation approaches (React Native Animated API, Reanimated 3, and Moti) against native SwiftUI transitions. Reanimated 3 with worklet-based animations on the UI thread achieved frame-perfect 60fps performance. We designed the offline-first data model with Convex, using optimistic updates for instant UI feedback and a conflict resolution strategy based on last-write-wins with user notification for conflicting changes.

Our Solution

Built with Expo for development tooling and custom native modules for haptic feedback and advanced animations. Convex provides the backend with offline-first sync — data is stored locally using AsyncStorage and synced when connectivity is available. The glassmorphic UI was built with custom blur effects using expo-blur and animated gradients using Reanimated 3 worklets running on the UI thread for zero-lag visual effects.

Architecture

The app uses a unidirectional data flow with Convex as the source of truth. Local state is managed with Zustand for instant UI updates (optimistic), while Convex handles server-side persistence and cross-device sync. The animation layer runs entirely on the UI thread via Reanimated 3 worklets, ensuring the JavaScript thread remains free for business logic. Push notifications use Expo Push with server-side scheduling for streak reminders.