wuwi/splatter-tennis
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add MEMBERSHIP, the club's own 1980s VHS advert

Browse Source 
cut.py --cut ad: a plummy announcer (one gpt-audio read per line, ad.sh)
sells St. Mordred's over the creepiest takes with yellow 80s supers, a
PLAY/STOP VCR read-out, two testimonials from the real lines and the small
print read at speed, until the game's umpire says "Quiet." and the jingle
dies. A VHS grade (chroma smear, scanlines, tape wobble) is the cut's own.
gen.py learns a voice command; one new silent Doris take.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
wuwiandClaude Opus 5.5 committed 2026-10-05 11:46:31 +02:00
1 parent da09b55525
commit 806a739c6f
7 files changed
+170 -11
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

tools/trailer/frame.html
+47
View File
@@ -4,6 +4,7 @@
--screenshot=<out>.png file://.../frame.html#<id> (cut.py does this)
Everything is drawn on transparent; cut.py lays it over picture or black. -->
<html><head><meta charset="utf-8">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght,SOFT@1,9..144,900,100&family=VT323&display=block">
<style>
@font-face { font-family: Silkscreen; src: url(../../assets/fonts/Silkscreen-Regular.ttf); }
:root { --paper: #ece6d6; --gold: #c9a45a; --shade: 0 2px 22px rgba(0,0,0,.8), 0 0 4px rgba(0,0,0,.6); }
@@ -49,6 +50,27 @@ section:target { display: block; }
.sb .you .who, .sb .you .pts { color: rgba(236,230,214,.62); }
.sb i { width: 12px; height: 12px; border-radius: 50%; background: #d8e04a; box-shadow: 0 0 8px rgba(216,224,74,.6); }
.sb .game { font: 600 34px/1 'Gill Sans', sans-serif; letter-spacing: .2em; }
/* MEMBERSHIP: the club's own 1980s advert — supers, VCR read-out, testimonials, the end frame */
.osd { position: absolute; left: 78px; top: 214px; font: 400 80px/1 VT323, monospace; color: #f4f4f0;
letter-spacing: .06em; text-shadow: 0 0 8px rgba(255,255,255,.55), 3px 3px 0 rgba(0,0,0,.55); }
.su { position: absolute; left: 64px; right: 64px; top: 1170px; transform: rotate(-3deg); transform-origin: left center;
font: italic 900 96px/.98 Fraunces, serif; font-variation-settings: 'SOFT' 100, 'opsz' 144; text-transform: uppercase;
color: #ffe14a; -webkit-text-stroke: 12px #3b1300; paint-order: stroke fill; letter-spacing: -.005em;
text-shadow: 0 10px 0 #2a0d00, 0 16px 34px rgba(0,0,0,.55); text-wrap: balance; }
.su.s { font-size: 80px; }
.su small { display: block; margin-top: 14px; font: italic 900 40px/1 Fraunces, serif; color: #fff;
-webkit-text-stroke: 7px #3b1300; text-transform: none; }
.adbg { position: absolute; inset: 0; background: radial-gradient(120% 80% at 50% 40%, #1f5a37 0%, #0c2b19 55%, #04120a 100%); }
.adbg::after { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 60px, transparent 60px 120px); }
.tm { position: absolute; left: 64px; top: 1250px; font: italic 900 70px/1 Fraunces, serif; font-variation-settings: 'SOFT' 100;
color: #fff; -webkit-text-stroke: 9px #3b1300; paint-order: stroke fill; text-shadow: 0 8px 0 #2a0d00; }
.tm em { display: block; margin-top: 10px; font-size: 44px; font-style: italic; color: #ffe14a; }
.burst { position: absolute; width: 520px; height: 520px; left: 50%; top: 1020px; margin-left: -260px; transform: rotate(-9deg);
background: #e3262b; clip-path: polygon(50% 0%,57% 13%,71% 4%,72% 19%,88% 15%,83% 30%,98% 33%,88% 45%,100% 55%,86% 62%,94% 77%,78% 78%,79% 94%,65% 87%,57% 100%,49% 88%,37% 98%,34% 83%,19% 90%,20% 74%,4% 72%,14% 59%,0% 49%,13% 40%,4% 26%,20% 25%,17% 9%,33% 14%,40% 1%);
display: flex; align-items: center; justify-content: center; text-align: center; }
.burst span { font: italic 900 58px/1 Fraunces, serif; color: #ffe14a; text-transform: uppercase; -webkit-text-stroke: 6px #5a0b0b; paint-order: stroke fill; padding: 0 70px; }
.fine { position: absolute; left: 70px; right: 70px; top: 1560px; font: 400 23px/1.3 Helvetica, Arial, sans-serif; color: rgba(255,255,255,.85); text-align: center; }
</style></head><body>
<section id="t_a"><div class="c say" style="top:700px">Every old club has its traditions.</div></section>
@@ -102,4 +124,29 @@ section:target { display: block; }
<div class="row"><i></i><span class="who">St. Mordred's</span><span class="pts game">GAME</span></div>
<div class="row you"><span></span><span class="who">You</span><span class="pts">0</span></div>
</div></section>
<section id="osd_play"><div class="osd">PLAY &#9654;</div></section>
<section id="osd_stop"><div class="osd">STOP &#9632;</div></section>
<section id="su_grass"><div class="su s">The finest grass in the county</div></section>
<section id="su_staff"><div class="su ">Dedicated ground staff</div></section>
<section id="su_tonic"><div class="su ">Our own lawn tonic!</div></section>
<section id="su_berries"><div class="su ">Strawberries &amp; cream</div></section>
<section id="su_fresh"><div class="su ">Served fresh daily!*<small>*fresh-ish</small></div></section>
<section id="su_welcome"><div class="su ">A warm welcome</div></section>
<section id="su_officials"><div class="su s">Officials who never miss a thing</div></section>
<section id="su_since"><div class="su ">Umpiring since 1908</div></section>
<section id="su_fixture"><div class="su s">Our longest-running fixture</div></section>
<section id="ad_members"><div class="adbg"></div><div class="c su" style="top:820px; left:80px; right:80px; transform:rotate(-3deg)">What our members say</div></section>
<section id="tm_doris"><div class="tm">&ldquo;Doris&rdquo;<em>Member since 1971</em></div></section>
<section id="tm_reg"><div class="tm">&ldquo;Reg&rdquo;<em>Member since 1962</em></div></section>
<section id="ad_club"><div class="adbg"></div>
<svg class="crest" style="top:300px" width="190" height="240" viewBox="0 0 150 190" fill="none" stroke="#e8c46a" stroke-width="3.6">
<g transform="rotate(-32 75 112)"><ellipse cx="75" cy="66" rx="30" ry="40"/><path d="M75 106v64M66 106l9 14 9-14"/></g>
<g transform="rotate(32 75 112)"><ellipse cx="75" cy="66" rx="30" ry="40"/><path d="M75 106v64M66 106l9 14 9-14"/></g>
<circle cx="75" cy="16" r="11" fill="#e8c46a" stroke="none"/></svg>
<div class="c su" style="top:600px; left:40px; right:40px; transform:rotate(-3deg); font-size:128px">St. Mordred's</div>
<div class="c club" style="top:790px; font-size:34px; color:#f4ecd6">LAWN TENNIS CLUB &middot; EST. 1877</div>
<div class="burst"><span>Lifetime membership now open!</span></div>
</section>
<section id="ad_fine"><div class="fine">Membership is for life. Membership does not end with life. Members may not leave the grounds.
Strawberries are not fresh. Lawn tonic is not for human consumption. Line calls are final. Terms and conditions apply.</div></section>
</body></html>