CIID 09/10: Tangible User Interfaces

Our penultimate course, prior to shifting focus to the thesis, was a 4 week investigation into tangible user interfaces. I was particularly looking forward to this course, as it promised to put a new perspective on my background in industrial design.

More than any course to date, these four weeks were defined almost exclusively by the project – there was some (semi-optional) reading, there were crits, sure, but looking back, there isn’t much else I remember other than working on the project itself, which is a bit different than most of the previous courses, where project work was combined with lectures and smaller exercises. Maybe working in pairs, rather than larger groups, allowed us to be more focused on the project itself, rather than the process (challenge) of getting something done. Or perhaps because we had previously covered both the technical skills we needed for TUI in physical computing, and all the elements of the design process across other courses, that this was one of the first opportunities to apply and explore from beginning to end, rather than push beyond what we knew. So these notes from the course are basically the story of the project I worked on together with Shruti, Knock Knock.


Our starting point was to consider the context of the home office, people working completely or in part from the same space they called home – thinking about permeability, blurred boundaries, split lives, etc. The brief served as a great point of departure, but we were happy, from the start, to bend the constraints if we felt the need to.

We started off with some research, talking to and observing a couple of people who worked primarily from home. I’m not sure if it helped or not that one of the people we were interviewing turned out to know more about the history, theory, and discussions of TUIs than we did, but it certainly made it interesting!

Some of the interesting things that came out of the research our were: needing the solitude to work, but it often being lonely; working from cafes for the ambient sociability; working across timezones creates challenges; not having to fit into normal office hours both a challenge and a blessing; collaborating without being in the same physical space; being nocturnal, finding own rhythm and most productive hours; creating rewards for self – coffee, lunch, etc; broadcasting productivity and presence; …

What was interesting in terms of process was that we weren’t looking to target a product at anybody, per se – this wasn’t a commercial (or psuedo-commercial in an academic context) project. We were looking for a spark, something to give us direction, inspiration. Later on, the research also served as a constant reminder of where we had started from, and as a useful guide when we needed to get back on track.

Quite quickly, we zeroed in on the basic concept: a device that allows two people to communicate across distance; initially like an ambient IM-status-indicator, although later more ‘message’ than ‘status’. Ambient, not on screen, physical; unobtrusive, ignorable. Connecting to those close to you, without being in the same location. etc.

Which, as Adam Greenfield quite rightly pointed out back in 2008, has become a cliché (at least, we were pretty close: “Interaction Design Cliché No. 1: The pillow you hug, causing its remote twin owned by your lover 3000 miles away, to light up or vibrate.”) – as Michal Migurski points out in his comment, maybe it’s simply an obvious first reaction to the possibilities of networked objects, of the possibilities of the Arduino platform and physical computing. We weren’t even the only pair in our class to be having exactly the same thoughts and discussions. Michal describes it as Est. ~2004, Ivrea, so at least we were continuing a proud tradition.

Initially, we were so focused on what it did, that the form itself was to be no more than a vessel for behavior; something to disappear completely. Not a pillow, but perhaps even simpler – we were imagining cubes, cuboids, simple white geometric objects, possibly in multiples, maybe stackable. Probably glowing, in some form or another. We played with how they would behave, both individually and as groups – how to turn them on and off, how to send a message or change status. What could they do alone, or next to each other, or stacked, or when interacted with in different ways? When tapped, stroked, rotated?

As we played around with what else it could become, we moved away from glowing cubes to objects that worked with sound – knocking, tapping, grating. Perhaps it could mimic whatever sound you made at the other end? a soft tap, a hard thwack. maybe different faces could be made of different materials, which could indicate different meanings – tap the wood and get a hollow thud, the ceramic or glass side and get more of a ping. There was something nice about it, a strong core, but slowly, I felt, feature creep was setting in, and it was getting a bit messy.

And then, suddenly, in a tutorial discussing all these options, an idea jumped on us, starting with an idle thought – can’t “it”, whatever it is, hit other materials? Perhaps, metaphorically, like a woodpecker, sending signals in the woods?

