AI for grown-ups
On an unremarkable Monday last February, Andrej Karpathy fired off a tweet that gave the internet its new favorite buzz-phrase: vibe coding.Within hours, people watched tools like Bolt, v0, and Lovable conjure apps from mock-ups never designed or developed.The internet cheered—speed looks spectacular in demo reels—but more senior groups were quietly wincing as AI began to add technical debt to large codebases at previously impossible rates.Why demo-first AI fails mature teamsHere’s how senior designers, developers, and marketers feel the pain.Designers: Prefab design systems ≠ your design systemToday’s one-click generators choose their own colors, border-radii, and fonts. The instant they collide with a house style they don’t recognize, they hard-code new hex values that overwrite your brand tokens, throw off the grid, and leave designers sending screenshots of mismatched styles to the bug tracker.When you draw a picture, you spend your time carefully crafting the shapes and lines. Great design comes from consistency of intention.Today’s AI designers give you a page full of chicken scratches, an eraser, and a “good luck.”Developers: One-shot codegen ≠ production code.A “fully-working” React page arrives as a single 1,200-line component—no tests, no accessibility tags, no separation of concerns. The diff looks like a CVS receipt.The dev who merges it now basically owns a tarball that will resist every future refactor. Code feels like inheriting a junior’s side project, but the junior in this case is an LLM that never sleeps and can’t be taught.Clean, maintainable code is measured by how many lines you can still cut. Without context of your existing codebase or a lot of fine-tuning, AI’s tendency is to be too verbose.Marketers: Fake data ≠ live experiments.Marketing can now crank out a landing page in fifteen minutes, but every testimonial, price, and CTA is still lorem ipsum.Wiring the page to the CMS—and to analytics—means rewriting half the markup by hand. Every 10x sprint lands on an engineering backlog.You can generate pages, sure, but you’re gonna have to wait on the revenue.What’s left for us?Call it all the 80/20 hangover: AI generates the first 80% of the job in 20% of the time… then teams grind through the next 80% of the time patching the final 20% of the work.It’s the perfect inversion of healthy collaboration. Humans drown in drudgery and plead with the machine to handle the craft. But here’s the thing: The lesson isn’t that AI is snake oil; it’s that big team problems aren’t solved by fast AI alone.Sure, “Make me a meal-planning app” is a fun toy, but as we’ve seen, speed without fidelity just moves the bottleneck downstream.What we need is to respect the craft already living in your components, tokens, data, and tests. We need AI for grown-ups.The two-sided contract of AI for grown-upsHere’s the proposal: what if we started building AI with competent teams in mind?For that kind of tooling, two mindset shifts need to happen, both from the builders of AI software and the professionals that use it.Builders need to…Respect the stack. Every pixel, prop, token, schema, and test that already lives in a repo becomes the rails, not a suggestion. Professionals should be able to easily predict what AI outputs will look like.
Stay in their lane. Instead of inventing Yet-Another-Canvas, the tooling embeds itself in the software the best teams already use: Figma, IDEs, headless CMSes, etc. Professionals work hard to choose their tools, and AI alone is not a compelling enough reason to switch.
Expose control. Codegen happens in daylight—via CLI hooks, readable diffs, and human review gates—so senior engineers can keep the quality bar where it belongs. Professionals are smart enough to handle the machine, so long as it shows them what it’s doing.It’s not up to the professional world to keep perfect pace with the runaway train of AI. It’s the tool builders’ responsibility to stop breaking so much stuff.Professionals need to…Feed the context. Put in the work to document processes, map prototypes to real components, hand over design tokens, and write the first round of tests. Give the model a fighting chance at fidelity. Builders will use this to make AI generations far more deterministic.Stay accountable. A merged PR is still a human name on the line for the most intricate of crafts: UX polish, performance budgets, sparkling copy, etc. Builders don’t have to design all-star AI; they can focus on making it consistent at the grunt-work.Recognize AI limits. Designers, developers, and marketers use AI primarily as the translation layer between deeply skillful fields. Builders don’t need to make AI that replaces teams, but rather AI that fosters communication in the handoffs.It’s not up to the Builders to anticipate every team’s exact use case. Instead, they can trust that professionals will rise to the challenge of adapting AI to their needs. How AI for grown-ups works on a given MondayWell, that’s all great: People focus on people things; AI focuses on AI things. But what does it look like in practice?Let’s take the perspective of our three personas again—designers, developers, and marketers—and see what an ideal world looks like for them.Designers, still in FigmaA designer adjusts the corner radius on the hero card and watches the live hand-off panel flag the exact React prop it will touch.A token audit bot pings him only if the value breaks the design system—no more screenshot spreadsheets.Freed from red-lining, he spends the afternoon nudging micro-interactions and pairing with motion design, really making everything sing.Way more time on polish. No more token-drift bugs filed.Developers, still in the IDEA developer pulls the latest “design-to-code” PR: it’s already split into sensible components, test stubs green-lit, and the diff is small enough to review over coffee.She runs the performance benchmark—numbers hold, thanks to preset budgets the generator never crosses.With boilerplate gone, she dives into accessible keyboard flows and edge-case logic that actually moves the product forward.Review cycles on layout bugs drop by half with AI taking over scaffolding.Marketers, still in the CMSA marketer duplicates last week’s landing page variant, swaps headline copy, and clicks “Stage Experiment.”The AI wires analytics, snapshots the control, and opens a PR tagged for growth-team review—no Jira ticket, no dev backlog delay.They schedule the A/B test in the same dashboard and spend their saved hour crafting social hooks for the launch.Campaign velocity doubles, while engineering time spent on “tiny copy changes” shrinks to near-zero.Same tools, less tedium, deeper ownership. Each role feeds context to the system, stays accountable, and lets the AI do the grunt work—that’s the contract in action.Keep your Cursor, keep your ChatGPT—the glue-layer AI just has to play nice with them while sitting squarely in the team’s shared stack. How we’re building toward AI for grown-upsSo, how close are we to that perfect Monday?At Builder, we find ourselves in a unique position to help, and we’ve been pivoting to meet the demand, especially for large teams.A tiny history lessonBuilder launched in 2019 as a headless CMS plus visual editor whose goal was simple: let developers surface their own JavaScript framework components, and then let non-developers arrange those components without touching code.To pull that off, we built our editor on Mitosis, an open-source layer that describes components once and compiles them to whatever JS framework a team already runs.Because of that early direction, three “grown-up parts” of our product were firmly in place before the generative-AI wave arrived:Fully-featured visual editing: Our Webflow-like editor creates space for designers and marketers to tweak components and pages that compile to any JS framework.
Deterministic component mapping: Every Figma frame and its design tokens can round-trip with a real, version-controlled component—not a look-alike snippet.
A data source with real content: The CMS holds marketing content, sure, but also all the data engineers need for accurate UI states.So when large language models became practical, we didn’t bolt AI onto a blank slate; we layered it onto an editor, a mapper, and a CMS that were already respecting the stack.That head-start is why our current AI features can focus on removing drudgery instead of reinventing fundamentals.What we’ve made so farOur product works as a bunch of incrementally adoptable layers. No big bang rewrites needed.Visual Editor → Code. Think Bolt or v0, but with Webflow-level tweakability. Prompt the AI to draft a page—or paste any URL for an instant, editable clone—then fine-tune any class, token, or breakpoint by hand. Drop in production-ready components from 21st.devand ship designs that respect your CSS, not ours.Figma → Visual Editor. Install the free Figma Visual Copilot plug-in, draw your frame, and click Export. Copilot converts the frame’s exact Auto-Layout geometry into clean, responsive framework code that can drop straight into the repo or open in Builder’s visual editor for tweaks. Designers still hand over a Figma link; developers run one CLI command to scaffold production-ready code—no guessing, no style drift.Repo → Visual Editor → Repo PR. We’ll be announcing a product shortly that allows anyone to import any GitHub repo to the Visual Editor and make changes that get auto-sent as a PR. Marketers and designers can file engineering tickets with the code already in nice shape.Component Mapping. Tell Builder which Figma button matches which code button once, click “Publish,” and you’re set. From then on, every design export that uses that component drops the real one from your repo into the generated diff—props, tokens, everything—so code reviews focus on ideas, not mismatched styles.Builder Publish: It’s not just a patch for lorem ipsum; it’s your entire headless CMS. Wire any page to real-time content and analytics so marketing can run A/B tests without tapping devs—and get the full schema, versioning, and single-source-of-truth perks that come with a modern CMS, all under the same roof.Where we’re still workingWe’re close, not finished. Next on our list:Less manual context. Auto-detect more tokens and components so mapping feels like autocomplete, not data entry.
Deeper control. Let power users crack open every AI draft—props, tests, perf budgets—without leaving the editor.
Broader design-system support. Shadcn today, your bespoke kit tomorrow. Mapping should be one click, not a weekend.That “perfect Monday” vision is where we’re headed, and our roadmap will get us there one feature at a time.We’re definitely interested in your feedback: What gaps do you still feel between design, code, and marketing, and where could an “AI for grown-ups” save you the most pain?Drop your thoughts in the comments or tag us on our socials.Turning the 80/20 right-side-upIf Software 2.0 taught us that networks can write code, and the Software 3.0 hype reminds us they can write whole interfaces, then the middle road we’ve walked today—call it Software 2.5—insists that learned programs still deserve linting, budgeting, and daylight.Boring constraints create extraordinary freedom.Speed is intoxicating, but alone it flips the 80/20 rule on its head, leaving humans elbow-deep in cleanup. AI for grown-ups reverses that trade.Tool builders promise rails, not rabbit holes. Professionals promise context and accountability. Every mapped component, every token lock, every human review makes the next generation more predictable—and predictability is what compounds into real velocity.We don’t need to be dragged kicking and screaming into the new world. We’re perfectly capable of walking there at our own pace, spending our hours on craft no model can fake. Introducing Visual Copilot: convert Figma designs to high quality code in a single click.Try Visual CopilotGet a demo
#grownups
AI for grown-ups
On an unremarkable Monday last February, Andrej Karpathy fired off a tweet that gave the internet its new favorite buzz-phrase: vibe coding.Within hours, people watched tools like Bolt, v0, and Lovable conjure apps from mock-ups never designed or developed.The internet cheered—speed looks spectacular in demo reels—but more senior groups were quietly wincing as AI began to add technical debt to large codebases at previously impossible rates.Why demo-first AI fails mature teamsHere’s how senior designers, developers, and marketers feel the pain.Designers: Prefab design systems ≠ your design systemToday’s one-click generators choose their own colors, border-radii, and fonts. The instant they collide with a house style they don’t recognize, they hard-code new hex values that overwrite your brand tokens, throw off the grid, and leave designers sending screenshots of mismatched styles to the bug tracker.When you draw a picture, you spend your time carefully crafting the shapes and lines. Great design comes from consistency of intention.Today’s AI designers give you a page full of chicken scratches, an eraser, and a “good luck.”Developers: One-shot codegen ≠ production code.A “fully-working” React page arrives as a single 1,200-line component—no tests, no accessibility tags, no separation of concerns. The diff looks like a CVS receipt.The dev who merges it now basically owns a tarball that will resist every future refactor. Code feels like inheriting a junior’s side project, but the junior in this case is an LLM that never sleeps and can’t be taught.Clean, maintainable code is measured by how many lines you can still cut. Without context of your existing codebase or a lot of fine-tuning, AI’s tendency is to be too verbose.Marketers: Fake data ≠ live experiments.Marketing can now crank out a landing page in fifteen minutes, but every testimonial, price, and CTA is still lorem ipsum.Wiring the page to the CMS—and to analytics—means rewriting half the markup by hand. Every 10x sprint lands on an engineering backlog.You can generate pages, sure, but you’re gonna have to wait on the revenue.What’s left for us?Call it all the 80/20 hangover: AI generates the first 80% of the job in 20% of the time… then teams grind through the next 80% of the time patching the final 20% of the work.It’s the perfect inversion of healthy collaboration. Humans drown in drudgery and plead with the machine to handle the craft. But here’s the thing: The lesson isn’t that AI is snake oil; it’s that big team problems aren’t solved by fast AI alone.Sure, “Make me a meal-planning app” is a fun toy, but as we’ve seen, speed without fidelity just moves the bottleneck downstream.What we need is to respect the craft already living in your components, tokens, data, and tests. We need AI for grown-ups.The two-sided contract of AI for grown-upsHere’s the proposal: what if we started building AI with competent teams in mind?For that kind of tooling, two mindset shifts need to happen, both from the builders of AI software and the professionals that use it.Builders need to…Respect the stack. Every pixel, prop, token, schema, and test that already lives in a repo becomes the rails, not a suggestion. Professionals should be able to easily predict what AI outputs will look like.
Stay in their lane. Instead of inventing Yet-Another-Canvas, the tooling embeds itself in the software the best teams already use: Figma, IDEs, headless CMSes, etc. Professionals work hard to choose their tools, and AI alone is not a compelling enough reason to switch.
Expose control. Codegen happens in daylight—via CLI hooks, readable diffs, and human review gates—so senior engineers can keep the quality bar where it belongs. Professionals are smart enough to handle the machine, so long as it shows them what it’s doing.It’s not up to the professional world to keep perfect pace with the runaway train of AI. It’s the tool builders’ responsibility to stop breaking so much stuff.Professionals need to…Feed the context. Put in the work to document processes, map prototypes to real components, hand over design tokens, and write the first round of tests. Give the model a fighting chance at fidelity. Builders will use this to make AI generations far more deterministic.Stay accountable. A merged PR is still a human name on the line for the most intricate of crafts: UX polish, performance budgets, sparkling copy, etc. Builders don’t have to design all-star AI; they can focus on making it consistent at the grunt-work.Recognize AI limits. Designers, developers, and marketers use AI primarily as the translation layer between deeply skillful fields. Builders don’t need to make AI that replaces teams, but rather AI that fosters communication in the handoffs.It’s not up to the Builders to anticipate every team’s exact use case. Instead, they can trust that professionals will rise to the challenge of adapting AI to their needs. How AI for grown-ups works on a given MondayWell, that’s all great: People focus on people things; AI focuses on AI things. But what does it look like in practice?Let’s take the perspective of our three personas again—designers, developers, and marketers—and see what an ideal world looks like for them.Designers, still in FigmaA designer adjusts the corner radius on the hero card and watches the live hand-off panel flag the exact React prop it will touch.A token audit bot pings him only if the value breaks the design system—no more screenshot spreadsheets.Freed from red-lining, he spends the afternoon nudging micro-interactions and pairing with motion design, really making everything sing.Way more time on polish. No more token-drift bugs filed.Developers, still in the IDEA developer pulls the latest “design-to-code” PR: it’s already split into sensible components, test stubs green-lit, and the diff is small enough to review over coffee.She runs the performance benchmark—numbers hold, thanks to preset budgets the generator never crosses.With boilerplate gone, she dives into accessible keyboard flows and edge-case logic that actually moves the product forward.Review cycles on layout bugs drop by half with AI taking over scaffolding.Marketers, still in the CMSA marketer duplicates last week’s landing page variant, swaps headline copy, and clicks “Stage Experiment.”The AI wires analytics, snapshots the control, and opens a PR tagged for growth-team review—no Jira ticket, no dev backlog delay.They schedule the A/B test in the same dashboard and spend their saved hour crafting social hooks for the launch.Campaign velocity doubles, while engineering time spent on “tiny copy changes” shrinks to near-zero.Same tools, less tedium, deeper ownership. Each role feeds context to the system, stays accountable, and lets the AI do the grunt work—that’s the contract in action.Keep your Cursor, keep your ChatGPT—the glue-layer AI just has to play nice with them while sitting squarely in the team’s shared stack. How we’re building toward AI for grown-upsSo, how close are we to that perfect Monday?At Builder, we find ourselves in a unique position to help, and we’ve been pivoting to meet the demand, especially for large teams.A tiny history lessonBuilder launched in 2019 as a headless CMS plus visual editor whose goal was simple: let developers surface their own JavaScript framework components, and then let non-developers arrange those components without touching code.To pull that off, we built our editor on Mitosis, an open-source layer that describes components once and compiles them to whatever JS framework a team already runs.Because of that early direction, three “grown-up parts” of our product were firmly in place before the generative-AI wave arrived:Fully-featured visual editing: Our Webflow-like editor creates space for designers and marketers to tweak components and pages that compile to any JS framework.
Deterministic component mapping: Every Figma frame and its design tokens can round-trip with a real, version-controlled component—not a look-alike snippet.
A data source with real content: The CMS holds marketing content, sure, but also all the data engineers need for accurate UI states.So when large language models became practical, we didn’t bolt AI onto a blank slate; we layered it onto an editor, a mapper, and a CMS that were already respecting the stack.That head-start is why our current AI features can focus on removing drudgery instead of reinventing fundamentals.What we’ve made so farOur product works as a bunch of incrementally adoptable layers. No big bang rewrites needed.Visual Editor → Code. Think Bolt or v0, but with Webflow-level tweakability. Prompt the AI to draft a page—or paste any URL for an instant, editable clone—then fine-tune any class, token, or breakpoint by hand. Drop in production-ready components from 21st.devand ship designs that respect your CSS, not ours.Figma → Visual Editor. Install the free Figma Visual Copilot plug-in, draw your frame, and click Export. Copilot converts the frame’s exact Auto-Layout geometry into clean, responsive framework code that can drop straight into the repo or open in Builder’s visual editor for tweaks. Designers still hand over a Figma link; developers run one CLI command to scaffold production-ready code—no guessing, no style drift.Repo → Visual Editor → Repo PR. We’ll be announcing a product shortly that allows anyone to import any GitHub repo to the Visual Editor and make changes that get auto-sent as a PR. Marketers and designers can file engineering tickets with the code already in nice shape.Component Mapping. Tell Builder which Figma button matches which code button once, click “Publish,” and you’re set. From then on, every design export that uses that component drops the real one from your repo into the generated diff—props, tokens, everything—so code reviews focus on ideas, not mismatched styles.Builder Publish: It’s not just a patch for lorem ipsum; it’s your entire headless CMS. Wire any page to real-time content and analytics so marketing can run A/B tests without tapping devs—and get the full schema, versioning, and single-source-of-truth perks that come with a modern CMS, all under the same roof.Where we’re still workingWe’re close, not finished. Next on our list:Less manual context. Auto-detect more tokens and components so mapping feels like autocomplete, not data entry.
Deeper control. Let power users crack open every AI draft—props, tests, perf budgets—without leaving the editor.
Broader design-system support. Shadcn today, your bespoke kit tomorrow. Mapping should be one click, not a weekend.That “perfect Monday” vision is where we’re headed, and our roadmap will get us there one feature at a time.We’re definitely interested in your feedback: What gaps do you still feel between design, code, and marketing, and where could an “AI for grown-ups” save you the most pain?Drop your thoughts in the comments or tag us on our socials.Turning the 80/20 right-side-upIf Software 2.0 taught us that networks can write code, and the Software 3.0 hype reminds us they can write whole interfaces, then the middle road we’ve walked today—call it Software 2.5—insists that learned programs still deserve linting, budgeting, and daylight.Boring constraints create extraordinary freedom.Speed is intoxicating, but alone it flips the 80/20 rule on its head, leaving humans elbow-deep in cleanup. AI for grown-ups reverses that trade.Tool builders promise rails, not rabbit holes. Professionals promise context and accountability. Every mapped component, every token lock, every human review makes the next generation more predictable—and predictability is what compounds into real velocity.We don’t need to be dragged kicking and screaming into the new world. We’re perfectly capable of walking there at our own pace, spending our hours on craft no model can fake. Introducing Visual Copilot: convert Figma designs to high quality code in a single click.Try Visual CopilotGet a demo
#grownups
·52 Vue