App Canvas · Código abierto · Para agentes · v0.12.0

Toda tu UI. Un lienzo. Código real.

Name: App Canvas
Author: Tom Tang

Explora pantallas, estados y flujos interactivos reales en un lienzo ampliable, creado y mantenido con tu agente de programación.

Abrir demo ↗Añadir a tu repo →

Datos sintéticos · sin backend de app · sin cuenta · sin API key

App Canvas Cloud →

TL;DR

Ve juntas las pantallas completas, sus estados y los flujos implementados.
Mantén una sola implementación de UI. Tu agente crea fixtures, adapter y verificaciones de cobertura.
Prueba 77 estados y 44 flujos con datos sintéticos, sin cuenta ni API key.

Estados reales de StoolSense en el lienzo App Canvas — Demo real: 77 estados, 44 flujos y 121 entradas reproducibles. Incluye casos independientes; no son 121 recorridos E2E.

Explora, interactúa y reproduce

Aléjate para entender la app

Pantallas completas agrupadas por página, búsqueda, filtros y paneles plegables. Los enlaces de flujo llevan la cámara al destino.

Acércate para usar la UI real

Browse bloquea los controles para mover el lienzo. Selecciona una pantalla y pulsa Interact para usar el código original con datos desechables.

Pulsa Demo para explicar un recorrido

Reproduce éxito, fallo y recuperación en una sesión continua, con indicaciones, subtítulos, pausa, velocidad y línea temporal.

Grafo real de fallo de guardado, borrador conservado y reintento exitoso — Elige un flujo para ver pantallas completas y transiciones etiquetadas. Un enlace mueve la cámara al destino.

Reproducción real tras un fallo de guardado sin conexión, conservando el borrador — UI real de fallo y recuperación. La reproducción ejecuta acciones y comprobaciones; una conexión dibujada no es una prueba.

De un repo existente a un lienzo interactivo

Encarga la integración a un agente que pueda leer, editar y ejecutar comandos. No necesitas Storybook ni una lista previa de pantallas. Instalar el paquete no llena el lienzo por sí solo.

Añadir a tu repo →

App Canvas Cloud · lista de espera

¿Quieres un espacio alojado? Registra tu interés. Cloud aún no está disponible; la herramienta MIT y la demo pública ya funcionan.

Salir de la lista

Privacidad y telemetría

Eventos mínimos opcionales mediante Cloudflare a PostHog. No se reenvían contenidos, código, nombres, rutas, correo ni IP a PostHog. Puedes desactivarlos.

Privacidad y telemetría ↗

Alcance y límites

Web utiliza HTML/CSS reales y JavaScript original al interactuar. UIKit, SwiftUI y Android necesitan harnesses y evidencia del runtime original; una captura no es una app nativa interactiva.
La cobertura relaciona código revisado y casos, no descubre automáticamente toda condición posible. Las pruebas UI no validan backends de producción ni precisión clínica o de modelos.
Viewer: inglés por defecto y 11 idiomas. La demo pública es un frontend sintético fijo; las integraciones locales siguen tu código. No se ha medido el rendimiento en un iPad físico.

App Canvas en Safari de un iPhone físico — Captura de Safari en un iPhone físico. El artículo técnico explica cómo pasó de fallar a funcionar y los límites de las mediciones.

Artículo técnico de Safari

Captura de Safari en un iPhone físico. El artículo técnico explica cómo pasó de fallar a funcionar y los límites de las mediciones.

Artículo técnico de Safari →