Trey t
66c2bbec8b
- Dashboard with campaign management, asset gallery, and publishing queue - 7-agent pipeline: trend scout, research, scripts, ad creative, video, copy, distribution - Campaign form with screenshot upload, goal picker, platform selection - Campaign detail view with Details/Pipeline/Assets/Chat tabs - Two-set image generation: Gemini AI (NanoBanana MCP) + Canvas Design posters - Remotion video rendering with phone.png frame and real screenshot alignment - honeyDue branding: blue #0079FF, orange #FF9400, Inter font, warm off-white - Asset cards with source badges (Gemini/Canvas/Remotion/Playwright) - Markdown/JSON render endpoint for viewing pipeline outputs as HTML - Settings page with Tavily, Gemini, Postiz, Nextdoor integration management - Claude Chat for campaign feedback loop with streaming SSE - Postiz publishing modal with scheduling - Auth with NextAuth credentials + JWT sessions - SQLite via Prisma with better-sqlite3 adapter Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
108 lines
4.2 KiB
Markdown
108 lines
4.2 KiB
Markdown
# Marketing Content Pipeline
|
|
|
|
This project implements an AI-powered Social Media Content Automation System.
|
|
Seven specialized agents research, generate, render, and distribute marketing content.
|
|
|
|
# System Architecture
|
|
Seven agents running in sequence:
|
|
1. **Trend Scout** — trending content monitoring via Tavily
|
|
2. **Marketing Research Agent** — deep market research via Tavily
|
|
3. **Script Writer** — ad scripts from research output
|
|
4. **Ad Creative Designer** — static ads via NanoBanana MCP + Playwright
|
|
5. **Video Ad Producer** — video ads via Remotion
|
|
6. **Copywriter Agent** — platform-specific copy
|
|
7. **Distribution Agent** — publish manifest creation (gate-protected)
|
|
|
|
# Folder Structure
|
|
- `assets/` — brand images, logos, product shots (mood board)
|
|
- `knowledge/` — brand identity, platform guidelines, product/campaign info
|
|
- `skills/` — all 7 agent skills (each has SKILL.md)
|
|
- `outputs/` — generated content per campaign
|
|
- `remotion-ad/` — Remotion video project with compositions
|
|
|
|
# Knowledge Files (READ FIRST)
|
|
Every agent MUST read these before generating ANY content:
|
|
- `knowledge/brand_identity.md` — tone, voice, personality, CTA patterns
|
|
- `knowledge/platform_guidelines.md` — per-platform specs and formatting
|
|
- `knowledge/product_campaign.md` — product details, features, campaign direction
|
|
|
|
# Available Tools
|
|
|
|
## Tavily (Web Research)
|
|
Use `@tavily/core` npm package. Write a Node.js script to run searches:
|
|
```javascript
|
|
import { tavily } from "@tavily/core";
|
|
const client = tavily({ apiKey: process.env.TAVILY_API_KEY });
|
|
const result = await client.search("query", { maxResults: 10 });
|
|
```
|
|
The TAVILY_API_KEY is available in the environment.
|
|
|
|
## NanoBanana MCP (Image Generation)
|
|
Available as MCP tool: `mcp__nanobanana__generate_image`
|
|
Uses Google Gemini to generate images. Call it with a detailed prompt describing the desired image.
|
|
The GEMINI_API_KEY is configured in .mcp.json.
|
|
|
|
## Playwright (HTML to PNG)
|
|
Use Playwright to render HTML/CSS layouts to pixel-perfect PNG screenshots:
|
|
```javascript
|
|
import { chromium } from "playwright";
|
|
const browser = await chromium.launch();
|
|
const page = await browser.newPage();
|
|
await page.setViewportSize({ width: 1080, height: 1080 });
|
|
await page.setContent(htmlString);
|
|
await page.screenshot({ path: "output.png" });
|
|
await browser.close();
|
|
```
|
|
|
|
## Remotion (Video Rendering)
|
|
Video project is in `remotion-ad/`. Compositions are defined in `remotion-ad/src/`.
|
|
To render a video:
|
|
```bash
|
|
cd remotion-ad && npx remotion render src/index.ts CompositionId --output ../outputs/campaign/video/filename.mp4
|
|
```
|
|
You can modify or create new compositions in `remotion-ad/src/` before rendering.
|
|
|
|
# Pipeline Execution Order
|
|
trend-scout → research → script-writer → ad-creative → video-producer → copywriter → distribution
|
|
|
|
Each agent reads its SKILL.md from `skills/{agent-name}/SKILL.md` and follows it exactly.
|
|
|
|
# Output Convention
|
|
```
|
|
outputs/{task_name}_{YYYYMMDD}/
|
|
├── trend_report.json
|
|
├── research_results.json
|
|
├── research_brief.md
|
|
├── interactive_report.html
|
|
├── ads/
|
|
│ ├── instagram_feed_*.png (1080x1080)
|
|
│ ├── instagram_stories_*.png (1080x1920)
|
|
│ ├── nextdoor_spotlight_*.png (1200x1200)
|
|
│ ├── nextdoor_display_*.png (1200x628)
|
|
│ └── ad_manifest.json
|
|
├── scripts/
|
|
│ ├── scripts_all.json
|
|
│ └── scripts_summary.md
|
|
├── video/
|
|
│ ├── instagram_reel_*.mp4 (1080x1920)
|
|
│ ├── tiktok_ad_*.mp4 (1080x1920)
|
|
│ ├── nextdoor_video_*.mp4 (1080x1080)
|
|
│ └── scene_plans.json
|
|
├── copy/
|
|
│ ├── instagram_captions.json
|
|
│ ├── tiktok_captions.json
|
|
│ ├── nextdoor_posts.json
|
|
│ └── copy_matrix.json
|
|
└── Publish_manifest.md
|
|
```
|
|
|
|
# File Naming Convention
|
|
`{platform}_{format}_{hook_variant}_{dimensions}.{ext}`
|
|
Example: `instagram_feed_hook_a_1080x1080.png`
|
|
|
|
# Safety Rules
|
|
- No live API posting without explicit user approval
|
|
- Distribution agent creates a publish manifest — NEVER auto-publishes
|
|
- All media files must exist locally before creating the manifest
|
|
- Always save outputs to the specified output directory
|