Core Products
Clean little interactions carrying the team on their back.
All
All
Clean little interactions carrying the team on their back.
An animated submit button that walks through Save → Saving → Saved on tap. The width springs open, the label morphs letter-by-letter (e → ing → ed) with a staggered roll, and a blurred spinner crossfades into a checkmark before the whole thing resets. Perfect for form submits, bookmark/like actions, or any optimistic async confirmation.
Built with react-native-reanimated v4 — a single `progress` shared value (0 Save → 1 Saving → 2 Saved → 3 reset) drives the entire choreography on the UI thread, so width, background color (interpolateColor), label letters, and the indicator all stay in sync with zero React state. Each suffix letter is a worklet-animated Animated.Text that fades and slides over its own staggered slice for the rolling effect. The status indicator layers an AnimatedBlurView (expo-blur, intensity animated via useAnimatedProps) over a spinner that scales out as the checkmark scales in; the spinner spin uses a Reanimated CSS keyframe animation. Tap scaling comes from pressto's PressableScale and the app is wrapped in react-native-gesture-handler's root view. Icons are react-native-svg. Tested on Expo SDK 56 (iOS + Android); note that the expo-blur indicator looks best on iOS.
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.