# Teaching agents product design at Vercel

DevFeed: [Teaching agents product design at Vercel](<https://devfeed.tech/articles/teaching-agents-product-design-at-vercel-775.md>)

Original publisher: [Read original article](<https://vercel.com/blog/teaching-agents-product-design-at-vercel>)

Author: John Phamous

Published: 2026-06-25T07:00:00Z

Content type: article

Language: en

Sources: [Vercel News](<https://devfeed.tech/sources/vercel-news.md>)

Topics: [AI Bots](<https://devfeed.tech/topics/ai-bots.md>), [Figma](<https://devfeed.tech/topics/figma.md>)

Tags: [agent-skill](<https://devfeed.tech/tags/agent-skill.md>), [agents](<https://devfeed.tech/tags/agents.md>), [design](<https://devfeed.tech/tags/design.md>), [github](<https://devfeed.tech/tags/github.md>), [product](<https://devfeed.tech/tags/product.md>), [pull-requests](<https://devfeed.tech/tags/pull-requests.md>), [review](<https://devfeed.tech/tags/review.md>), [ui](<https://devfeed.tech/tags/ui.md>), [vercel](<https://devfeed.tech/tags/vercel.md>), [workflow](<https://devfeed.tech/tags/workflow.md>)

## AI overview

Vercel describes a repository-based product-design skill for coding agents that preserves the reasoning behind product decisions. The system combines agent guidance, automated linting, and a review loop that draws on Slack, Figma, and GitHub to propose guideline updates.

## Source excerpt

Coding agents can produce working UI fast, but what's harder is a different shape. They can copy your product's style, match its patterns, and try to follow its conventions. What they cannot do is understand why those patterns exist. Code shows agents what shipped, not why one component, phrase, or interaction became your standard. That reasoning lives in design reviews, PR comments, Slack threads, and with the people who were in the room. For an agent, context that isn't in the codebase doesn't exist. Vercel is an agent-native team. We treat accepted product decisions like code, keeping them in the repository, reviewing changes against them, and making them available to every agent working there. The way we do this is through product-design. It's a system with three parts: An agent skill that gives coding agents the context behind decisions that require product or codebase judgment. Linters that enforce clear rules automatically. A review loop that gathers evidence from Slack, Figma, and GitHub, then prepares guideline updates for review. Any team can build the same structure around their own standards. Inside the product-design skill The skill lives inside the repository alongside the code it governs. Here's a simplified view of its structure: The repository AGENTS.md tells coding agents when to load the skill. The skill-local AGENTS.md defines load order, validation, and governance. SKILL.md owns the runtime workflow. references/ stores product-judgment, interface-quality, resilience, copy, canonical product names, interaction patterns, and surface-specific decisions. exemplars/ documents decisions worth repeating from shipped pull requests, along with mistakes to avoid. coverage-gaps.md lists areas where we do not have a standard yet. copywriting-eval/ tests copy and interface-language behavior. It does not evaluate the broader product-design workflow. How the skill routes SKILL.md resolves the request mode first: shape, implement, review, copy, or harden. This