Content

*spark screenrunner

2012

*spark screenrunner runs screens. It allows the stage manager to title who is on stage, it allows creative to adjust the mix of the brand video, it allows communications to feed twitter and other messaging through that video. Most of all, it does all it does within a world of well designed motion graphics unique to the brand or event.

For an Accenture annual event, it visualised the activity of 900 consultant’s conversation in realtime, alongside the progress of each of them taking a portrait of each other and the graphic output of a data journalist and illustrator. Rather than brand video, the screen animated around a ‘tabletop set’ of the venue, with conversation turns appearing in speech bubbles above the yurts they were happening in, conversation outcomes writing themselves on post-its, polaroid snaps piling up and illustrations taped down around. It was the centre point of ‘The Brain’, and…

The Brain made #festivalofideas.
– Eithne Harley, Accenture Ireland

For a MADE-BY annual event, it transformed their three minute brand video into the whole day’s output, remixing the elements of that video with a range of media prepared for the event alongside tweets and photos coming live from the floor. MADE-BY’s staff were in control, setting ‘now and next’ titles and creating a composition of media appropriate for that moment of the event.

I thought the application was very user-friendly and generally just very impressive!
– Johanna Walker, MADE-BY London

*spark screenrunner is two things. An application with features built-up over the demands of differing events, and an animation template created specially for each event. The application feeds the animation template with tweets, titles and all sorts of media, and its interface presents a sane way of wrangling that media and controlling the animated output.

You can read more about its development and use through the project’s diary posts.

To use *spark screenrunner, get in touch.

Files

Diary entries

sheep music » pun me this

the latest visuals technology development to come off the *spark anvil is a mac-native titler application, made by wrapping a quartz composer patch with some fullscreen code and interface builder bindings. props to roger bolton of quartonian for the guts of the fullscreen xcode project, shared under gpl so expect to see the titler soon once it’s been tidied up.

truly came into its own during the ups and downs of the first day of the festival, where a huge rainfall threatened to wash away half the site. we could upload videos and images taken moments before, and pun the titles out till they got beyond baaaaaaaad. ‘shave yourself’ still my favourite.

*spark titler redux and release

as shown in the ‘pun me this’ entry, the *spark titler was used in nascent form at sheep music, and the promise to tidy-up and release as open-source software has been followed through. so, please find attached: sparktitler-v1.1.zip.

the titler’s interface allows you to take between two sets of title/subtitle, with the choice of four backgrounds: black / green / a quicktime movie or a folder of images. the output window will automatically go full-screen on the second monitor if it detects one is available at launch, otherwise it will remain a resizable conventional window.

it is released with the intention that it can be reused for other events without changing a single line of code: you can design the animation and incorporate quicktime movies in the design by editing the ‘GFX’ macro in the quartz composer patch, and its a matter of drag and drop replace the logo in the interface.

for those who wish to dig deeper and improve the whole package, the source is released under GPL. the xcode project provides an adequate shell for the patch, implemented with just two cocoa classes and an nib file complete with bindings between the qc patch and the interface window. the classes are required to tell the quartz composer patch where to find the resource directory of the application’s bundle (neccessary for any ‘image with movie’ nodes), and to subclass the output window so it is sent borderless to the second display if appropriate. features apart, there is certainly room for improvement, a ‘open file’ dialog instead of the raw text fields would be good, likewise solving the text field update issue.

if you do use it, let us know: operator@tobyz.net

royal opera house + mike figgis

phone call from friend louis: “help me with mike figgis at the royal opera house”. certainly. watching timecode live with figgis reworking the playback and audio was a seminal experience for me. this however is not that, rather a weekend of curated stuff spread throughout the royal opera house’s many spaces. and in the middle, a screen driven by me: live cameras, live graphics, and edits through the film-making people+pipe louis has (impressively) put together.

*spark titler v2

and how did those live graphics make it to the screen? i sat down and took the idea of *spark titler from sheep music and remade it as a fully fledged cocoa+quartz composer application. the idea being it can’t muck up: animation designed to gracefully transfer from state to state, participant names pre-filled in a drop-down menu, no mouse cursors on the output, text fields that commit their edits on pressing take… the little details that make-or-break a live application. oh - and it exports its title animations as quicktimes for integration with playback pro.

*spark titler v3: for them, not me

thats my laptop, but not my hands. if i can write software to make it more fool-proof for me to drive big, important screens, could that same approach empower organisations to drive their own screens?

