Build what the workaround was for

3 min read #dashboards #product-design

From a dashboard I designed for wholesale sales reps, who take retailers’ orders for manufacturers, and the agencies they work for.

Each number on the dashboard sat on a card with its own timeframe and a small chart of its trend. As we opened the dashboard to more users, we kept seeing people add the same card, like sales, three times and give each copy a different timeframe. They could already change the period on one card; they were choosing to keep three in view, because what they wanted was to read the figures together, a good month beside a disappointing year. The copies were a workaround, and the thing to build was what they were for: the comparison, built from parts the dashboard already had. My rule for that is amplify over add: make what’s already there do more before adding something new.

Every card also had a resize arrow that set it to two or three of the dashboard grid’s columns, giving its contents more room. Almost nobody clicked it, which meant a new job for the arrow would disturb very few people, and also that few would come across the new job on their own. I gave it the job anyway: a sales card resized to two columns held three timeframes side by side, and one resized to three held up to five, in whichever periods and order people chose. Every card on the dashboard was built from one shared card that I designed and built, so adding the comparison was a single change to it. Every sales card, the kind people had been copying, got the comparison at once.

The first cost fell on the few people who had resized a card to give its chart more room. Every time someone resized a sales card, the dashboard first asked them to confirm it would now show several timeframes side by side. Saying no cancelled the resize, so a sales card with a bigger chart was no longer available. I accepted that loss because so few people had resized a card for that reason, and the confirmation meant nobody lost the bigger chart without being told.

Resizing asks before it changes a card, then puts the chosen periods side by side.

The people who found the comparison mostly liked seeing sales across four or five timeframes at once, though a few found a row that dense harder to read. Soon after, resizing an order-status card did the same for statuses, showing several for one period, because surveys and research showed people usually looked at more than one status at a time.

The bigger cost was the one I’d expected: a control nobody used was also a control nobody looked at, so the comparison was easy to miss. Two months after release, about a third of regular users had a resized sales card. Many of the rest still kept two or three copies of the same card, so they wanted the comparison and hadn’t found it.

A workaround shows what to build and which parts to build it from. It doesn’t show where people will look for the result, or what they were already using those parts for, and both deserve as much design as the feature itself. Here, the better place to offer the comparison is where the workaround starts: the moment someone adds a second copy of a card.