Diseño de tableros: consideraciones y mejores prácticas

Escucha la versión en audio de este artículo

Los tableros son una forma única y poderosa de presentar inteligencia basada en datos utilizando técnicas de visualización de datos que muestran datos relevantes y procesables, así como estadísticas de seguimiento e indicadores clave de rendimiento (KPI). Los tableros deben presentar estos datos en un formato rápido y fácil de escanear con la información más relevante comprensible de un vistazo.

El término nació del salpicadero de un automóvil tradicional y han evolucionado para cumplir la misma función en el mundo digital. En su libro, Stephen Few lo expresó mejor:

Un tablero es una visualización de la información más importante necesaria para lograr uno o más objetivos; consolidados y ordenados en una sola pantalla para que la información pueda ser monitoreada de un vistazo.

En este artículo, describimos ejemplos estratégicos, analíticos, operativos e informativos, así como los principios fundamentales que se encuentran en el corazón de cada diseño de tablero exitoso, independientemente de su tipo.

Tener el enfoque correcto para la visualización de datos es una característica clave para sentar las bases de un tablero exitoso. La visualización de datos es la presentación de datos a través de gráficos e imágenes; su objetivo principal es ayudar a los responsables de la toma de decisiones a identificar patrones o comprender conceptos difíciles que pueden pasar desapercibidos en las aplicaciones basadas en texto.

En su libro Data Visualization , Noah Iliinsky y Julie Steele afirman:

El propósito del diseñador al diseñar una visualización de datos es crear un resultado que sea bien recibido y que el lector lo entienda fácilmente. Todas las opciones de diseño y las implementaciones particulares deben cumplir este propósito.

Características clave de los grandes tableros

Un tablero efectivo muestra información procesable y útil de un vistazo. Simplifica la representación visual de datos complejos y ayuda a las partes interesadas a comprender, analizar y presentar información clave.

Los grandes tableros son claros, intuitivos y personalizables.

• Comunican información rápidamente.
• Muestran la información de forma clara y eficiente.
• Muestran tendencias y cambios en los datos a lo largo del tiempo.
• Son fácilmente personalizables.
• Los widgets y componentes de datos más importantes se presentan efectivamente en un espacio limitado.

Una personalización inicial de los datos visuales y la información para los requisitos clave del usuario ayudará a mejorar la usabilidad y eliminará la necesidad de diferentes personajes de usuario.

Grandes tableros proporcionan todo a un clic de distancia.

• Toda la información esencial es inmediatamente accesible.
• Se priorizan los datos.
• La información se muestra claramente en una jerarquía visual en una pantalla.
• El diseño proporciona una descripción general coherente que incluye datos iniciales escasos y claros con oportunidades adicionales para obtener más detalles.
• Los elementos (gráfico, tabla, formulario) se muestran en una vista minimizada con la capacidad de mostrar más detalles en una ventana modal o ir a una página con más detalles.
• El diseño mejora la usabilidad con filtros que permiten a los usuarios personalizar cómo se muestran los datos y filtra el contenido mediante etiquetas, categorías y KPI.

La complejidad reducida proporciona claridad

En un mundo abrumado por los datos, proporcionar información clara es una de las cosas más difíciles de lograr. Presentar solo los datos más relevantes en los tableros es esencial: cuanta más información mostramos, más difícil será para los usuarios encontrar lo que necesitan.

Cuando se enfrentan a demasiados datos para seleccionar, los diseñadores deben mostrar solo el subconjunto más relevante. Necesitamos priorizar y eliminar cuidadosamente las métricas engañosas y poco claras.

Las decisiones efectivas de diseño de tableros deben guiarse por:

• los objetivos del proyecto
• la naturaleza de los datos
• las necesidades de los usuarios

Al leer una visualización (o cualquier otro tipo de comunicación), su lector tiene una cantidad limitada de capacidad intelectual para dedicarse al problema. Parte de esta capacidad intelectual se dedicará a decodificar la visualización; cualquier capacidad intelectual que quede puede usarse para comprender el mensaje (si el lector aún no se ha dado por vencido por la frustración). Noah Iliinsky y Julie Steele (Visualización de datos)

El objetivo central de un tablero es hacer que la información compleja sea accesible y fácil de digerir. Por lo tanto, la interfaz que presenta los datos debe ser limpia y sencilla para minimizar la carga cognitiva de los usuarios y el tiempo dedicado a la búsqueda.

