Here’s a list of links to works cited in my recent talk “Storytelling in the Age of Divided Screens” at Gallaudet University. Thanks to the Motion Light Lab for inviting me!.
Adobe has posed a Connect archive of the ‘Designing for Convergence’ panel I was on with Dmitri Siegel of Urban Outfitters and Peter Lunenfeld of Art Center College of Design back in November. I enjoyed this panel—Dmitri showed a selection of his recent projects with Urban Outfitters and Peter spoke about some the ideas in his forthcoming book The Secret War Between Downloading and Uploading. I showed some recent work, including Swing, SpringGraph database visualizations for Vectors, and a sneak peek at the Wii remote-enabled interface for Blood Sugar, the follow-up project to Public Secrets I’m currently working on with Sharon Daniel. We also got into some interesting discussions about professional vs. amateur creative output on the web and ways in which the Wii remote could be used to make experimental interactivity more accessible in installation or gallery settings. Take a look at the Connect archive here; there’s also a page featuring archives from other discussions in the series.
This is the final installment of a four-part graphical dissection of the “slabtype” text layout algorithm I developed for Public Secrets. For an introduction to the algorithm, visit The slabtype algorithm, Part 1: Background. To review some calculations that set the stage, visit Part 2: Initial calculations. To get into the real meat of the algorithm, visit Part 3: Iterative line splitting.
In this post, we’ll wrap things up by doing our final layout of the text, followed by the source code for the algorithm. The iterative sequence we explored in the previous installment successfully turned our original text:
into seven separate lines:
We’re almost done. Our next task is to assemble these lines into a slab by scaling them all to an identical pixel width:
And finally, to scale the entire slab to fit inside the original box, allowing for a minimum amount of padding on each side:
And with that, the algorithm has run its course. In conjunction with the treemap algorithm, the slabtype algorithm allows us to dynamically lay out the entire contents of a screen like this
using only a collection of quotes as a starting point. Due to randomization in the input to the treemap algorithm, even identical collections of quotes are never laid out in exactly the same way. Within Public Secrets, you can briefly see the dynamism of the slabtype algorithm in action when a box containing a quote resizes as it moves from one location to another—the text inside shifts around to keep pace with the changing dimensions of its enclosing rectangle.
This algorithm was included in Public Secrets as a method called formatInscription, which is reproduced below (AS 2.0). I hope this has been a useful exercise—I’d love to get your feedback, questions, or suggestions for improvement.
This is the third in a four-part graphical dissection of the “slabtype” text layout algorithm I developed for Public Secrets. For an introduction to the algorithm, visit The slabtype algorithm, Part 1: Background. To review the calculations that set the stage for this post, visit Part 2: Initial calculations.
In this post, we’ll take up the real workhorse of the slabtype algorithm—iterative line splitting—followed by the final layout of the text.
Our initial calculations provided us with a single very important number: 8, our ideal character count per line. This number gives us a target to aim for as we split our text into individual lines. We start by dividing our text into its constituent words:
Next, we execute the following iterative sequence:
Here’s a diagram of how we arrive at our first line using this sequence:
In this example, our two word containers initially hold the words “I and “I WISH. Neither of these exceed the ideal character count per line, so we continue adding words, giving us “I WISH and “I WISH IT. The latter is ten characters long, two characters longer than our ideal character count per line of eight. Since the former is seven characters long, resulting in only a one-character difference between its length and the ideal, we store “I WISH as the contents as the first line of the slab.
Here’s how we arrive at the next line:
Here, we have a very similar case. Neither IT nor IT WAS exceed the ideal character count, so we proceed to IT WAS and IT WAS THAT. IT WAS is only two characters off the ideal, compared to three characters for IT WAS THAT, so we pick the former.
The third line plays out a bit differently. With THAT and THAT SIMPLE, we find that THAT SIMPLE’s character count of eleven is nearer the target of eight than THAT’s character count of four, so we go with the latter.
The fourth line plays out much like the first two:
While the fifth pass chooses the first of the two text containers:
The sixth finds ERASE MY matching the ideal character count per line exactly:
Leaving PAST” as our only remaining word, which becomes a line unto itself.
Since we have exhausted our available words, the iterative part of the algorithm ends, resulting in our original text being split into seven lines:
For the final installment, we’ll turn our attention to laying out the text within the target box (source code will be provided).
Here’s a list of links to works cited in my recent talk “Storytelling in the Age of Divided Screens” at Gallaudet University.
I’m very happy to announce the launch of “Timeframing: The Art of Comics on Screens,” a new website that explores what comics have to teach us about creative communication in the age of screen media.
To celebrate the launch of Upgrade Soul, here’s a screen shot of an eleven year old prototype I made that sets artwork from Will Eisner’s “The Treasure of Avenue ‘C’” (a story from New York: The Big City) in two dynamically resizable panels.
The last couple of months have seen an uptick in published commentary on Strange Rain, much of it owing to notice the app received at this year’s Modern Language Association conference in Seattle.
Dialogue bubbles huddle together in the Unity authoring environment like backstage theatre performers awaiting their chance to shine in the forthcoming iOS and Android release Upgrade Soul, from Opertoon.