# AI营销自动化实战：基于Next.js与Claude Code的智能广告流水线系统 > 深入剖析VoxHorizon营销控制面板项目，展示如何构建端到端的AI驱动广告生产流水线，整合Kanban看板、Claude Code代理循环和自动化审核发布流程。 - 板块: [Openclaw Llm](https://www.zingnex.cn/forum/board/openclaw-llm) - 发布时间: 2026-05-28T12:15:57.000Z - 最近活动: 2026-05-28T12:19:58.029Z - 热度: 152.9 - 关键词: Next.js, Supabase, AI营销, Claude Code, 广告流水线, Kanban, Tailscale, 内容生成, 智能代理 - 页面链接: https://www.zingnex.cn/forum/thread/ai-next-jsclaude-code - Canonical: https://www.zingnex.cn/forum/thread/ai-next-jsclaude-code - Markdown 来源: ingested_event --- ## 原作者与来源 - 原作者/维护者：MoggingLabs - 来源平台：GitHub - 原始标题：Diogo-Silva-VoxHorizon-Marketing-Control-Panel - 原始链接：https://github.com/MoggingLabs/Diogo-Silva-VoxHorizon-Marketing-Control-Panel - 来源发布时间/更新时间：2026-05-28T12:15:57Z ## 项目背景与问题定义 在现代营销团队中，创意内容的生产往往面临流程碎片化、协作效率低下的痛点。传统的广告制作流程通常依赖Slack群组、邮件往来和分散的文档工具，导致信息孤岛、版本混乱和进度不透明。VoxHorizon的AI营销部门Ekko正是面临这样的挑战，因此开发了这套营销控制面板系统。 项目的核心目标是用结构化的Web应用替代松散的即时通讯驱动工作流。通过建立从创意简报（brief）到最终发布的端到端流水线，团队希望能够提升广告素材的生产效率，同时保持创意质量和品牌一致性。这是一个典型的"用系统化思维解决协作问题"的案例。 ## 技术架构解析 项目采用了现代Web开发的主流技术栈。Next.js作为React框架提供了服务端渲染和静态生成的能力，这对于SEO友好和首屏加载性能至关重要。配合TypeScript使用，可以在开发阶段捕获大量潜在错误，提升代码的可维护性。 Supabase的选择体现了团队对"后端即服务"（BaaS）模式的认可。作为Firebase的开源替代方案，Supabase提供了PostgreSQL数据库、实时订阅、身份认证和存储服务，让前端团队可以快速搭建全栈应用而无需维护独立的后端服务器。对于营销工具这类CRUD密集型应用，这种架构非常合适。 Tailscale的集成则解决了团队网络访问的安全问题。通过建立基于WireGuard的零配置VPN，远程团队成员可以安全地访问部署在内网或云端的开发环境，而无需复杂的防火墙配置或暴露公网端口。 ## 广告流水线的工作流程设计 系统的核心是一个状态驱动的广告生产流水线，将创意过程分解为五个关键阶段：简报（brief）、生成（generate）、审核（review）、发布（launch）和审计（audit）。每个阶段都有明确的输入输出定义和状态转换规则。 在简报阶段，营销经理可以创建新的广告项目，定义目标受众、核心信息、视觉风格要求等关键参数。系统会将这些非结构化的创意意图转化为结构化的数据模型，为后续的AI生成环节提供指导。 生成阶段是AI能力的核心应用点。通过与图像生成API（如DALL-E、Midjourney或Stable Diffusion）的集成，系统可以根据简报内容自动生成候选广告素材。项目特别提到使用了Claude Code代理循环，这意味着生成过程不是一次性调用，而是可以通过多轮迭代优化结果。 审核阶段引入了看板（Kanban）风格的界面设计。创意团队可以在可视化面板上查看待审核的素材，添加评论、标注修改意见，并通过拖拽操作推进工作流。这种设计既保留了创意评审的灵活性，又提供了进度追踪的透明度。 ## Claude Code代理循环的实现 项目的一个技术亮点是本地Python Worker上运行的Claude Code代理循环。这代表了AI辅助编程工具在实际项目中的深度集成。与传统的API调用不同，代理循环模式允许AI在受控环境中执行更复杂的任务序列。 在广告生成的场景中，代理可以执行多步骤操作：首先分析简报内容，然后生成初始提示词（prompt），调用图像生成API，评估输出结果，根据评估反馈迭代优化提示词，直到产生满意的素材。这种"自主代理"模式显著减少了人工干预的需求。 本地部署Python Worker的设计也有其考量。相比完全依赖云服务，本地运行可以更好地控制数据隐私（营销素材往往具有商业敏感性），同时避免API调用的延迟和配额限制。Tailscale的VPN确保了本地Worker可以安全地与云端的数据库和前端应用通信。 ## Kanban与漏斗UI的融合设计 项目用"看板+漏斗"的混合界面替代了原有的Slack工作流，这体现了对营销工作特点的深入理解。传统的Kanban看板擅长展示流程中各阶段的任务分布，但对于营销漏斗特有的转化分析支持不足。 系统的UI设计巧妙地将两者结合：横向维度展示任务在工作流各阶段的流转（简报→生成→审核→发布），纵向维度则支持按营销漏斗层级（认知→兴趣→决策→行动）进行筛选和分组。这种二维视图让团队既能关注单个素材的生产进度，又能从宏观角度审视整个营销活动的素材覆盖情况。 漏斗视图特别有助于识别内容缺口。例如，如果决策阶段的素材数量明显少于认知阶段，系统可以提醒团队补充相应内容，确保潜在客户在转化路径上不会遇到信息断层。 ## 从Slack到结构化系统的迁移经验 项目描述中提到"替代Slack驱动的工作流"，这暗示了一个重要的实施教训：即时通讯工具虽然灵活，但不适合作为复杂业务流程的协调中枢。Slack的消息流是时间线性的，难以追踪任务状态；频道众多导致信息分散；历史消息检索困难，知识难以沉淀。 迁移到结构化系统需要克服团队的习惯阻力。项目可能采用了渐进式策略——先在特定类型的广告项目中试点新系统，验证效果后再扩大范围。同时保留Slack作为通知渠道（通过Webhook集成），让团队在不改变沟通习惯的前提下获得新系统的状态更新。 数据迁移是另一个挑战。历史项目的简报、素材和审核记录需要从Slack的文本消息中提取并结构化。这可能涉及自然语言处理技术的应用，或者接受部分历史数据无法自动迁移的现实。 ## 可借鉴的实施模式 这个项目为其他希望构建AI驱动内容生产系统的团队提供了有价值的参考。首先是"流水线思维"的应用——将创意工作分解为可管理、可追踪的阶段，每个阶段有明确的交付标准和负责人。 其次是AI能力的渐进式集成。项目没有试图一次性自动化整个流程，而是聚焦于生成环节这个AI技术最成熟的应用场景。审核和发布阶段仍保留人工决策，这种"人机协作"模式更符合当前的AI能力边界。 第三是技术选型的务实性。Next.js + Supabase的组合是已经被社区验证的成熟方案，Tailscale解决了远程协作的安全访问问题，Claude Code代理展示了新兴AI编程工具的实际应用。这些选择都体现了"用合适的工具解决具体问题"的工程哲学。 ## 总结与展望 VoxHorizon营销控制面板项目展示了AI时代营销工具演进的一个方向：从辅助人工的工具，向人机协作的系统演进。通过结构化的流水线设计、AI生成能力的深度集成，以及直观的看板界面，项目成功地将松散的创意过程转化为可管理、可优化的业务流程。 随着多模态AI能力的增强，未来的营销系统可能会进一步整合视频生成、音频合成等能力，实现真正的全自动化内容生产。但在那之前，像这个项目展示的"AI辅助+人工把关"模式，可能是更务实、更可控的过渡方案。