La arquitectura de la información debe presentar primero los datos esenciales al tiempo que permite el acceso a métricas de apoyo o secundarias. Se debe diseñar un sistema de desglose progresivo que comience con una descripción general y luego entre en más detalles; facilita la priorización de datos y crea claridad.

Determinación de los objetivos del tablero y visualización de los datos apropiados

Al diseñar cuadros de mando, los diseñadores de cuadros de mando exitosos comienzan con un conjunto de objetivos bien definidos que se centran en el problema a resolver y en los conocimientos clave y procesables que las personas necesitan extraer de los datos.

Los buenos objetivos de diseño promueven una ejecución eficiente y precisa. El empleo del marco SMART para el establecimiento de objetivos pone el foco en objetivos específicos , medibles , procesables , realistas y basados ​​en el tiempo .

Algunas preguntas clave para hacer al determinar los objetivos de diseño del tablero:

• ¿Cuántos pasos deben dar los usuarios para lograr un objetivo específico?
• ¿La interfaz es lo suficientemente intuitiva para que el usuario alcance su objetivo por sí mismo?
• ¿Qué información necesita el usuario para alcanzar con éxito su objetivo?

Para determinar cuál puede ser el objetivo de un diseño de tablero específico, defínalo preguntando: "¿Qué problema específico va a resolver este diseño para el usuario?" La respuesta proporcionará información sobre qué métricas, propiedades, valores, imágenes y datos son importantes.

El diseño centrado en objetivos se enfoca en soluciones a problemas reales y es la base de todo gran diseño de tablero. Comience con una comprensión clara de los objetivos comerciales, considere las metas del usuario y luego transmita la información clave que debe comunicarse.

Contexto en el diseño de tableros

Uno de los mayores desafíos del diseño de tableros es servir a múltiples personas. Una vez que se define cada rol de usuario, se vuelve fundamental comprender dónde se superponen sus necesidades y dónde divergen.

La comunicación efectiva es el principio subyacente de todo diseño exitoso de tablero. Prever escenarios potenciales en los que los usuarios pueden encontrarse contribuirá a una mejor comprensión de las circunstancias del usuario.

Tenga siempre en cuenta el contexto de los usuarios al diseñar: identifique sus conocimientos técnicos, su familiaridad con el sistema en general, sus objetivos, etc.

Asegúrese de hacer las siguientes preguntas cuando intente determinar el comportamiento y el contexto del usuario:

• ¿El diseño considera la dirección en la que el visitante está acostumbrado a leer?
• ¿La interacción con el tablero requiere conocimientos técnicos?
• ¿Lograrán los usuarios realizar la mayoría de las acciones con solo unos pocos clics?
• ¿El diseño se alinea con el contexto del usuario mediante la creación de menús desplegables? ¿Utiliza iconografías y paletas de colores sugerentes?

La paleta de colores utilizada en el diseño de un tablero también debe considerarse como un contexto. Muchos tableros de productos SaaS de empresa a empresa están diseñados en una interfaz de usuario con un tema oscuro porque se usan durante varias horas seguidas.

Las interfaces de usuario con temas oscuros pueden ayudar a reducir la fatiga visual y respaldar la claridad visual dentro de la interfaz. Sin embargo, adoptar este enfoque requiere una evaluación cuidadosa de la dirección del diseño: las ventajas, las desventajas y los peligros potenciales, como se describe en un artículo de blog de diseño anterior: Dark UI Qué hacer y qué no hacer.

Mejor diseño de tablero con investigación de usuarios

La investigación de usuarios ayuda a crear un entorno en el que a los usuarios se les presentan datos que son relevantes, claros y concisos. Esto les ayuda a pensar en el contenido y los datos que están buscando, en lugar de cómo usarlos y acceder a ellos.

Algunos tableros tienen que funcionar, o ser personalizables sin esfuerzo para usuarios de diferentes roles que miran el mismo tablero básico. La investigación del usuario es importante porque ayuda a determinar los objetivos del usuario, los modelos mentales, el contexto ambiental y los puntos débiles. Estos son factores que influyen mucho en el diseño final del salpicadero.

El diseñador de experiencia del usuario, investigador y autor Mike Kuniavsky señala que es “el proceso de comprender el impacto del diseño en una audiencia”.

