# LangChain explains how it built Content Studio, an open-source Slack design agent

> Original title: 把设计品味写进 Agent：LangChain 开源 Content Studio 的四个月实践

- Source: meng shao
- Published: 2026-10-28T07:29:00.000Z
- Bad Influence: https://badinfluence.news/items/s4kym1xwt4n8lk5hbbo6qnmqt
- Original: https://x.com/shao__meng/status/2115345069570212202

## Summary

LangChain's GTM engineering and design teams built Content Studio, a Slack design agent, over four months and open-sourced its harness on GitHub. The agent encodes designers' judgment in skills, a wiki, and code gates, and runs each Slack thread in its own sandbox where project files persist across turns.

## Post

把设计品味写进 Agent：LangChain 开源 Content Studio 的四个月实践

LangChain 内部 GTM 工程与设计团队用四个月把 Content Studio（Slack 里的 Design Agent）从「丑、像千篇一律 AI 稿」做到可量产：把设计师的判断写进 skills / wiki / 代码门禁，给模型一台能跨轮次改项目的沙箱电脑，再用异步子 Agent + 多人对线程的协作 UX 撑住几小时任务；并开源整套 harness，可 fork 后挂上自家品牌，经 Managed Deep Agents 部署到团队 Slack。

开源地址：
https://github.com/langchain-ai/design-agent

项目背景和结果
公司节奏快，launch、活动、博客都要图、片、片头、广告物料；设计人力被重复需求占满。Content Studio：在 Slack 里描述需求、挂 brief/素材，拿回合规成片。文称自 8 月起交付 3000+ 资产（含 80+ PPT）；带其素材的帖在 X 约 450 万 曝光；官号上这类帖相对其他帖约 2× 点赞、3.7× 收藏；约 3/4 请求来自营销外团队，75% 用户每周回访。单次请求模型花费中位数约从 9 月中的 $8 降到约 $0.50；迁到 Managed Deep Agents 后自有代码量约减 80%。

AI 会不会设计？
模型已经能写 HTML/CSS、图表规范和动画时间线，缺的是立场与上下文，容易「分布收敛」成好看但千人一面的稿（文里引 Anthropic 说法，以及 Stripe 设计负责人 Katie Dill 的「zombie UI」：没有观点，AI 会替你给一个）。结论不是「AI 不能设计」，是必须教它你们的品味。

怎么教品味？
· 基础：色板、字重、间距、对齐。
· 更关键：设计原则（如每帧一个焦点）、反 AI 俗套的护栏、以及每次反馈背后的推理（不只「改一下」）。
· 可度量的用代码门禁（如默认大小写）；主观判断（创意是否够强、信息是否清楚）由设计师拍板后写入 skill，供后续复用。
· 早期动效例子：鸟拖着光带飞出，「不要尖角」被理解成硬切圆角；后来 Agent 会自己建逐帧检查，保证光带贴合运动。设计师角色更像创意总监：定方向、审稿，而不是每张都手搓。

媒体 harness：设计师的电脑
底层是 Deep Agents（规划、文件、子 Agent、上下文管理）；Managed Deep Agents 负责生产运行（Slack、LangSmith Sandbox、工具、记忆、调度）。环境侧重点：
· 每条 Slack 线程一台沙箱：独立 Linux + 文件系统，项目跨轮次常驻；产出尽量是代码（幻灯片 HTML、动画时间线），改时间点就能重渲，不必整段重生。
· 工具层：剪辑用 HeyGen 开源的 HyperFrames（把片子当网页 + GSAP 时间线）；原创动画用自研 motion-studio（按像素画帧、多时刻混合模拟快门模糊等）；音画同一时间线。
· 知识四层：Skills（按任务路由，文称约 48 个 skill、近千文件；README 写约 35 个，以仓库现状为准）；Wiki（品牌、语调、产品、约 70 部参考片拆解等，技能只链过去不复制）；Gate（确定性检查）；Memory（团队层 + 个人层，AGENTS.md 索引有过膨胀到约 50 万 token 的教训，现约限 200 行）。
· 规格驱动：贵的是成片，先故事板（约 50ms/帧量级探索）→ 分镜/animatic 对节奏 → 再量产；顺序由代码强制，判断留在 prompt。协作画布用 Paper（点选改，而不是全程「用自然语言描述坐标」）；Paper 桌面能力在常驻 Linux worker 上无头跑，经桥接给云端沙箱。

