Show HN: Grapes Studio – HTML-first WYSIWYG website editor with LLM assistant | Hacker News Reader

Show HN: Grapes Studio – HTML-first WYSIWYG website editor with LLM assistant

grapesjs.com

22 pointsgriffinkelly8 comments

I’ve been working with @artf (creator of GrapesJS) on Grapes Studio, an HTML-first editor with an LLM assistant on top of GrapesJS.

We’re approaching this differently than the new wave of AI app/site builders which are typically generating full React applications, which we think is overkill for simple websites. From talking to people using these tools, we’ve seen a lot of issues with build errors and overly complicated pages.

With our approach you can:

- Edit visually via the no-code editor (drag/drop) or ask the LLM to make scoped changes (like “add a section” or “add a new page”).

- Build with straight HTML/CSS

- Ask AI to import your current site and start building from there instead of total rebuild.

We think there’s a lot of benefit using drag and drop editor functionality with LLMs, or you can jump straight into the code in the editor if you choose.

- Do you see value in this hybrid model (AI + visual + code editing)?

- What are the biggest blockers you’ve run into with AI-only builders?

Let us know what you think.

Open articleView on HN

One thing I've noticed bridging the gap between technical LLM users like myself, and less technical users is they don't know the right questions to ask so to speak. I'm not sure how many wordpress users are going to jump in and ask an LLM to "adjust my header to make it sticky and reduce the background opacity on the hero image by 5%". Do you find it a challenge getting users the right directional support to ask the right questions?

Yeah totally, we see the same thing. Most people don't phrase things the way an engineer would but funny enough, LLMs are often better than us at interpreting non technical instructions. What makes a big difference is giving the model context about what the user is actually looking at (current page, selected section, etc.), so it doesn’t have to guess. That way has a decent chance of doing the right thing.

I think that's the best part of what we've built--while you still can use an LLM to do that. You can also just use the drag and drop editor to figure it out and make that change without spending AI credits to do so. You also can just edit the code directly and make the change too in our editor.

Awesome. I think this is exactly the right approach for so many use cases. HTML is perfect for so many things.

I’ve used grape in the past and it is really really useful so I am excited to see this in action. It’s interesting to see the transition from the drag and drop era to the semantic vibes era. So does this essentially let me bridge the gap? Vibe code but fix the code when the LLM predictable craps the bed?

Yeah, that's the idea here. You can vibe code, and then the usual places where folks get stuck, you can jump in and use the drag and drop.

Looking at the site there are comparisons to features between WordPress and other non-ai site builders. How does this compare to things like Lovable?

To build off of what artf said, the biggest thing against WP is really pricing. From speaking to folks, they get nickled and dimed for plugins. They also cant migrate to less expensive options.

I think we've taken the best parts of what folks like Lovable have created (one click deployment and chat to do anything), but built the drag and drop functionality into it-- which is something people have come to depend on. From what I've seen, the uptake of AI into the non-ai site builders has been very slow because they all have proprietary JSON formats.

Tools like Lovable are great for spinning up apps, but our focus is different: we’re mainly aiming at websites. Instead of generating a full React app, the editor outputs HTML/CSS and gives you both visual editing and AI assistance, so you’re not stuck relying only on prompts for small changes.

Reply on news.ycombinator.com