Core Products
Clean little interactions carrying the team on their back.
All
All
Clean little interactions carrying the team on their back.
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.
The water is a single @shopify/react-native-skia RuntimeEffect: an SkSL fragment shader (ported from a Shadertoy GLSL caustics shader) samples the pool photo through an ImageShader and displaces it with summed sine waves for refraction, adds additive caustic highlights, and paints the duck's elliptical shadow at the same displaced coordinate so it ripples with the tiles. A react-native-reanimated useClock SharedValue feeds useDerivedValue uniforms every frame on the UI thread, and the duck's buoyant wander/tilt is a sum-of-sines at unrelated frequencies so the path never visibly repeats. Tested on Expo SDK 56 with the new architecture (react-native-skia 2.6 + reanimated 4 + worklets); requires a development build rather than Expo Go, and runs on both iOS and Android since all the heavy lifting stays on the GPU.
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 Telegram-inspired profile header where the avatar blob gooily detaches from a top pill and pops into a full profile photo as you pull the list down. The metaball merge/separation is rendered with a Skia ColorMatrix filter while a Reanimated scroll handler drives the radius, blur and snap behavior on the UI thread.