# Motion Brief Analysis **Core Message**: Progress flows forward with unstoppable momentum — code → test → ship → live. The card should feel like a pipeline executing, each stage propelling the next. **Motion Strategy**: - **Idle state**: A subtle, continuous left-to-right particle/dot stream through the pipeline stages, suggesting constant flow. - **Hover**: The stream accelerates, dots multiply, and a glowing "active" indicator pulses at the rightmost (live) stage. - **Press**: The entire pipeline compresses momentarily (scale 0.97), then rebounds with a ripple outward from the "live" endpoint, cementing the "momentum delivered" sensation. This animates the *journey*, not decoration — each motion phase reinforces "code moves relentlessly to production." --- --- ## Motion Rationale The card conveys momentum through **temporal flow**: each stage fills left-to-right with a staggered delay (150ms apart), mirroring a real pipeline's execution cascade. On hover, **particle streams** continuously slide across each stage bar at accelerating speeds (stage 4 completes in 0.9s vs. stage 1 at 1.2s), visually compressing time as code moves closer to "Live." The **green pulse indicator** on hover signals "active deployment" without text. On press, the entire card scales to 0.97 and rebounds with a spring, giving tactile confirmation of progress delivery. The gradient bloom behind intensifies the sense of energy and forward momentum. Easing uses snappy cubic-bezier easings for fills (ease-out) and linear for particle motion to avoid false deceleration — code doesn't slow down mid-pipeline. Labels appear only on hover to reduce visual noise, keeping focus on the motion itself. All movement respects prefers-reduced-motion and touch devices via @media (hover: hover).