Fire, smoke and a tattooed forearm, frame 121 of the site's hero sequence
Scran Doh · CheltenhamIdentity · Site · Motion

SCRAN
DOH.

A brand built out of one word, one colour, and a film you scrub with your thumb.

The problemCh 01

Where every chef's site goes wrong

EVERY CHEF'S SITE SELLS THE PLATE.

Shot from above, on white linen, perfectly plated. That sells taste. Scran Doh is selling how you feel two hours later, and nobody has ever photographed that from above on white linen.

Cam Meyer · personal chef, supper clubs, private events02 / 16
The two characters the mark was adapted from
The shipped chop stamp

Shipped · the red chop, black ink

Cut one
Cut two
Cut three
Cut four
Cut five
Cut six
Cut seven
The markCh 02 · Identity

Seven cuts of the same stamp

A REAL WORD, REDRAWN UNTIL IT CARRIED THE BRAND AND NOT THE LANGUAGE.

Adapted from 美食, bishoku, Japanese for fine food. Two characters redrawn stroke by stroke with the letters of Scran Doh set into them as an anagram, so the wordmark and the symbol arrive in one stroke.

Starting from a real word is what keeps it upright. The rhythm and the stroke weight do the structural work; the anagram is the joke underneath, there for anyone who looks long enough to find it

Design work / Scran Doh / Logos03 / 16
The forearm the stencils were traced from
The knife, traced
Sunny side, traced
The script column, traced

Knife · sunny side · script column

The motif set, part oneTraced, never invented

THE MOTIFS ARE CAM'S OWN TATTOOS, TURNED INTO INK.

A chef's knife, a script column and a sunny side mark, taken from references of the real tattoos and traced into white pen and ink. Brand texture that already belonged to the person, rather than a stencil set bought in.

On the site they composite with mix-blend-mode: screen on black, one per section, 8 to 20% opacity. Faint enough to read as a watermark in the paper, not a sticker on top

assets/motifs/tattoo-*.png04 / 16
Fire at the pass
BLACK#000000
The ground, always
TRUE WHITE#FFFFFF
Where light or paper falls
RED#CE3A27
Exactly once per frame
Lost in South
Display · every headline. Its numeral two is missing from the font, so no headline on this site can contain one
EB Garamond
Body · the serif against the brush is what stops it reading as a generic bold-sans restaurant site
BUNGEE
Labels, navigation, the wordmark

“Quiet, hands-on, lived-in. Name the herb, the cut, the village. Warm over polished, dry humour over hype.”

The voice, written once and applied to every line of copy on the site

The systemCh 03 · Three faces, three colours

BLACK, TRUE WHITE, AND ONE RED PER FRAME.

Tokens live in one :root in sites/scrandoh/styles.css05 / 16
Concept page one, the hero
Concept page two, the mindset
Concept page three, the philosophy and three line icons
Concept page four, the enquiry form
Concept, 25 AprilFour pages, before a line of the site existed

What survived and what did not

IT HELD ITS NERVE ON BLACK AND LOST IT ON THE ICONS.

Black ground, one red, brush display: all of that shipped unchanged. The three thin line icons along the bottom of page three did not, and they are the reason the brand now has a written rule about icons.

Design work / Scran Doh / Scran Doh landing page.pdf06 / 16
The chef section/about
The cooking/about
Intentional approach, with the three glyphs/ feature
A menu/menus
What private dining includes/private-dining
The enquiry form/ enquire
Livescrandoh.com

SIX PAGES, ONE ACCENT, NO SECOND COLOUR ANYWHERE.

The discipline is the design. Add one warm neutral, one amber, one cream, and the red stops being loud.

Six pages · static HTML, hand-written CSS, vanilla JS07 / 16
The portrait social frame the hero started as

The source · 1080 × 1350, brand type baked in

Widening one, the face held01 — face held
Widening two02 — herbs invented
Widening three, a different man03 — different man
Widening four, a different man04 — different man
Widening five, a different man05 — different man
A frame of the animated clip01, animated
ProvenanceCh 04 · Where the film came from

One photograph, widened, animated, then cut up

THE PROMPT BANNED AN INVENTED FACE. THREE OF THE FIVE INVENTED ONE ANYWAY.

A portrait social frame went to gemini-2.5-flash-image to be painted out from under its own overlays and extended to 21:9. Five passes. Only the first two kept the man in the photograph, and the first is the one that went forward.

Take 01 → parallax push → fal-ai/wan-i2v → hero.mp4, $0.20 · hash-matched to the shipped file08 / 16
Smoke through the pass
Dead endCh 05 · The hero, first way

SEEKING A VIDEO ON EVERY SCROLL TICK STALLS,

