Muchas veces el día a día de una startup ocupa casi todo el tiempo del equipo. Funcionalidades a implementar (de una lista gigante de cosas que al equipo les gustaría tener), bugs que corregir, pedidos/reclamos de clientes de los cuales hay que ocuparse, etc.

Esta situación deja poco lugar para la implementación de mejoras más enfocadas a la gestión de la propia startup: mejorar el backoffice interno, mejores herramientas de gestión, y un largo “whish-list”.

Por supuesto que esto nace de algo totalmente natural y de una priorización, a mi entender, correcta: Las necesidades de los clientes están primero, dejando en un segundo lugar las mejoras de herramientas para el propio equipo. La clave es manejar este balance y no dejar completamente abandonado el progreso interno que permitan gestionar mejor el día a día.

Dentro de esta categoría entran las métricas y el monitoreo. Muchas startups operan en un mundo poco tangible. A diferencia de un negocio tradicional donde es fácil observar a simple vista la dinámica del negocio (cuanta gente entra por la puerta, cuan rápido bajan las cajas de los artículos del deposito, etc), para una empresa que opera en el plano digital, se hace difícil a veces tener una sensación de su estado en tiempo real.

Este post les ayudará a crear un Dashboard propio (o al menos animarse a dar el primer paso), con ejemplos en código y una demo para que se hagan una idea de las posibilidades. Si bien es necesario saber programar y tener una idea en Ruby, es relativamente sencillo de “meter mano” y modificar algunas cosas.

Manos a la obra

Dashboard, traducido a veces como tablero, panel de control o tablero de comandos, es un conjunto de visualizaciones que agrupan varios aspectos de interés a tener a la vista. Las cosas a monitorear varían mucho de acuerdo a las necesidades, gustos del equipo y objetivo del dashboard. Puede ir muy orientado a la gestión del equipo (cantidad de tareas pendientes, cantidad de reclamos sin responder, etc), orientado al monitoreo del status de la infraestructura (estado y tiempo de respuesta de cada uno de los servidores, carga de determinados servicios, etc) u orientado a las ventas (cantidad de ventas realizadas en el día, volúmenes de montos transados, etc).

Dashboard de ventas

Ejemplo de dashboard con algunas métricas e info elegida.

Hoy en día hay varias herramientas que permiten implementar un dashboard rápidamente y de muy buena calidad. Para este ejemplo voy a usar Dashing, de la gente de Shopify, una alternativa open source muy buena y completa. Es posible implementar un dashboard relativamente complejo en unas pocas horas, una inversión en tiempo que vale mucho la pena para medir el “pulso” de nuestro negocio.

Para los que todavía no se hacen una idea de lo que podría ser un dashboard, aquí un ejemplo de un e-commerce ficticio que inventé para este post (el código fuente pueden encontrarlo al final del post) , con información orientada a las ventas y algo de monitoreo en las redes sociales:

• Ejemplo para ver en pantalla mas chica (con menos info) : Dashboard pequeño

• Ejemplo para un televisor en 1080p: Dashboard 1080p

Este último está pensado como para ponerlo en un televisor donde todos los miembros del equipo puedan verlo.

Si bien todos los datos que muestra el dashboard de ejemplo son falsos, en el código hay ejemplos de como conectarlo fácilmente con fuentes de datos reales. Aquí un ejemplo del código que envía datos al dashboard:

#Refresco de los 10 productos vendidos cada 6 segundos
SCHEDULER.every '6s' do 
    top_10_prod = dash_data.get_ultimas_10_ventas_fixed send_event('top_10_prod', { items: top_10_prod })
end

#Cada 10 segundos enviar al dashboard los montos de venta
SCHEDULER.every '10s' do
    send_event('ventas', points: dash_data.get_montos_ventas)
end

Dashing propone una estructura bien sencilla, una carpeta jobs donde nosotros tenemos que programar las distintas fuentes de información y su frecuencia, y la carpeta dashboards, donde diagramamos en html+css los distintos bloques.

Por un tema de simplificar el código, creé una clase en la carpeta lib llamada DashboardData, encargada de obtener toda la info (para no ensuciar con queries cada job).

Les recomiendo visitar el sitio de Dashing y su Wiki, donde encontrarán mucha más información.

Dashing ademas tiene varios widgets desarrollados por la comunidad para extender su funcionalidad y también conectarlo con diversos servicios: https://github.com/Shopify/dashing/wiki/Additional-Widgets

Donde hostearlo

El dashboard puede ser hosteado gratuitamente en Heroku (como lo está la versión demo que puse online), pero probablemente lo mejor sea hostearlo internamente (o en algún servidor propio, cerca de la base de datos o cualquiera que sea la fuente de información).

Puede dejarse corriendo en modo background de la siguiente manera:

dashing start -d

Espero que esto los aliente a crear sus propias versiones y adaptarlos a sus necesidades de información, dejo disponible el código en GitHub aquí: https://github.com/guillehorno/dashboard-ejemplo