RFC-002: Template Ecosystem for Deterministic Agent Output

violet-app-agent/apps/agent/demo/DEMO_SCRIPT.md

@@ -0,0 +1,143 @@
+# Violet App Agent Demo Script
+
+## The Hook (0-10 seconds)
+
+**SHOW THE RESULT FIRST**
+
+```
+[Screen: The finished app - cosmic-observer.localhost:5250/home with 90s nostalgia styling]
+```
+
+**Voice:**
+> "I typed one sentence. 47 seconds later, I had a deployed blog with this styling."
+
+---
+
+## The Problem (10-25 seconds)
+
+**Voice:**
+> "Building apps is slow. Even with Rails, you're still writing migrations,
+> controllers, views, CSS... What if you could just describe what you want?"
+
+```
+[Screen: Split - left side shows traditional Rails workflow (terminal commands),
+right side shows a text input box]
+```
+
+---
+
+## The Demo (25-90 seconds)
+
+### Step 1: Describe Your App
+
+```
+[Screen: Chat UI with user typing]
+```
+
+**Voice:**
+> "Here's the entire prompt: 'Build me a blog called The Cosmic Observer about astronomy'"
+
+**Type in the chat:**
+```
+Build me a blog called The Cosmic Observer about astronomy.
+Make a home page with a hero section.
+```
+
+### Step 2: Watch It Build
+
+```
+[Screen: Show the streaming UI with tool calls appearing]
+```
+
+**Voice:**
+> "The agent figures out what to build. Creates a subdomain.
+> Generates styled pages. Verifies everything works."
+
+**Show checkmarks appearing:**
+- ✓ create_subdomain → cosmic-observer
+- ✓ generate_styled_page → Home with 90s CSS
+- ✓ create_page → /home
+- ✓ verify_page → Success
+
+### Step 3: The Result
+
+```
+[Screen: Navigate to cosmic-observer.localhost:5250/home]
+```
+
+**Voice:**
+> "Cream backgrounds. Georgia serif. Teal and coral accents.
+> This isn't generated garbage - it's designed."
+
+---
+
+## The Tech (90-120 seconds)
+
+**Voice:**
+> "Under the hood: LangGraph orchestrating specialized subagents.
+> A Template Designer that only uses verified Liquid tags - no hallucinated code.
+> Rails runner for direct database access. DHH would approve."
+
+```
+[Screen: Quick flash of architecture diagram]
+```
+
+---
+
+## The CTA (120-150 seconds)
+
+```
+[Screen: Hackathon landing page / graphic]
+```
+
+**Voice:**
+> "Want to build something like this? I'm judging the 'Building with AI' track
+> at the Violet Rails Hackathon.
+>
+> Your challenge: take this agent and make it do something we haven't thought of.
+> Deploy a marketplace. Generate a SaaS. Build the next big thing.
+>
+> Link in description. See you there."
+
+```
+[Screen:
+  VIOLET RAILS HACKATHON
+  "Building with AI" Track
+
+  [Register Now]
+]
+```
+
+---
+
+## Recording Notes
+
+### Equipment
+- Screen recording: OBS or QuickTime
+- Audio: External mic if available
+- Resolution: 1920x1080 minimum
+
+### Pacing
+- Speak FAST, pause between sentences (can edit pauses out)
+- Total runtime: 2-3 minutes max
+- Show, don't tell - let the demo do the work
+
+### Editing Tips
+- Cut all dead air
+- Speed up typing (1.5x)
+- Add subtle zoom on key moments
+- Background music: lo-fi or synthwave (low volume)
+
+### Platforms
+- YouTube: Full version with chapters
+- X/Twitter: 60-second cut (hook + demo + CTA)
+- LinkedIn: 90-second version with text overlay
+
+---
+
+## B-Roll Ideas
+
+1. Terminal commands flying by (speed up)
+2. The 90s nostalgia CSS file scrolling
+3. Tool calls streaming in real-time
+4. Before/after comparison (blank page → styled app)

violet-app-agent/apps/agent/demo/SOCIAL_POSTS.md

