Gama Sierraalta

Interacción 02

Comparar grupos dentro de un reporte de benchmark.

Un diseño de UI para el siguiente paso de Benchmarks AI: comparar grupos dentro de un reporte. Diseñado para Time Doctor y listo para implementarse, el prototipo explora cómo las personas podrían leer, ajustar y organizar los datos de benchmark.

01 · El siguiente paso para Benchmarks AI

El reporte original de Benchmarks AI ayudó a los gerentes a entender cómo le iba a su empresa frente a otras empresas. La siguiente pregunta era cómo contribuían a ese resultado los distintos grupos dentro de la empresa.

Diseñé este concepto como el siguiente paso del reporte. Agrega comparaciones de grupos, interacciones de gráfico más claras y más control sobre cómo se organiza el reporte.

El diseño estaba listo para implementarse, pero la hoja de ruta del producto tomó otro rumbo. Este prototipo da vida al trabajo de Figma para que las interacciones puedan experimentarse directamente.

02 · Comparar grupos dentro del gráfico

Los grupos se pueden agregar directamente desde el gráfico, manteniendo la comparación cerca de los datos. Cada grupo conserva su propio color a lo largo del reporte, así el gráfico sigue siendo fácil de seguir a medida que se agregan o quitan grupos.

El reporte admite hasta diez grupos a la vez. El límite mantiene el gráfico legible y le da a la comparación un borde claro.

03 · Hacer los datos más fáciles de leer

Al pasar el cursor sobre un punto se muestran el grupo, la semana, el percentil y la posición dentro del rango de benchmark. Los puntos llevan el mayor énfasis visual porque representan los datos medidos, mientras que las líneas que los unen se mantienen más discretas.

Las tarjetas del reporte también se pueden reordenar arrastrando sus barras de título. Las personas pueden decidir qué comparación merece atención primero, y el layout se mantiene consistente a medida que cambia el orden.

04 · Un reporte que se explica solo

La interfaz anuncia los cambios importantes cuando se agregan grupos, se cambian las vistas y se mueven las tarjetas. El gráfico también se puede explorar con el teclado, con las flechas moviéndose entre grupos y semanas.

Una tabla entrega la misma información en un formato que funciona bien con lectores de pantalla. Se respetan las preferencias de movimiento reducido, y los cambios de estado ocurren al instante cuando la animación está desactivada.