# Closeup: Filming

> Picking what to film, the frame and its background, the cursor, and the camera that closes in on clicks and pans as you scroll.

Source: https://cesarvenzac.com/closeup/docs/filming

## Picking

Point at an element, ↑ and ↓ widening and narrowing the pick through what holds it, and click to film it; or switch to a region and draw one. Once picked, what the take will film is outlined, its shape and room included, and everything else dimmed, so there's no guessing where the frame falls.

## Options

The toolbar's Options button opens them, in groups. They're kept in the browser for next time, all but a background image, which is chosen again after a reload.

- **Frame**: the shape (16:9, 1:1, 4:5, 9:16 or the pick's own), the room round an element (a region is filmed as drawn), and for a video how close the camera comes on a click: off, 1.5× or 2×.
- **Background**: none, a colour, a gradient or an image of your own, with the inset between it and the page, the corners' radius and a shadow.
- **Cursor**: for a video, who moves it, your mouse or a script; whether it's drawn (a script's always is), a ring on each click, and its size.
- **Recording**, for a video: the countdown before a take by hand (3 seconds, or 5, or none), the clicks' sound, the tab's own sound, and the quality. For a photo the group is **Photo**: a timer of 3, 5 or 10 seconds, or none.

## The camera

With the camera set to close in, each click inside the frame brings it in on that point, which stays where it is on screen as far as the frame allows. While it's close it follows the pointer as a magnifier does, and it draws back once nothing has been clicked or typed for a moment, 1.8 seconds.

A script's take closes in on its clicks and its typing, landing as the cursor arrives; from one point to the next nearby it glides, to one further away it draws back first, and it draws back at the end.

## Scrolling

Scroll as you would, with a wheel, a trackpad or the keys that scroll. A part of the page that scrolls, a list or a code block, scrolls; otherwise the camera pans down the page, as far as the page goes. The page itself never scrolls, so nothing jumps.

## Pausing

In a take by hand, Pause and Resume sit beside Stop, above the frame, and a paused stretch isn't recorded. A script's take plays through. Esc stops either.

## How it stays sharp

A capture of a small part of the screen is small: a 120-pixel button filmed and enlarged is a blur. So Closeup enlarges the page first. A transform on `<body>` scales it round the pick until the frame fills most of the window, and the browser draws it large at the screen's full resolution; the layout doesn't change, only how big it's drawn. The tab is captured with `getDisplayMedia` and cropped to the frame by Region Capture, so Closeup's own controls, outside the frame, never show.

The real cursor would be drawn into the capture small and soft, so it's hidden and a drawn one, like macOS's, stands in. The camera works the same way: closing in enlarges the page further and panning moves it, a frame at a time on a spring, so a close-up of a click is drawn as sharp as the rest, not blown up.

> **Note:** While the page is staged, the transform on `<body>` makes it the box that parts fixed to the window are placed in: they sit where they would at the top of the page and move with the rest. A fixed part you pick is filmed where it's placed then.

## Closeup's docs

- [Overview](https://cesarvenzac.com/closeup.md): Film any part of a web page in close-up, sharp at any size, with a drawn cursor and sound.
- [Getting started](https://cesarvenzac.com/closeup/docs/getting-started.md): Install Closeup, open it on a shortcut or on an element, and film a first take.
- [Filming](https://cesarvenzac.com/closeup/docs/filming.md): Picking what to film, the frame and its background, the cursor, and the camera that closes in on clicks and pans as you scroll.
- [Scripts](https://cesarvenzac.com/closeup/docs/scripts.md): Draw the cursor's path once and play it on every take: the editor, what each point does, and the JSON a script is kept as.
- [Keeping a take](https://cesarvenzac.com/closeup/docs/keeping.md): Trim a take, change its speed, keep it as a video or a GIF, and add buttons of your own that send it somewhere.
- [API reference](https://cesarvenzac.com/closeup/docs/api.md): Everything the package exports: opening it, actions on a take, scripts, and their types.