Nature 150 Interactive
A beautiful interactive visualisation of every paper published in Nature.
Link tags: visual
196
Iceberger
Draw an iceberg and see how it will float.
Data Visualization and the Modern Imagination - Spotlight at Stanford
There are some beautiful illustrations in this online exhibition of data visualisation in the past few hundred years.
Eleanor Lutz - An Orbit Map of the Solar System
A lovely visualisation of asteroids in our solar system.
CSS Stats
A handy tool for getting an overview of your site’s CSS:
CSS Stats provides analytics and visualizations for your stylesheets. This information can be used to improve consistency in your design, track performance of your app, and diagnose complex areas before it snowballs out of control.
An Ocean of Books
What you see is the big map of a sea of literature, one where each island represents a single author, and each city represents a book. The map represents a selection of 113 008 authors and 145 162 books.
This is a poetic experiment where we hope you will get lost for a while.
List of Physical Visualizations
A timeline showing the history of non-digital dataviz.
British & Exotic Mineralogy
A really lovely unmonetisable enthusiasm:
All 2,242 illustrations from James Sowerby’s compendium of knowledge about mineralogy in Great Britain and beyond, drawn 1802–1817 and arranged by color.
You can dive in and explore or read more about the project and how it was made.
It reminds me of Paul’s project, Bradshaw’s Guide: the both take a beloved artifact of the past and bring it online with care, love, and respect.
CSS Vocabulary
This is a nifty visual interactive explainer for the language of CSS—could be very handy for Codebar students.
Why I hate the log graph, and you should too - Geek in Sydney
I must admit I’ve been wincing a little every time I see a graph with a logarithmic scale in a news article about COVID-19. It takes quite a bit of cognitive work to translate to a linear scale and get the real story.
Visual Design Inspiration from Agency Websites–And Other Tangential Observations | Jim Nielsen’s Weblog
Tyring to do make screenshots of agency websites is tricky if the website is empty HTML with everything injected via JavaScript.
Granted, agencies are usually the ones pushing the boundaries. “Pop” and “pizazz” are what sell for many of them (i.e. “look what we can do!”) Many of these sites pushed the boundaries of what you can do in the browser, and that’s cool. I like seeing that kind of stuff.
But if you asked me what agency websites inspired both parts me, I’d point to something like Clearleft or Paravel. To me, they strike a great balance of visual design with the craft of building for an accessible, universal web.
Emma Willard’s Maps of Time
The beautiful 19th century data visualisations of Emma Willard unfold in this immersive piece by Susan Schulten.
Same HTML, Different CSS
Like a little mini CSS Zen Garden, here’s one compenent styled five very different ways.
Crucially, the order of the markup doesn’t consider the appearance—it’s concerned purely with what makes sense semantically. And now with CSS grid, elements can be rearranged regardless of source order.
CSS is powerful and capable of doing amazingly beautiful things. Let’s embrace that and keep the HTML semantical instead of adapting it to the need of the next design change.
The Map of Mathematics | Quanta Magazine
An absolutely gorgeous piece of hypermedia!
Data visualisations and interactive widgets enliven this maze of mathematics. Dig deep—you may just uncover the secret passages that join these concepts together.
Draw all roads in a city at once
A lovely little bit of urban cartography.
Kinopio
I’m finding this tool to be very useful for the kind of chaotic mind-mapping I do when I’m preparing a conference talk.
The Deep Sea
After showing us the size of space, here’s a fascinating intereactive visualisation of the ocean depths.
The New York City Subway Map as You’ve Never Seen It Before - The New York Times
The design history of the New York subway map.
The Size of Space
Celestial objects ordered by size, covering a scale from one astronaut to the observable universe.
Case Study: lynnandtonic.com 2019 refresh - lynnandtonic.com
Lynn gives a step-by-step walkthrough of the latest amazing redesign of her website. There’s so much joy and craft in here, with real attention to detail—I love it!