1. Home
  2. Projects
  3. Editor Vivo
Editor Vivo · Studio tool

Tool for editing web pages with the mouse, without touching code

An editing layer that opens on top of any site under development: you click, move things, change text or images, and the change is carried into the real code with before-and-after screenshots.

I want something like this
Status
Internal use
Type
Own tool
Platform
Desktop (local browser)
Year
2026
Screenshot of Editor Vivo
The project in 30 seconds

What it solves and for whom

01

Problem

Requesting a visual change in writing—“move this up a bit,” “change that photo”—is slow and ambiguous, and often goes back and forth several times before it's right.

02

Solution

The site opens with an editing layer on top. Each save records exactly what changed, with optimized images and screenshots, and the coding assistant applies it to the real project.

03

Who it's for

Teams that tweak websites every day. Today it is the tool the studio itself uses to fine-tune its deliverables.

What it does

From click to code change

01

Select and act

Hover, click, and a bar appears to move, edit the text, delete, or replace the element's image.

Select and act
02

Edit text right on the page

You type over the text and see the result instantly, with undo, redo, and a counter of pending changes on the Save button.

Edit text right on the page
03

Saves the intent, not the code

Each save generates a package with the changes, optimized images, and before-and-after screenshots, ready to be applied to the site.

04

Safe by design

Works only on the user's own computer and rejects any save that does not come from its own page.

In numbers

What was built

Measured in tests
158 automated tests + 8 in a real browser

All passing at the close of development.

Measured in tests
6 of 6 unauthorized save attempts blocked

Attack test reproduced during the audit: none managed to write a file.

How it's made

Technology behind it

Technology
Node.jsTypeScriptPlaywrightsharp
Technical detail

Command-line application that sits in front of the site's local server, injects the editing layer, and saves a package with a validated manifest of the changes. The studio's coding assistant reads that package and applies the modifications.

Gallery

More screens of the product

Inspection on hover
Element editing bar
Changes ready to save
Your project

Need something like Editor Vivo?

Tell us the idea in two lines. We'll reply with scope, timeline and a first proposal.

Start a project Try the Concept Engine
Keep exploring

More projects