The Visual Development Revolution: How Etch is Reimagining WordPress Website Creation

Publius May 4, 2025

2,151 Comments

EtchWP.com

By Publius
May 4, 2025

In a three-hour demonstration that showcased the future of WordPress development, Kevin Geary, founder of Digital Gravy, revealed how his team’s new tool Etch is redefining what’s possible in the WordPress ecosystem after just six months of development.

“We asked a completely different question,” Geary explained during the presentation. “What if we created a visual development environment specifically for professionals, while still making it accessible to beginners who want to learn proper web design?”

The demonstration revealed a sharp contrast to conventional WordPress page builders like Elementor, Divi, and others that have dominated the market for years. While those tools have primarily targeted non-technical users, Etch approaches website creation from a professional developer’s perspective, with clean code output and a unified workflow.

Breaking Down the Traditional Barriers

Traditional WordPress development has long been fragmented across multiple interfaces—what Geary calls “magic areas”—forcing developers to constantly switch contexts. Need to create a custom post type? That’s in one place. Want to add custom fields? That’s somewhere else. Managing media? Yet another location.

“Why can’t I create a custom post type when I’m building my page? Why can’t I create custom fields and assign them to that custom post type when I’m building my page?” Geary asked rhetorically. “Nobody has stopped to ask why we have to do that, why can’t we just do our work in one place, nice and efficient?”

Etch addresses this fragmentation by creating a unified environment where developers can perform all these tasks without leaving the builder. Though some features like custom post type creation are still in development, the roadmap clearly shows the vision of eliminating these context switches.

Two-Way Gutenberg Sync: A Technical Breakthrough

Perhaps the most impressive technical achievement demonstrated was Etch’s two-way synchronization with the WordPress block editor (Gutenberg). Changes made in Etch are automatically authored as native WordPress blocks, while edits made in Gutenberg reflect back in Etch.

“This was one of the initial promises that we made that a lot of people said probably is not even possible,” Geary noted. “Not only is it possible, it’s happening before your very eyes in six months.”

The significance can’t be overstated: client-friendly content editing in Gutenberg combined with developer-focused design control in Etch creates a workflow that previously required complex custom block development or compromising on either the developer or client experience.

Components, Variations, and Conditional Logic

Etch introduces a component system that allows developers to create reusable elements with variations controlled by properties. Unlike other systems that use “snapshot” variations, Etch employs conditional logic to render different versions of components based on property values.

During the demonstration, Geary created an “intro” component with variations for centered/non-centered layouts and optional elements like call-to-action buttons—all controlled through simple boolean properties. The component maintained global synchronization of structure and styling while allowing instance-specific content.

“You can literally whatever you continue to dream up, what do I want the flexibility of this component to be? Let me just go add that in real quick and I move on with my life,” Geary explained.

The conditional logic system extends beyond components to dynamic content. In one example, Geary demonstrated a star rating system that dynamically renders the appropriate number of stars based on a custom field value—all without writing JavaScript.

Clean Code Output and Performance Focus

Throughout the presentation, Geary emphasized Etch’s commitment to clean, efficient code output. The demonstration showed how Etch generates only what’s explicitly requested, without unnecessary wrapper divs or proprietary markup.

“There is nothing added that I did not ask to be there,” Geary noted while inspecting the generated HTML. “It’s like I wrote the code by hand.”

This focus on code quality extends to performance considerations, with Geary highlighting how quickly the editor loads and renders changes—even when working with complex components and dynamic data.

Education as a Core Value

Addressing concerns about the learning curve, Geary emphasized that Etch is designed for both professionals and beginners who want to learn proper web design principles.

“When you use a tool that respects and uses the language of web design, you in turn learn the language of web design,” he explained. “Then you are empowered to use any tool that speaks that same language.”

Geary announced plans to remake his popular “Page Building 101” course specifically for Etch, providing a free educational resource for newcomers. He compared learning web design in proprietary builders to “going to Poland to learn Spanish,” arguing that immersion in the actual language of web design through Etch will accelerate learning.

Looking Ahead

With the product currently in pre-launch until Friday, Geary outlined an ambitious roadmap for the next six months, leading to a September general release. Future developments include native creation of custom post types and fields, container query management, and an expanded component library.

The team is prioritizing features weekly based on user feedback, with Geary emphasizing that community input directly influences development priorities.

“We know all the things that are on the roadmap, but I can’t tell you when and where they go because we don’t even know,” he said. “We know on Monday what’s going to happen that week.”

For professionals frustrated with the limitations of existing WordPress tools, Etch represents a significant paradigm shift—one that prioritizes proper web design principles, clean code, and workflow efficiency over simplified interfaces that hide the underlying technology.

As one commenter on the livestream noted, “This is what happens when you properly fund and properly lead a project.”