tcpsyn
cee78b5d88
- Re-label all 8 episode transcripts with LUKE:/CALLER: speaker labels using LLM-based diarization (relabel_transcripts.py) - Add episode.html transcript page with styled speaker labels - Update publish_episode.py to generate speaker-labeled transcripts and copy to website/transcripts/ for Cloudflare Pages - Add SVG favicon with PNG fallbacks - Fix CPU issue: tie host audio stream to on-air toggle, not per-caller - Update how-it-works page with post-production pipeline info - Add transcript links to episode cards in app.js Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
504 lines
29 KiB
HTML
504 lines
29 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>How It Works — Luke at the Roost</title>
|
|
<meta name="description" content="How Luke at the Roost works: AI-generated callers with unique personalities, real phone calls, voice synthesis, multi-stem recording, automated post-production, and CDN-powered global distribution — all built from scratch.">
|
|
<link rel="canonical" href="https://lukeattheroost.com/how-it-works">
|
|
|
|
<meta property="og:title" content="How It Works — Luke at the Roost">
|
|
<meta property="og:description" content="The tech behind a one-of-a-kind AI radio show: real-time caller generation, multi-stem recording, automated post-production, and global CDN distribution — all custom-built.">
|
|
<meta property="og:image" content="https://cdn.lukeattheroost.com/media/podcasts/LukeAtTheRoost/cover_feed.png?v=3">
|
|
<meta property="og:url" content="https://lukeattheroost.com/how-it-works">
|
|
<meta property="og:type" content="website">
|
|
|
|
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 4c-2 0-4 2-4 5 0 1 .3 2 .8 3C26 13 24 16 24 20c0 2 .5 4 1.5 5.5L22 28c-2 1-4 3-5 6l-3 10c-.5 2 .5 3 2 3h4l1-4 2 4h6l-1-6 3 6h6l-1-6 3 6h4c1.5 0 2.5-1 2-3l-3-10c-1-3-3-5-5-6l-3.5-2.5C35.5 24 36 22 36 20c0-4-2-7-4.8-8 .5-1 .8-2 .8-3 0-3-2-5-4-5z' fill='%23e8791d'/%3E%3Ccircle cx='30' cy='17' r='1.5' fill='%231a1209'/%3E%3Cpath d='M36 15c1-1 3-1 4 0s1 3 0 4' fill='none' stroke='%23cc2222' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M28 22c2 1 4 1 6 0' fill='none' stroke='%23e8791d' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E">
|
|
|
|
<link rel="stylesheet" href="css/style.css">
|
|
</head>
|
|
<body>
|
|
|
|
<!-- Nav -->
|
|
<nav class="page-nav">
|
|
<a href="/" class="nav-home">Luke at the Roost</a>
|
|
</nav>
|
|
|
|
<!-- Page Header -->
|
|
<section class="page-header">
|
|
<h1>How It Works</h1>
|
|
<p class="page-subtitle">Every caller on the show is a one-of-a-kind character — generated in real time by a custom-built AI system. Here's a peek behind the curtain.</p>
|
|
</section>
|
|
|
|
<!-- Overview -->
|
|
<section class="hiw-section">
|
|
<div class="hiw-card hiw-hero-card">
|
|
<div class="hiw-diagram">
|
|
<!-- Row 1: Inputs -->
|
|
<div class="diagram-label">Live Show</div>
|
|
<div class="diagram-row diagram-row-split">
|
|
<div class="diagram-box diagram-accent">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/><line x1="12" y1="19" x2="12" y2="23"/><line x1="8" y1="23" x2="16" y2="23"/></svg>
|
|
</div>
|
|
<span>Luke (Host)</span>
|
|
</div>
|
|
<div class="diagram-box diagram-accent">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
|
|
</div>
|
|
<span>AI Callers</span>
|
|
</div>
|
|
<div class="diagram-box diagram-accent">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/></svg>
|
|
</div>
|
|
<span>Real Callers</span>
|
|
</div>
|
|
</div>
|
|
<div class="diagram-arrow">↓</div>
|
|
<!-- Row 2: Control Room -->
|
|
<div class="diagram-row">
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="3" width="20" height="14" rx="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/></svg>
|
|
</div>
|
|
<span>Control Room</span>
|
|
</div>
|
|
</div>
|
|
<div class="diagram-arrow">↓</div>
|
|
<!-- Row 3: Engine Layer -->
|
|
<div class="diagram-row diagram-row-split">
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
|
|
</div>
|
|
<span>LLM Dialog</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"/><path d="M19 10v2a7 7 0 0 1-14 0v-2"/></svg>
|
|
</div>
|
|
<span>Voice Synthesis</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></svg>
|
|
</div>
|
|
<span>Live Data</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/></svg>
|
|
</div>
|
|
<span>Audio Router</span>
|
|
</div>
|
|
</div>
|
|
<div class="diagram-row diagram-row-split">
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/></svg>
|
|
</div>
|
|
<span>Music</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"/><path d="M19.07 4.93a10 10 0 0 1 0 14.14"/></svg>
|
|
</div>
|
|
<span>SFX</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="7" width="20" height="15" rx="2"/><path d="M16 7V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v3"/></svg>
|
|
</div>
|
|
<span>Ads</span>
|
|
</div>
|
|
</div>
|
|
<div class="diagram-arrow">↓</div>
|
|
<!-- Row 4: Recording -->
|
|
<div class="diagram-row">
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="3" fill="currentColor"/></svg>
|
|
</div>
|
|
<span>Multi-Stem Recorder</span>
|
|
</div>
|
|
</div>
|
|
<div class="diagram-arrow">↓</div>
|
|
<!-- Row 5: Post-Production -->
|
|
<div class="diagram-label">Post-Production</div>
|
|
<div class="diagram-row diagram-row-split">
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"/><path d="M19.07 4.93a10 10 0 0 1 0 14.14"/><path d="M15.54 8.46a5 5 0 0 1 0 7.07"/></svg>
|
|
</div>
|
|
<span>Compression & Ducking</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>
|
|
</div>
|
|
<span>Loudness Normalization</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg>
|
|
</div>
|
|
<span>Transcription</span>
|
|
</div>
|
|
</div>
|
|
<div class="diagram-arrow">↓</div>
|
|
<!-- Row 6: Publishing -->
|
|
<div class="diagram-label">Publishing</div>
|
|
<div class="diagram-row diagram-row-split">
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z"/><line x1="4" y1="22" x2="4" y2="15"/></svg>
|
|
</div>
|
|
<span>Podcast Server</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 12h-4l-3 9L9 3l-3 9H2"/></svg>
|
|
</div>
|
|
<span>CDN Edge Network</span>
|
|
</div>
|
|
<div class="diagram-box">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="3" width="20" height="14" rx="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/></svg>
|
|
</div>
|
|
<span>Website</span>
|
|
</div>
|
|
</div>
|
|
<div class="diagram-arrow">↓</div>
|
|
<!-- Row 7: Distribution -->
|
|
<div class="diagram-label">Distribution</div>
|
|
<div class="diagram-row diagram-row-split">
|
|
<div class="diagram-box diagram-accent">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z"/></svg>
|
|
</div>
|
|
<span>Spotify</span>
|
|
</div>
|
|
<div class="diagram-box diagram-accent">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M5.34 0A5.328 5.328 0 0 0 0 5.34v13.32A5.328 5.328 0 0 0 5.34 24h13.32A5.328 5.328 0 0 0 24 18.66V5.34A5.328 5.328 0 0 0 18.66 0z"/></svg>
|
|
</div>
|
|
<span>Apple</span>
|
|
</div>
|
|
<div class="diagram-box diagram-accent">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814z"/><path d="M9.545 15.568V8.432L15.818 12z" fill="#fff"/></svg>
|
|
</div>
|
|
<span>YouTube</span>
|
|
</div>
|
|
<div class="diagram-box diagram-accent">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M6.503 20.752c0 1.794-1.456 3.248-3.251 3.248S0 22.546 0 20.752s1.456-3.248 3.252-3.248 3.251 1.454 3.251 3.248z"/><path d="M.002 9.473v4.594c5.508.163 9.929 4.584 10.092 10.091h4.594"/><path d="M.006 0v4.604C10.81 4.77 19.23 13.19 19.396 24h4.604"/></svg>
|
|
</div>
|
|
<span>RSS</span>
|
|
</div>
|
|
<div class="diagram-box diagram-accent">
|
|
<div class="diagram-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 20V10"/><path d="M12 20V4"/><path d="M6 20v-6"/></svg>
|
|
</div>
|
|
<span>Analytics</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Steps -->
|
|
<section class="hiw-section">
|
|
<h2>The Anatomy of an AI Caller</h2>
|
|
|
|
<div class="hiw-steps">
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">1</div>
|
|
<div class="hiw-step-content">
|
|
<h3>A Person Is Born</h3>
|
|
<p>Every caller starts as a blank slate. The system generates a complete identity: name, age, job, hometown, and personality. Each caller gets a unique speaking style — some ramble, some are blunt, some deflect with humor. They have relationships, vehicles, strong food opinions, nostalgic memories, and reasons for being up this late. They know what they were watching on TV, what errand they ran today, and what song was on the radio before they called.</p>
|
|
<div class="hiw-detail-grid">
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Unique Names</span>
|
|
<span class="hiw-detail-value">48 names</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Personality Layers</span>
|
|
<span class="hiw-detail-value">30+</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Towns with Real Knowledge</span>
|
|
<span class="hiw-detail-value">32</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Unique Voices</span>
|
|
<span class="hiw-detail-value">25</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">2</div>
|
|
<div class="hiw-step-content">
|
|
<h3>They Know Their World</h3>
|
|
<p>Callers know real facts about where they live — the restaurants, the highways, the local gossip. When a caller says they're from Lordsburg, they actually know about the Shakespeare ghost town and the drive to Deming. They know the current weather outside their window, what day of the week it is, whether it's monsoon season or chile harvest. They have strong opinions about where to get the best green chile and get nostalgic about how their town used to be. The system also pulls in real-time news so callers can reference things that actually happened today.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">3</div>
|
|
<div class="hiw-step-content">
|
|
<h3>They Have a Reason to Call</h3>
|
|
<p>Some callers have a problem — a fight with a neighbor, a situation at work, something weighing on them at 2 AM. Others call to geek out about Severance, argue about poker strategy, or share something they read about quantum physics. Every caller has a purpose, not just a script.</p>
|
|
<div class="hiw-split-stat">
|
|
<div class="hiw-stat">
|
|
<span class="hiw-stat-number">70%</span>
|
|
<span class="hiw-stat-label">Need advice</span>
|
|
</div>
|
|
<div class="hiw-stat">
|
|
<span class="hiw-stat-number">30%</span>
|
|
<span class="hiw-stat-label">Want to talk about something</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">4</div>
|
|
<div class="hiw-step-content">
|
|
<h3>The Conversation Is Real</h3>
|
|
<p>Luke talks to each caller using push-to-talk, just like a real radio show. His voice is transcribed in real time, sent to an AI that responds in character, and then converted to speech using a voice engine — all in a few seconds. The AI doesn't just answer questions; it reacts, gets emotional, goes on tangents, and remembers what was said earlier in the show. Callers even react to previous callers — "Hey Luke, I heard that guy Tony earlier and I got to say, he's full of it." It makes the show feel like a living community, not isolated calls.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">5</div>
|
|
<div class="hiw-step-content">
|
|
<h3>Real Callers Call In Too</h3>
|
|
<p>When you dial 208-439-LUKE, your call goes into a live queue. Luke sees you waiting and can take your call right from the control room. Your voice streams in real time — no pre-recording, no delay. You're live on the show, talking to Luke, and the AI callers might even react to what you said.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">6</div>
|
|
<div class="hiw-step-content">
|
|
<h3>The Control Room</h3>
|
|
<p>The entire show runs through a custom-built control panel. Luke manages callers, plays music and sound effects, runs ads, monitors the call queue, and controls everything from one screen. Audio is routed across multiple channels simultaneously — caller voices, music, sound effects, and live phone audio all on separate tracks. The website shows a live on-air indicator so listeners know when to call in.</p>
|
|
<div class="hiw-detail-grid">
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Audio Channels</span>
|
|
<span class="hiw-detail-value">5 independent</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Caller Slots</span>
|
|
<span class="hiw-detail-value">10 per session</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Phone System</span>
|
|
<span class="hiw-detail-value">VoIP + WebSocket</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Live Status</span>
|
|
<span class="hiw-detail-value">Real-time CDN</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Post-Production Pipeline -->
|
|
<section class="hiw-section">
|
|
<h2>From Live Show to Podcast</h2>
|
|
|
|
<div class="hiw-steps">
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">7</div>
|
|
<div class="hiw-step-content">
|
|
<h3>Multi-Stem Recording</h3>
|
|
<p>During every show, the system records five separate audio stems simultaneously: host microphone, AI caller voices, music, sound effects, and ads. Each stem is captured as an independent WAV file with sample-accurate alignment. This gives full control over the final mix — like having a recording studio's multitrack session, not just a flat recording.</p>
|
|
<div class="hiw-detail-grid">
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Stems Captured</span>
|
|
<span class="hiw-detail-value">5 parallel</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Format</span>
|
|
<span class="hiw-detail-value">48kHz WAV</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Sync Method</span>
|
|
<span class="hiw-detail-value">Time-aligned</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Architecture</span>
|
|
<span class="hiw-detail-value">Lock-free I/O</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">8</div>
|
|
<div class="hiw-step-content">
|
|
<h3>Post-Production Pipeline</h3>
|
|
<p>Once the show ends, an automated six-stage pipeline processes the raw stems into a broadcast-ready episode. Dead air and long silences are removed with crossfaded cuts. Voice tracks get dynamic range compression. Music automatically ducks under dialog. All five stems are mixed into stereo and loudness-normalized to broadcast standards. The whole process runs without manual intervention.</p>
|
|
<div class="hiw-detail-grid">
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Pipeline Stages</span>
|
|
<span class="hiw-detail-value">6 steps</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Loudness Target</span>
|
|
<span class="hiw-detail-value">-16 LUFS</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Music Ducking</span>
|
|
<span class="hiw-detail-value">Automatic</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Output</span>
|
|
<span class="hiw-detail-value">Broadcast MP3</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">9</div>
|
|
<div class="hiw-step-content">
|
|
<h3>Automated Publishing</h3>
|
|
<p>A single command takes a finished episode and handles everything: the audio is transcribed using speech recognition to generate full-text transcripts, then an LLM analyzes the transcript to write the episode title, description, and chapter markers with timestamps. The episode is uploaded to the podcast server, chapters and transcripts are attached to the metadata, and all media is synced to a global CDN so listeners everywhere get fast downloads.</p>
|
|
<div class="hiw-detail-grid">
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Transcription</span>
|
|
<span class="hiw-detail-value">Whisper AI</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Metadata</span>
|
|
<span class="hiw-detail-value">LLM-generated</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Chapters</span>
|
|
<span class="hiw-detail-value">Auto-detected</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Deploy Time</span>
|
|
<span class="hiw-detail-value">~2 min</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="hiw-step">
|
|
<div class="hiw-step-number">10</div>
|
|
<div class="hiw-step-content">
|
|
<h3>Global Distribution</h3>
|
|
<p>Episodes are served through a CDN edge network for fast, reliable playback worldwide. The RSS feed is automatically updated and picked up by Spotify, Apple Podcasts, YouTube, and every other podcast app. The website pulls the live feed to show episodes with embedded playback, full transcripts, and chapter navigation — all served through Cloudflare with edge caching. From recording to available on every platform, the whole pipeline is automated end-to-end.</p>
|
|
<div class="hiw-detail-grid">
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Audio Delivery</span>
|
|
<span class="hiw-detail-value">Global CDN</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Website</span>
|
|
<span class="hiw-detail-value">Cloudflare Edge</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Platforms</span>
|
|
<span class="hiw-detail-value">5+ directories</span>
|
|
</div>
|
|
<div class="hiw-detail">
|
|
<span class="hiw-detail-label">Feed Format</span>
|
|
<span class="hiw-detail-value">RSS + Podcast 2.0</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- What makes it different -->
|
|
<section class="hiw-section">
|
|
<h2>What Makes This Different</h2>
|
|
<div class="hiw-features">
|
|
<div class="hiw-feature">
|
|
<div class="hiw-feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"/></svg>
|
|
</div>
|
|
<h3>Not Scripted</h3>
|
|
<p>Every conversation is improvised. Luke doesn't know what the caller is going to say. The AI doesn't follow a script. It's a real conversation between a human and an AI character who has a life, opinions, and something on their mind.</p>
|
|
</div>
|
|
<div class="hiw-feature">
|
|
<div class="hiw-feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg>
|
|
</div>
|
|
<h3>Built From Scratch</h3>
|
|
<p>This isn't an app with a plugin. Every piece — the caller generator, the voice engine, the control room, the phone system, the post-production pipeline, the publishing automation — was built specifically for this show.</p>
|
|
</div>
|
|
<div class="hiw-feature">
|
|
<div class="hiw-feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
|
</div>
|
|
<h3>Real Time</h3>
|
|
<p>Everything happens live. Caller generation, voice synthesis, news lookups, weather checks, phone routing — all in real time during the show. There's no post-production trickery on the caller side. What you hear is what happened.</p>
|
|
</div>
|
|
<div class="hiw-feature">
|
|
<div class="hiw-feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
|
|
</div>
|
|
<h3>They Listen to Each Other</h3>
|
|
<p>Callers aren't isolated — they hear what happened earlier in the show. A caller might disagree with the last guy, back someone up, or call in specifically because of something another caller said. The show builds on itself.</p>
|
|
</div>
|
|
<div class="hiw-feature">
|
|
<div class="hiw-feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"/><path d="M19.07 4.93a10 10 0 0 1 0 14.14"/><path d="M15.54 8.46a5 5 0 0 1 0 7.07"/></svg>
|
|
</div>
|
|
<h3>Broadcast-Grade Audio</h3>
|
|
<p>Every episode goes through a professional post-production pipeline: five isolated stems are individually processed with dynamic compression, automatic music ducking, and EBU R128 loudness normalization before being mixed to stereo and encoded for distribution.</p>
|
|
</div>
|
|
<div class="hiw-feature">
|
|
<div class="hiw-feature-icon">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="16 16 12 12 8 16"/><line x1="12" y1="12" x2="12" y2="21"/><path d="M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3"/></svg>
|
|
</div>
|
|
<h3>Fully Automated Pipeline</h3>
|
|
<p>From recording to your podcast app, the entire pipeline is automated. Post-production kicks off when the show ends, then a publish script handles transcription, AI-generated metadata, chapter detection, CDN sync, and RSS distribution — all with a single command.</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA -->
|
|
<section class="hiw-section hiw-cta">
|
|
<p>Want to hear it for yourself?</p>
|
|
<a href="/" class="hiw-cta-btn">Listen to Episodes</a>
|
|
<div class="hiw-cta-phone">
|
|
Or call in live: <strong>208-439-LUKE</strong>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer">
|
|
<div class="footer-links">
|
|
<a href="/">Home</a>
|
|
<a href="https://open.spotify.com/show/0ZrpMigG1fo0CCN7F4YmuF?si=f990713adce84ba4" target="_blank" rel="noopener">Spotify</a>
|
|
<a href="https://www.youtube.com/watch?v=xryGLifMBTY&list=PLGq4uZyNV1yYH_rcitTTPVysPbC6-7pe-" target="_blank" rel="noopener">YouTube</a>
|
|
<a href="https://podcast.macneilmediagroup.com/@LukeAtTheRoost/feed.xml" target="_blank" rel="noopener">RSS</a>
|
|
</div>
|
|
<div class="footer-projects">
|
|
<span class="footer-projects-label">More from Luke</span>
|
|
<div class="footer-projects-links">
|
|
<a href="https://macneilmediagroup.com" target="_blank" rel="noopener">MacNeil Media Group</a>
|
|
<a href="https://prints.macneilmediagroup.com" target="_blank" rel="noopener">Photography Prints</a>
|
|
<a href="https://youtube.com/lukemacneil" target="_blank" rel="noopener">YouTube</a>
|
|
</div>
|
|
</div>
|
|
<p class="footer-contact">Sales & Collaboration: <a href="mailto:luke@macneilmediagroup.com">luke@macneilmediagroup.com</a></p>
|
|
<p>© 2026 Luke at the Roost</p>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|