Chapter 06

Media with a point of view

Our imagery has one job: make the product feel real. Real screens, real data shapes, real stories β€” and never a stock handshake in sight.

Screenshots

The product is the photography

Real screens only

Capture the actual product β€” never a redrawn approximation. Light theme by default; dark theme when the surrounding surface is dark.

Believable data

Populated workspaces with plausible names, sums, and stages. Never lorem ipsum, never "Test 123", never an empty state unless the empty state is the feature.

Framed consistently

Browser-bar frame with the three dots and an app.bo.ge URL, 14px radius, large soft shadow, on white or Surface 2. No tilted 3D perspective mockups.

Crop to the story

Show the widget or table the copy talks about, not the whole app. If a viewer can't tell what to look at in one second, crop tighter.

Photography

Real operators, real rooms

βœ“ Use
Candid people at work in real spaces β€” shops, warehouses, clinics, small offices β€” with natural, warm daylight.
Honest detail shots: a POS terminal on a counter, a stockroom shelf, a phone running the app in someone's hand.
A neutral, slightly cool grade that lets the UI's teal and aqua accents stay the most saturated thing in frame.
βœ• Avoid
Stock clichΓ©s: handshakes, pointing-at-whiteboard meetings, skyline drone shots, suits laughing at salads.
Heavy filters, duotones over faces, or gradient overlays on photographs β€” the gradient belongs to the UI, not to people.
Obvious AI-generated people presented as customers. Illustrative AI imagery is fine for abstract concepts, never for testimonials.
Video

Two styles, zero feature tours

Every ad is either a story or a beat. The generic screen-recording with a stock voiceover reading feature names is explicitly banned β€” if a video could belong to any SaaS company, it's not ours.

Style A
A day in a real business,
told by the person running it

Story-led

A narrative with a protagonist β€” an operator with a name, a problem, and a morning that goes wrong before the product makes it right. Voiceover with character (warm, specific, human), product shots woven into the story, emotion before information.

FIVE TOOLS.
ONE BILL.
$29/user/mo

Kinetic type

Bold Inter typography cut hard to the music β€” short punchy claims, numbers doing the arguing, product flashes between beats. No voiceover needed; rhythm carries it. Night background, gradient on the payoff line only.

Audio first

Record the voiceover and pick the track before composing. Scenes are timed to real audio lengths β€” never stretched to fill, never cut mid-word.

Captions always

Most feeds play muted. Every spoken word is captioned in Inter Semibold; the video must work with the sound off.

One end card

Every video closes the same way: Night background, the lockup, the tagline, and backoffice.llc in JetBrains Mono. Two seconds minimum.

Music, understated

Modern and rhythmic, never epic-trailer bombast. Sound effects only where they land on an action β€” a click, a cash-drawer, a notification.

Motion

Movement you barely notice

Quick and eased

UI transitions run 150–250ms with standard easing. Hovers lift 2–3px with a soft shadow. Nothing bounces, spins, or overshoots.

Glows drift

The teal and aqua background glows may drift slowly on hero and dark surfaces β€” ambient, never pulsing, never demanding attention.

Motion means something

Things move because they changed state β€” appeared, completed, failed β€” not for decoration. Respect reduced-motion preferences everywhere.