tcpsyn
7b7f9b8208
- On-air toggle uploads status.json to BunnyCDN + purges cache, website polls it every 15s to show live ON AIR / OFF AIR badge - Publish script downloads Castopod's copy of audio for CDN upload (byte-exact match), removes broken slug fallback, syncs all episode media to CDN after publishing - Fix f-string syntax error in publish_episode.py (Python <3.12) - Enable CORS on BunnyCDN pull zone for json files - CDN URLs for website OG images, stem recorder bug fixes, LLM token budget tweaks, session context in CLAUDE.md Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
253 lines
14 KiB
HTML
253 lines
14 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, and a live control room — 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 callers, AI callers, voice synthesis, and a live control room.">
|
|
<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">
|
|
<div class="diagram-row">
|
|
<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>
|
|
<div class="diagram-arrow">↓</div>
|
|
<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>
|
|
<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>AI Brain</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 Engine</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 News</span>
|
|
</div>
|
|
</div>
|
|
<div class="diagram-arrow">↓</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="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>
|
|
</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 for professional mixing.</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>
|
|
</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 audio routing — was built specifically for this show. No templates, no shortcuts.</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>
|
|
</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>
|