Aplicación de escritorio
Diseño de app de tablero de sprint
El diseño de app Northwind Sprint Board reúne el estado del sprint, la asignación de tickets, las estimaciones y los bloqueos en un espacio de trabajo de escritorio fácil de revisar de un vistazo.
Casos de uso de una app de tablero de sprint
- Planificación de sprintsRevisa el trabajo por estado, estimación, responsable y prioridad.
- Operaciones de ingenieríaPon de manifiesto los tickets activos, los bugs, las tareas de mantenimiento y las dependencias de revisión.
- Revisiones de carga de trabajo del equipoCompara los puntos aportados junto al tablero del sprint actual.
Aspectos destacados del diseño del espacio de trabajo de sprint
- Flujo de trabajo en cuatro etapasBacklog, en curso, revisión y finalizado comparten una sola vista.
- Resumen de Sprint PulseEl avance completado, los colaboradores y los bloqueos aparecen junto al trabajo activo.
- Contexto a nivel de ticketCada tarjeta combina tipo, título, responsable, puntos e ID.
- Bloqueo visibleNW-205 sigue vinculado a su dependencia de revisión de copy.
El tablero de sprint, panel por panel
1 / 3
Tablero de sprint Northwind
Este ejemplo oficial de OpenDesign presenta al Northwind Growth Squad durante el Sprint 38, Day 6 of 10. El espacio de trabajo de escritorio coloca el tablero en el centro y mantiene visible a la derecha una barra lateral de Sprint Pulse, de modo que el trabajo operativo y el contexto resumido puedan leerse juntos.
La barra superior establece el alcance antes de que empiecen las tarjetas: “NORTHWIND / GROWTH SQUAD” se combina con “Sprint 38 · Day 6 of 10.” Search tickets, Filter y New aparecen en el extremo opuesto. Este orden favorece el paso rápido de identificar el sprint actual a localizar o añadir trabajo, y reserva el área principal para comparar tareas.
Una franja de filtros separa los controles del contenido de las tareas. Las iniciales de los miembros, las etiquetas Active sprint, Bug, Feature y Research, y los controles Group · Status y Sort · Priority hacen explícita la organización de ejemplo del tablero. La contrapartida es la densidad: quedan visibles muchas opciones de control, pero el usuario puede entender la agrupación prevista del tablero sin abrir otra pantalla.
Revisión de carga de trabajo y bloqueos
El diseño es adecuado para un equipo que revisa qué está esperando, avanzando, en revisión o terminado. Las tarjetas repiten una estructura: una banda de color con el tipo de trabajo, un título de tarea, un avatar del responsable, una estimación en puntos y un ID de incidencia como NW-241. Esa repetición permite comparar trabajos distintos sin perder la identidad del ticket.
Los datos de ejemplo también muestran distintos tipos de trabajo en una misma cola. “Add empty-state illustration to onboarding step 2” aparece junto a “Interview 5 new Enterprise admins about 2FA enforcement”, mientras que “CSV export drops emoji from project names” hace visible un defecto como clase aparte. Las bandas de tipo distinguen Feature, Design, Research, Chore y Bug, pero la anatomía común de las tarjetas mantiene comparables esas categorías.
Esta disposición favorece la revisión de un vistazo frente a la discusión detallada de cada ticket. Un equipo puede ver que el elemento de investigación tiene 5 pts y que la incidencia de exportación CSV tiene 1 pt, pero el tablero no explica las reglas de estimación ni los criterios de aceptación. En una aplicación de producción, esos detalles requerirían una vista de tarea más profunda; quedan fuera del diseño visible.
Primero el estado
La posición en la columna comunica el estado del flujo de trabajo antes de que el lector examine los metadatos de cada ticket.
Estimación y responsable
Las etiquetas de puntos y las iniciales hacen visibles la responsabilidad y el esfuerzo relativo en cada tarjeta.
Bloqueo accionable
La barra lateral nombra NW-205, su dependencia de revisión de copy y dos acciones siguientes propuestas.
Del tablero al Sprint Pulse
El espacio de trabajo se lee de izquierda a derecha por Backlog, In progress, In review y Done. Sus insignias muestran 5, 4, 3 y 6. Las tres primeras coinciden con el número de tarjetas visibles, pero Done contiene solo cuatro tarjetas pese a su insignia de 6. La secuencia de izquierda a derecha sigue distinguiendo las etapas del flujo de trabajo; la discrepancia en el recuento de ejemplo debería resolverse antes de usar el tablero como datos operativos.
Las barras de progreso aparecen solo en varias tarjetas de In progress, entre ellas TOTP enrollment UI in member settings, Recovery codes, Fix focus-trap regression in command bar y 2FA challenge step. Su presencia separa visualmente el progreso activo de las tarjetas a las que simplemente se asigna un estado. Como el elemento visual no define qué mide la barra, debe leerse como una señal ilustrativa de progreso y no como una métrica de finalización verificada.
La barra lateral cambia la escala de lectura de los tickets a un resumen de sprint de ejemplo. Muestra Completed 22 of 38 pts y enumera a Devon Park con 9 pts, a Mira Reddy y Priya Banerjee con 5 pts cada una, y a Caleb Renner con 3 pts. Esos valores de colaboradores suman 22, pero las cuatro tarjetas Done visibles suman solo 11 puntos. La fuente no explica esa diferencia, por lo que la barra lateral y el tablero no deben tratarse como un informe de rendimiento conciliado.
El último bloque de la barra lateral hace explícita la relación entre estado y dependencia. “1 ticket needs unblock” identifica NW-205, descrito como en espera de una revisión de copy de Brand, con “Mention @Sasha or move it back to backlog” como guía visible de seguimiento. Mantenerlo junto al tablero hace más difícil pasar por alto la dependencia, aunque la barra lateral ocupa un espacio persistente que de otro modo podría ensanchar el área de tareas.
| Estado | Insignia mostrada | Tarjetas visibles | Función de lectura |
|---|---|---|---|
| Backlog | 5 | 5 | Trabajo a la espera de avanzar activamente |
| In Progress | 4 | 4 | Trabajo en etapa activa con barras de progreso ilustrativas |
| In Review | 3 | 3 | Trabajo a la espera de revisión o decisión |
| Done | 6 | 4 | Tarjetas de ejemplo completadas; la insignia no coincide con el recuento visible |
Límite del diseño visible
Este artefacto es un ejemplo de app de escritorio solo de diseño, con nombres, cifras, contenidos de tareas y afirmaciones ilustrativos. Las capturas establecen la composición visible, las etiquetas, la codificación por colores, el orden y el estado de ejemplo. No acreditan un servicio de producción conectado, almacenamiento persistente, búsqueda operativa, filtrado, creación de tickets ni actualizaciones en tiempo real.
Para una adaptación, conserva la relación específica entre las cuatro columnas de flujo de trabajo y la barra lateral de Sprint Pulse. Una implementación útil necesitaría una definición explícita de los totales de puntos, las barras de progreso, las acciones sobre bloqueos y los cambios de estado antes de presentarlos como datos operativos. La fuente muestra el contrato de la interfaz con claridad suficiente para prototipar esos estados, pero no para afirmar que los controles ya los realizan.
Cómo crear un diseño de app de tablero de sprint en OpenDesign
Define el marco del espacio de trabajo
Crea un espacio de trabajo de sprint para escritorio con un encabezado de Northwind Growth Squad, el contexto de Sprint 38 y Day 6 of 10, un campo de búsqueda y los controles Filter y New arriba a la derecha, una franja de filtros, cuatro columnas de flujo de trabajo y una barra lateral derecha persistente.
Añade los datos del caso
Usa la estructura de ejemplo visible: columnas Backlog, In progress, In review y Done con los recuentos mostrados; tarjetas con tipo de trabajo, título de la tarea, iniciales del responsable, estimación en puntos e ID de incidencia; y un resumen de Sprint Pulse con el avance completado, los colaboradores y el bloqueo NW-205.
Prompt sugeridoCrea un diseño de app de tablero de sprint para escritorio para el Northwind Growth Squad. Muestra Sprint 38 · Day 6 of 10, una barra de controles superior con Search tickets…, Filter y New, una franja de filtros para miembros y las etiquetas Active sprint, Bug, Feature y Research, cuatro columnas llamadas Backlog, In progress, In review y Done, y una barra lateral derecha de Sprint Pulse. Usa tarjetas ilustrativas con tipo de trabajo, título, iniciales del responsable, puntos e ID. Incluye barras de progreso visibles solo en algunas tarjetas de In progress y un bloqueo para NW-205 a la espera de una revisión de copy. Trata la búsqueda, el filtrado, la creación, el almacenamiento y las actualizaciones como comportamiento propuesto, no como servicios operativos.
Afina la lectura y las señales de estado
Comprueba que el orden de las columnas, las bandas de color por tipo, los avatares de responsables, las etiquetas de puntos, los ID de incidencia, los filtros seleccionados, las barras de progreso y el panel rosa de bloqueo sigan distinguiéndose en anchos de escritorio. Haz que la barra lateral sea informativa sin dar a entender que los totales de ejemplo son rendimiento medido del equipo.
Exportar y obtener un enlace para compartir
Exporta tu diseño terminado y luego usa Compartir en OpenDesign para obtener un enlace. Abre el enlace en una ventana del navegador independiente y comprueba que la versión prevista y sus recursos estén disponibles antes de enviarlo.
Diseño de wireframe de dashboard de analítica
Un dashboard greybox de OpenDesign representa un espacio de trabajo de analítica mediante una barra lateral, cuatro marcadores de posición KPI, un gráfico esquemático, cinco filas de tabla y anotaciones de maquetación en azul.
Aplicación de escritorio
Diseño de aplicación de bandeja de entrada para revisiones de código
El diseño de aplicación de bandeja de entrada para revisiones de código reúne solicitudes de revisión, fallos de CI, incidencias asignadas y actividad en un espacio de trabajo fácil de revisar para la priorización diaria.
Aplicación de escritorio
Diseño de panel de rendimiento de contenido
Un panel de contenido oscuro conecta instantáneas de plataformas con inspección de gráficos, planificación de borradores y una vista más profunda de las señales de audiencia y conversión.
Aplicación de escritorio
Diseño de planificador de excursiones
Planifica seis paradas programadas en la ciudad ficticia de Solara Bay, con un mapa ilustrado, estimaciones de trayectos a pie y advertencias útiles sobre la ruta.
Aplicación de escritorio