@MMDEV98
6 min read

Bringing Bacham to Life with Motion

Three months of animation-heavy frontend work — scroll-driven sequences, a virtualized Jalali calendar, and custom audio and video players built for the Bacham platform.

Mohammad Hossein Moradi
MotionReactCareer

From February to May 2024 I worked remotely on Bacham, a platform whose design leaned hard into motion. Most projects use an animation library for a transition here and a fade there; Bacham was the opposite — the animations were the interface, and my job was to make them feel effortless.

Framer Motion, nearly all of it

By the end of the project I had used almost the entire Framer Motion surface: sequence animations, scroll-based and in-view triggers, springs, transform values and velocity, gestures, variants, drag, custom animations, AnimatePresence, and layout animations. The scroll-driven sequences were the most demanding — choreographing elements against scroll position without jank means being deliberate about what animates on the compositor and what touches layout.

You can see a taste of it in this demo I shared on LinkedIn.

A Jalali calendar without limits

The platform needed a Jalali (Persian) calendar and datetime picker, and the existing options all had the same flaw: hard-coded year ranges and sluggish month grids. I built one with virtualization under the hood — effectively infinite years, months, and days, scrolling as smoothly as a native picker.

Custom media players

Bacham's design called for audio and video players that matched its visual identity, so I built both from scratch on top of the media element APIs — custom scrubbing, buffering states, and controls that fit the design instead of fighting it.

The practical parts

Not everything was animation. I implemented the authentication and control flow, and set up server-side rendering for the blog pages specifically — the one part of the app where SEO mattered most — while keeping the rest a fast client-side experience.

Three months is a short stint, but it was the most concentrated animation work I've done — and it permanently raised my bar for what "feels right" means in a UI.