Aritro
A design engineer based out of New York City, focused on interaction design.
Design Experiments
2025 — 2026
A collection of small, focused interaction design experiments built with React and Framer Motion. Each is a study in animation and state transitions.
Drone Imagery
A processing animation with two layers. A blurred backdrop sits behind a sharp aerial crop shown through a circular porthole. A 12×12 grid of frosted panes covers the crop and de-blurs cell by cell, sweeping diagonally from a random corner while a pill counts the tiles as they clear.
Image Source
A hero image that morphs into a two-column picker, with a scrollable rail of captures in the middle and source providers on the right. The centered capture sits enlarged, mandatory scroll-snap keeps every scroll landing on an image, and clicking a capture morphs it back into the hero with a shared layout animation.
Project Card
A draggable pipeline card built from a drag wrapper, a four-layer shadow, and content zones that each react on their own. The footer expands on hover with a grid-template-rows transition, tags animate between positions with shared layoutIds, and a two-step picker lets you add a tag with a reason.
142 Oak Avenue, Unit 3B
Rachel Morrison
Compressor cycling on high-pressure fault. Found 12psi low on suction side. Possible slow leak at service valve.
Tag & Label Editor
Two takes on the same editing pattern. Tags use tinted fills with colored borders pulled from one hex, while labels use solid fills with white text. Both open an inline popover with a self-measuring name field and a two-row color picker, and labels add a visibility toggle with an animated EyeOff icon.
Stacked Input
A multi-step form input that stacks previous entries as the user progresses, creating a compact layered effect. Each completed step slides beneath the current input.
Stacked Input
Action Toolbar
Inspired by @mrncst
An expandable action toolbar that morphs between collapsed and expanded states. Cards within the toolbar animate in with staggered timing and spring physics.
Dynamic Island
An iOS-style dynamic island that transitions between multiple states — idle, ringing, and timer. Each state morphs the container shape and reveals different content with layout animations.
Tab Bar
An animated tab bar using clip-path transitions and mix-blend-mode. The active indicator smoothly morphs between tabs with a spring animation, inverting the text color of the selected tab.
Comment Ball
A draggable comment pin on a design canvas. At rest it's a 32px avatar bubble with a speech-tail corner. Hovering expands the container, clipping the preview into view as it grows, and clicking opens a full thread panel anchored to the ball with a reply input.
@james Can we shift this section down? Feels too close to the header.
@priya This gradient feels off on the edges.
Love this gradient treatment. Ship it.