Problem
Plume needed a way to show how their users have been affected by the wide-ranging changes stemming from COVID‑19. As with most technology companies, Plume has a wealth of data collected during the criss, but it must be parsed and displayed elegantly to surface meaningful insights.
Solution
We developed a responsive website and data visualization for Plume in response to the effects of the COVID‑19 virus. Utilizing Plume’s anonymized data, we were able to display the increase in residential network traffic as more users began working from home. The data set is updated regularly, giving Plume and its users real‑time insight into the evolution of the crisis.
Implementation
We built out a responsive webpage to hold dynamic
charts, that way users can view the data from any device.
Busy Hours at Home in the US
Entertainment Devices Include Set‑Top Boxes, Smart TVs, And Game Consoles
2/19 - 4/26 | DATA FROM 14 METRO AREAS, UPDATED WEEKLY
Working with dynamic
data using D3
D3.js is a JavaScript library for manipulating documents based on data. Using D3 allowed us to bind the Plume usage data to the DOM and then make data-driven transformations.
Here we can introduce new datasets and then update, append and display the DOM elements using those datasets, realtime. We modified the horizontal line chart with Plume specific styling to best display usage over time even as the data set is updated.
Relevant milestones and dates are annotated at the bottom of the chart.
Evolving Data Set
We worked closely with Plume to normalize new data sets and add them
to the graph. Each city has unique considerations to accommodate.