import { AbsoluteFill, Img, interpolate, useCurrentFrame } from 'remotion'; import { loadFont } from '@remotion/google-fonts/Geist'; import { loadFont as loadSerifFont } from '@remotion/google-fonts/InstrumentSerif'; const { fontFamily: geistFontFamily } = loadFont('normal', { weights: ['400', '700'], subsets: ['latin'], }); const { fontFamily: instrumentSerifFamily } = loadSerifFont('normal', { weights: ['400'], subsets: ['latin'], }); export function ReerollVideo({ image1 = 'https://tgrn1v6iwvgijzza.public.blob.vercel-storage.com/gi/tNqVyw4jJ0-SvHSDTKcPI5jCYbm1ihFxr4J15ejoA.png', image2 = 'https://tgrn1v6iwvgijzza.public.blob.vercel-storage.com/gi/TLeP98eZ9B-zlKorm9BIiuY1JWb55Ctq0Y7LEansq.png', }) { const frame = useCurrentFrame(); const durationInFrames = 150; const imageSliderX = interpolate( frame, [0, durationInFrames], [0, -1080], { extrapolateLeft: 'clamp', extrapolateRight: 'clamp', } ); const footerOpacity = interpolate(frame, [20, 40], [0, 1], { extrapolateLeft: 'clamp', extrapolateRight: 'clamp', }); const footerY = interpolate(frame, [20, 40], [50, 0], { extrapolateLeft: 'clamp', extrapolateRight: 'clamp', }); return ( {/* Title behind models */}

NEW

STYLES

{/* Image slider on top of title */}

{/* Header and Footer on top of everything */}

URBAN CHIC

ARRIVING THIS SUMMER

SHOP.URBAN-CHIC.COM

); }

High-Fashion Coming Soon Promo Video

More like this

Cyber Monday Sale Ad Video

15% Off Promotion Video