People Helping Machines Helping People: A Vibe Coding Adventure

Or: How we discovered that AI tools are "directionally correct" but still need a human touch

In our recent exploratory vibe coding session, we put Claude MCP, Aider and Builder.io to the challenge of generating codebase compliant HTML from images. Each tool revealed distinct strengths and weaknesses, but more importantly, we stumbled upon three powerful principles that changed how we think about AI-assisted development.

The Challenge: From Figma Dreams to HTML Reality

Our mission was simple: take a beautiful design from our talented designer Cami (created years ago but never implemented due to the 25+ hour development cost) and see if modern AI tools could bridge that gap. The design featured our company mantra "people helping machines helping people" with striking visual elements—perfect for testing these tools' image-to-code capabilities.

Tool Battle Royale: The Results

Claude MCP: The Focused Specialist (6/10)

Claude MCP approached the task like a laser-focused surgeon. When we said "look at index.html," it looked at exactly that—nothing more, nothing less. This precision was both its strength and weakness.

Strengths:

• Direct, no-nonsense approach

• Clean code output that matched our existing patterns

• Minimal overhead and fast execution

Weaknesses:

• "Incredibly stingy" with context—couldn't see the bigger picture

• Required manual debugging and CSS fixes

• No understanding of how changes fit into the overall design

Aider: The Repository Whisperer (6.5/10)

Aider took a more holistic approach, creating a graph of our entire repository before making changes. This broader context awareness made a noticeable difference.

Strengths:

• Better out-of-the-box results with fewer bugs

• Automatic commits and repository-wide understanding

• More hands-off experience requiring less manual intervention

Weaknesses:

• Poor diff visualization (HTML flashing annoyingly on screen)

• Sometimes too autonomous with its auto-commit behavior

Builder.io: The Enterprise Mirage (0/10)

Builder.io promised a visual development environment and seamless design-to-code conversion. Instead, it delivered a masterclass in frustration.

The Reality:

• Over 2 minutes of setup time creating virtual environments

• Crashed with a generic "sorry we ran into an issue" message

• Never produced a single line of usable code

As one of our team members put it: "I will give it a 0 out of 10."

Three Powerful Principles We Discovered

1. "Directionally Correct" Is the New Good Enough

Both Claude MCP and Aider produced layouts that were recognizably similar to our design—they captured the essence while missing the details. The text was there, the layout was roughly right, but the alignment was off and the styling needed work.

Here's the kicker: we rated this as "good enough to get a job" despite being only 5-6 out of 10 in quality. Why? Because as capitalist economics cannot resist the pull of zero-cost engineering, somebody will find a way to put even imperfect AI output to use.

The market's sensibilities are "purely rational" in their pursuit of cost reduction, even if the output doesn't satisfy our human visual sensibilities.

2. Palindromic Relevance: When Patterns Reveal Deeper Truths

During our session, we realized that our company mantra "people helping machines helping people" is actually a palindrome—at least conceptually (phmhp). This led to a fascinating discussion about history's most impactful palindromes.

The winner? The "P" in CRISPR (Clustered Regularly Interspaced Short Palindromic Repeats). Those palindromic sequences in DNA aren't just linguistic curiosities—they're the foundation of gene editing technology that's literally helping us rewrite the code of life.

Sometimes the most profound insights come from the most unexpected observations.

3. Coordinate Interpretation as a Proxy for Vision

Perhaps the most important realization was understanding how AI "sees" our work. These tools don't actually read or see in the way humans do. As I explained to my colleagues:

The AI could read our HTML code but couldn't see the actual rendered webpage. This created layouts that technically worked but looked disconnected from the existing design—they lacked visual cohesion with their surroundings.

This "coordinate interpretation" explains why the tools were directionally correct but missed the nuanced understanding of how elements should flow together visually.

The Bigger Picture: What This Means for Developers

The Productivity Paradox

Despite all the hype about AI giving mind-blowing productivity gains, our experience was more nuanced. We still moved at a "snail's pace," carefully examining each output and debugging issues. The AI helped, but it didn't fundamentally change our development behavior.

The real value might not be in replacing human developers but in making certain types of work more accessible to people who wouldn't otherwise be able to do it.

The Learning Imperative

Here's a critical insight: most of the "magical" AI demonstrations you see on LinkedIn and Twitter are created by people with 10-15 years of programming experience. Their ability to debug CSS and smooth over AI limitations happens naturally—but they don't show that part in their posts.

If AI paradoxically convinces us to learn less in the future, we'll have less ability to smooth over the places where AI can't perform. The counter-argument is that as we lose our ability to learn, AI will gain more ability to learn. The jury's still out on that one.

Join Our Weekly Vibe Coding Sessions

What makes these sessions special isn't just the technical exploration—it's the collaborative discovery process. We approach problems with "incredible naivety" rewarded, where you don't need to be an "intellectual ninja" to contribute valuable insights.

Whether you're a seasoned developer or someone curious about AI tools, our weekly sessions offer:

• Real-world experimentation with cutting-edge AI tools

• Honest assessments without the typical hype

• Collaborative problem-solving with diverse perspectives

• Philosophical discussions about the future of development

• And yes, some jokes along the way

As we proved in this session, some of the most valuable insights come from unexpected places—like discovering that your company mantra is a palindrome, or realizing that CRISPR's palindromic sequences might be history's most impactful palindrome.

The Bottom Line

AI tools for code generation are getting better, but they're not magic. They're "directionally correct" assistants that can help you move faster if you understand their limitations and have the skills to guide them effectively.

The future isn't about AI replacing developers—it's about people helping machines helping people create better software together.

Ready to join the adventure? Our next vibe coding session is coming up, and who knows what we'll discover next. Maybe we'll finally get that self-driving car for CSS, or perhaps we'll uncover the next palindromic revelation that changes how we think about technology.

John Davison is the founder and CTO of Startuplandia.io, bringing tech dreams to life one vibe coding session at a time. Join Lucas Draichi (AI/LLM engineer from São Paulo) and Will Baxter (PhD mathematician and Austin CTO Club leader) for weekly explorations into the frontier of AI-assisted development.