After the meeting, we looked at each other… why not actually make it a woodpecker? Not as a metaphor… but literally? Suddenly, although the function hadn’t really changed, the project took on a different complexion. Glowing, or even vibrating or knocking, cubes felt like archetypal interaction design student projects… but a woodpecker was fun. It was a clean, simple idea. There were glints in our eyes when we discussed it. It suddenly had the potential, as Shruti said, to become “a joyful object”.

So, that was settled. A joyful object it would become. Now just to execute, to fulfill that potential.

[the first woodpecker in my sketchbook, and one of the first functional prototypes]

We had agreed on what it was, and, broadly, on what it should do. Now we had the dual challenges of creating a form that communicated that playfulness, and creating the internals that would enable it to behave as we intended, both in terms of the physical mechanics – receive signal from other woodpecker, so autonomously and mechanically move – and in software.

We moved back and forth between sketches, Rhino 3d, foam and even clay models, laser cut acrylic; often, whatever the latest development in terms of form met the latest in terms of electronics – first breadboards and arduinos, later a custom PCB, combined with the various components that actually moved things, primarily a solenoid.

At it’s simplest, it was a networked solenoid in a case. But of course, it wasn’t really that simple: we filled the wall with drawings of woodpeckers – true to life, completely abstracted, and variations in between, trying to identify the essence of a woodpecker. I filled pages of my sketchbook and folders with versions of CAD files trying to figure out how we might make the thing. We ordered components, that then turned out not to be strong enough – solenoids salvaged from 70s audio equipment eventually did the trick, when we pumped enough power through them. We laser-cut sheets and sheets of acrylic. I wasted lots of material. Shruti burnt an arduino, with a puff of smoke. We slept less and less.

Form and function and material choice were all interwoven – the components did certain things and moved in certain ways, which defined certain elements of the internal shape, which obviously impacted the external form. Internal space – both in terms of total space, but also in terms of how big a moment around the central pivot point we could create – was vital. As was the overall weight: too heavy and nothing would move, and the concept was dead. Weight and size both defined the components we needed, and vice versa.

A question we kept coming back to, and pushing away, was what to make it from, how to manufacture it?

  • Beautifully polished wood? (too heavy)
  • Modelling foam, painted white/grey (Muji-esque) or bright colours (toys)?
  • Fiberglass or carbon fiber? (expensive, and… where?)
  • Vacuum formed plastic? (big split line, not the right materiality)
  • Porcelain? (heavy, and even if strong, communicates fragility)
  • folded/bent polyprop sheet? (mjeh)
  • Bent/folded ply? (heavy, difficult to achieve accurately)

Having made plenty of models during my time at Brunel, I foresaw much pain with some of those options, particularly those that required the final form to be hand-crafted from a solid lump. Any wall thickness had to be exceptionally thin – the whole thing had to be lightweight. There was also the question of the beak, which was to hit the surface on which the entire bird was mounted. Obviously, it had to be solid, and not fragile, or chip on impact. And to top it off, the entire object had to feel (as opposed to be) strong, and be inviting to the touch. A non-trivial spec list of oft-conflicting requirements!

In the end, I hit upon using cardboard – not as a cheap and messy prototyping material, but as the final, finished material. Together with acrylic sheet for a central frame, including the beak, it ticked all the right boxes: it’s cheap, it’s light. It’s strong, at least in one direction, and that’s all we needed. It is warm and inviting to the touch – we quickly agreed that we didn’t want to end up with ‘cyber-bird’. The acrylic (sanded, painted) allowed us to inject an element of colour, of very different materiality, while the card, cut with the laser-cutter and stacked, gave the object something natural.

To start with, I created a basic three dimensional form in Rhino, with the right dimensions and proportions, which was then sliced into the levels of the right thickness (we used 4mm cardboard. It was initially calculated for 3mm slices, which when I put it together with 4mm card, made for a very chubby bird!). From there on, the form was refined in 2d. It was quite an interesting challenge to imagine a 3d form, but implementing it in 2d; getting a feel for where each layer was, where each curve started and ended. While it wouldn’t have been too hard to make a script or grasshopper pattern to take care of the conversion from form to shapes, I liked doing it in the slower way. It was manual and perhaps roundabout, but it was nice to have that level of control over the curves and ultimately, the form itself. It meant we worked in layers, as it would end up, not in a mythical smooth shape, which it would never become. It mean we could feel the limitations, constraints, and, in a way, the affordances of the material and process, even in CAD. I could feel the resistance of the materials and chosen manufacturing process, and design with then, not against.

