Helio Grid
A live map of a city's solar output, built to make data feel like weather.
01Introduction
Helio Grid is a concept platform that turns rooftop solar readings into a living forecast for residents, installers and city planners.
02The challenge
The challenge
Energy dashboards tend to speak in kilowatt-hours and acronyms. The challenge was to make a dense real-time dataset readable at a glance, without hiding the precision experts rely on.
03Creative direction
The idea in one move.
We treated the data as weather. Output became light and density on a dark city grid, with a type system borrowed from aviation instruments for the moments that need exact numbers.
#08090D
Signal#D6FF38
Spark#496BFF
Paper#F5F5F3
Text Instrument Sans 400
Data JetBrains Mono 500
04Design exploration
Studies before decisions.
Early studies tested heat maps, isometric towers and particle fields. The particle grid won because it stays legible when thousands of sources update every few seconds.
05Development and implementation
Built to the same standard as it looks.
A WebGL layer renders the grid from a compact binary feed, while the interface stays plain, accessible HTML. A server-rendered fallback keeps every figure available without WebGL.
06Visual gallery
Drag through the details.
07Results and outcomes
What thedirection delivers.
Concept project: outcomes describe the intended design result, not measured client metrics.
- 01
A single view for residents, installers and planners
- 02
Real-time rendering designed for mid-range phones
- 03
Every visual value mirrored in accessible text