Phones recede down a corridor on either side of a headline.

$npx kinetograph add screen-tunnel
Source

Props

Every prop has a default, so the template renders as it is. Change any of them in Studio or in code.

  • opening

    list = ['One', 'camera move.']

    The line the shot opens on: a muted first word, then the rest in the accent.

  • words

    list

    The sentence that builds at the end, one entry per word.

  • uiFont

    string = "Geist"

    Google Fonts family of the headline.

  • ground

    colour = "#ffffff"

    The ground, which fills the corridor.

  • accent

    colour = "#5a3cf0"

    The headline accent.

  • muted

    colour = "#8d8a99"

    The muted opening word.

  • frame

    colour = "#1b1c1e"

    Phone frame colour.

  • tint

    colour = "#efebfe"

    The ground colour of the screens on the walls.

  • tiles

    list

    The four colours of the tiles and dots drawn on the screens.

  • pullBack

    number = 1

    How far the camera pulls back: 1 is the full move, 0 a still camera on the corridor.

  • speed

    number = 1

    Playback speed of the move.

  • gap

    number = 0.12

    Space left between neighbouring phones, as a share of each wall: 0 has the phones meet at the seams, 0.12 the default spacing.

  • shadow

    number = 1

    Strength of the drop shadows under the headline: 0 is flat type, 1 the default lift.

  • grain

    number = 0

    Film grain over the whole frame.

Compositions

  • ScreenTunnel