How to build your own AI developer tools with Claude Code | CJ Hess (Tenex)

2026-02-04 · Source: Lenny's Newsletter · Field: Technology & Digital — Artificial Intelligence & Machine Learning, Software Development & Engineering · Depth: Intermediate, extended

Summary

CJ Hess, featured on "How I AI," demonstrates Flowy, a custom AI-native development tool designed to transform AI-generated Markdown plans into interactive visual diagrams and UI mockups. Flowy addresses the limitations of ASCII flowcharts by enabling Claude Code to generate JSON files that render into more visually appealing wireframes and system diagrams. Hess emphasizes Claude Code's "intent understanding" and steerability, which allowed him to build this ecosystem of tools. The workflow involves prompting Claude Code to create animation timing sequences and user flow diagrams using Flowy skills, iterating on these visual representations within Flowy's editor, and then using the refined diagrams and mockups to guide Claude Code in building features. The episode also highlights a model-to-model evaluation technique, where Claude's code is reviewed by Codex for "code smells" and potential refactoring opportunities.

Key takeaway

For AI Engineers and Product Designers seeking to streamline planning and development, integrating custom visual tools like Flowy with LLMs can significantly improve clarity and efficiency. You should consider building your own AI-native tools to translate text-based plans into interactive diagrams and UI mockups, allowing for faster iteration and better communication with AI agents. This approach reduces cognitive overhead and accelerates feature development, moving from concept to functional code rapidly.

Key insights

Custom AI-native tools enhance developer workflows by transforming AI-generated plans into interactive visual diagrams.

Principles

• AI intent understanding improves steerability.
• Visualizing AI-generated plans aids human comprehension.
• Model-to-model evaluation identifies code smells.

Method

Develop custom skills for LLMs to interpret proprietary JSON schemas, enabling visual diagram generation from text plans. Iterate on diagrams in a dedicated editor, then use them to guide feature implementation.

In practice

• Build custom dev tools for AI agents.
• Use JSON for structured visual diagram generation.
• Employ a second LLM for code review.

Topics

• Custom AI Tools
• AI-Native Design
• LLM Workflow Orchestration
• Model-to-Model Evaluation
• AI Engineering Workflows

Best for: AI Engineer, Software Engineer, Product Designer

Related on AIssential

• DIY dev tools: How this engineer created “Flowy” to visualize his plans and accelerate coding — Custom AI-native dev tools enhance planning and coding efficiency by enabling visual iteration and model-to-model evaluation.
• 🎙️ This week on How I AI: How to build your own AI developer tools with Claude Code — Custom AI-native dev tools and model-to-model evaluation enhance AI engineering workflows and code quality.
• The engineering best practices you can drop straight into Claude — Towards AI offers free, public AI engineering cheatsheets to accelerate LLM system development.
• 🔵 Claude Plugins and the SaaSpocalypse: is this “the most illogical thing in the world?” — AI is rapidly transforming product development, internal operations, and market dynamics, challenging traditional SaaS models.
• v2.1.87 — Claude Code updates significantly enhance AI model capabilities, user experience, and extensibility through plugins and agent teams.
• Build your own AI tools to fill specific workflow gaps — Custom AI tools can bridge workflow gaps by enabling AI models to interpret and generate structured visual designs.

Open in AIssential →

Editorial summary, takeaway, and curation by AIssential. Original article published by Lenny's Newsletter.