Core Products
Clean little interactions carrying the team on their back.
All
All
Clean little interactions carrying the team on their back.
An Apple Music–style synced lyrics view with a word-by-word highlight sweep, an auto-scrolling sheet that cascades line-by-line with a staggered spring, and a progressive blur now-playing header. Tap any line to seek, drag to browse, and auto-follow resumes once you go idle. Drop it into a music player, podcast, or any read-along screen.
Lyrics are rendered on a Skia Canvas: the dim base text is drawn once, and a bright copy is painted through a [white, white, transparent] LinearGradient whose stops follow a per-word sweep, so the highlight reads as a sweep from the left without recoloring the base. Word timings are precomputed into a time→pixel mapping over each line 'unrolled' row by row. All motion runs on the UI thread via react-native-reanimated v4 worklets (shared values, useDerivedValue, useAnimatedReaction); the active line scales up with withSpring while neighbors get a depth-of-field Skia Blur. The auto-scroll uses a closed-form critically-damped spring step with a staggered cascade to mimic Apple's settle. The sticky header's progressive blur is an expo-blur BlurView faded by a MaskedView over an eased gradient (react-native-easing-gradient) so it ramps off smoothly instead of reading as a flat frosted panel. Gestures (pan with withDecay, tap-to-seek) come from react-native-gesture-handler, with box-none header layout so empty header taps fall through to the sheet. iOS shows SF Symbols via expo-symbols with a unicode glyph fallback on Android/web. Built and tested on Expo SDK 56 (RN 0.85, Reanimated 4); web works once the CanvasKit WASM is loaded before Skia imports run. Requires a custom dev client — Skia is not available in Expo Go.
A denim zipper that unzips and parts the screen like a curtain. The pull rides down the seam, the teeth split open along a soft rounded V, then both fabric halves slide off-screen to reveal the app underneath. Great as a splash, intro, or screen-transition overlay.
An interactive x-ray effect that reveals a hidden image underneath a base photo through a circular mask the user drags around. Pan to move the lens and long-press to reset, perfect for product showcases, before/after reveals, or playful onboarding screens.
A full-screen animated swimming-pool water effect with drifting caustics, refraction ripples, and a buoyant rubber duck whose shadow wobbles on the tiled floor below. Built as a Skia runtime shader (SkSL) driven by Reanimated, it makes a great living background for splash screens, onboarding, or empty states.