Art / Fida / Family Archive / Meerkat / Tuba / TellTable / Other Brother / SketchStorm / Autonomous Presence
TellTable utilises Microsoft Surface Technology to provide an interactive storytelling experience, helping to stimulate creativity and self-expression by children. The storyteller(s) can manipulate various digital characters and sceneries on Surface, which are created by capturing and editing real world elements using a camera. By doing so, they can narrate, act, and record the story in a lightweight way, similar to how children would tell stories using physical toys. For the TellTable project, initiated by Xiang Cao, I have created several physical capturing tools and a new UI design to fit with better with the target group. Working closely together with Xiang Cao and Sian Lindley, getting children into the lab throughout designing TellTable we managed to make the system fun and intuitive to use. Deploying it within a primary school, kids were extremely enthusiastic and created a lot of stories.
Using Microsoft Surface and a camera, the idea behind the project is that children can literally capture anything within their surrounding and turn these physical objects into digital content. This digital content can be manipulated and turned into story characters and backgrounds after which children can tell, capture and share stories with each other.

Observing several issues with the use of the webcam as a capturing device I started to explore a selection of different physical tools to replace the experience of holding a normal webcam. To enable children to flexibly photograph objects, I designed a capture tool as a tangible extension to feed into the tabletop system.
In order to create an exploreable, cheap and easy to replace setup I chose to design a modular solution, comprised of the webcam used before that could be snapped on to several interchangeable “bases”. To emphasise playfulness and simplicity, three different bases were created, all of which featured large rectangular frames as viewfinders. These were a “magnifying glass”, a “telescope” and a “magical frame" (as can be seen in the pictures below). I deliberately chose to use large rectangular frames as “live” viewfinders instead of digital viewfinders to keep the system setup as simple and low-tech as possible. The camera module was equipped with two magnets that allowed it to be connected to the different bases. These metal magnets also acted as the electrical connection to the button(s) located on each base, triggering photo capture. This setup generally allowed the capture device and its interaction possibilities to be adjusted without changing the computational elements.

Explorations/prototyping & design process


In addition to the camera module and the three handheld viewfinders, an additional base was designed to attach to the surface itself so that pictures could be taken “hands-free”. This base allowed the camera module to be mounted onto the table using a suction cup, as well as encapsulating a speaker and microphone used for recording and playing back stories.
An initial trial was run in which two separate pairs of children (aged 7 to 12) tried the system for about two hours in our own lab. The aim here was to reveal interaction issues with both the software and physical elements of the interface design. One of the main findings here was difficulties in dealing with the “live” viewfinders. The location of the camera on the portable viewfinders (off-centre at the bottom of the frame) provided several interaction issues.
In relation to the first UI design it became evident that the large amount of functionality available within a single workspace led to confusion between different system features; the fact that the creation of story elements and the recording of the story were represented in the same space seemed particularly confusing. These problems were further confounded by ambiguous button labels and the fact that buttons for very different features looked visually similar. One final observed difficulty was the location of buttons along the bottom edge of the tabletop, which clearly led to children accidently triggering these features when manipulating content (e.g. with their sleeves).
I designed large irregularly shaped “blobs” as the main graphical interface buttons, each containing a graphic icon and supporting text (see the picture below). The different shapes of the blobs and the addition of various feedback sounds emphasised their different functions and instilled a sense of playfulness. E.g. after creating a story the children were rewarded with the sound of an applaud. In order to clarify the different system features, the single workspace model was replaced by two distinct system modes: “Make” mode and “Tell” mode, which were differentiated by their backgrounds (icons representing editing tools such as pencils and scissors populate the background in Make mode). Additionally, the interface elements of each mode were intentionally positioned on opposite sides (left versus right) of the tabletop, which had the extra advantage of diminishing the likelihood that features would be accidentally triggered when switching between modes.

After analyzing the test results, it was decided that the default interface layout and text should be oriented such that it naturally favoured children positioned along one side of the table. This was so that children on this “preferred” side would have more control over the current interaction status (e.g. switch mode, start recording etc.) to reduce conflict and confusion. At the same time, other children could freely join in from any side in order to create story elements, moving and rotating these elements to suit the children’s position.
Because the children had issues with the handheld viewfinders, I designed a new handheld base onto which the camera module, once attached, would form a crosshair; aligning the crosshair to the centre of an object would allow it to be perfectly framed (as can be seen in the right picture below). Two buttons were added on both sides of the handle of the situated base for triggering capture (picture on the left). In addition, a digital viewfinder on the tabletop screen gave additional feedback. As can be seen in the screenshot below, displaying the second TellTable interface.


Part of the larger effort of the project we deployed TellTable in a primary school in Cambridge during which 66 children used the system and created 31 unique stories containing 195 objects and 50 backgrounds. The deployment was extremely successful as it caused a hype and children started planning their stories beforehand, e.g. bringing in content from home. Children got inspired by each other, enjoyed watching stories made by others and some stories even became famous amongst them.
The following clip explains how TellTable works: TellTable movie.wmv
Find here a news clip broadcasted by Anglia News after our trial within the primary school: Anglia Tonight.wmv
