ELA homepage, rounds 4 and 5

Round 5's remix leads, then round 4's three directions. All are rebuilt on the launch film's messaging and real app footage, judged by the same three lenses as round 3 (founder, conversion, craft; 8 means a judge would ship it). Click a screenshot to open the real page. Round 3's board stays where it was.

Where it stands

The remix is the best page so far. Across five independent judgings it scored 7.8 to 8.0 on average: founder 8 to 8.5 ("the first variant I would put my name to"), conversion 8 and craft 7.5. Round 3's best was 6.7. It does not reach 8.5. The craft judge holds at 7.5 because it reads the bento layout itself as template-shaped; getting past that means leaving the bento, which is your call. Three small fixes landed after the last judging: the full stops stay put while the guide dot moves, the phone completion message says "That's the hold" once, and the result card scrolls into view on desktop.

Scores

VariantFounderConversionCraftAverage
Round 3 winner: D Bento7766.7
R: The remix (round 5)887.57.8
H: Hold, then the story7.887.57.8
D: Bento, evolved7.87.577.4
F: The film, as a homepage7.87.57.57.6

What changed since round 3

  • The film's messaging: "Hold for three seconds. We send for help." replaces "Then you're not alone."
  • Day-neutral: no night framing, no 02:11 clocks; captures read 09:41.
  • Real app pixels only, in the film's iPhone 17 Pro and Apple Watch frames: no rebuilt UI.
  • One membership at AED 24.99 a week, 79.99 a month or 749.99 a year; the tiers are gone.
  • Launch-day state: "Available on iPhone and Apple Watch", no email capture, no 999 line.

Your calls on the remix

  • Who pays the lawyer. Proposed line in the membership section: "Legal fees are agreed between you and the law firm." It rests on your 9 August confirmation that members without Shield pay the firm directly. Approve or reword.
  • Price on the first screen. Proposed hero line: "AED 24.99 a week, AED 79.99 a month or AED 749.99 a year." The conversion judge wants a price in the first five seconds; the founder judge accepts prices in one place or all three.
  • Store link. Every "Get the app" goes to the real App Store id (6779533035), which resolves once the listing is live.

Round 4's chair

Open H first (variant-h-hold-story.html), then D. H is the closest to shippable and its fold is the product being used: press the phone in the hero and the real hold frames scrub under your finger, which is the film's message made tactile. Then open D, because it is the bento you asked for and its hero composition (phone mid-hold with the watch mirroring it) is the best single image in the round; scroll it on your phone though, because the 'what happens next' tile is currently a blank box on mobile and the countdown tile says the opposite of the auto-send. F is worth five minutes for its membership ledger and its film section, not for its hero. Honest score: nothing here is at 8.5. H is 7.8, F 7.6, D 7.4, and the judges agree on why in every case. The remix above (H's hero, D's tiles fixed, F's film and membership and dot physics) is what I would build; I expect it to clear 8.5 on founder and conversion and sit at 8 on craft unless the grid is broken up. Decisions only you can make: (1) Hero: H's pressable demo phone or D's synced phone-plus-watch loop; the hold demo cannot be both hero and tile without the settled home screen appearing twice. (2) One approved sentence on whether the member pays the lawyer's fees; all three judges asked for it near the price and none of us can write it for you. (3) Whether 'If you're arrested in the UAE, you're not on your own' may appear as a section headline on the page, or stays the film's title only, given the hold line is the H1. (4) Confirm the fail-safe headline is law 9 verbatim and that no page copy may say the family link keeps updating after the phone dies (H currently says it). (5) Whether 'From AED 24.99 a week' may appear in the fold as a pointer to membership, or whether the price is said exactly once further down.

Remix recommendation

