There was no client brief. Raven Path’s social media analytics and research teams for Noogle and Wayvo were good at finding the story and short of time to show it. Their reports were built under deadline, page by page, and they looked it. A sharp finding in a rushed layout reads like a rushed finding.
The analysts did not need to become designers. They needed a page that was already designed, where the only decisions left were about the data. So I pitched a design system for reports, built it in under three weeks with design ops and agile methods, and named it for what it promised: BloQ, Blocks and Quality.
The ideaMondrian, built with LEGO.
The style comes from Piet Mondrian: a grid of ink rules, a few fields of colour, and everything else white. It reads as data-driven, and it is strict enough that no one can break it by accident. The building method comes from LEGO. Every page is a set of blocks that snap to the grid, and every block type has a spec.
The only decisions left on the page are about the data.
A page, taken apartGrid first, insight last.
Every BloQ page is the same stack. The grid goes down first, then the colour fields, then the axes, the data and the annotated moments. The headline is written last and goes on top, because it is a sentence about the data and not a title: on the page below, that #LocalGuides led Twitter’s hashtags again in the second quarter of 2019.
A key-opinion-former profile is the same idea at a finer grain: eleven blocks, from the identity and four scorecards down to a stamp and the insight, and not one decision about layout left to make.
Before BloQ, and with it
The same kind of page, built by hand under deadline, and built from blocks.
How big is 200?
One cell per report a year, on BloQ’s own grid. Beside it, the reporting retainers Raven Path won that year, drawn to scale.
Reports a year Self-reported
18 a year before BloQ 182 more after
Retainers Self-reported
The outcomeThe ceiling broke.
After BloQ shipped, production went from 18 reports a year to 200, and the data visualisation team grew from two people to five. It worked because it was built on research into the analysts’ day-to-day work, and because it was easy to use. Cross checks built into the process brought human errors under 2% for the whole year.
Noogle and Wayvo praised the work and asked our team to train their own designers to run design ops at scale. All of this is self-reported.
The record
Where the blocks went next.
A delivered Noogle page
- Noogle and WayvoSocial listening, key opinion formers, audiences, sentiment and company analysis, all on one grid.
- Their own designersNoogle and Wayvo asked the team to train their designers to run design ops at scale.Self-reported
- Allied Leaf TobaccoThe system deployed 900 reports across 15 markets.Self-reported
- ICMSome of ICM’s reporting products were built on it too.Self-reported