Diseño de paneles

Conceptos de diseño de paneles

Olga Scrivner, PhD

President, Scrivner Solutions Inc

¿Por qué es importante el diseño?

 

  • Empresa: NASDAQ
  • Necesidad: comunicar el mercado diario al inversor medio
  • Solución: un visor en tiempo real de un solo valor en Times Square

 

¿Por qué las líneas de tendencia no son la mejor opción?

 

bolsa

1 Brath, Richard & Michael Peters. (2004). Dashboard design: why design is important.
Conceptos de diseño de paneles

¿Por qué es importante el diseño?

 

  • Empresa: NASDAQ
  • Necesidad: comunicar el mercado diario al inversor medio
  • Solución: un visor en tiempo real de un solo valor en Times Square

 

¿Por qué las líneas de tendencia no son la mejor opción?

 

bolsa

 

Información histórica frente a indicadores en tiempo real

1 Brath, Richard & Michael Peters. (2004). Dashboard design: why design is important.
Conceptos de diseño de paneles

Componentes de diseño

                Audiencia

  • ¿Quién usará este panel?
  • ¿Cuáles son sus necesidades?
  • ¿Qué formato se ajusta a la audiencia?
  • ¿Con qué frecuencia se consultará?

  audiencia

                        Componentes

  • Propósito: exploratorio vs. explicativo
  • Formato: horizontal vs. vertical
  • Disposición: grid vs. flex
  • Visuales: valores, dimensiones, formas

 

componentes

Conceptos de diseño de paneles

Propósito del panel

              Panel exploratorio

panel exploratorio

Un panel exploratorio permite explorar los datos.

                    Panel explicativo

panel explicativo

Un panel explicativo ofrece conclusiones predefinidas.

Conceptos de diseño de paneles

Panel exploratorio

 

panel exploratorio

 

 

  • Filtros para segmentar datos a medida
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceptos de diseño de paneles

Panel exploratorio

 

panel exploratorio

 

 

  • Filtros para segmentar datos a medida
  • Paneles de navegación personalizables
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceptos de diseño de paneles

Panel exploratorio

 

panel exploratorio

 

 

  • Filtros para segmentar datos a medida
  • Paneles de navegación personalizables
  • Drill-down para una vista más granular
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceptos de diseño de paneles

Panel exploratorio

 

panel exploratorio

 

 

  • Filtros para segmentar datos a medida
  • Paneles de navegación personalizables
  • Drill-down para una vista más granular
  • Visualizaciones interactivas (hover, tooltips)
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceptos de diseño de paneles

Panel explicativo

 

panel explicativo

 

 

  • Los datos suelen estar ya filtrados
  • Narrativa predefinida
  • Presentación para ejecutivos
  • Llamada a la acción
1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceptos de diseño de paneles

Tamaño del panel

                      Espacio físico

  • Tamaño del monitor: distancia diagonal de la pantalla

      Sobremesa, portátil, tableta, móvil

tamaño del monitor

Conceptos de diseño de paneles

Tamaño del panel

                      Espacio físico

  • Tamaño del monitor: distancia diagonal de la pantalla
  • Resolución: número de píxeles y su densidad (ancho × alto)

                          Formato

  • Formato estándar: panel rectangular

    • Relación: 16:9
    • Todos los componentes visibles en una pantalla
    • Sin desplazamiento

  • Formato largo: horizontal o vertical

      Sobremesa, portátil, tableta, móvil

tamaño del monitor

                Horizontal (estilo cronología) formato largo

Conceptos de diseño de paneles

Tamaño del panel

                      Espacio físico

  • Tamaño del monitor: distancia diagonal de la pantalla
  • Resolución: número de píxeles y su densidad (ancho × alto)

                          Formato

  • Formato estándar: panel rectangular

    • Relación: 16:9
    • Todos los componentes visibles en una pantalla
    • Sin desplazamiento

  • Formato largo: horizontal o vertical

      Sobremesa, portátil, tableta, móvil

tamaño del monitor

                Vertical (estilo columna de periódico) formato vertical

Conceptos de diseño de paneles

Disposición del panel

                  Sistema de cuadrícula sistema de cuadrícula

  • Matriz bidimensional
  • Equilibrado y simétrico
  • Navegación sencilla
  • Big Aggregate Numbers (BAN): fila superior

                                Foco

F focus

F focus

1 Baucke, Spencer. (2022). Dashboard design essentials.
Conceptos de diseño de paneles

¡Vamos a practicar!

Conceptos de diseño de paneles

Preparing Video For Download...