Build the shipping page from H's skeleton and D's tiles, with F's finishing. Concretely: (1) Hero from H: the pressable demo phone with the 'Press and hold the disc' pill, keyboard and reduced-motion paths, and 'Demo with the real app. Nothing is sent from this page.' moved above the phone on mobile; keep D's bolded lede ('ELA is a legal emergency membership for UAE residents:') and D's mint keyhole bullet for law 9. Consider D's watch mirroring the hold beside H's phone if it fits without pushing law 9 below the fold on 390. (2) 'What happens when you hold' as D's evolved bento, with D's must-fixes applied: countdown body replaced with the film line verbatim ('If the moment passes, slide I'm safe and nothing happens. If you can't, ELA sends. Send help now sends at once.'), countdown phone at 270 px or more, case phone painting on mobile with the 'Example timeline' label outside .lines, one data-stop per tile, and the family tile carrying the voice.md sentence ('Live location, each milestone, and the name of the lawyer acting for you. Sent only to the people you chose.') before 'They don't need the app.' Drop H's sticky story stage entirely; it is where H's dead space and repetition live. (3) Fail-safe: D's dark tile, headline 'Phone locked, dead, or taken: it still runs.' in mint, body 'Once the hold commits, the response runs on ELA's servers, not on your phone.' Never H's family-link headline or F's 'nothing that happens to the handset' absolute. (4) Film section from F: poster-16x9 with the heading set into the poster's blank area, fixed 16:9 mount, click to play with sound, caption 'The launch film. 45 seconds, with sound.' Do not print 'Everything else is ours now' here since the bento tile owns it. (5) Membership from F: the editorial ledger (rules, three mono prices, one inclusion list, no card shells), Shield sentence verbatim beneath the prices, and one founder-approved sentence answering 'do I pay the lawyer'. Say the four outcomes once (the bento) and not again in the inclusion list. (6) Guide dot from F: its spring curves (damping ~0.81, arc and swell), a plain glyph on light with no white ring, dock position checked against each headline's baseline; H's rule that the headline's full stop returns when the dot leaves. (7) Closing from H: app icon plus CTA plus 'Available on iPhone and Apple Watch.' Target under 4,300 px on desktop. Done properly, this reaches 8.5 on conversion and founder lenses; craft will land around 8 unless the bento's tile silhouette is broken up (let the hold tile and the fail-safe tile bleed beyond the grid, as F's watch crop does).

