Shown Media Spec Rebuild
Problem
It was a spec project, so the real problem was mine: how to stand out in a thread full of people saying they could do the job. A link to my own site would have been reply number 76. A working version of their site, with the reasoning behind every change, would show the work instead of describing it.
That set the bar. It had to be a real rebuild, not a homepage mockup, and it had to be right about their business, using only facts from their own public site.
Before
Shown Media makes launch videos for tech and AI companies, so their site is mostly video. It looks expensive: a WebGL shader, glows, grain, a custom cursor, and a 5 to 6 second preloader. The audit found that a lot of that polish was getting in the way of the things the site needed to do.
- The headline numbers were wrong to anything that doesn't run JavaScript. The stats are count-up animations. The HTML that Google, link previews, and AI crawlers read holds the starting values (50M+ views, $5M+ revenue, 1,950 videos), not the real ones (100M+, $10M+, 2,000+). The views counter takes about 45 seconds to finish counting.
- Search engines couldn't tell the pages apart. Seven key pages shared the title "Shown Media," 19 of 20 shared one meta description, and there was no structured data.
- No video had its own page. For a video company, that's the big one. Google only shows a video result for a page where the video is the main content. All their launch films sat together on the portfolio page, so none of them qualified.
- It was heavy. Some pages requested 633 MB of video up front, with twelve videos autoplaying at once. The booking widget loaded 1.1 to 1.9 MB of script before anyone clicked anything.
- Three booking flows, and the nav button sent DTC visitors to the tech one.
- Accessibility gaps: the native cursor was hidden, reduced-motion settings were ignored, and autoplaying video couldn't be paused.
Approach
Research came first, run as a set of AI agents. They produced four reports, about 50,000 words in total. The first was a page-by-page audit of the live site. The second compared eleven direct competitors and how they position themselves. The third was an SEO and AI-search playbook covering structured data, video SEO, llms.txt, and how AI crawlers read a page. The fourth chose the stack. Those reports became a build spec. The build followed the spec, and then separate review passes checked every fact against the live site, plus quality and design.
The main decision was what to optimize for. If Shown Media engaged, the visual design would change based on their input, as it should. The structural work wouldn't: what crawlers read, how fast pages load, how a visitor gets to a call, and whether each film can rank. It's also the part most people building sites with AI don't know to do, so that's where I put the effort. I kept their brand (wordmark, play-mark, black and blues, a condensed serif) and removed the effects that made it slow.
The messaging got the same treatment. Their own case studies say the first line of a launch post matters most, and none of their competitors' sites show the writing, only thumbnails and view counts. So the new home page (shown at the top) opens on the first lines of real launch posts, playing with their films. The site now leads with tech and AI, and DTC keeps its own page with its own call to action.
What I shipped
A static Astro site on Netlify: 52 pages, every existing URL preserved, every fact sourced from their public site. Lighthouse, axe, and Playwright ran against it before it went out.
Speed
Nothing loads from a third party until someone presses play or reaches the calendar. Lighthouse 12.8, mobile emulation, medians of three to five runs:
| Page | Performance | Largest paint | Page weight | Requests |
|---|---|---|---|---|
| Home | 83 → 97 | 4.17 s → 2.41 s | 4,931 KB → 543 KB | 54 → 38 |
| /tech | 85 → 99 | 3.62 s → 1.81 s | 9,153 KB → 318 KB | 197 → 49 |
| /portfolio | 86 → 100 | 3.96 s → 1.35 s | 2,063 KB → 193 KB | 96 → 29 |
The live home page's paint time actually flatters it, because the preloader covers the page for about five seconds after that. Accessibility on /tech went from 84 to 100. Only one video plays at a time, it can be paused, and every control is labelled.
A page for every launch
There are 24 watch pages, one per launch, each with its film, the post text, and the launch's numbers. Together with a generated video sitemap, they give every film a chance to show up in Google's video results. The portfolio became a sortable index of those pages.
Numbers and metadata that crawlers can read
Every number is in the HTML, so Google, link previews, and AI assistants see 100M+ instead of 50M+. One facts file feeds the page copy, the JSON-LD structured data, and llms.txt, so a number can't say one thing on a page and something else in the markup. Every page has its own title and description. Open Graph images are generated on every build, so a shared link shows the right film and headline.
Built for AI assistants
More of this audience builds a shortlist by asking an AI assistant, so the site answers agents directly. There's an llms.txt summary, and every page has a Markdown twin. Request a page as Markdown and the same URL returns clean text instead of HTML:
$ curl -H "Accept: text/markdown" https://shown-media-spec.netlify.app/
# The launch team behind the biggest announcements in tech.
Shown Media is a New York-based launch agency that writes, films and
distributes launch campaigns for tech and AI companies, and makes
performance ad creative for DTC brands.
One path to a call
Three booking flows became one action, "Plan your launch," used everywhere. It opens a five-step brief that ends on their calendar and only asks for a name and email on the last step. If someone just has a date, they can send that in one line instead.
Dark where you watch, light where you read
Film pages stay on black. Case studies, guides, and job posts sit on a pale surface, which makes 900-word case studies much easier to get through. I fixed the copy problems the audit found (an unfinished [EMBED] placeholder, a section duplicated across all four case studies, typos) and logged every edit beyond a typo so they could review it.
Easy to keep up
There's no CMS to log into. Each launch, client, case study, job, guide, and FAQ is one small file, and adding a new launch takes one YAML file and one script run, which is easy to hand to AI.
Outcome
I replied to the thread with the live link, then posted a plain list of what changed and why. The best response came from someone else. Bryce Liggins handed that list to an AI tool and pointed it at a site they were working on:
I gave your post to astra and told it "do all of these things drew did to the site we're working on"
92% reduction in weight 😲🙌.
Thanks for that!
None of the structural work was specific to Shown Media. It's a set of fixes most fast-built sites skip, and that reply showed they carry over to other sites.