emocn

Push Through

Dolly through the outgoing scene while the next one approaches from the depth

Installation

$ pnpm dlx shadcn@latest add @remocn/push-through

Usage

pushThrough() is a Remotion transition presentation. Pass it to a TransitionSeries.Transition between two sequences. The camera pushes forward: the outgoing scene accelerates past the lens, blurring as it grows to zoom, while the incoming scene scales up from the depth with a small overshoot settle. Around 40 frames keeps the dolly readable.

import { TransitionSeries, linearTiming } from "@remotion/transitions";
import { pushThrough } from "@/components/remocn/push-through";
 
export const MyVideo = () => (
  <TransitionSeries>
    <TransitionSeries.Sequence durationInFrames={76}>
      <SceneA />
    </TransitionSeries.Sequence>
    <TransitionSeries.Transition
      timing={linearTiming({ durationInFrames: 40 })}
      presentation={pushThrough()}
    />
    <TransitionSeries.Sequence durationInFrames={76}>
      <SceneB />
    </TransitionSeries.Sequence>
  </TransitionSeries>
);

Props

pushThrough(props) accepts:

PropTypeDefaultDescription
zoom
number2.4How far the outgoing scene grows past the camera.
blur
number14Peak blur in pixels as scenes pass the focal plane.

Whip Pan

Whip the camera sideways with motion blur so both scenes fly through the frame in one move

Focus Pull

Rack focus from one scene to the next through a soft defocus breath