WebReform AI

Inspiration

The web has become incredibly powerful, but most websites still expect humans to adapt to their interfaces. Every site has its own navigation, layout, sidebars, recommendations, ads, and information hierarchy. We wondered: what if the interface could adapt to what the user is actually trying to accomplish?

That led to WebReform AI. Instead of building another AI that simply tells you what to click, we wanted to build an interface layer where an agent can understand a webpage and safely reshape it around the user's intent.

WebMCP made this idea especially interesting because it gives agents a structured way to interact with real web capabilities instead of relying entirely on brittle browser automation.

What it does

WebReform AI lets users express what they want to accomplish on a webpage in natural language.

An agent can use WebMCP tools to understand the current page and perform actions such as:

• Focusing on the most relevant content
• Hiding distracting elements
• Reorganizing information
• Creating a task-focused view
• Highlighting useful content
• Restoring the original interface

The important part is that these operations happen on the real webpage. WebReform AI analyzes the page into a semantic representation, generates a structured transformation plan, validates it, and applies the changes through a deterministic transformation engine.

Every transformation is designed to be reversible, so the user remains in control.

How we built it

WebReform AI is built as a Chrome extension with a lightweight, dependency-free architecture.

The main pipeline is:

User Intent → AI Planner → Semantic PageModel → Transformation DSL → Validator → Transformation Executor → Real DOM

The extension analyzes webpages into a bounded semantic PageModel rather than sending an entire raw DOM to the model. The planner produces structured transformation operations instead of arbitrary JavaScript.

We integrated WebMCP through document.modelContext.registerTool() and exposed structured tools for page analysis, querying, focusing, hiding, reorganizing, creating focused views, and restoring the original page.

We also built a deterministic fallback planner so the core transformation system can still be demonstrated without depending entirely on an external AI model.

Challenges we ran into

The biggest challenge was making the concept work across different websites without building a separate integration for every website.

Modern websites have constantly changing DOM structures, dynamically loaded content, nested layouts, and very different ways of representing similar information. A transformation that works perfectly on one page can easily break another.

We therefore had to build around semantic page understanding rather than relying on fixed website-specific selectors.

Another major challenge was making AI-generated actions safe. We didn't want the model generating arbitrary JavaScript and directly modifying the page. Instead, we created a strict transformation DSL with validation and a controlled executor.

Getting WebMCP, the extension messaging layer, the semantic analyzer, the AI planner, and the real DOM to work together reliably was another significant part of the project.

Accomplishments that we're proud of

We're proud that WebReform AI goes beyond simply describing webpages or automating clicks.

The agent can interact with structured WebMCP capabilities that cause actual, visible changes to the webpage.

We built a complete pipeline from natural-language intent to semantic page understanding, structured planning, validation, real DOM transformation, and restoration.

We're also particularly proud of the reversible transformation system. The user doesn't lose control of their original interface—changes can be rolled back and the original page can be restored.

Most importantly, we built the system to be generic. The goal isn't to make one perfect GitHub demo; it's to create a reusable interface layer that can adapt different kinds of websites around different human goals.

What we learned

We learned that making an AI agent useful on the web isn't only about giving it more powerful actions. The representation of the webpage matters just as much.

Giving the agent a bounded semantic representation makes it easier to reason about the page while also reducing the amount of raw information that needs to be processed.

We also learned that safety and reversibility are essential when an agent is allowed to modify a user's interface. A powerful agent should not mean an uncontrollable interface.

Most importantly, WebMCP changed how we think about agent-to-web interaction. Instead of treating websites as something an agent has to mechanically operate, structured web capabilities can give agents a much cleaner way to understand and interact with them.

What's next for WebReform AI

The hackathon version is only the beginning.

Next, we want to make WebReform AI substantially more robust across complex websites and dynamic applications, improve its semantic understanding, and expand the types of transformations agents can safely perform.

We also want to explore deeper agent-driven workflows where the interface continuously adapts as the user's goal changes, while still keeping the human in control.

Longer term, the vision is bigger than a browser extension: WebReform AI could become an adaptive interface layer for the web, giving websites a way to expose structured capabilities to agents while allowing those agents to reshape the experience around individual human intent.

Built With

• chrome-extensions-(manifest-v3)
• codex
• css
• github
• html
• javascript
• ollama