if you catch me while i’m thinking about that with a beautifully animated video explaining your work transforming the ethics of the fashion industry and an annual event coming up, am i going to suggest working with me on a journey to find out? of course.

and so at mady-by’s annual event, it was made-by’s joanna who knowing the people, the running order, the messaging, made the screen reflect that.

*spark titler v3: live brand video [in]

how did joanna run the screen? with *spark titler v3: no longer a now-and-next titler, more the means for a live brand video. into an animation template go tweets, titles and all sorts of media, and the user is presented with a sane way of wrangling that media and controlling the output.

the app as a whole is mac-native in the best of ways, with the behaviours a naive user might expect. i’m especially proud of the interface, which takes the standard elements and extends them where necessary[1], all to be used without fear of killing the output or screwing up the content.


  1. suffice to say i now know a lot more about subclassing cocoa views than i used to: say hello SPKTableView and SPKArrayController ↩︎

*spark titler v3: live brand video [out]

sane control of the media and scenography needs to be partnered with the animation mechanics to handle it all gracefully. luckily, thats what i do – and what tools like quartz composer enable – and i had the best materials to work with in the form of made-by’s brand video. it’s great. watch it, and you’ll also see how perfect it was to be remade into a never-ending animation with dynamic content interspersed with the hand-animated elements.

best of all, now i have the interface and back-end largely worked out i can concentrate on creating bespoke animation for future gigs: everybody wins.

festival of ideas » 900 people and 20 hexayurts

a big convention centre, not so much sleep, and it’s barely dawn: back to high-stakes corporate events. there’s a good reason for taking some time out from the phd to be here: this is interesting, innovative stuff, embracing what a live event can bring, and doing it a long-term context of strategic and organisational renewal.

the photo – credit matthew thompson – shows the bulk of those people, and a smattering of the twenty hexayurts it was their first task of the day to build.

festival of ideas » in those yurts, 200 conversations

and why the twenty hexayurts? they were there to partition off the main business of the day: facilitated conversation in small groups. some form of internal market had been conducted in advance to arrive at the best 200 suggestions for topics, and the proposers were there to host each session. suffice to say, there were going to be a lot of ideas. and this is where we came in: could we capture them? visualise them? archive them?

“we” were stef and i, reforming our rave-era visuals partnership in our decidedly more rarified present – he a webby winner, clore fellow, top five of the observer future 500 (need i go on!?), and me deep on a journey of reorienting live events from the passive observation of ever more spectacle to something that builds on the character of liveness as i’ve experienced it, that exploits the potential of here and now of us together.

stef told me of the blue-sky conversations he’d had with the event’s mastermind, inspired arts producer boz temple-morris who had earned the trust of a corporate client to really explore what their events could be, and more importantly be for. this time, it all seemed to be around yurts, facilitated conversation, and the event being precisely the opposite of a bubble – the lynchpin of an on-going process yes, but that on-going process very much the thing.

a day or two later, stef had taken a conversation annotation web-app from idea to prototype. this was serious, and so i introduced stef to ford vj, kinetxt and how my *spark titler was changing the game of running screens at organisation’s events. there was something big and interesting that we could do here.

in the photo above, there’s a facilitated conversation in full flow, and on laptop the stef’s corporate-IT grade version of that original prototype[1]. most importantly, its enmeshed with all the other instances of the web-app in the room, and – drumroll – with our setup.

hardening and security is one thing, just don’t talk to stef about last minute requests for IE8 support on XP…


  1. ↩︎

festival of ideas » and portraits taken of everybody, by everybody

if you’re going to gather all your staff for a one-off event, why not take the opportunity while you’re at it to make a company portrait? this being a boz affair, however, its not a case of a photographer marshalling the troops into one shot. rather, everybody is tasked with taking everybody else’s photo - cue each pair having that connected moment of “oh, i don’t want a disastrous photo of me: do as you’d like done to you”. and, this being this, we also had them caption themselves with their favourite place to think and suchlike, and that camera and app was also wirelessly linked to our setup.

festival of ideas » all feeding into 'the brain'

This is the Brain.

We are using experimental thought-casting technology to display in real-time the ideas and thoughts are emerging at this moment, inside the Hexayurts and elsewhere. Come join our artists and coders in drawing it all together: talk to us, doodle with us as we find the emergent themes, trends and stories.

festival of ideas » interfaced, interpreted, illustrated

