Robot Tv

www.therobot.tv

A Southern African film production studio site that pits a bespoke shattered-slab display logomark against full-bleed film stills and a heavy WebGL/GSAP/Lenis motion stack to make the homepage feel like a 60-second commercial reel rather than a marketing page.

Film Production Commercials Production Studio niche

Design tokens

black

white

off-black

dark2

dark3

grey-1

grey-2

grey-3

dark-grey

grey-01

beige

light-pink

display: OTMediumSemiSqueezed, Arial, sans-serif
displayBold: OTBoldSemiSqueezed, Arial, sans-serif
displayExtra: OTMediumExtraSqueezed, Arial, sans-serif
body: OTMediumSemiSqueezed, Arial, sans-serif
mono

Do / Don't

Reference it for

Duotone palette of pure black rgb(0,0,0) + warm beige #e3e4d8, cinema mode flipping to daylight mode
Single chromatic accent #fe0000 pure red plus dark-red #740410 text variant and reserved #290ff0 blue
Bespoke three-cut squeezed display sans (OTNeueMontreal-MediumSemiSqueezed + ExtraSqueezed + BoldSemiSqueezed)
Custom shattered-slab logomark ("ROBOT" rendered with diagonal slice-cuts through each letter)
6-step extreme type scale (13 / 16 / 26 / 104 / 176 / 500px), most extreme display scale in library
2.47px wide-tracked letter-spacing on caps micro-labels, broadcast-credit register
Live GMT+2 timezone clock in top-left with red square indicator, Southern Africa HQ signal
Top-centre shattered logomark + top-right MENU label, three-anchored hero chrome

Do not copy

The shattered-slab "ROBOT" wordmark glyph treatment, strongly brand-coded
The OTNeueMontreal-MediumSemiSqueezed bespoke squeezed cuts unless licensed
The "WE DISRUPT. / WE INSPIRE. / WE CREATE." three-line manifesto opener verbatim
The "Southern Africa production specialists" positioning unless the brand is genuinely Southern African
The "Liam Johnson, Executive Producer" contact card structure verbatim
The GMT+2 timezone unless the brand is in Cape Town / Johannesburg
The giant red "t" mark as the contact-section background graphic
The lil-gui dev panel left in production

Signature moves

extreme 6-step display scale with squeezed sans

a 6-step type scale (13 / 16 / 26 / 104 / 176 / 500px), the most extreme in the library, drives manifesto slabs at 176px caps and giant scrolling letterforms at 500px as section dividers

broadcast-credit chrome system

wide 2.47px-tracked caps micro-labels, a live GMT+2 clock with red square indicator top-left, three-anchored hero chrome (logomark top-centre, MENU top-right) and per-case-study pagination (03/10) give a broadcast-reel register

clip-path reveal choreography

display reveals run on all 0.8s cubic-bezier(0.25, 1, 0.5, 1) slow-out snap with a transform 0.4s ease-in-out workhorse, plus clipOpen/clipClose keyframes for clip-path reveals

Related references

Analogue

strong

Creative Studio

a "seriously playful" brand-and-motion studio that wears its personality as type, a wonky multi-alternate ANALOGUE wordmark, emoji and icon glyphs set inline in the copy, a candy-pink accent on white, and a GSAP-driven box of tricks (mexican-wave letters, glitches, bounce, float) kept just on the right side of chaos.

Bindery

niche

Film Production

The reference for boutique NYC production studios — full-bleed video tile mosaic on warm off-white, condensed black serif wordmark, GSAP+Lenis scroll choreography over a soft pastel palette that cycles per section.

Brand Appart

strong

Creative Studio

The reference for Paris startup design agencies — Youth chunky-sans display, cream parchment paper, orange ©-superscript wordplay, live Paris clock, Webflow + Lenis + Splitting.js stack.

Dverso

strong

Creative Studio

a Milan "immersive" studio that builds its homepage like a technical drawing, a warm cream canvas with a blueprint grid, mono-everything UI, a giant outlined "dverso" wordmark, and the team rendered as stylised 3D avatars standing inside the letters, with a pixel display font and scramble text for character.