Our desk was permanently littered with mostly two dimensional acrylic outlines, and towards the end, more and more cardboard forms. People often asked what we were going to make the final thing out of – the cardboard was just for testing, right? No no, we assured them – this is what it’s gonna be.

There was something beautiful and perhaps unexpected about the card. For a material so abundant, usually considered disposable, it’s remarkably versatile. It cuts cleanly, giving remarkably well defined form. From both sides and back it displays very different characteristics: in profile, the layers accentuate the shape, especially the wings, through the natural contour lines. From behind, the ‘endgrain’ has a sudden surprise in store – when walking past, the layers line up, and become momentarily transparent. It’s fleeting, almost like a woodpecker flying past amongst leaves. It also has the nice side effect of making the internals – components, electronics, etc – visible, in a strangely abstracted way, in silhouette.

Using card, as card, also felt somehow honest. it’s not painted, printed on, artificially coloured – and although a heavily processed material, it feels natural. The stripe of acrylic, beyond its functional properties (rigid, hard, etc), created a strip of bright red, which became the beak and the crest; enough to identify the bird as a woodpecker. A flash of colour didn’t go amiss, either, ensuring that the dullness of the brown card was balanced.

The combination stuck.

And so, to the end result. It all came together for a crit and exhibition at the very end of the 4 weeks. To sum up what we created:

“Knock Knock are pairs of networked woodpeckers. When you physically make one woodpecker knock on the wall, its connected pair, wherever it is located, automagically knocks as well.”

That’s it. it’s all it does. And I’m so happy that it doesn’t do anything else. (and can I here just say I love the word automagically?) Sometimes, it can be so much harder to keep something simple, to reject any additional features or suggestions, to keep the idea clean. And I think that’s what we did. It’s probably one of the easiest projects to describe that I’ve ever done,and I think that’s what makes it one of my favorites.

What does a knock mean? It could be anything, it’s open to interpretation… and probably means different things to different people at different times. Maybe it’s a simple I’m thinking of you. Perhaps it’s a reminder to get back to me with those comments. Maybe check your email, dammit. Or fancy lunch? Or Good luck for tomorrow. Or ok, I’m awake now – want to call? Or, sometimes, maybe it means nothing – or nothing explicit, at least. Maybe it’s used just to play, for the simple pleasure of the object, as a distraction. To be playful.

Something we explored was how could we create something so minimal, so open, that the use wasn’t prescribed? As Vinay put it, “create the vocabulary, but leave the grammar open”. Creating a framework, not prescribing the use.

It’s interesting to reflect on the outcome, and what it is to me, in comparison to some of the other projects we’ve done here at CIID, and before. In contrast, for example, the projects from the GUI course were very much learning outcomes. I’m happy with the work we did, but within the context of the course, within the constraints of the challenges we were set and set ourselves, as responses to a brief. But Knock Knock, for me, works both within the context of the course, but also outside of it. It can stand alone, away from CIID, away from the brief. Not just as a way to showcase particular skills, but as an idea and execution, in and of itself. What we were supposed to do doesn’t need explaining, just what we did. It’s not necessarily better, but it is different.

I really enjoyed working on this project, in no small part due to working with Shruti (thanks!) – which was lucky, as we’d never worked together before, and it was a long time spent on one project, by CIID standards. But just as importantly, I am really happy with the outcome. I love the idea and the concept, but also the execution, the form. As both a connected concept, and even as a standalone object, I am unusually proud of our woodpeckers. And it’s rare that I say that about something I’ve worked on – I’m a critical person, especially about myself and my own work.

And yet, I’m so proud.

I think it truly did become A joyful object.


My project page is here.

The course was taught at CIID in February 2010. The syllabus is here.

Other projects from the course – responses to the same brief – are here.

The course faculty were Richard Shed, David Gauthier, and Vinay Venkatraman.

There were also visiting crits and input from Joseph Forakis and Durrell Bishop.

← Back to the latest posts