How we made the analog twitter wall
A short description of the software’s architecture.
For an introduction and video documentation of the project, have a look at this blog post
Since we couldn’t test the installation as a whole and there were a lot of issues we couldn’t control or anticipate, we constructed the software behind the analog twitter wall with great flexibility in mind. We separated it into 5 parts that we could pause and modify independently while the installation was running. Each part kept track of their own job-queue.
Part 1: Reading Tweets
Using Node.js + nTwitter we listened to Twitter’s streaming API and collected all tweets with the conference hashtag #rp12. We parsed the entities of each tweet and saved mentions and hashtags. Attendees at the conference could register themselves by sending the hashtag #action once. Their following tweets were displayed bigger.
Part 2: Analysing Data
This piece of the software analyzed the tweets on a per minute basis. It determined and saved all the information necessary for laying out the pages. The script counted the tweets per minute, analyzed local trending topics (based on the conference hashtag), picked a top tweet by follower count and a tweet containing a photo.
Part 3: Rendering Pages
We used HTML to layout the tweets and statistics. This added speed and flexibility in the design process and made it easy for us to use different fonts. Linotype supported us by providing a set of webfonts from fonts.com which we used to set the top tweets.
With wkhtmltopdf the HTML layout, delivered by a local express.js server, was “printed” to PDF.
Part 4: Processing Pages
A custom Processing app split the generated PDF file into single PNG images for post-processing. The app created copy aesthetics and artifacts forming the letters ACT!ON. The shape of the letters was defined as SVG. The Processing app scaled, transformed and clipped the SVG-path to match the sheet of paper. By turning this path into a mask, we could filter and multiply the image.
Part 5: Printing
To speed up the communication between computer and printer, this last part of the application bundled the processed PNGs into a PDF file before sending it to the printer.
HTML, PDF, SVG, PNG