Information Design & Data Visualization
No more LittleDataGraphics
Small data sets should be shown directly...LittleDataGraphics (pie charts, bar charts) translate and encode data into areas and colors. Viewers must then mentally translate codes back into numbers. These codes are unique to the local sets of data graphics, and do not repay learning. Instead, just directly show numbers as numbers. No more LittleDataGraphics. Data visualizations are at their best when there is so much data that the only way to see it...is to see it.
The Visual Information Seeking Mantra
There are many visual design guidelines but the basic principle might be summarized as the Visual Information Seeking Mantra:
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demand
Overview first, zoom and filter, then details-on-demandEach line represents one project in which I found myself rediscovering this principle and therefore wrote it down it as a reminder. It proved to be only a starting point in trying to characterize the multiple information visualization innovations occurring at university, government, and industry research labs.
Envisioning Information
A Book by Edward TufteBeautiful Evidence
A Book by Edward TufteThe Visual Display of Quantitative Information
A Book by Edward TufteThe Elements of Graphing Data
A Book by William S. ClevelandVision Science
A Book by Stephen E. PalmerVisual Explanations
A Book by Edward TufteVisualizing Algorithms
An Article by Mike BostockInformation Visualization: Perception for Design
A Book by Colin WareThe Eyes Have It
A Research Paper by Ben ShneidermanVisualizing Data
A Book by William S. ClevelandExploratory Data Analysis
A Book by John TukeyPlus Equals #4
An Article by Rob WeychertOne of the seeds for Plus Equals was planted a few years ago with Incomplete Open Cubes Revisited, my extension of a Sol LeWitt work. I learned a lot about isometric projection from that project, but my affection for the concept didn’t begin there. Whether I’m looking at a Chris Ware illustration or an exploded-view technical drawing of a complex machine, an isometric rendering always stirs something in me.
In search of visual texture
An Article by Rachel PruddenI’m now more inclined to attribute Looseleaf’s power to its visual texture than to some cognitive media-style abstraction. And the visual texture owes more to the beauty (yes, beauty!) of the original pdfs from the Vasulka Archive. Perhaps the demo is best understood not as a prototype generic tool, but as a specific curated experience in its own right, with form and content claiming equal importance in its overall success.
Even so, I think there are some general lessons that can be drawn from this demo:
- Content is not inert
- Visual texture lets content breathe
- Visual texture lets the eye wander without losing itself
Chartwell
A FontThis set of tools for easily creating graphs is conveniently disguised as a set of fonts. OpenType features are used to interpret and visualize the data. The data remains as editable text, allowing for painless updates.
Windy
A WebsiteBetter colormaps?
An Article by Mark LibermanA modest sample of alternative ways of coloring the same type of 2-D density plots of rates of F0 change and amplitude change.
ImageQuilts
A Tool by Edward Tuftepress.stripe.com
A WebsiteStripe partners with millions of the world’s most innovative businesses. These businesses are the result of many different inputs. Perhaps the most important ingredient is “ideas.”
Stripe Press highlights ideas that we think can be broadly useful. Some books contain entirely new material, some are collections of existing work reimagined, and others are republications of previous works that have remained relevant over time or have renewed relevance today.
Between the Words
An Artwork by Nicholas RougeuxMoby Dick.
Between the Words is an exploration of visual rhythm of punctuation in well-known literary works. All letters, numbers, spaces, and line breaks were removed from entire texts of classic stories...leaving only the punctuation in one continuous line of symbols in the order they appear in texts. The remaining punctuation was arranged in a spiral starting at the top center with markings for each chapter and classic illustrations at the center.
SeriesHeat
A Website by Jim VallandinghamSearch for a TV Series to see a heatmap of average IMDb ratings for each episode.
Time-based analytics
An Article by Ryan SingerAnalytics apps don't tell you much about usage behavior. You might be able to see how many users performed an event, or how many times they did it. But none of the analytics packages out there are good at showing you how often people do things. Are they using to-dos once a week? Every day? Only signing into the app once a month but happily paying for years?
Time matters. You can't understand usage without time.
Cameras and lenses
An Article by Bartosz CiechanowskiPictures have always been a meaningful part of the human experience. From the first cave drawings, to sketches and paintings, to modern photography, we’ve mastered the art of recording what we see.
Cameras and the lenses inside them may seem a little mystifying. In this blog post I’d like to explain not only how they work, but also how adjusting a few tunable parameters can produce fairly different results.
The Subtleties of Color
A Series by Robert SimmonThe use of color to display data is a solved problem, right? Just pick a palette from a drop-down menu (probably either a grayscale ramp or a rainbow), set start and end points, press “apply,” and you’re done. Although we all know it’s not that simple, that’s often how colors are chosen in the real world. As a result, many visualizations fail to represent the underlying data as well as they could.
tixy.land
A Websitesin(t * x) * cos(t * y)
Creative code golfing.
Zipdecode
A Website by Ben FryA Library Demand List
A Website by Robin SloanThis visualization takes the current New York Times Best Sellers list for combined print and e-book fiction and scales each title according to the demand for its e-book edition at a collection of U.S. public libraries, selected for their size and geographic diversity.
MIT Student Hub
An Article by Alex HogrefeThe project is located on the MIT Campus and will be a “Student Hub” containing restaurants, large event spaces, and smaller study spaces.
V-RESAS
An ApplicationAll in & with the flow
An Article by Buster BensonInfoCrystal
A Research PaperThis paper introduces a novel representation, called the InfoCrystal, that can be used as a visualization tool as well as a visual query language to help users search for information. The InfoCrystal visualizes all the possible relationships among N concepts.
Readings in Information Visualization: Using Vision to Think
A Book by Ben Shneiderman
The Elements of Typographic Style
Leave the road when you wish
The subject of this book is not typographic solitude, but the old, well-traveled roads at the core of the tradition: paths that each of us is free to follow or not, and to enter and leave when we choose – if only we know the paths are there and have a sense of where they lead. That freedom is denied us if the tradition is concealed or left for dead. Originality is everywhere, but much originality is blocked if the way back to earlier discoveries is cut or overgrown.
If you use this book as a guide, by all means leave the road when you wish. That is precisely the use of a road: to reach individually chosen points of departure. By all means break the rules, and break them beautifully, deliberately and well. That is one of the ends for which they exist.
Typography exists to honor content
In a world rife with unsolicited messages, typography must often draw attention to itself before it will be read. Yet in order to be read, it must relinquish the attention it has drawn. Typography with anything to say therefore aspired to a kind of statuesque transparency. Its other traditional goal is durability: not immunity to change, but a clear superiority to fashion. Typography at its best is a visual form of language linking timelessness and time.
Typographic style
Literary style, says Walter Benjamin, “is the power to move freely in the length and breadth of linguistic thinking without slipping into banality.” Typographic style, in this large and intelligence sense of the word, does not mean any particular style – my style or your style, or Neoclassical or Baroque style – but the power to move freely through the whole domain of typography, and to function at every step in a way that is graceful and vital instead of banal.
A state of energetic repose
Read the text before designing it.
Discover the outer logic of the typography in the inner logic of the text.
Make the visible relationship between the text and other elements (photographs, captions, tables, diagrams, notes) a reflection of their real relationship.
Give full typographic attention even to incidental details.
Invite the reader into the text.
Reveal the tenor and meaning of the text.
Clarify the structure and the order of the text.
Link the text with other existing elements.Induce a state of energetic repose, which is the ideal condition for reading.
Evenness of color
The density of texture in a written or typeset page is called its color.
Once the demands of legibility and logical order are satisfied, evenness of color is the typographer’s normal aim. And color in the typographic sense depends upon four things: the design of the type, the spacing between the letters, the spacing between the words, and the spacing between the lines. None is independent of the others.
A single note
The simplest scale is a single note, and sticking with a single note draws more attention to the other parameters, such as rhythm and inflection. The early Renaissance typographers set each book in a single font – that is, one face in one size. Their pages show what sensuous evenness of texture and variety of rhythm can be attained with a single font of type.
The higher courts
Refer typographic disputes to the higher courts of speech and thinking.
Type is idealized writing, and its normal function is to record idealized speech. Acronyms such as CD and TV or USA and UFO are set in caps because that is the way we pronounce them. Acronyms such as UNESCO, ASCII, and FORTRAN, which are pronounced not as letters but as words, are in the process of becoming precisely that. When a writer accepts them fully into her speech and urges readers to do likewise, it is time for the typographer to accept them into the common speech of typography by setting them in lower case. Other acronymic words, such as laser and radar, have long since traveled the same road.
An antiphonal geometry
A book is a flexible mirror of the mind and body. Its overall size and proportions, the color and texture of the paper, the sound it makes as the pages turn, and the smell of the paper, adhesive and ink, all blend with the size and form and placement of the type to reveal a little about the world in which it was made. If the book appears to be only a paper machine, produced at their own convenience by other machines, only machines will want to read it.
Sizing and spacing type, like composing and performing music or applying paint to canvas, is largely concerned with intervals and differences.
The page is a piece of paper. It is also a visible and tangible proportion, silently sounding the thoroughbass of the book. On it lies the textblock, which much answer to the page. The two together – page and textblock – produce an antiphonal geometry. That geometry alone can bond the reader to the book. Or conversely, it can put the reader to sleep, or put the reader’s nerves on edge, or drive the reader away.
Pure but silent
Architects build perfectly proportioned kitchens, living rooms and bedrooms in which their clients will make, among other things, a mess. Typographers likewise build perfectly proportioned pages, then distort them on demand. The text takes precedence over the purity of the design, and the typographic texture of the text takes precedence over the absolute proportions of the pure but silent page.
A sterile sameness
Another kind of random variation involves the interaction of the craftsman’s skill and the texture of materials. The letterforms of Griffo and Colines were cut with immense care. But the letters they cut were struck by hand in copper or brass, then cast and dressed and set by hand, inked by hand with handmade ink and printed by hand in a handmade wooden press on handmade paper. Every step along with way introduced small variations planned by no one. In the world of the finely honed machine, those human-scale textures are erased. A sterile sameness supervenes.
The computer is, on the face of it, an ideal device for reviving the old luxury of random variations at the threshold of perception (quite a different thing from chaos). But conventional typesetting software and hardware focuses instead on the unsustainable ideal of absolute control – and has been hamstrung in the past by the idea of a single glyph per character. There have been several recent attempts to introduce a layer of random variation, but all have had to work against the grain of technological development.
Waiting to repay the gift of vision
Like a forest or a garden or a field, an honest page of letters can absorb – and will repay – all the attention it is given. Much type now, however, is delivered to computer screens. It is a good deal harder to make text truly legible on screen than to render streaming video. Both fine technology and great restraint are required to make the screen as restful to the eyes as ordinary paper.
The underlying problem is that the screen mimics the sky instead of the earth. It bombards the eye with light instead of waiting to repay the gift of vision – like the petals of a flower, or the face of a thinking animal, or a well-made typographic page. And we read the screen the way we read the sky: in quick sweeps, guessing at the weather from the changing shapes of clouds, or in magnified small bits, like astronomers studying details. We look to it for clues and revelations more than wisdom. This makes it an attractive place for the open storage of pulverized information – names, dates, or library call numbers, for instance – but not so good a place for thoughtful text.
Respect
Respect the text first of all, the letterforms second, the type designer third, the foundry fourth.
The needs of the text should take precedence over the layout of the font, the integrity of the letterforms over the ego of the designer, the artistic sensibility of the designer over the foundry’s desire for profit, and the founder’s craft over a good deal else.
Little by little
Check every text you set to see where improvements can be made. Then return to the font and make them. Little by little, you and the instrument – the font, that is – will fuse, and the type you set will start to sing. Remember, though, this process never ends. There is no such thing as the perfect font.
An end in itself
Typography, like language, is more important to me for what it allows to happen than for anything it accomplishes on its own. I hope that in writing a book on the subject I have not given the impression that either typography or design is an end in itself.
Not as a star
But I’m warning you,
this is my last existence.
Not as a swallow, not as a maple,
not as a cat-tail and not as a star.