80a1ffbe4d
Apps share the same backend, API keys, and publishing flow but each gets its own branding (name, colors, icon, app URL), knowledge files (brand identity, product info, platform guidelines), and campaigns. The pipeline dynamically writes _knowledge/ files and copies app assets before each run. - Add App model with slug, colors, appUrl, and knowledge markdown fields - Add appId FK to Campaign, seed honeyDue as first app with existing knowledge - App switcher dropdown in sidebar with icon previews - Filter campaigns, stats, and assets by active app (cookie-based) - De-hardcode lib/claude.ts: AppConfig interface, templated prompts, dynamic _knowledge/ and Remotion asset copying - App management pages (list, create, edit) with icon upload and color pickers - Asset library sort options (newest, oldest, name, platform, type) - Asset cards show creation date - Remotion HoneyDueAd accepts colors/appName props Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
110 lines
4.3 KiB
Markdown
110 lines
4.3 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
|
|
|
|
NOTE: The `_knowledge/` directory is dynamically written per-pipeline-run with the active app's content. The original `knowledge/` directory contains the honeyDue defaults.
|
|
|
|
# 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
|