Cada gota, contada.
Un tótem de recarga con tablero de impacto en vivo y una botella inteligente con su app: diseño de producto y UX/UI para traducir el agua servida en plástico evitado.
- Diseño de producto
- UX/UI
- Sistema visual
- Visualización de datos
- 3D y render
Un tótem de recarga que cuenta lo que reparte, un tablero público que lo traduce y una botella con su app para llevarse el hábito a casa. El encargo: que el agua se pudiera leer. El cliente no se nombra por acuerdo de confidencialidad — el trabajo se enseña entero.
El reto
Una red de clubes deportivos quería que cada botella rellenada en sus salas contara de verdad: litros servidos, plástico que no se compró, CO₂ que no viajó. Y que los datos dejaran de ser técnicos: un tablero que cualquier persona pudiera leer de un vistazo, junto a sus tótems de recarga. El objetivo, escrito en el propio proyecto: traducir datos técnicos en información visual accesible para cualquier persona. Salieron dos interfaces que se hablan: el monitor público del tótem y la botella inteligente con su app.
Las cifras de la demo del monitor — no son resultados nuestros: son la interfaz haciendo su trabajo, que es exactamente lo que se diseñó.
- 2
- interfaces el tótem con su tablero público y la botella con su app
- 4.800
- botellas evitadas el plástico que la red convierte en recargas, contado en vivo
- 1.250
- personas abastecidas quién bebe de la red, no solo cuánta agua sale
- 120,5
- kg de huella al día el carbono evitado, con su tendencia semanal en el tablero
Dos azules y una sans geométrica: el institucional que ordena y el cian que señala el dato. Todo lo demás es espacio.
Los hex salen de la propia landing del proyecto; el contraste del cian sobre el azul de fondo está verificado para el dato en pantalla.
El tablero
El monitor del tótem no es un salvapantallas: es un tablero vivo. Un mapa con la red de recarga, y cuatro métricas que se entienden sin leyenda — agua suministrada, botellas evitadas, huella de carbono y personas abastecidas. Cada número con su unidad y su tendencia, en Raleway a tamaño de cartel.
La botella
La segunda interfaz cabe en una mano. Una botella inteligente que mide lo que bebes y lo que evitas, y una app que lo convierte en hábito: meta diaria, última recarga, huella y plástico evitados, premios por constancia y la comunidad alrededor de la red. La propuesta expande el proyecto desde el espacio público hacia el cuidado personal.
Un dato que no se entiende no cambia ningún hábito. El trabajo fue hacer que el agua se pudiera leer.
-
Diseño de producto
El tótem de recarga y la botella inteligente, pensados como una sola familia — misma geometría, mismos azules.
-
UX/UI
El tablero público y la app, con recorridos que se entienden sin manual y métricas que se leen de lejos.
-
Sistema visual
Dos azules, Raleway y aire: un sistema que aguanta igual en un tótem de calle que en una pantalla de móvil.
-
Visualización de datos
Cuatro métricas con unidad, tendencia y jerarquía. Nada de gráficos que exigen leyenda.
-
3D y render
El tótem y la botella modelados y renderizados para contar el producto antes de fabricarlo.
-
Confidencialidad
El cliente no se nombra y algún detalle de su identidad se ha cambiado a propósito. Las marcas van difuminadas en las piezas. El trabajo que ves, ese sí, entero y real.
El nombre del cliente no aparece en esta ficha por acuerdo de confidencialidad, algún detalle de su identidad se ha cambiado a propósito y las marcas visibles en las pantallas van difuminadas. Lo que sí se puede enseñar — el sistema, las dos interfaces y el criterio — está entero.