Setting currentTime on a <video> makes the decoder hunt for a keyframe and decode forward from it. Under fast scrolling it step-jumps, worst on iOS.

assets/hero.mp4 · 2.9MB · still in the repo, no longer referenced09 / 16
Frame 1001
Frame 21021
Frame 41041
Frame 61061
Frame 81081
Frame 101101
Frame 121121
Frame 141141
Frame 161161
The fixCh 05 · The hero, second way

SO THE FILM STOPPED BEING A VIDEO.

Every real frame of a five-second clip at 32fps, decoded up front with createImageBitmap, the right one painted per scroll tick. No interpolation: 161 is the native ceiling.

161frames, all real
5.4MBwebp, q72
2.9MBthe mp4 it replaced
Commit d4d5ca6 · assets/hero-frames/f-001..161.webp10 / 16
RunningThe hero, scrubbing

FOUR SCREEN HEIGHTS BEFORE THE PAGE BEGINS.

About twenty pixels of scroll per frame. At 200vh the whole film was over in one screen-height and rushed past before it read. On a phone the track drops to 250vh; with reduced motion it collapses to 100vh, the canvas is hidden, and not one frame is fetched.

Frame 1 at 20%001
Frame 54 at 20%054
Frame 107 at 20%107
Frame 161 at 20%161
Frame 1 at 40%001
Frame 54 at 40%054
Frame 107 at 40%107
Frame 161 at 40%161
FramingCh 06

The mobile hero

A PHONE ONLY SEES A QUARTER OF THE FRAME.

Once cover-fit has scaled the film, a portrait phone shows about 26% of its width. Where that window sits is a framing decision, not a detail.

Top row  ·  20%. Pinned right, the face clipped through the back half
Bottom row  ·  40%, shipped. Clear of both edges, forearm and fire in shot

Checked at frames 1 / 54 / 107 / 161, not the opening frame alone12 / 16
Shisoshiso
Wild garlicwild garlic
Three-cornered leekleek
Wood sorrelwood sorrel
Common sorrelsorrel
Yarrowyarrow
Sweet cicelycicely
Wild fennelfennel
Baybay
Wild thymethyme
The motif set, part twoCh 07

TEN HERBS, AND THE LIST IS CAM'S, NOT MINE.

Shiso leads because it is Cam's favourite, and because it is the bridge between the Asian leaning and the foraged-in-Britain register. Nine more followed one per run, the brief field swapped and everything else held identical, so the drawing hand stays the same across the set.

White ink on flat black, composited by screen at 0.14 to 0.2213 / 16
Fire, take Afire a
Fire, take Bfire b
Fire, take Cfire c
Fire, take Dfire d
Fire, take Efire e
Fire, take Ffire f
Knife, take Aknife a
Knife, take Bknife b
Knife, take Cknife c
Knife, take Dknife d
Knife, take Eknife e
Knife, take F, a daggerknife f
Mortar, take Amortar a
Mortar, take Bmortar b
Mortar, take Cmortar c
Mortar, take Dmortar d
Mortar, take Emortar e
Mortar, take Fmortar f
Mortar, take Gmortar g
Mortar, take Hmortar h
Mortar, take Imortar i
Fire, shippedFIRE E
Knife, shippedKNIFE D
Mortar, shippedMORTAR G
Dead ends, eighteen of themCh 08

TWENTY-ONE DRAWINGS FOR THREE MARKS.

Scran Doh does not use icons. It uses tattoo flash, drawn by the same hand as the knife on the wall. A stock line-icon set is the single fastest way to make a site like this look rented.

Design work / Scran Doh / motifs / icon-source / norm14 / 16
Mortar take A, scratchboard: a solid white mass carved with black lines
Mortar take G, open line work: only the strokes are white
The rule that came out of itNine mortar takes, two prompt rewrites

A WHITE MASS CARVED WITH BLACK LINES IS THE EXACT INVERSE OF FLASH.

Scratchboard · rejected

Open line work · shipped · about 12% white in frame

Only the strokes are white and the black ground shows straight through the body of the object. The failure is not ugliness, it is inversion, and it looks correct until you put the two side by side.

Judged at 88px, the size it actually ships at15 / 16
Cam at the pass
AttributionDexter Jameson

I BUILT THE BRAND.
CAM BUILT THE FOOD.

The mark, the palette, the voice, the motif set, the glyph set, six pages and the frame-scrub hero are mine. The cooking, the kitchen and the location photography are not, and I did not take a single one of those pictures.

There is no outcome number on this deck. Enquiry and booking figures sit with Cam, I have not been given one, so there is not one here.

01 / 16 A3 landscape · 420 × 297mm