clockwise from top left

  • ciaran lucas illustrating key ideas and playing with post-its and sharpies across the venue
  • stef lewandowski live coding
  • caroline beavon plugging the data into spreadsheets galore on the data-journalism tip
  • carolyn jones wrangling everything and everybody together
  • yours truly, at this moment dealing with the good problem of having so much data coming in, the visualisation needed re-scaling

the physicality doesn’t match up to kinetxt’s, but there are definite and deliberate echoes here. its not a big ‘visual rock band’ performing realtime story-telling from audience contributions, but perhaps released from the demands of that, we finally delivered on some of those original ideals of transforming a sea of contributed snippets into something meaningful and coherent.

photo credits matthew thompson

festival of ideas » channeled through *spark screenrunner

at the heart of the brain was the increasingly inappropriately named *spark titler, collating all the media and channelling it to the screen. it runs the screen, and gives just what you need to be responsive to the moment without breaking the visual illusion. so… *spark screenrunner?

whatever its grown-up name is, it monitored a fileshare for photos incoming from the caption-shot camera, illustrations and data-vis from ciaran and caroline’s laptops, listened to twitter accounts and hashtags, and, wonderfully, got updates in real-time from convotate, stef’s conversation annotation web-app. a technical shout-out here to pusher, the HTML5 websocket powered realtime messaging service, and to luke redpath’s objective-c library. and via the venue’s many-input HD vision mixer and a quartz composer patch or so more, we had treated feeds from above ciaran’s illustration pad, photoshop screen and whatnot.

it might be that you have to do this kind of job to grok the need, but i really think there’s something in *spark screenrunner, whether its just titling and transitioning between two presenters’ powerpoints or this kind of high-end craziness.

festival of ideas » animating around a 3d diorama of post-its and plastic

after a bout of yet more *spark screenrunner back-end building up – libPusher, ‘event’ document packages that encapsulate the media and graphic template, the all important enqueue new – it was onto what really set this gig apart.

visually, i’d always thought of the rendered output as 2d motion graphics, the made by movie re-working being the canonical example. but here the content wasn’t coming in from the virtual ether, or just signing who was in front of the screen, we were visualising the venue we were in, and it was laid out with yurts, with conversation threads and ideas coming from each of them. we needed a map, we needed a way of collating the ideas… and one-creative-process-later, i was loving the result: animating around a 3d tabletop diorama of post-its and plastic yurt board-game pieces, with polaroid snaps falling down on one side and A4 sheets sellotaped down on the other.

true 3d in quartz composer was a branch out into the unknown for me, and not without its developer terror moments finding out what it was happy with and what it wasn’t. bottom line, while there’s issues a-plenty with qc’s 3d rendering, couple it with sketchup for quick 3d modelling and globs of javascript to handle the data-scape, colour me impressed. it was captivating watching the animation unfold as the live content came in - and a proud moment.

festival of ideas » and out into the venue

…aaaaand, no more test data. we did so much more than can be shown in a still or two here, we even pulled a whole four minute finale piece out of the bag, video edit and all[1]. most of all, we did it, the audience made it… live!

Amazing event. Loving the Brain! #festivalofideas
Alice Murphy @almurph75
Thanks. We’re having a brilliant day too!
Accenture Ireland @Accenture_Irl

Over 2000 ideas have flown through ‘the brain’ @ @Accenture_Irl #festivalofideas.
Andrew Hetherington @a_hetherington
Wow & we’ve still got the afternoon!
Accenture Ireland @Accenture_Irl

Still buzzing a little after #festivalofideas yesterday. I think the crash will hit hard!
Carolyn Jones (Cj) @TheWidget
@TheWidget you guys were great. The Brain made #festivalofideas. Hopefully we’ll see you again some where, some time…
Eithne Harley @EithneHarley


  1. i’m learning: never has under-promise and over-deliver been so clear in my mind! ↩︎

lpm'12 » *spark's stall: mixers, screenrunners, and making it as post-vj

in which i set out my stall, hawking the wares and ideas that have helped make my ‘post-vj’ life. half an hour, somewhat off the cuff, and probably ill-advised in parts. the bulk of the talk covers some of the backroom work and event life of the dvi mixer hardware and screenrunner software projects, but contextualised by how i. vjs should work towards exploiting the liveness possible in their practice, ii. which should lead to a more rewarding, less clichéd life, iii. and one more profitable and sustainable.

b-seite » *spark's stall out again

b-seite charge one: provoke vjs into thinking about the future of their practice, via showing the toys and talk about how i made it as a post-vj. this was a tidied up version of the talk i improvised at LPM last year, except that then the mixer was a final prototype, and here I was at a festival with two d-fusers as part of their tech setup. mixer’s i’d sold but had never seen, the boxes opened up by hands other than mine, in a country far away.