主 Agent 负责统筹派活
长任务里多人会边做边改 brief。同步子 Agent 会堵住主线程，所以子任务异步：主 Agent 拆工、派角色、选模型与力度，用 start_task / check_tasks / cancel_task / resume_task / report_progress / schedule_wakeup 协调；人消息可插入下一轮模型调用前。线程里持续更新计划、ETA、子任务状态、花费，公开前要审批。例子：隔夜改肤 52 页 PPT，主 Agent 约跑 1 小时，子 Agent 合计超过 6 小时，不堵对话。

Bitter Lesson
早期给弱模型堆了约 115 个可复用 UI/动效组件和细则，品牌稳了但版式重复。等模型（文中写 Opus 5.5）跃升后，删掉大部分硬编码补丁，只留原则与高层指引，多样性反而上来。补偿模型短板的规则会过期；更长寿的是环境：工具、上下文、以及人如何中途干预。

自改进
快环：当场把规则写入记忆。慢环：learn_from_job 抽最多 5 条有证据的教训挂到对应 skill，后续任务打分，每周后台合入 skill/wiki。下一步方向：整条战役生命周期（经审批后经 Buffer 发帖、员工转发草稿、定时复盘等），人仍审仍批。

开源与部署
design-agent：fork 后加品牌 token、字体与 skills，用 Managed Deep Agents 部署到 Slack。README 强调本地可试、密钥不进沙箱；架构图把 Slack → 主 Agent → skills/wiki/记忆 → 沙箱（Chromium、ffmpeg、HyperFrames、motion-studio、异步子 Agent）串在一起。

## AI translation

Writing Design Taste into an Agent: Four Months of Building LangChain's Open-Source Content Studio

Over four months, LangChain's internal GTM engineering and design team turned Content Studio (the Design Agent that lives in Slack) from "ugly, looks like generic AI output" into something that can produce work at scale. They encoded designers' judgment into skills, a wiki, and code gates; gave the model a sandbox computer that can modify projects across turns; and used asynchronous sub-agents plus collaborative multi-person threads to support hours-long tasks. They have also open-sourced the entire harness, which you can fork, attach your own brand to, and deploy to your team's Slack via Managed Deep Agents.

Open-source repository:
https://github.com/langchain-ai/design-agent

Project background and results
The company moves fast: launches, events, and blogs all need graphics, images, intro videos, and ad assets, and the design team's capacity is consumed by repetitive requests. Content Studio lets you describe a request in Slack, attach a brief or assets, and get back compliant finished pieces. According to the write-up, since August it has delivered 3,000+ assets (including 80+ PPTs); posts featuring its output have reached about 4.5 million impressions on X; on the official account, these posts get roughly 2× the likes and 3.7× the bookmarks of other posts; about 3/4 of requests come from teams outside marketing; and 75% of users return weekly. The median model spend per request dropped from about $8 in mid-September to about $0.50; after moving to Managed Deep Agents, the team's own code shrank by about 80%.

Can AI do design?
Models can already write HTML/CSS, chart specifications, and animation timelines. What they lack is a point of view and context, so they tend to "converge to the distribution," producing work that looks fine but is indistinguishable from thousands of others. The article cites Anthropic's framing and Stripe design lead Katie Dill's notion of "zombie UI": without a point of view, AI will make one up for you. The conclusion is not that "AI can't design"; it's that you have to teach it your taste.

How do you teach taste?
- Basics: color palettes, font weights, spacing, alignment.
- More critical: design principles (such as one focal point per frame), guardrails against AI clichés, and the reasoning behind each piece of feedback (not just "change this").
- Measurable criteria are enforced with code gates (such as default capitalization); subjective judgments (whether the idea is strong enough, whether the information is clear) are decided by designers and written into skills for reuse.
- An early motion example: a bird dragging a light trail out of frame. The instruction "no sharp corners" was interpreted as hard cuts with rounded corners. Later, the agent built its own frame-by-frame checks to ensure the light trail followed the motion. The designer's role shifts toward creative director: setting direction and reviewing work, rather than hand-crafting every piece.