Convergence check

  • D/H: H1 is identical ('Hold for three seconds. / We send for help.', two-tone, guide dot as the full stop) and the lede is near-verbatim the same sentence ('one hold on your iPhone or Apple Watch tells a vetted law firm, your consulate and your family'). Mandated by the founder ruling, so not a failure, but the two folds differ only in the phone: D's synced hold loop plus watch versus H's pressable demo phone.
  • D/H/F: all three run the same signature device (the forest guide dot hopping heading to heading and ending in the app icon's keyhole), the same 47-frame hold-scrub demo, the same 'Everything else is ours now' block with the same four voice.md lines, the same three-price membership block with 'Billed through the App Store', and the same closing 'Set it up once. Hope you never use it.' The layout families are genuinely different (bento grid / sticky story / linear editorial) but the section headings are swappable across all three.
  • H/F: 'If you're arrested in the UAE, you're not on your own' is H's story H2 and F's H1; D uses it on the film tile. Same 'One membership. The same response for every member.' H2 in H and F. Same 'Your lawyer has made contact.' beat heading in H and F.
  • D/F: both put the film's own poster-c frame ('Everything else is ours now.') under a section heading that already says the line, printing it twice on one screen.

Rank 1

R: The remix (round 5)

H's pressable hero with the watch scrubbing in lock-step, D's bento fixed and broken open, F's film, ledger and dot.

7.8was 6.7 in round 3
The remix (round 5), desktop, first screen The remix (round 5), phone, first screen

Founder 8Conversion 8Craft 7.5Score by round: 7.7 → 7.8 → 7.8 → 8.0 → 8.0 → 7.8 → 7.8 → 7.8

Headline. Hold for three seconds. / We send for help.

Signature. Press the disc on the real iPhone and the 47 real hold frames scrub under your finger while the Apple Watch beside it, bezel to bezel, scrubs its 121 real ring frames on the same clock (index = round(p*120)); release early and both rings wind back with "Released early. The ring winds back, nothing happens."; hold the full three seconds and both stop on their closed rings (f047 / w120, no red) with "That's the hold. In the app, the countdown starts now. Nothing was sent from this page." The forest guide dot is the headline's full stop, leaves the line to become the full stop of "Press and hold the disc", moves into the completion note, then hops tile to tile on springs (damping 0.81, arc and swell), turns mint on the one dark tile, docks on the film's title line and the membership and closing headings, and ends sunk into the app icon's keyhole.

Built from round 4's best parts: H's pressable hero, now with the Apple Watch scrubbing its real ring frames in step with the phone; D's bento, fixed and broken open; F's film section, membership ledger and guide-dot springs. Judged by the same three lenses. Average by round: 7.67 → 7.83 → 7.83 → 8.00 → 8.00 → 7.83 → 7.83 → 7.83.

What the judges said
  • Founder 8. This is the first variant I would put in front of the film without wincing: brand, copy law and honesty are all in line, the product carries the page, and it sells relief not fear; fix the dot/full-stop artefact and the mobile double line, then decide whether the hero keeps the price cue.
  • Conversion 8. A scanner knows what ELA is, who it is for and what it costs inside five seconds on both viewports, the action is real and honest, and the objections are answered in the right order with real screens; fix the two completion-state glitches and this ships.
  • Craft 7.5. A well-set, real-pixel, restrained page whose synchronous phone-and-watch hold is a signature worth keeping, held back from 8 by a confirmed mobile full-stop bug, a text-heavy mobile hero, and a silhouette that is still a refined bento rather than a new layout family.
Strengths
  • Brand system is clean: light-first Evergreen Mint throughout, tokens exact, self-hosted Bricolage/Instrument/Spline, mono used only for the three prices (nowhere else), one contained dark tile, and the only red on the page is the app's own "Send help now" inside the countdown capture. No gold, no oxblood, no black band, no eyebrows or kickers anywhere.
  • Real pixels only, properly: hero phone and watch are the actual frames (47 phone + 121 watch) scrubbed on one clock under the film's device masks; countdown, case timeline, thread, watch ledger and the family map are all real captures with Google attribution intact. Nothing is DOM-rebuilt; the only page chrome is a caption, a hairline leader and a completion note.
  • Copy is the film, near-verbatim: the hold line two-tone, the lede says what/who/where in one sentence, law 9 above the fold on both viewports, "Everything else is ours now" as its own exhale, the four lines with NOTIFIED/informed/private link/human team, deadman truth ("If you can't, ELA sends"), Example timeline labels on both timed captures, Shield line and all three footer sentences verbatim, no dashes, no banned words, no time promises outside the app's own captures.
  • The demo is honest without being apologetic: "Demo with the real app. Nothing is sent from this page." sits beside the phone, the release path says "Released early. The ring winds back, nothing happens", and the done state never shows the red countdown above the fold; it points you to it instead.
  • Emotional target lands: hold line, lede, CTA, then the keyhole and "Phone locked, dead, or taken: it still runs" in one fold; the forest tile is the exhale; the close is "Set it up once. Hope you never use it." No night, no dread, no insurance selling, no panic-button energy.
Still to fix (7)
  • Guide dot docking: keep the heading's typed full stop visible until the dot has actually settled on it (toggle `is-here` on settle in step(), not at hop start in go()), so no heading or note is ever missing its full stop and the desktop done state stops reading "That's the hold'".
  • Mobile done state: say "That's the hold" once. Either keep the hint as "Keep holding" fading out and let the note carry the line, or drop the note's repeat of it, and make sure the hint's dock period is not left orphaned at the line's right edge.
  • Mobile completion hint: make .hint display:block (or keep the dock inline inside #hintText) under 900px so the full stop stays attached to 'now', and shorten the mobile hint to 'That's the hold.' since the note card repeats the rest of the sentence.
  • Desktop completion: keep both note buttons visible at 1440x900 after the hold (e.g. scrollIntoView({block:'nearest'}) on the note when it shows, or reduce the hero's top offset so the card clears the fold) so the demo's payoff is not half-clipped.
  • Glue the hint's full stop to its sentence: make .hint display:block (or wrap #hintText and the .dock in one inline span) so the '.' can never become its own flex item when the line wraps on mobile; re-shoot fix7-r-ix-mobile-done.
  • Keep the typed full stop visible until the dot lands: toggle is-here on arrival (in step()'s settled branch) rather than in go(), so no heading ever reads without its stop during a hop.
  • Thin the mobile hero so the disc reaches the 844px fold: collapse the price cue to one line or drop it below the stage, and move 'Demo with the real app' under the devices only (as on desktop) rather than above them.

Rank 2

H: Hold, then the story

A real iPhone you press and hold in the hero, then one sticky phone tells the rest.

7.8was 6.7 in round 3
Hold, then the story, desktop, first screen Hold, then the story, phone, first screen

Founder 7.8Conversion 8Craft 7.5Score by round: 7.5 → 7.8 → 7.8

Headline. Hold for three seconds. We send for help. (line two in forest; the full stop is the guide dot, which hops once to the "Press and hold the disc" hint)

Signature. The hero phone is the real iPhone 17 Pro frame showing home.webp; pressing and holding inside the disc (pointer, touch, or Space/Enter) scrubs the 47 real hold frames on a canvas in step with a 3 s press; releasing early winds the ring back and says so; completing paints countdown.webp, a dark "Demo. Nothing is sent from this page." card slides in beside the phone (inside the countdown's empty band on mobile), then the canvas fades to case.mp4 playing in the same phone with "Then the response runs on ELA's servers." and a Try again button. touch-action:pan-y plus start-inside-only and a 14 px move abort, so a swipe that starts on the disc still scrolls; reduced motion reveals the end state in one tap with play buttons instead of autoplay. Below the fold, one sticky phone swaps the countdown still, case.mp4, a landscape card of the real family-map (attribution intact, phone slides aside) and reply.mp4 as four beats scroll past; on mobile each beat carries its own device inline.

Highest final average (7.77) and the only variant whose fold is the product being used rather than shown: the hero phone is the thing you press, with the 'Press and hold the disc' pill, the demo disclaimer, law 9 and the store CTA all above 844 px on mobile and 900 px on desktop. Objection order is right and mobile stacks cleanly. It stays under 8.5 because the dark fail-safe panel headline ('your family's link keeps updating') promises a live pin from a dead phone, the four outcomes are said three times, the sticky story leaves a 200 px dead band on desktop, the film poster is cropped into a 2.2:1 sliver, and the mobile 'Your lawyer has made contact' beat has no capture. All five are an afternoon of fixes; none is structural.

What the judges said
  • Founder 7.8. The closest any variant has come to the rules and the film's feeling, and it would ship once the fail-safe headline stops promising a live pin from a dead phone and the three small brand slips are corrected.
  • Conversion 8. Shippable on the conversion lens once the five small fixes land: the fold answers what, who, where and what to do in one glance with a real product, and the objection order is the right one, but the price is buried with no mobile shortcut, the outcomes are repeated three times, and the biggest unanswered question ('do I pay the lawyer?') needs one founder-approved sentence near the price card.
  • Craft 7.5. Ship-adjacent craft with one real signature moment, the hold on real frames whose full stop leaves the headline to become the thing you press and ends in the keyhole, which earns its place; it stays under 8 because of a mid-line poster crop, a dead band at the story's end, a mobile that loses the payoff capture, and container shapes any polished template already owns.
Strengths
  • Hero is the ruling, verbatim and two-tone: "Hold for three seconds." light ink, "We send for help." forest; lede says what/who/where; "Available on iPhone and Apple Watch." and law 9 ("Phone locked, dead, or taken: it still runs.") sit above the fold on desktop AND mobile, next to the real home.webp in the real iPhone 17 Pro frame.
  • Real pixels only, done properly: the hero hold scrubs the 47 real frames on a canvas (pointer must start inside the disc, 14 px move aborts, touch-action:pan-y, Space/Enter, reduced-motion tap path, "Demo with the real app. Nothing is sent from this page."); story, wrist, family link and film are all real stills/loops under the kit's frames. No DOM rebuilds, no fake console, no fake timeline.
  • Copy-law discipline is near-clean: day-neutral (09:41 everywhere, no night word anywhere), firm NOTIFIED / "Engaged the moment it accepts", deadman truth verbatim ("It sends on its own" / "slide 'I'm safe' and nothing happens. If you can't, ELA sends."), "Example timeline. Timings vary by case." under both case captures, one membership with mono prices only, Shield line and all three footer sentences verbatim, no 999 line, no stats/logos/testimonials, no eyebrows, no section numbers, no dashes.
  • One-red rule holds: the only red on the page is the app's own "Send help now" inside the countdown capture. Dark family confined to one contained panel with the mint keyhole; light Evergreen Mint tokens everywhere else. No gold/oxblood residue.
  • The film's guide dot is carried through as the page's through-line (hero stop -> pill -> completion note; story title -> first beat -> first bullet; closing stop -> app icon keyhole) with a springy 1 s hop, and the emotional arc lands without dread: hold -> "you're not on your own" -> "Everything else is ours now." -> "Your lawyer has made contact." -> "Set it up once. Hope you never use it."
Still to fix (14)
  • Replace the fail-safe H2 (line 474) with an approved line that describes the response, not the pin: e.g. "Phone locked, dead, or taken: it still runs." with body "Once the hold commits, the response runs on ELA's servers, not on your phone." plus the existing "A human team follows every case, start to finish." Remove "your family's link keeps updating" entirely (or narrow it to milestones only, explicitly not live location).
  • Remove the .mono class from the "0:45" in the film play button (line 508), or drop the duration since the lead already says "Forty-five seconds, with sound."
  • Keep the headline full stops after the dot leaves: either do not add .gone to #stop / #stopB0 (let the dot be a duplicate that departs), or bring the dot back to the stop when the hop sequence ends. The line must read "We send for help." at rest.
  • On mobile, add a beat-media block under the "Your lawyer has made contact." beat with reply-contact.webp (or reply.mp4 with poster) in the phone frame, so the quoted message is backed by real pixels as it is on desktop.
  • Tap targets: change .note .btn height from 40px to 44px (keep padding) so 'See the countdown' and 'Try again' meet the ≥44px rule on touch.
  • Mobile nav ≤480px: keep the Membership link and hide 'How it works' instead (scrolling reaches how-it-works anyway; the price needs the shortcut). Swap the display:none rule at the 480px breakpoint from .links .mem to .links .how.
  • Desktop dead space and length: cut .beats{padding-bottom:200px} to ~80px (the sticky phone still has travel for the last beat), and drop the film band from aspect-ratio 2.2/1 to 16/9 with a matching poster so the frame is not cropped into slivers; target under 4,500px at 1440.
  • Remove one of the three repetitions of the four outcomes: replace the five-item 'Every member gets' list under the price card with the single line 'One membership. The same response for every member.' already in the H2 plus one sentence ('Everything on this page is included; nothing is tiered.' is not approved copy, so use the approved 'The same response for every member.' only), or cut the dark panel's bold 'A human team follows every case, start to finish.' line. Keep the story list as the canonical one.
  • Move the 'Demo with the real app. Nothing is sent from this page.' note above the phone on mobile (order it before .devwrap in the stage at ≤900px, or fold it into the hint pill's aria-describedby text shown under the pill) so it is visible before the first touch at 390x844.
  • Film poster crop (line ~185, .player{aspect-ratio:2.2/1}): either keep the un-started player at 16/9, or switch the poster to assets/film/poster-c.jpg (the 'Everything else is ours now.' frame, no UI card to clip), or set object-position so the 2.2:1 cut lands on blank canvas. No capture may be cut mid-line.
  • Story section tail: reduce .beats{padding-bottom:200px} to ~64px so the sticky phone's last state (reply loop) sits beside the 'Your lawyer has made contact.' beat instead of leaving a dead band; on mobile, add assets/stills/reply-contact.webp (in the device frame, fade-cropped like the case beat) to that beat's .beat-media so the payoff capture exists on phones.
  • Hero dot resting state: make the pill's dot the terminal full stop of its text ('Press and hold the disc●' with the slot after the text, matching .note b .stop) rather than a leading indicator, so it reads as the H1's full stop that moved and not a status LED. Keep the H1's sr-only period as is.
  • Mobile section order: remove the .membership/.film/.close order overrides (lines ~250-251) or move the film in the DOM so DOM order, tab order and the visual story match on both viewports.
  • Cut the repeated 'A human team follows every case, start to finish.' from the dark fail-safe panel (already in the four-list and the membership list); if the panel needs a second beat, use voice.md's 'A vetted law firm, and a fallback already moving: if the firm can't act, ELA is already finding another.'

Rank 3

D: Bento, evolved

The film retold as ten product tiles: real footage in real frames, one forest dot leading the eye.

7.4was 6.7 in round 3
Bento, evolved, desktop, first screen Bento, evolved, phone, first screen

Founder 7.8Conversion 7.5Craft 7Score by round: 7.4 → 7.4

Headline. Hold for three seconds. We send for help.

Signature. The film's forest guide dot is the full stop of "We send for help." and hops, springily, from heading to heading through the bento in reading order as each tile comes into view (four hops down the four lines, white on the forest tile, mint on the dark one), leaving a forest full stop behind at every stop and finally shrinking into the app icon's keyhole. Beside it, the hold tile is a working demo on real pixels: press and hold the disc for three seconds and the 47 real recording frames scrub under your finger, release early and they unwind, complete it and the real countdown screen appears (keyboard Space/Enter hold, tap under reduced motion, pan-y so it never traps scrolling, "Nothing is sent from this page" throughout).

The founder's preferred layout family, now obeying every founder ruling on brand and copy, with the best hero composition of the three (real phone mid-hold, watch mirroring it on one clock, red countdown engineered out of the fold). Ranked second, not first, because it ships two defects that would be visible to the founder in the first minute: on mobile the 'what happens next' tile renders a ~1,400 px blank box where the case phone should be, and the countdown tile says 'If the moment passes, nothing happens', the opposite of the auto-send. Add the duplicated 'Everything else is ours now' (forest tile plus film poster), a countdown capture too small to read, and the craft judge's fair point that the grid silhouette is template-shaped. Score 7.43; the fixes are mechanical but there are more of them than H needs.

What the judges said
  • Founder 7.8. This is the first bento that obeys every founder ruling on brand, copy and real pixels, and it lands the relief note; one inverted deadman sentence, an illegible countdown capture and a duplicated film frame stand between it and shipping at 8.5.
  • Conversion 7.5. The fold and the objection order are ship-grade, but the mobile "what happens next" tile is broken (blank phone, hidden timeline label) and the page repeats itself; fix those five items and this clears 8.5.
  • Craft 7. A genuinely evolved bento (real captures, a synced hero hold, an honest interactive demo, and a guide dot that earns its place in code) let down by a missing phone on mobile, three under-directed tiles and a grid silhouette any 2026 AI page could have drawn; fix the six items and it crosses 8, but not before.
Strengths
  • Copy is almost entirely the signed-off film lines, verbatim: the hold line as H1 (two-tone, ink then ink-soft), the four system-verb lines, the Shield sentence and both footer sentences. A full text scan finds no night framing, no banned words, no eyebrows, no section numbers, no dashes, no time promises, no firm count or name, one membership with the three App Store prices as the only mono on the page.
  • Real pixels only, properly: every phone and watch is a real capture under the film's own Apple frames, the hold demo scrubs the 47 real press frames (touch-action pan-y, abort on 14px move, keyboard, reduced-motion tap path, 'Nothing is sent from this page' stated before and after), and the family tile is the real map the link opens with the Google attribution uncropped. Nothing reads as a wireframe.
  • One-red rule is engineered, not hoped for: the hero loop is clipped at 3.4 s so the app's red countdown never appears in the fold, and the only red on the page is the app's own 'Send help now' inside the countdown capture. No --danger token is used anywhere.
  • The fold does the 5-second job on both viewports: H1, a bolded 'ELA is a legal emergency membership for UAE residents' lede, store CTA, 'Available on iPhone and Apple Watch.', 'Phone locked, dead, or taken: it still runs.' and a live product visual (phone mid-hold with the watch mirroring it, synced by one clock in JS).
  • The emotional target lands without dread: the darkest beat on the page is the fail-safe tile, and its payload is the reassurance itself ('it still runs' in mint), followed by the film title line and 'Set it up once. Hope you never use it.' Relief, not panic-button energy, and no insurance selling beyond the one permitted sentence.
Still to fix (15)
  • Line 347 of variant-d-bento-evolved.html: replace the countdown body with the film line verbatim, 'If the moment passes, slide "I'm safe" and nothing happens. If you can't, ELA sends. "Send help now" sends at once.' The current 'If the moment passes, nothing happens.' asserts the opposite of the auto-send.
  • Make the countdown capture legible: raise .t-count .device (CSS line 131) to at least 270 px wide, or use the tile's spare height for a deliberate crop that fills the tile with the countdown region (0:28, Send help now, Slide to cancel, the automatic-location sentence) so those lines read at body size. Do not crop mid-line.
  • Stop showing 'Everything else is ours now' and the case screen twice on one desktop screen: switch the film poster (line 422) to assets/film/poster-16x9.jpg, or if poster-c stays, cut the forest tile down to a short band and let the film carry the line.
  • Show 'Example timeline. Timings vary by case.' on mobile too: move the label out of .lines (or drop the display:none at CSS line 247) so the timed case capture is always labelled.
  • variant-d-bento-evolved.html, `.t-four` at ≤720px (CSS lines 242–247): make the case phone actually paint on mobile (the 390px shot shows an empty 409px `.media` box; verify the absolutely positioned `.device` with the case.mp4 poster + bezel renders inside it, and if the poster cannot be guaranteed, place `assets/stills/case-s4.webp` as an <img> beneath the video) and stop hiding the timeline label: move `<p class="fine">Example timeline. Timings vary by case.</p>` out of `.lines` to be a direct child of `.t-four` so `order:3` works, and delete `.t-four .lines .fine{display:none}`.
  • Family tile (line 380–383): add the voice.md line "Live location, each milestone, and the name of the lawyer acting for you. Sent only to the people you chose." as the first sentence under the heading, before "They don't need the app. The link opens in a browser.", so #your-family answers what the family sees without depending on the four-lines tile.
  • Kill the double "Everything else is ours now.": change the film poster from `assets/film/poster-c.jpg` to `assets/film/poster-16x9.jpg` (line 422) so the line appears once (tile 3) and the film tile's poster reinforces its own H3 instead.
  • Hero poster (line 303): use `assets/stills/hold-mid.webp` instead of `home.webp` so the static/reduced-motion hero shows the ring filling ("KEEP HOLDING 2") and the hold-demo tile is the only settled home screen; today the same screen appears twice within one mobile viewport.
  • Hold demo release path (JS lines 583–605): only show "Released early…" (and update the aria-live region) when the hold lasted ≥300 ms; when the pointer moved >14px within the first 300 ms (a scroll swipe), reset silently to idle so touch scrolling over the phone never spams the message or screen readers.
  • Mobile case phone: in the ≤720 px rule add `align-items:stretch` to `.t-four` (or `align-self:stretch` on `.t-four .media`) so the media box has width and the phone renders; and move the 'Example timeline. Timings vary by case.' paragraph outside `.lines` (or drop the `display:none`) so the law-7 label survives on mobile.
  • Countdown tile: show the capture large enough that '0:28', 'Send help now' and 'Slide to cancel, I'm safe' are all legible. Either run a ≥300 px phone off the tile edge cropped to the lower two-thirds of the screen, or size the tile to the phone. At 204 px the tile's headline promises a control the reader cannot see.
  • ELA Ops tile: remove the top fade. Crop the phone at the tile's top edge deliberately (a flat cut on the bezel at full opacity) and switch the poster to reply-contact.webp so the thread fills the screen instead of leaving 60% blank; or show the whole phone and let the copy sit beside it.
  • Guide dot: one `data-stop` per tile. Remove the four stops on the individual lines in `.t-four` (keep the tile's first h3 or the tile itself) so the `>3` teleport branch can never fire on desktop; the through-line only works if it never breaks.
  • Film poster: use assets/film/poster-16x9.jpg, not poster-c.jpg, so 'Everything else is ours now.' is not printed twice in adjacent tiles.
  • Family tile: art-direct the map. Crop tighter to the pin (the 640 w asset at full width, ~4:3), hide or crop Google's 'Sign in' chip while keeping the attribution uncropped, and give it a minimal browser top bar (plain grey bar, no fake URL text) so 'the link opens in a browser' is shown, not just said.

Rank 4

F: The film, as a homepage

The film's title card as the page, its beats told in big type beside real captures.

7.6was 6.7 in round 3
The film, as a homepage, desktop, first screen The film, as a homepage, phone, first screen

Founder 7.8Conversion 7.5Craft 7.5Score by round: 7.5 → 7.6 → 7.6

Headline. If you’re arrested in the UAE, you’re not on your own● (the forest guide dot is the full stop) / Hold for three seconds. We send for help.

Signature. The film's guide dot is the page's through-line: it blooms in as the title's full stop, then on springs tuned to the film's own curves (damping ratio 0.81, a hop with a small arc and swell) it hands itself from headline to headline as you scroll ("Hold for three seconds●", "Everything else is ours now●", the watch, the dark fail-safe panel, "Your lawyer has made contact●", membership) and finally lands inside the app icon's keyhole at the closing action, exactly as the film ends. Each headline's ink full stop settles back in when the dot leaves. IntersectionObserver-driven, no scroll listener, static forest full stop under reduced motion. Beside it, the hold beat is a real-pixels demo: press and hold the phone and the real hold frames (home → f001…f047 → the real countdown capture) run under the Apple frame; release early and the ring resets. Nothing is sent, and the caption says so.

The most crafted page below the fold (editorial ledger membership, real captures in designed crops, the guide dot on the film's own spring curves) and the most brand-faithful copy, but the hero fails the brief's own test: the rest frame is a cropped film fragment behind a play button, not a product, and the hold line is demoted to a subhead under the film title. Law 9 sits at the fold edge on desktop. The dark panel invents an absolute ('nothing that happens to the handset stops the sequence'), 'Your lawyer has made contact' is used as a promise headline, and the mobile phone pairs at 1fr 1fr are too small to read the copy that is the point. Score 7.6; fixing the hero means redesigning the hero, which is why it ranks third despite the strongest lower half.

What the judges said
  • Founder 7.8. The most brand-faithful and law-compliant variant I have seen for ELA, with real pixels throughout and the film's own register; it needs the invented absolute in the dark panel and the outcome headline removed, and the mobile map attribution restored, before it goes in front of the founder as a shippable page.
  • Conversion 7.5. A clear, honest page whose fold and heading-flow already pass Krug, held back from shippable by an undiscoverable price, an unanswered 'who pays', and mobile phone pairs too small to read the copy that is the whole point.
  • Craft 7.5. The most crafted page in the round so far, with real type discipline, real pixels in the right frames, and a signature guide dot that genuinely comes from the film, but the hero mount's cropped phone fragment and its unanimated aspect-ratio jump on the page's own signature click keep it at a strong 7.5 rather than a ship; fix the mount and the two-up and it lands at 8.5.
Strengths
  • Copy-law compliance is close to total: the film's hold line verbatim and two-tone under the title-card H1, law 9 above the fold on both 1440 and 390, the four dispatch lines verbatim (firm NOTIFIED, 'already finding another'), the deadman stated truthfully ('slide I'm safe and nothing happens. If you can't, ELA sends' / 'The countdown auto-sends'), 'Example timeline. Timings vary by case.' on both sequences, no night, no eyebrows, no tiers, no 999, no invented numbers, no dashes.
  • Real pixels only, kept honestly: every phone and watch is a real capture under the film's own Apple frames; the hold demo scrubs the real f001-f047 frames and its caption says 'It's a demo: nothing is sent'; the film is click-to-play with sound and never autoplays; the only red on the page is the app's own 'Send help now' inside the countdown capture.
  • Brand fidelity: light-first Evergreen Mint tokens exactly, Bricolage with opsz set per size, Instrument Sans body, Spline Sans Mono confined to the three prices (the .mono class is otherwise unused), one contained rounded dark panel (no dark band, no night scene), and the film's forest guide dot carried through as the through-line with spring physics and mint-on-dark.
  • The emotional arc mirrors the film rather than an insurance page: title card, hold, 'Everything else is ours now', one dark beat, then exhale into the map and the wrist, the lawyer's contact, and 'Set it up once. Hope you never use it.' It reads as relief, and the reader's only task is visibly the hold.
  • Membership reads as membership: 'One membership. The same response for every member', three mono prices, 'Billed through the App Store. Cancel any time in your Apple ID settings', the identical-response checklist, and Shield as a single 15 px sentence under a rule with the verbatim footer small print. Nothing sells cover.
Still to fix (13)
  • Dark panel (the .dark block, id b-safe): replace the body with the approved lines, e.g. 'Phone locked, dead, or taken: it still runs. Once the hold commits, the response runs on ELA's servers, not on your phone. The case brief, the firm, your consulate and your family's link are on our side of it.' Delete 'nothing that happens to the handset stops the sequence'.
  • Section b-end: stop using the app's message as a promise headline. Reword the H2 to describe the artifact, e.g. 'From the hold to your lawyer's first contact', and let the reply-contact capture carry the app's own 'Your lawyer has made contact.' line (keep the body 'the case never waits on your phone. A human team follows every case, start to finish.').
  • Mobile map (.maps img at <=900px): keep the Google attribution whole. Either switch to family-map-640.webp with no negative offsets and a matching aspect-ratio, or adjust the crop so the capture's bottom-left corner is inside the window; verify at 390x844 that 'Google' and the attribution line are visible.
  • Mobile (≤600 px): stop rendering the two phone pairs at 1fr 1fr. Stack them, or show the payoff phone (countdown; reply-contact) at ~250 px with the other beneath it. Rule: every capture whose text carries meaning must be ≥240 px wide at 390 so the bubbles read; bump `.pair .cap` to ≥13 px.
  • Answer 'who pays' in the membership block: one plain sentence under the price rows about the lawyer's fees (founder to confirm the defensible wording), and on mobile move the Shield sentence to sit directly beneath the price rows, above the includes list, not after it.
  • Put a price reference in the fold without a second price table: extend the facts row to 'Available on iPhone and Apple Watch. From AED 24.99 a week.' (mono for the figure) linking to #membership, so the 5-second cost question is answered while the full prices stay stated once.
  • Make the hold demo discoverable: a visible pill on or directly above the demo phone ('Press and hold to try it') in ≥14 px ink, not a muted 12.5 px figcaption; keep 'nothing is sent' next to it.
  • Dark panel headline: restore the scanner's own words, e.g. 'Phone locked, dead, or taken: the case runs on our servers.' and cut the body opener 'Not on your phone.' so the panel adds the server fact instead of repeating the hero line.
  • Remove the aspect-ratio flip on play. Keep .film .mount at a fixed 16:9 on desktop and a fixed portrait ratio on mobile, and make the 'window on the disc' with transform only: at rest `video{transform:scale(1.32) translateY(-6%)}` (tune so the disc fills), on .playing transition to `scale(1)` over .6s var(--ease). Nothing below the hero moves on play or on ended. If a shorter rest state is essential, animate a wrapper's grid-template-rows 0fr to 1fr instead, never aspect-ratio.
  • Fix the hero's rest frame so it reads as a product, not a fragment: either rest on poster-c.jpg (the 'Everything else is ours now.' frame, with the play button centred) and let the first beat's demo phone be the only disc-at-rest, or drop the rounded grey mount entirely and let the poster's phone bleed off the top of the hero as a deliberate composition. Either way change the caption to something true of the frame shown (for example 'The launch film. 45 seconds, with sound.').
  • Rebalance the family/watch two-up: give the watch the same visual mass as the map (`.two .watch{width:min(420px,80%)}` and align both media blocks to one height, or crop the watch into a 1000/770 window matching the map) so the row reads as a pair rather than a block and a floating object.
  • Make the guide dot a glyph on light: drop the white ring and shadows unless .on-dark (keep the mint version's dark ring), and check the dock's vertical position against the headline's baseline so the dot sits exactly where the period would at every size; the 12 px base plus halo currently sits heavier and lower than the type's own full stop.
  • Chat pair crops: move the top fade so it does not cross bubble text. Either start the fade above the first bubble (reduce `.crop.bottom::before` height to about 12% and shift the device so a bubble boundary meets the fade) or use a hard designed cut between bubbles.