DEV Community: Om Rajguru

WebDNA: A structured interface for AI agents

Om Rajguru — Mon, 06 Apr 2026 13:01:37 +0000

When I watch an AI agent or a coding tool interact with a website today, the process feels inefficient. These models are essentially forced to squint at raw HTML and minified JavaScript bundles while attempting to reverse-engineer the original intent of the developer. They miss the relationship between components, they lose the nuances of brand colors, and they struggle to understand the shape of underlying APIs. I built WebDNA to solve this by creating a bridge between the way humans write code and the way machines need to consume it.

The core idea is a manifest that lives at a predictable location on your server. By integrating directly into the Next.js build process, WebDNA automatically scans your project and generates a blueprint of your site. It looks at your route tree, extracts design tokens from your Tailwind configuration, and maps out your component hierarchy. This happens without requiring any manual documentation from the developer. It turns the implicit knowledge stored in your codebase into an explicit, structured briefing for any AI that visits your site.

This system moves beyond existing solutions like sitemaps or basic text files. While those tools offer a list of URLs or high-level summaries, they do not explain the design system or the specific data requirements of a dynamic route. WebDNA provides that missing context. It allows a developer to define which parts of a site are private and which components serve specific roles, ensuring that when an AI tool accesses the site, it does so with a full understanding of the constraints and the brand guidelines.

Security and privacy are foundational to this standard. The manifest is a static JSON file that cannot execute code and is read-only by design. I have included features like element-level exclusion, where a simple attribute can hide specific sections of a page from the AI manifest. This ensures that developers remain in total control of what information is shared. It is about providing consent-based, structured access rather than leaving AI tools to scrape whatever they can find.

My goal with WebDNA is to make the web more accessible to the next generation of software tools. By making the architecture of a site discoverable, we reduce the friction and errors that occur when AI tries to navigate or modify web projects. It is a simple addition to a configuration file that provides a significant upgrade in how machines perceive and interact with the work we build. Information about the package and the specification is available on GitHub and through the official documentation.

Official documentation: webdna.omraj.guru

I built a Claude Skill to automate brand-consistent social graphics (HTML to PNG) The Backstory

Om Rajguru — Sat, 04 Apr 2026 17:45:15 +0000

Automating Brand-Consistent Social Graphics with a Claude Skill

I’ve been using a custom Gemini setup to produce Instagram content for IBBE, a company I work with. While the workflow worked, it was fragile. I found myself repeating brand constraints, hex codes, and styling rules in every new session.

I wanted a way to formalize this process, something reusable, brand-aware, and easily installable. So, I built a Claude Skill that handles the heavy lifting of design consistency through a structured memory system.

How it Works

The skill transforms Claude from a general assistant into a specialized brand designer through three main phases:

The Onboarding Interview: The first time you request a design, Claude conducts a brand interview. It collects your color palette, typography preferences, design personality, and specific brand restrictions.
Persistent Memory: Once the profile is generated, you save it to memory. Every future session picks up exactly where you left off, ensuring your brand identity isn't "hallucinated" or lost between chats.
HTML-to-Image Pipeline: Claude generates a self-contained HTML file. This isn't just a mock-up; it includes a staging environment and an export button that uses html2canvas to download a high-resolution PNG directly from your browser.

The Aesthetic

The design language is opinionated and "dev-friendly." Every asset generated follows a consistent visual logic:

Structure: Inset cards with thick borders and hard offset shadows (Neo-brutalism style).
Textures: Dot grid backgrounds and rotated pill tags.
Dynamics: Carousel slides automatically alternate rotation directions, and visual metaphors are selected based on the slide's specific content.

What it Generates

Instagram Posts & Carousel Slides
OG Images for blog posts
Featured Images
General Visual Assets

Why HTML?

Generating graphics as HTML instead of raw images via DALL-E or Midjourney gives us pixel-perfect control over text. No more AI "gibberish" in your graphics. Since it's code, you can tweak the hex codes or layout in seconds before exporting.

Check out the repo here:

👉 https://github.com/omrajguru05/brand-social-design

I'd love to hear how you guys are using LLMs to automate your design workflows. Any suggestions for the memory system? Let's discuss in the comments!

Is Your Project Ready to Launch? I Built a Skill to Find Out

Om Rajguru — Wed, 01 Apr 2026 11:50:30 +0000

Shipping fast is great. Shipping ready is better. Here's how I stopped guessing and started knowing.

I used to think I had a solid launch checklist. It lived in a doc somewhere; it had checkboxes, and I told myself I would actually use it. Spoiler: I did not always use it. Features would go missing, a monitoring alert, or a README that said "TODO," or a rollback plan that existed only in my head. Every time, the feeling was the same. That quiet dread of realizing something got missed after it was already live.

So I built something to fix that. "Launch Readiness" is a skill I created to make pre-launch checks feel less like homework and more like a conversation. Instead of digging through a doc I inevitably forgot to update, I can just ask. It walks through the things that actually matter before a release: documentation, monitoring, rollback strategy, stakeholder sign-off, and more. It does not let me skip ahead. It asks, it listens, and it flags what is missing.

What I love most about it is that it changed how my team thinks about launches. We stopped treating readiness as a formality and started treating it as a real conversation. The skill is not a gatekeeper. It is more like a thoughtful colleague who asks the right questions at the right time and genuinely wants the launch to go well.

The best part is that you can try it yourself right now. Setup is straightforward, and within a few minutes you will have a launch process that actually holds up under pressure.

Launching something you built is exciting. I want that excitement to last past day one. This is my small contribution to making that happen.

omrajguru05 / launch-readiness

A Claude skill that audits your app before launch and gives you a readiness score, ranked issues, exact fixes, and copy-paste prompts. Install in one command. Updates at omrajguru.com

App Launch Readiness Skill for Claude

A Claude skill that audits your web app or SaaS product before launch. Give it your repo, your live URL, or both, and it returns a scored readiness report with every problem ranked by severity, exact fix instructions for each one, and copy-paste Claude prompts so you can resolve issues immediately without writing a single prompt yourself.

I built this because pre-launch checklists are either too generic to act on or scattered across a dozen blog posts. This skill pulls everything into one structured audit that runs inside Claude, reads your actual code or live URL, and tells you precisely what is broken and how to fix it.

I update this skill as new patterns, security issues, and launch gotchas emerge. All updates are published at omrajguru.com.

Installation

There are three ways to install depending on how you use Claude.

Option A: One-line

…

View on GitHub

I built a Formspree alternative because flat pricing is stupid

Om Rajguru — Sun, 22 Mar 2026 01:20:08 +0000

Aldform public beta: aldform.com

Formspree: $16/month flat. 10 or 10k submissions — same price.

Aldform: $1.20 per 1k submissions (₹100). 100 free/month.

Your HTML/CSS. We handle storage, email, API.

Alpha fixes shipped:

Server-side auth only, API keys
File uploads to S3 (10MB, images/PDF)
Polar billing, SES emails, dashboard

aldform.com/release-notes

Try it & And please let me know!!