Core Products
Clean little interactions carrying the team on their back.
All
All
Clean little interactions carrying the team on their back.
A two-level animated segmented control: the outer switch toggles between Free and Premium, and selecting Premium morphs in a nested Solo / Team switch on the right half. Every translate, scale, and color transition runs on the UI thread via Reanimated, making it a slick pricing or plan selector for onboarding, paywall, and settings screens.
Built entirely with react-native-reanimated v4. Two shared values (outerX, innerX) drive the whole control: useAnimatedStyle worklets derive every dependent transform with interpolate, while interpolateColor crossfades the label colors as the indicators slide. The 'Premium' label lifts and shrinks while the nested 'Solo • Team' row scales up from behind it, and a divider dot fades out — all keyed off the single outer position so the morph stays in sync. Taps are handled with Pressable onPressIn for instant response; the demo wraps the tree in GestureHandlerRootView so it drops cleanly into a gesture-handler app. No native code — tested on Expo SDK 56 (iOS + Android) and works on web via react-native-web.
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.
