Un editor de sitios web con IA debe hacer comprensible un cambio solicitado en la tienda antes de publicarlo. Runner AI trabaja a partir del proyecto de tienda actual, un brief concreto, imágenes de referencia opcionales y el elemento que selecciones. Devuelve cambios en los archivos fuente y vistas previas adaptables que puedes inspeccionar, revisar y guardar de forma independiente a la publicación.
Facilita al editor de sitios web con IA un brief de tienda acotado
Empieza por la página y la acción del cliente que deben cambiar. Indica el problema actual, el resultado visible que buscas y las partes de la tienda que deben permanecer estables. Una solicitud útil podría pedir a Runner AI que facilite el descubrimiento de una colección desde la página de inicio, pero que conserve la navegación, los datos de producto, el recorrido hasta el carrito y el lenguaje de marca existentes. Añade los estados de dispositivo y el recorrido de clics que quieres revisar en lugar de pedir una mejora imprecisa.
Entre los datos de entrada pueden estar los archivos actuales de la tienda, datos verificados del catálogo, textos aprobados, reglas de marca, una imagen de referencia y la ruta o sección incluidas en el alcance. Una imagen de referencia sirve como prueba de la apariencia, no como sustituto de la realidad del producto. Runner sigue necesitando productos, precios, reglas de inventario, políticas, destinos y límites de responsabilidad precisos cuando afecten al resultado. Si una imagen de origen o un ejemplo pertenece a otra persona, úsalo únicamente con los derechos y permisos necesarios para tu proyecto.
Mantén un único resultado coherente por solicitud. Si el primer resultado no cumple el objetivo, señala la sección exacta, explica el estado esperado y aporta una referencia más clara si es necesario. Así se crea un historial de revisión para un cambio concreto en lugar de regenerar repetidamente un sitio completo. Si el proyecto parte de una URL pública autorizada y no de una sección de tienda existente, la clonación de sitios web con IA explica el flujo independiente que va de la captura al código y sus límites de derechos.
Selecciona un elemento de la tienda y conserva su contexto de código
El Modo Diseño de Runner AI sirve para realizar cambios visuales concretos en la versión actual de la tienda que esté lista. En un equipo de escritorio, puedes abrir la tienda, entrar en Modo Diseño y seleccionar un elemento visible. El elemento seleccionado y el contexto de código que lo rodea se pueden enviar junto con una instrucción de Ask Runner AI, lo que acota la solicitud al componente que has elegido. Resulta útil cuando «cambia este encabezado» o «sustituye esta imagen» es más claro que describir su ubicación de memoria.
Los controles directos admiten determinados cambios de espacio, imagen y texto, además de la eliminación de elementos. El panel de imágenes puede mostrar opciones para subir contenido o generarlo con IA en elementos multimedia compatibles. Los controles de texto permiten ajustar propiedades como el tamaño, el grosor, la familia tipográfica, el color, la opacidad y la alineación. Deshacer y rehacer se aplican al historial actual del Modo Diseño que todavía no se haya guardado. Como una solicitud a la IA restablece la selección y el historial de ediciones directas sin guardar cuando comienza a procesarse, guarda las ediciones directas pendientes antes de pasar de los controles directos a Ask Runner AI.
La disponibilidad depende del estado del proyecto. El Modo Diseño puede no estar disponible si la última versión de la tienda no está lista, se está previsualizando una versión anterior, hay otra solicitud en curso, la función no está habilitada para el espacio de trabajo o no se utiliza un diseño de escritorio. El chat normal de Runner sigue siendo la vía adecuada para trabajar en varias páginas, añadir un comportamiento nuevo o crear funciones más amplias. El editor no debe presentarse como un control universal que evita la preparación del proyecto o las restricciones de acceso a funciones.
Revisa los cambios en archivos fuente y las vistas previas adaptables
Al guardar una edición visual, el cambio pendiente se escribe en el proyecto y puede registrarse una nueva instantánea de versión cuando el flujo actual lo admita. La vista previa se vuelve a cargar para que puedas comprobar otra vez el resultado visible. Revisa la página en diseños de PC, tableta y teléfono, y sigue la acción del cliente indicada en el brief. Una sección que se ve bien con un ancho aún puede cortar texto, ocultar un control, romper una ruta o colocar una acción de producto en una secuencia incómoda con otro ancho.
Runner también ofrece un editor de código condicional para inspeccionar los archivos de la tienda que hay detrás de la vista previa. Su vista de Git separa los archivos guardados, las diferencias, la preparación, los commits y los pushes. Esta separación es importante: un archivo guardado no se incluye automáticamente en un commit, un commit no se envía automáticamente y ninguna de esas acciones publica la tienda. Revisa las diferencias previstas en los archivos y evita agrupar cambios sin relación solo porque estén en el mismo espacio de trabajo.
Usa la vista previa adaptable como prueba del estado actual del proyecto, no como demostración de todos los sistemas conectados. Verifica los datos reales de producto, los enlaces, la búsqueda, el funcionamiento del carrito, la responsabilidad sobre el checkout, la analítica, la accesibilidad y las rutas públicas en la fuente correspondiente. Si el cambio forma parte de una revisión más amplia de la navegación, la jerarquía de páginas y el contenido, el rediseño de un sitio ecommerce explica cómo mantener el rediseño vinculado a pruebas de la tienda actual en lugar de realizar una actualización visual genérica.
Mantén separados el guardado, la revisión de versiones y la publicación
Un editor de sitios web con IA es más seguro cuando cada paso importante sigue siendo explícito. En el Modo Diseño, los cambios directos se pueden revisar con las opciones de deshacer y rehacer antes de guardar. Después de guardar, la vista previa normal de la tienda muestra el resultado actual. El historial de versiones, cuando está disponible para el proyecto, proporciona otra forma de inspeccionar o restaurar trabajos anteriores en la tienda sin considerar cada propuesta guardada como la respuesta pública definitiva.
La publicación es una decisión independiente. Antes de publicar, compara el resultado con el brief original y verifica que la sección seleccionada siga funcionando con el catálogo, la página que la rodea, los diseños para distintos dispositivos y el recorrido del cliente. Contrasta cualquier texto factual con el sistema responsable de esos datos. Una descripción generada no confirma el inventario, una vista previa no confirma la disponibilidad de los pagos y que un archivo se escriba correctamente no confirma que todas las rutas o integraciones funcionen bien.
Este límite de revisión es una distinción útil de Runner AI para los equipos de comercio. El editor trabaja dentro del proyecto de tienda y puede conectar un elemento seleccionado con su contexto de origen, pero la persona responsable aún puede inspeccionar qué ha cambiado y decidir si el resultado está listo. El resultado no es solo una maqueta aplanada o una mutación visual sin explicación. Es un cambio editable del proyecto, con archivos y vistas previas visibles que respaldan un proceso de aprobación deliberado.
Preguntas frecuentes sobre el editor de sitios web con IA
¿Qué información puedo facilitar a Runner AI para editar un sitio web?
Facilita a Runner AI el proyecto de tienda actual, la página o el elemento incluido, la acción del cliente que quieres mejorar, datos verificados del catálogo o el contenido y los límites que debe respetar. Puedes añadir una imagen de referencia aprobada cuando la apariencia sea importante. En el Modo Diseño, seleccionar un elemento también permite adjuntarlo con el contexto de código que lo rodea a una solicitud concreta de Ask Runner AI.
¿Puedo editar una tienda sin cambiar el código manualmente?
El Modo Diseño ofrece controles directos para determinados cambios de espacio, imagen y texto, además de la eliminación de elementos, así como un campo de Ask Runner AI para solicitudes sobre el elemento seleccionado. Los cambios más amplios se pueden solicitar en el chat normal. Las personas que necesiten inspeccionar o realizar una edición concreta de un archivo siguen teniendo disponible un editor de código condicional, pero no es necesario para todos los ajustes visuales.
¿Guardar una edición la publica inmediatamente?
No. Al guardar se actualiza el espacio de trabajo del proyecto y se vuelve a cargar la vista previa actual. El commit, el push y la publicación siguen siendo acciones independientes con sus propios permisos y comprobaciones. Revisa la página afectada en PC, tableta y teléfono, inspecciona los cambios de archivo relevantes y verifica el recorrido del cliente antes de decidir si publicas la tienda.
¿En qué se diferencia de un generador genérico de sitios web con IA?
Un generador genérico suele partir de unas instrucciones vacías y dar prioridad al primer sitio completo. El flujo de edición de Runner AI puede empezar con el proyecto de comercio actual, un elemento de tienda seleccionado, el contexto de origen que lo rodea, imágenes de referencia y datos verificados de la tienda. El resultado revisable incluye archivos modificados y vistas previas adaptables, de modo que se puede comprobar una revisión concreta sin fingir que generar, guardar y publicar son el mismo hecho.
Edita una tienda actual con un resultado revisable
Aporta tu tienda actual, la página exacta o el elemento seleccionado, los datos verificados del catálogo y la marca, una imagen de referencia opcional y la acción del cliente que debe permanecer intacta. Pide a Runner AI los archivos fuente modificados y vistas previas para PC, tableta y teléfono, de modo que puedas inspeccionar el resultado antes de decidir si lo publicas.
Abre el flujo del editor de sitios web con IA en Runner AI