SPK-RectPack

a screenrunner client wanted an animating tiled layout. it’s surprisingly non-trivial to code, at least if you want to go beyond hard-coding a few grid layouts. thankfully, the problem is academically interesting too, and lo! there’s a paper on spatial packing of rectangles, complete with MaxBinRectPack algorithm and c++ implementation. respect to jukka jylänki.

getting this working for me was time worth investing, and i’ve released the results: a quartz composer patch and animation technique. it’s up on github, and is something best seen in action, so check the quick demo video on vimeo.

igloo creative coding night

james sheridan saw SPK-RectPack, and invited me to see the dome setup he develops the tech for: igloo, the company, could do with something like screenrunner running in the dome, and more generally james is a creative-coding guy keen to meet like-minds. well, i was impressed; it wasn’t long before screenrunner was running on the dome’s mac pro[1], and not long after that james was organising a creative coding night in their mini demo dome.

as part of that he invited the london quartz composer group along, and invited me to show what quartz composer was doing in screenrunner. i was happy to talk about it[2], i really like the mix of cocoa for the app, OpenGL + QCRenderer for the rendering engine and Quartz Composer.app to visually patch each client’s bespoke design and animation together. it’s not often i can show what lies underneath!


  1. happily rendering 9600x1080 and handing this over to james’s openframeworks edge-blending dome warper via syphon. the ease and painless 60fps of this blew my mind. ↩︎

  2. doubly so as tom butterworth would also be there, and in thanks for ^1 i could buy him a real — not over the internet — syphon pint in thanks and respect. https://twitter.com/tobyspark/status/433157752073224192 ↩︎

gallery life project

brilliant. 500 kids with tourettes in the most august tate britain. madness, expertly facilitated by tourettes hero with friends chris+keir amongst other artists. super happy to have my software screenrunner feeding the event back into itself, messages and photos of the kid’s “research” getting onto screens live as the events happened.

bowers & wilkins visual test

an offer i couldn’t refuse from friends artists + engineers: high-end soundsystem, 360° screen, barcelona. or at least an offer i had to make work somehow: the phd giving no time for the full content-creation and performance brief, instead some oversight for talent and tech.

part of this has become stage-managing the screen, and so out comes screenrunner; act names spinning in and out around the dome’s screen, live input for guest acts, and a default ‘screensaver’ state. the photo is a happy session developing the realtime effect to animate any non-dome materials around the dome’s screen, in igloo’s london test facility.

screenrunner at the tower of london

the architectural contrast was wonderful. in the scene, an igloo 12m dome. in that dome, a media server running videos and screenrunner.

screenrunner for the tower of london

screenrunner with animation templates for use first by historic royal palaces themselves and then renaissance foundation, photo’d. i do love a 9,600px canvas full of photos animating around.

b&w primvera setup

suffice to say, they sounded good. real good.

b&w primavera venue

bowers and wilkins wanted the best sound, and they wanted the best package around. this is a 21m igloo dome, and as venue it was pretty much perfect.

immersive sound, immersive visuals; just the right balance of intimacy with the artists vs. massed excitement of the crowd.

b&w primavera live

boom! excellent live acts and djs, amazing 360° visuals from blinkin lab, florence to and jack featherstone, packed with punters from 9pm to sunrise every day.

there’s a b&w video here: blog.bowers-wilkins.com

b&w primavera video

canal180 shot this nice video of what we, as artists & engineers, were up to with bowers & wilkins. and to my bemusement, a shot of my hairy chest has defaulted to be the poster image on vimeo’s page.

#pixelslettredamour

can you projection map tweets?

of course, i reply to friends at observatory. and a bespoke animation template is made for screenrunner, a license is minted, and soon enough a french team is projecting love letters onto a church in lille. went down well, too: “your creation has been really well appreciated. lots of people, lots of tweet, lots of lovely messages and déclarations. was great to see so much love.”

there’s some tweaks observatory and i would have made if we’d been there in person, but so it goes. overall, observatory made a lovely video piece.

photo via video mapping festival

bristech 2019 » screenrunner

bristech has had some really nice brand identity work done, making it a pleasure to transform the static document into a dynamic animation template. and with that, screenrunner ran the social area screen at their annual conference.

fun day, and a nice way to say thanks to the organisers for some enthusiastic networking they did for me.