Text Visualization with Paper and Yarn

"I am quite content to go down to posterity as a scissors and paste man for that seems to me a harsh but not unjust description."—James Joyce

So, let's say you took Gabler's edition of Ulysses, photocopied each page of "Wandering Rocks" (episode 10) at 50% of its normal size, and then taped them all together. You now have one long piece of paper. Cut at the breaks between the nineteen sections of which the episode is composed and you have nineteen pieces of paper—one for each of the episode's sections. The sizes of these pieces, of course, would vary; the first (describing Father Conmee's walk and trip on the tram) would be the longest.

Next, grab some yarn and some paper clips (because they're handy). Cut some short lengths of yarn. Tie a paper clip to each end. Now let's have a look at the second sheet ("Text Interruptions") in this Google Doc, containing a list of moments in "Wandering Rocks" where a recognizable line from one section intrudes in another. Take one end of your paper-clip/yarn device and clip to the line where a reference occurs; connected the other side to the area referenced (the Gabler edition has lines numbers; that is chiefly why we're using).

When all is said and done, with some variability depending on how exactly you connect things, you might have something that looks like this:

Wandering Rocks, Visualized in Paper

(Check out this Flickr image for an annotated version of the same image.)

This is a sort of basic visualization of the connections between the sections of "Wandering Rocks." Using scissors and some basic office supplies you can begin to get a grip on how, precisely, the various sections of the episode related to one another.

This only visualizes, however, one of the ways in which these sections are connected. Certain characters, for example, help synchronize the sections by appearing in more than one section: this is not visualized (perhaps we could highlight proper names which occur in more than one section; or connect them with a different colored thread). Location also helps synchronize the sections: Bloom, Stephen, and his sister all appear at the book stall, for instance. Maybe we could lay the nineteen pieces of paper out on a map (how would we handle the episodes where characters are moving?). You'll notice that I haven't even tried to make sense of the final, nineteenth section, where many of the characters see the cavalcade as it moves through Dublin (its movement appears in a number of other sections too). Have a look at the Google Doc to see my raw data; if you think you can improve it, email me (cforster @ virginia.edu) and I'll happily add you as an editor for the document.

It is also worth remembering that the chief unit of analysis here is the "line" in the Gabler edition. But all "lines" within the narration are not equal in terms of the time narrated. So you can line up the sections based on the synchronizations within the sections; but these provide only a point of synchronization; you cannot extrapolate out beyond that point.

There isn't too much to be learned from this very basic attempt to get a handle on the complexity of this episode. But it does seem interesting that sections tend to branch out—rather than, for instance, many sections all referring to one section (though this situation is precisely that of the final section, which I have ignored; and, in another, of Father Conmee's walk which, through its geographical progression, may relate to other sections in ways I have ignored).

This yarn stuff is fun, but wouldn't it be nice to have this digitally? Let's take this and do it in processing. In trying to write up in code this same visualization, I think the chief lesson of playing with yarn is that there are essentially two key types of objects for this analysis: chunks of text (representable as a rectangle of length propotional to the amount of text they represent); and flexible connections between parts of the text (not necessarily between sections: a link could, theoretically, be within a single section).

These two types of things were instatiated as two basic classes in my code: textChunk and connection. A textChunk contains its starting line and ending line, its length (computed as the difference between those first two pieces of data; I keep it onboard rather than re-computing it constantly), and a quick description (stored as a String); each textChunk object also contains the coordinates of its current location on the screen. The connection objects similarly contain the points they link together (stored as simply two integers representing the two line numbers that are linked; we don't even need x,y coordinates since we're working with a basically one dimensional representation of the text here). There are also a handful of methods for these objects: constructors to load up the data (though the way the data is currently stored/loaded is an embarassment); some methods to draw the objects, etc.

Here is what is looks like, comparing my yarn visualization with my version in processing (not too bad, huh?):

Two Visualizations Compared: One Paper, One Digital

(In mapping things out, I got some of the inspiration here from my friend & colleague Jean Bauer's much more sophisticated tool for visualizing relational databases, Davila, also written in processing; originally I was simply going to gut her code and repurpose it here; but her code is far more elegant than mine, and is designed for situations far more complex. It made sense to just start from scratch.)

Each object bridges the gap between what it represents (which remains basically static) and the current state of its representation (which can be moved around and interacted with).

Wandering Rocks Visualized

The interactions are basic. You can grab each textChunk and move it around manually. Hovering over a block will produce a little description of that block in the white section near the bottom of the window. You can hit 'a' and the blocks will automatically align. That function isn't working entirely perfectly yet, so I had to do manually massage things a bit to get them to look as these do above.

But as you move the blocks around, the connections stretch and keep the links between the sections evident. The blocks lined up on the right hand side are those without connections. (Oh yeah, those curved white lines; they're my beginning of an attempt to mark the skiff's progress.)

There would be other ways to begin visualizing "Wandering Rocks" (and I'd love to hear suggestions). And there are certainly ways to improve this one. One could attach the entire text (its available through Project Gutenberg y'know) of each section; though I'm not sure what the advantage would be of doing that would be. The colors just alternate now (for odd and even sections), to avoid sheer monochromatism. But the color of the textChunk could be tied to location or character; similarly the color of the connection could be made meaningful in some way.

I may post the code if I can get it cleaned up enough; if you'd like to see it in its current state, just email me, and I'll chuck you a tar ball with everything as it stands.

What we're playing with here is the tension between narrated time and narrative time. This neglects the entire dimension of space, which is central to the text of "Wandering Rocks" itself. In the comments of my previous post, crazymonk pointed to these maps from the wonderful Robot Wisdom site which is full of interesting Joyce material. The next step on this odd little project will be to continue to improve this visualization with an eye to moving towards a mapped visualization of the action of the episode. The simultaneity I've trying to visualize here is directly connected to the way the episode attempts to unify diverse locations. Bringing together a basic geographical representation of the episode's action (and the action of the novel) with the concerns I'm tinkering with here, would allow this visualization to move from merely playing to something else I think... Of which, more anon (or, anonish).