How I Carefully Crafted a Truly Terrible Data Visualization

As a seasoned data visualization practitioner, I‘ve developed a deep appreciation for the power of a well-crafted chart or graph to communicate complex ideas with clarity and concision. From the careful selection of visual encodings to the thoughtful arrangement of elements on the page, every design decision matters when it comes to telling a compelling story with data.

But sometimes, to really understand the importance of getting things right, it helps to explore what happens when we get things horribly, disastrously wrong. So I decided to conduct an experiment: What if I tried to create the worst data visualization imaginable? How terrible of a chart could I come up with if I broke every rule and guideline I‘ve ever learned?

Data Viz 101: What Not To Do

Before we dive into the horror show I‘ve concocted, let‘s take a moment to review some of the key principles and best practices of data visualization. As experts like Edward Tufte and Stephen Few have explained, good visualizations:

• Represent data accurately and proportionately
• Use visual encodings that are intuitively understood
• Organize and arrange elements for clarity and impact
• Omit unnecessary embellishments or distractions
• Provide sufficient context and explanation

These guidelines are rooted in human perception and cognition. We are wired to quickly process visual information, spot patterns, and make comparisons. Effective visualizations take advantage of these innate abilities, translating abstract numbers into concrete shapes, colors, and spatial relationships.

Conversely, ineffective visualizations tend to have:

• Distorted or misrepresented data
• Unintuitive or inconsistent visual encodings
• Cluttered or disorganized layouts
• Excessive chartjunk and embellishments
• Missing or inadequate context

Such charts fail because they work against, rather than with, our perceptual and cognitive faculties. They slow down our understanding, confuse our interpretations, or mislead us altogether.

Methodology: Collecting Crimes Against Data

To create my terrible visualization, I needed an appropriate dataset. And what better source than the WTF Visualizations collection – a hall of shame showcasing some of the worst real-world charts and graphs out there.

I manually gathered data on 100 visualizations from the site, coding them on dimensions like:

• Predominant color
• Spatial position
• Chart type (bar, line, pie, etc.)
• Popularity (Reddit score)

Here‘s a sample of the raw data:

Color	Position	Type	Popularity
Blue	Top	Bar	305
Mixed	Bottom	Line	217
Red	Middle	Pie	156

The full dataset contained additional fields like whether 3D effects were used, if the chart had a title, and a freeform "WTF Factor" score. In total, I spent several hours poring through the examples, recording the details in a spreadsheet.

Crafting Chaos: The Viz from Hell

With my data in hand, it was time to build the beast. I had already sketched out some initial concepts for maximally confusing and terrible visual encodings:

• Use color to represent color, but inconsistently
• Use position to represent position, but reversed
• Use shape to represent chart type, but mismatched
• Use size to represent popularity, but inverted

In terms of implementation, I used D3.js to generate the SVG elements and apply the various data-driven transformations. Here‘s a snippet of the code used to set the color of each circle:

const vis = d3.select("#vis")

vis.selectAll("circle") 
   .data(data)
   .join("circle")
   .attr("fill", d => COLOR_MAP[d.color] || randomColor())

The COLOR_MAP object contained the illogical and inconsistent mappings like {"red": "green", "blue": "green"}. Anything not included got a random color assigned, as with the special "mixed" category.

I repeated this pattern for size, position, and shape, resulting in the visual cacophony you see before you:

Where to begin with this monstrosity? It‘s almost impressive how much wrongness is packed into a single chart image:

• Colors are completely nonsensical. Green dominates, even for categories like "blue" and "red", while "mixed" is a rainbow assortment.
• Positions are reversed from their labels. What‘s shown on the left is counted on the right and vice versa.
• Shapes are arbitrarily assigned. Bars show up as circles, pies as triangles, and lines as squares.
• Sizes are inversely proportional to their values. The largest shape has the lowest popularity score.
• Labels are inconsistent (3D: True/False) and unnecessarily verbose.
• Annotations like the rotated numbers are meaningless chartjunk.
• Totals don‘t add up to the declared 100 items. They actually sum to 102!
• Embellishments like the inexplicable dinosaur are utterly gratuitous.

Stepping back, this visualization is a perfect storm of poor design choices. It breaks every rule of thumb, from using non-intuitive encodings to distorting the underlying data. It almost requires effort to misinterpret what‘s being shown.

Analysis: Lessons from Visual Disaster

So what can we learn from this exercise in visualization malpractice? Creating something so aggressively bad actually illuminates a lot about what makes for good visualization design.

At a fundamental level, it illustrates the importance of lining up our visual encodings with the viewer‘s expectations. We expect color to represent categories consistently. We expect left and right to correspond to left and right. We expect size to scale proportionally with quantity. When those expectations are violated, it doesn‘t just make interpretation harder – it makes the viewer wonder if they‘re losing their mind.

More broadly, it shows how easy it is for charts to go wrong, even unintentionally. A designer might think that a quirky typeface or a flashy 3D effect adds visual appeal, not realizing how it degrades legibility and cognition. Thoughtful, restrained design is harder than it looks.

From an audience perspective, this exercise also demonstrates the importance of data literacy and critical viewing. Confronted with a chart like this, it‘s easy to just throw up one‘s hands and assume it must be authoritative. But developing the habit of carefully reading any data visualization, and cross-checking the information presented, can guard against being misled by a rogue chart (or at least knowing when you‘ve been had).

Lastly, for practitioners like myself, it‘s a humbling reminder of the power we wield in designing data visualizations. The choices we make have the potential to enlighten or confuse, to reveal truth or obscure it. It‘s a tremendous responsibility, and not one to take lightly. Even with the best intentions, it‘s all too easy to introduce some unintended ambiguity or visual noise.

Conclusion: Doing Wrong to Learn Right

Lest you worry, I won‘t be submitting this abomination to the canon of data visualization classics anytime soon. As perversely fun as it was to deliberately flout every best practice I‘ve internalized over the years, I think I‘ll stick to the straight and narrow from here on out.

But I do think this exercise of doing things wrong on purpose has real merit for anyone looking to do things right. By probing the edges of visual communication, by stress-testing the principles of perception and cognition, we can emerge with a clearer and deeper understanding of what good visualization is all about.

The next time I‘m laboring over a design decision or debating a default setting, I‘ll remember this journey to the dark side. I‘ll imagine my chart featured on WTF Visualizations with an embarrassingly high Reddit score. And I‘ll make the choice that keeps it in the light.

To all my fellow data viz practitioners out there – keep fighting the good fight. Our users may never appreciate the bullet of bad design they dodged thanks to your diligence and care. But know that your work makes a difference, even when the only feedback is silence. I salute you, and I aspire to uphold the same high standards that you do.

And to any non-practitioner readers who made it this far – thanks for sticking with me through this twisted tale. May you never encounter a real-life chart as terrible as this one in your travels. But if you do, know that you‘re well equipped to stare into its abyss and come out unscathed on the other side. Go forth and visualize, fearlessly.