1
Abre el preview y selecciona un elemento
Haz clic en el texto, botón, card o imagen que necesita ajuste para localizar el componente correcto.
Guía Prisma
Cómo editar una app con inspector visual
Usa el preview como superficie de edición para corregir copy, layout, imágenes, estados y detalles visuales sin perder contexto.
Respuesta directa
Para editar una app generada con IA, selecciona el elemento en preview, ajusta propiedades visuales o textos, revisa el resultado responsivo y usa nuevas instrucciones para cambios estructurales mayores.
9 minIntermedio
Prisma Studio / Modo Designer
button
Comprar agora
button
DesignConteúdoAvançado
NormalHoverFoco
Cor
Espaçamento
12pxmargin
Paso a paso del inspector
O mockup animado mostra seleção de componente, ajustes de texto, estilo e revisão rápida entre desktop e mobile.
Inspector PanelProps aplicadas
Preview remotobutton.primary
CRM StarterDashboard
button · primary
Pipeline comercial
Acompanhe leads, visitas e propostas em uma tela.
Inspector Visual
button#cta-primary
Ações rápidas
Texto
Começar agora
Classe
btn-primary rounded-full
Prop href
/checkout
Cores rápidas
2
Haz ajustes pequeños directamente
Cambia copy, estados visuales, clases, espaciados o imágenes cuando el cambio sea puntual.
3
Usa el chat para cambios mayores
Cuando la alteración involucre layout, datos o comportamiento, describe la intención para que la IA refactorice con más contexto.
4
Revisa responsividad y consistencia
Verifica que el ajuste no rompió mobile, contraste, jerarquía o alineación entre secciones.
Fundamentos, contexto y decisión
Objetivo operativo
Para editar una app generada con IA, selecciona el elemento en preview, ajusta propiedades visuales o textos, revisa el resultado responsivo y usa nuevas instrucciones para cambios estructurales mayores.
Regla de decisión
Antes de abrir AbstractOS, reúne objetivo de la app, audiencia, pantallas esenciales, datos, integraciones, restricciones técnicas y criterio de publicación. Mejores entradas reducen la posibilidad de que la IA genere algo pulido pero desconectado de la operación real. Configura el flujo con una hipótesis simple: prioriza el menor flujo funcional que pruebe valor sin comprometer datos, seguridad ni evolución futura. Evita empezar por detalles visuales o automatizaciones antes de validar la intención principal.
Criterio de calidad
Revisa alcance, experiencia, datos, integraciones, historial de versión y camino de publicación. Si alguno de estos puntos está débil, trata el resultado como borrador y ejecuta otra iteración antes de publicar o escalar. Finaliza registrando briefing, versión, branch, integración, checklist de QA y destino de deploy. Ese registro transforma el aprendizaje en memoria operativa y facilita auditoría, colaboración y medición después.
Checklist de aplicación práctica
- Abre el preview y selecciona un elemento
- Haz ajustes pequeños directamente
- Usa el chat para cambios mayores
- Revisa responsividad y consistencia
- Revisar resultado antes de escalar.
- Registrar responsable y próxima acción.
- Validar la entrada antes de pedir otra generación de IA.
- Comparar el resultado con la intención original.
- Registrar decisión, responsable y próxima revisión.
Métricas y señales de calidad
- flujo principal probado de punta a punta
- datos y permisos mapeados
- versión recuperable antes de publicar
- Tiempo hasta preview usable
- Publicación o integración exitosa
- Errores encontrados antes de producción
- Iteraciones necesarias después de revisión
Guía de campo del módulo
Cómo editar una app con inspector visual
Usa este módulo cuando el flujo necesita convertirse en una rutina operativa, no solo en una acción aislada. El objetivo es salir con un artefacto útil, una decisión clara y una próxima acción registrada.
Abre el preview y selecciona un elemento
Antes de abrir AbstractOS, reúne objetivo de la app, audiencia, pantallas esenciales, datos, integraciones, restricciones técnicas y criterio de publicación. Mejores entradas reducen la posibilidad de que la IA genere algo pulido pero desconectado de la operación real.
Haz ajustes pequeños directamente
Configura el flujo con una hipótesis simple: prioriza el menor flujo funcional que pruebe valor sin comprometer datos, seguridad ni evolución futura. Evita empezar por detalles visuales o automatizaciones antes de validar la intención principal.
Usa el chat para cambios mayores
Revisa alcance, experiencia, datos, integraciones, historial de versión y camino de publicación. Si alguno de estos puntos está débil, trata el resultado como borrador y ejecuta otra iteración antes de publicar o escalar.
Revisa responsividad y consistencia
Finaliza registrando briefing, versión, branch, integración, checklist de QA y destino de deploy. Ese registro transforma el aprendizaje en memoria operativa y facilita auditoría, colaboración y medición después.
Modelo operativo recomendado
- 1Define la intención principal del flujo en una frase: quién será impactado, qué problema se resolverá y qué acción debe ocurrir después.
- 2Ejecuta primero en una muestra pequeña. En AbstractOS, valida el flujo, revisa las sugerencias de IA y ajusta campos, tono, reglas o integraciones antes de escalar.
- 3Compara el resultado con las señales esperadas: flujo principal probado de punta a punta; datos y permisos mapeados; versión recuperable antes de publicar. Estas señales indican si el módulo está listo para uso real o si todavía es un borrador.
- 4Documenta la decisión tomada, el responsable y la próxima revisión. Esto evita retrabajo cuando otro miembro del equipo continúe el proceso.
- 5Después de validar, conecta el resultado con publicación, exportación, integración o una guía avanzada para preparar escala.
Ejemplo práctico
Después de generar un dashboard, puedes seleccionar un card de métrica, cambiar el rótulo, ajustar el destaque visual y pedir a la IA que aplique el mismo patrón a los otros cards.
Errores comunes
- Editar demasiados detalles antes de validar el flujo principal.
- Corregir el visual en desktop y olvidar mobile.
- Pedir una refactorización grande como si fuera un ajuste puntual.
Cómo hacerlo en AbstractOS
En Prisma Studio, combina preview, inspector, chat y editor para hacer ajustes finos sin salir del flujo de creación de la app.
Abrir editor visualInspector ReviewReview aprovado
Layers
main
section.hero
button.cta
form.lead
Pipeline
Começar agora
Contraste
AA 5.8
Overflow
0
Tap area
44px
Diff
salvo
Sigue aprendiendo
Cómo crear una app con IA
Convierte una idea en una primera versión navegable, con interfaz, lógica, datos y ajustes visuales en ciclos rápidos.
Cómo crear sitio con IA
Sal de una oferta o idea de página hacia una landing navegable, editable y lista para validar tráfico y conversión.
Cómo publicar una app creada con IA
Prepara una versión compartible de tu app para validación, revisión del equipo, campaña o primeras conversaciones con usuarios.
¿El inspector reemplaza el código?
No. Acelera ajustes visuales y puntuales. Para cambios profundos, el chat y el editor de código siguen siendo importantes.
¿Puedo cambiar imágenes con el inspector?
Sí, cuando el componente expone ese tipo de ajuste. Para cambios estructurales, pide la alteración en el chat.
¿Cómo evito romper el diseño?
Haz una alteración por vez, revisa mobile y usa patrones consistentes entre componentes similares.