Skip to the page
Tactile UI Kit

Lamp heatmap

A heatmap as a matrix of small panel lamps set into the plate: each lamp’s brightness is the value, off to full in four steps, with a printed legend. Deploys per day over a year, incidents by hour of the week, energy by the hour.

Hover a lamp, or Tab into the grid and use the arrows, Home/End and PageUp/PageDown: the display reads the day. Switch the year and every lamp fades to its new level.

  • A WAI-ARIA grid: rows of gridcell lamps, each named in full — “Tue 14 Oct 2025: 6 deploys” — with one tab stop that the arrows, Home/End and PageUp/PageDown move. The row headers name the weekdays.
  • The grid is described by a summary that states the data: the total, the busiest day, how many had none, and what each step of light means. With summary="mean" a rate is averaged instead, and its highest and lowest cells are named.
  • Hover and focus read the same lamp on the display in the head; the lamp being read is ringed in print as well as lit, so nothing depends on seeing brightness alone. The legend prints each step’s range.
  • Each step of light is clearly apart from the next, and the glow grows with it; a day with no reading is an empty socket with no lens at all.
  • Reduced motion: lamps change brightness at once and no frame is asked for; nothing else moves.
Tactile UI Kit
Get the Founder Pass