The media harness: the designer's computer
The foundation is Deep Agents (planning, files, sub-agents, context management). Managed Deep Agents handles production operation (Slack, LangSmith Sandbox, tools, memory, scheduling). Key points on the environment side:
- One sandbox per Slack thread: an isolated Linux environment with its own filesystem, where the project persists across turns. Outputs are preferably code (slide HTML, animation timelines), so changing a timing point just re-renders, without regenerating the whole piece.
- Tool layer: for editing, HeyGen's open-source HyperFrames (treating the video as a web page plus a GSAP timeline); for original animation, an in-house motion-studio (drawing frames pixel by pixel, blending multiple moments to simulate motion blur, etc.); audio and visuals share the same timeline.
- Knowledge in four layers: Skills (routed by task; the article says about 48 skills and nearly a thousand files, while the README says about 35, so the repository's current state is authoritative); Wiki (brand, tone, products, breakdowns of about 70 reference videos, etc., where skills link to content instead of copying it); Gates (deterministic checks); Memory (team-level and personal-level; the AGENTS.md index once bloated to about 500k tokens, and is now capped at about 200 lines).
- Spec-driven workflow: the expensive part is the final piece, so first storyboard (exploring at about 50ms per frame), then animatic to lock pacing, then produce at scale. The order is enforced by code, while judgment stays in the prompt. The collaborative canvas uses Paper (point-and-click editing rather than describing coordinates in natural language throughout); Paper's desktop capabilities run headlessly on a persistent Linux worker and are bridged to cloud sandboxes.

The main agent coordinates and dispatches work
In long tasks, multiple people change the brief while work is underway. Synchronous sub-agents would block the main thread, so sub-tasks run asynchronously: the main agent breaks down work, assigns roles, and selects models and effort levels, coordinating through start_task / check_tasks / cancel_task / resume_task / report_progress / schedule_wakeup. Human messages can be inserted before the next model call. The thread continuously updates the plan, ETA, sub-task status, and spend, and public release requires approval. One example: an overnight reskin of a 52-page PPT, where the main agent ran for about 1 hour while sub-agents collectively ran for over 6 hours, without blocking the conversation.

The Bitter Lesson
Early on, the team piled roughly 115 reusable UI/animation components and detailed rules onto a weaker model. The brand stayed consistent, but layouts became repetitive. After a model jump (the article names Opus 5.5), they deleted most of the hardcoded patches and kept only principles and high-level guidance, and diversity improved. Rules that compensate for model weaknesses expire; what lasts longer is the environment: tools, context, and how humans intervene midway.

Self-improvement
Fast loop: write rules into memory on the spot. Slow loop: learn_from_job extracts up to 5 evidence-backed lessons and attaches them to the relevant skill; later tasks are scored, and skill/wiki updates are merged weekly in the background. Next direction: the full campaign lifecycle (after approval, posting via Buffer, employees forwarding drafts, scheduled retrospectives), with humans still reviewing and approving.

Open source and deployment
design-agent: fork it, add brand tokens, fonts, and skills, and deploy to Slack with Managed Deep Agents. The README emphasizes local trial and keeping secrets out of the sandbox. The architecture diagram links Slack → main agent → skills/wiki/memory → sandbox (Chromium, ffmpeg, HyperFrames, motion-studio, asynchronous sub-agents).

![](https://badinfluence.news/api/img-proxy?u=https%3A%2F%2Fpbs.twimg.com%2Fmedia%2FHVs3GpWbwAAz2f3.jpg&mode=thumb&exp=1793404800&sig=0302f95224e47941)

## Quoted post @LangChain

> How we built Content Studio, an open-source design agent in Slack that makes on-brand videos, graphics and decks, and the harness that powers it. https://x.com/i/article/2114731014794661888

https://x.com/LangChain/status/2115124503093121121