Prueba en Móvil
Usa el selector de viewport responsivo en el builder para una revisión rápida, luego publica y prueba en un dispositivo real para todo lo que involucre comportamiento exclusivo de móvil.
Hay dos niveles para las pruebas en móvil en Proyecta: la vista previa responsiva dentro del builder y las pruebas en un dispositivo real con una URL publicada.
Vista previa responsiva en el builder
Sección titulada «Vista previa responsiva en el builder»El panel de vista previa incluye un selector de viewport en la barra de dirección:
| Modo | Dimensiones |
|---|---|
| Desktop | Ancho completo de ventana |
| Tablet | 768 × 1024 |
| Mobile | 390 × 844 |
Cambia entre ellos mientras editas para detectar problemas de layout a tiempo. Es la forma más rápida de identificar bugs responsivos obvios (desbordamiento, grids rotos, botones que no se pueden tocar).
Ábrela en tu teléfono con un código QR
Sección titulada «Ábrela en tu teléfono con un código QR»La forma más rápida de llegar a un dispositivo real es la pestaña Mobile → Test del dashboard. Una vez que tu app está publicada, muestra un código QR — escanéalo con la cámara de tu teléfono para abrir la app en vivo al instante. También hay un botón Copy link si prefieres enviarte la URL. (Si aún no has publicado, la pestaña te pedirá que lo hagas primero — las pruebas en dispositivo necesitan una URL activa.)
Prueba en un dispositivo real
Sección titulada «Prueba en un dispositivo real»El selector de viewport solo simula dimensiones — no simula entrada táctil, latencia real, peculiaridades del navegador móvil ni comportamiento específico de la plataforma. Para todo lo que realmente te importa (interacciones táctiles, prompts de instalación, notificaciones push, cámara, GPS), prueba en un dispositivo real:
- Publica tu app en su subdominio
*.proyecta.live - Abre la URL en el navegador de tu teléfono
- Si agregaste soporte para PWA, elige Add to Home Screen y prueba la experiencia instalada
- Recorre los flujos que te interesen
Cosas que solo puedes detectar en un dispositivo real
Sección titulada «Cosas que solo puedes detectar en un dispositivo real»- Tamaño de los targets táctiles — los dedos son más grandes que el puntero del mouse
- Elementos fijos (sticky) — las unidades de viewport se comportan diferente con el chrome del navegador móvil
- Entrada en formularios — autocompletado, tipos de teclado, autocomplete
- Peculiaridades de iOS Safari — problemas con
100vh, scroll con rebote, posicionamiento fijo - Flujo de permisos para notificaciones push — solo funciona en un origen publicado sobre HTTPS en una pestaña de navegador de nivel superior; no se activará dentro del panel de vista previa del builder (incluso cuando la vista previa ya se sirve sobre HTTPS).
- Rendimiento en hardware real (más lento)
Consejos para las pruebas
Sección titulada «Consejos para las pruebas»- Usa las herramientas de desarrollo de tu teléfono. Safari en macOS puede conectarse a Safari móvil para depuración en vivo; Chrome puede conectarse a Chrome en Android.
- Prueba también en horizontal. La mayoría de los devs solo prueban en vertical y se pierden bugs en landscape.
- Prueba con el modo de bajo consumo activado. Las animaciones y los temporizadores se comportan diferente.
- Prueba en un iPhone real para push en PWA. Las notificaciones push en iOS solo funcionan desde una PWA instalada mediante Safari.