@@ -0,0 +1,210 @@
+# Social Media Posts for Violet App Agent Demo
+
+## Twitter/X Thread (Main Post)
+
+### Tweet 1 (The Hook)
+```
+I typed one sentence.
+
+47 seconds later, I had a deployed blog with:
+- Cream backgrounds
+- Georgia serif typography
+- Teal/coral CTAs
+- Working navigation
+
+Here's how 👇
+```
+
+### Tweet 2 (The Input)
+```
+The entire prompt:
+
+"Build me a blog called The Cosmic Observer about astronomy. Make a home page with a hero section."
+
+That's it. No YAML. No configs. No boilerplate.
+```
+
+### Tweet 3 (The Tech)
+```
+Under the hood:
+
+• LangGraph orchestrating specialized subagents
+• Template Designer with verified Liquid tags (no hallucinated code)
+• Rails runner for direct DB access
+• 90s nostalgia CSS baked in
+
+DHH would approve.
+```
+
+### Tweet 4 (The CTA)
+```
+Want to build something like this?
+
+I'm judging the "Building with AI" track at the Violet Rails Hackathon.
+
+Your challenge: Take this agent and make it do something we haven't thought of.
+
+Register: [LINK]
+
+See you there.
+```
+
+---
+
+## LinkedIn Post
+
+```
+One sentence. One deployed app.
+
+I've been working on an AI agent that turns natural language descriptions into working Rails applications.
+
+The result? Type "Build me a blog about astronomy" and get:
+✓ A subdomain provisioned
+✓ Styled pages with 90s nostalgia CSS
+✓ Working navigation and forms
+✓ Verified Liquid templates (no hallucinated code)
+
+The secret sauce: A Template Designer subagent that only uses tags that actually exist in the framework. No runtime errors. No broken pages.
+
+Tech stack:
+• LangGraph for agent orchestration
+• Specialized subagents for architecture, CMS, security
+• Rails runner for direct database access
+• Deterministic template system
+
+I'm judging the "Building with AI" track at the upcoming Violet Rails Hackathon.
+
+If you can extend this agent to do something unexpected - deploy a marketplace, generate a SaaS, build the next big thing - I want to see it.
+
+Link to demo and registration in comments.
+
+#AI #Rails #DevTools #BuildInPublic
+```
+
+---
+
+## YouTube Short Script (60 seconds)
+
+```
+[0-5s] HOOK
+"One sentence. 47 seconds. A deployed app."
+
+[5-15s] SHOW THE RESULT
+[Screen: Navigate to cosmic-observer.localhost with styled blog]
+"Look at this. Cream backgrounds. Georgia serif. Teal and coral buttons. This isn't generated garbage."
+
+[15-30s] THE INPUT
+[Screen: Chat UI with typing]
+"Here's the entire prompt: Build me a blog called The Cosmic Observer about astronomy."
+[Screen: Tool calls appearing]
+"Watch. Subdomain created. Page generated. Verified. Done."
+
+[30-45s] THE TECH
+"The secret? A Template Designer that only uses Liquid tags that actually exist. No hallucinated code. No NoMethodError at runtime."
+
+[45-60s] CTA
+"I'm judging the Building with AI track at the Violet Rails Hackathon. Take this agent. Make it do something we haven't thought of. Link below."
+```
+
+---
+
+## Short Tweet (Single Post)
+
+```
+Built an AI agent that turns "Build me a blog about astronomy" into a deployed Rails app in 47 seconds.
+
+Template Designer only uses verified Liquid tags - no hallucinated code.
+
+Judging "Building with AI" at Violet Rails Hackathon.
+
+What would you build?
+
+[DEMO LINK]
+```
+
+---
+
+## Reddit Post (r/rails, r/webdev, r/artificial)
+
+**Title:** I built an AI agent that deploys Rails apps from natural language - 47 seconds from prompt to styled blog
+
+**Body:**
+```
+Been working on this for a few weeks and wanted to share.
+
+**The Problem:**
+AI agents that generate code tend to hallucinate. They'll write Liquid tags that don't exist, causing runtime errors on pages they create.
+
+**The Solution:**
+A "Template Designer" subagent that:
+1. Only uses verified Liquid tags from a whitelist
+2. Generates styled HTML with CSS baked in (90s nostalgia aesthetic)
+3. Verifies every page renders after creation
+
+**Demo:**
+Type: "Build me a blog called The Cosmic Observer about astronomy"
+Get: A working subdomain with styled home page in under a minute
+
+**Tech:**
+- LangGraph for agent orchestration
+- Specialized subagents (Architect, CMS Designer, Security, Deployer)
+- Rails runner for direct database operations
+- Deterministic template system
+
+**Why I'm posting:**
+I'm judging the "Building with AI" track at the Violet Rails Hackathon. Looking for people who want to extend this - deploy marketplaces, generate SaaS apps, whatever.
+
+Code is open source: [GITHUB LINK]
+Demo: [DEMO LINK]
+
+Would love feedback from the Rails community.
+```
+
+---
+
+## HN Post
+
+**Title:** Show HN: AI agent that deploys Rails apps from natural language (no hallucinated code)
+
+```
+I built an AI agent that turns "Build me a blog about astronomy" into a deployed Rails app.
+
+The key innovation: A "Template Designer" subagent that only uses verified Liquid tags. No hallucinated code = no runtime errors.
+
+How it works:
+1. You describe your app in plain English
+2. Agent creates subdomain, generates styled pages, verifies they render
+3. You get a working app with 90s nostalgia CSS (cream backgrounds, Georgia serif, teal/coral accents)
+
+Under 1 minute from prompt to deployed app.
+
+Tech: LangGraph, specialized subagents, Rails runner for DB access.
+
+Open source. Looking for feedback and people who want to extend it.
+
+Demo: [LINK]
+GitHub: [LINK]
+```
+
+---
+
+## Recording Checklist
+
+Before recording the video demo:
+
+- [ ] Clean browser (no tabs, incognito mode)
+- [ ] Fresh subdomain name ready (test first that it doesn't exist)
+- [ ] LangGraph server running and healthy
+- [ ] Rails server running
+- [ ] Screen recording software ready (OBS/QuickTime)
+- [ ] External mic connected (if available)
+- [ ] Script printed or on second monitor
+- [ ] Keyboard shortcuts memorized
+- [ ] Energy drink consumed (speak fast!)
+
+Post-recording:
+- [ ] Trim dead air
+- [ ] Speed up typing to 1.5x
+- [ ] Add zoom on key moments
+- [ ] Export at 1080p minimum
+- [ ] Thumbnail: split screen (chat input | styled result)