Un diseñador tiene que definir los diferentes tipos de usuarios y entender dónde sus objetivos son los mismos y dónde difieren. ¿Qué información es más procesable para un tipo de usuario frente a otro? Deben considerar si es necesario que haya un diseño diferente de un tipo de usuario a otro, o si existe una solución para un caso de uso más general.

Teniendo esto en cuenta, es una buena idea comenzar con esquemas rudimentarios y pasar a prototipos que puedan probarse con usuarios reales durante una fase de investigación de usuarios. La información verdaderamente valiosa puede surgir de una breve fase de investigación de usuarios con solo cinco usuarios, y ahorrará una enorme cantidad de tiempo en el futuro.

Divulgación progresiva en el diseño de tableros

La divulgación progresiva es una técnica utilizada para mantener la atención del usuario al reducir el desorden. La creación de un sistema de divulgación progresiva ayuda a crear un entorno centrado en el usuario, lo que ayuda a priorizar la atención del usuario, evitar errores y ahorrar tiempo. También permite a los usuarios concentrarse en las funciones clave que les importan y no verse obligados a pasar por todas las funciones, incluidas las que no necesitan o no les interesan.

La divulgación progresiva es una de las mejores prácticas de diseño de tableros que también reducirá considerablemente las tasas de error; mejorará la eficiencia y ayudará a los usuarios a mejorar su comprensión de los tableros cuando un sistema se basa en la priorización de funciones.

La divulgación progresiva transfiere las funciones avanzadas o poco utilizadas a una pantalla secundaria, lo que hace que las aplicaciones sean más fáciles de aprender y menos propensas a errores. –Jakob Nielsen

La animación es una excelente manera de satisfacer una variedad de necesidades de los usuarios y al mismo tiempo cumplir con múltiples funciones. Es una excelente opción para usar mientras se cargan los datos y las imágenes y es una solución avanzada de divulgación progresiva.

La animación es el proceso de crear la ilusión de movimiento; es una dinámica que crea una sensación de progreso y retroalimentación constante, lo que reduce la incertidumbre del usuario y aumenta el rendimiento percibido.

Ventajas de usar la divulgación progresiva en los tableros:

• Reducir la incertidumbre y la ansiedad de los usuarios (al mostrar signos de progreso, los usuarios tienen la seguridad de que todo funciona según lo previsto)
• Proporcionar a los usuarios algo para mirar (visualización parcial de datos) en lugar de hacerlos esperar
• Brindar a los usuarios una expectativa clara de los próximos pasos y crear una comprensión de la forma en que la información se presenta jerárquicamente.

Los problemas potenciales con las divulgaciones progresivas y la carga de datos incluyen:

• Usar indicadores y divulgaciones de manera inapropiada. Los tiempos de carga cortos y los pasos inútiles crearán distracción y trabajarán en contra de los principios de usabilidad.
• Un retraso en la recuperación de datos sin un indicador claro de progreso puede generar incertidumbre en el usuario y mayores tasas de rebote.
• El uso de indicadores de progreso estáticos es una solución sin sentido y no ofrece suficiente información sobre el progreso, lo que también puede generar incertidumbre en el usuario y mayores tasas de rebote.

Resumen

Los tableros son una forma poderosa de comunicar datos y otra información, especialmente con un diseño centrado en el usuario y en los objetivos que sigue las mejores prácticas de diseño de tableros y una visualización adecuada de los datos. Aunque cada tablero es diferente y tiene sus propios objetivos, requisitos y limitaciones, seguir estos principios fundamentales ayudará a crear diseños sobresalientes, independientemente de los detalles:

• En primer lugar, empatice con sus tipos de usuarios y comprenda sus objetivos.
• Transmita una historia clara a los usuarios haciendo uso de imágenes sugerentes, etiquetas, técnicas de divulgación progresiva y animación.
• Haz que las cosas complejas sean fáciles aplicando técnicas de investigación de usuarios.
• Revelar datos e información en el momento adecuado, en un sistema de desglose.
• Utilice la visualización de datos para expresar información de manera significativa.

• • •

Lectura adicional en el blog de diseño de Toptal:

• eCommerce UX: una descripción general de las mejores prácticas (con infografía)
• La importancia del diseño centrado en el ser humano en el diseño de productos
• Los mejores portafolios de diseñadores de UX: estudios de casos y ejemplos inspiradores
• Principios heurísticos para interfaces móviles
• Diseño anticipatorio: cómo crear experiencias de usuario mágicas