The ColorTable

 

 

The ColorTable is a tangible user interface in support of collaborative working situations involving multidisciplinary design teams. It is a tabletop-based system where all interactions take place around and on a central table. A large amount of colored objects of different shapes and sizes may be positioned and manipulated on the table. The users may thus stand around the table and interact simultaneously from different positions, as it is the case in conventional discussion situations.

The tangible user interface uses computer vision based tracking from an overhead camera for untethered interaction. Specifically, the system is able to detect the positions, shapes, colors and sizes of the objects on the table. Users can move and turn existing objects, while an overhead video projection on the table provides interactive feedback (see Figure 1).

 

Interaction modules

The system of the ColorTable includes different tangible interaction modules that may be used independently. The original modules where the colored objects interface, the barcode interface and the rotating viewpoint. In year 2, 3 and 4, those modules have been iteratively ameliorated and expanded into a complex tangible user interface.

Colored objects interface
The colored shapes, currently wooden blocks of 8 different colors and 4 different shapes, may be positioned, moved and rotated on the table in order to interact with the system. Their positions, sizes, shapes and colors are used to manipulate the state of different elements of an application.
In this way, the colored objects interface can for example be used to control virtual objects in a mixed reality scene. The colored shapes are linked to various types of digital content that may be moved within space by moving the corresponding physical objects on the table. Each color defines a different virtual object. Figure 2 shows how users interact with the colored objects.

Barcode interface
The barcode interface enables users to easily access elements of the Hypermedia Database by reading in dedicated barcodes (or RFID). These elements can be 3D models, 2D partly transparent pictures and sound files to be used within the application, or commands controlling other parameters of the application.
Depending on the purpose of the application, the barcodes and RFID tags may be integrated in different physical objects. We currently use small magnetic cards to be attached on the content board, and wooden barcode trays to control other settings. Figure 3 shows the arrangement of barcodes on 3 trays of different colors.

Rotating wheel
The rotating wheel provides means to navigate in the scene. A small turn-tilt plate is positioned in just under the surface of the table and can be rotated to change the orientation and zoom of the viewpoint.

Configuration board
The configuration board presents rectangular areas for each of the available colors. To assign a specific content to a colored object, users place the content card onto the respective colored area which is captured by RFID. In addition, the board can be used to manipulate content; we developed command cards, triggering for instance automatic, incremental scaling or modification of the transparency. Users place the command card onto the colored area to trigger modification of the value. When satisfied with the value, they take the card off the area at the right moment.
The board is attached at the front side of the ColorTable, at a same height as the map area. Each color area provides space for placing the card, as well as space to put previously used cards.

Billboard sketcher
The billboard sketcher is a tool allowing users to add their own paper sketches to the database. User can sketch with a conventional pen and cut out their sketch (see Figure 4). When placing it onto a specific area, a webcam captures the content, automatically crops the background and stores the result in the Hypermedia Database. The image can then be printed along with a barcode in order to be available for the barcode interface.

 

The ColorTable as part of the MR Tent

The ColorTable is currently used as interface for urban renewal applications. It is set up outdoors in the MR Tent on the site of an urban project. The MR Tent provides shelter for workshop participants and equipment while its adjustable openings give view to the surrounding side. Inside the MR Tent, two large screens show perspective views of the urban site. The views are alternatively fed by a live video stream from a remote controlled camera, a panorama image prepared previously, a direct view seen through a half transparent screen (see Figure 5).

The ColorTable is set up in the centre of the MR Tent and provides a top view of the MR scene. It is composed of several layers combining real and virtual elements forming a common interactive space. A physical map representing the urban site can be placed on the table and is pre-registered to define the coordinate system of the interaction. By choosing a different map or a map on a different scale, this frame of reference can be changed.

The ColorTable uses multiple interactive views to convey and encourage the urban design process. The vertical screens show perspective views as seen by a pedestrian, while the horizontal surface (table) shows an overhead view inspired by maps. In order to navigate in the perspective view, users can change the orientation of the viewpoint with a rotating wheel. We also pre-register different panorama viewpoints that can be loaded individually. For each viewpoint, a barcode is fixed on a physical map deployed on the table, representing the corresponding position in the panorama.

A collection of scenario-specific content is stored in advance in a Hypermedia Database (HMDB). We use content provided by architects (e.g. low-polygon CAD models), simple 3D shapes like cubes or polygon strips, 2D objects created from segmented photographs and spatially arranged sound. To make the content available to the users, we use a whiteboard with small, magnetic cards showing thumbnails of the digital assets together with barcodes for accessing the HMDB.

Placing objects
To decide on the type and location of future elements of the project site, participants can add objects into the scene. Triangular tokens represent single virtual objects, such as a photograph or a 3d model, that can be moved and rotated on the physical map. To change object properties and associate tokens with new objects, users can select elements from a hypermedia database that are available as small cards. They assign them to a specific color by placing them onto the configuration board, a dedicated interface consisting of 7 different color areas, each corresponding to a different color object. The application offers the possibility to override default values and change size, transparency, offset from the ground, color, sound as well as brightness and contrast of objects. During modification of these properties, the values are displayed next to the object in the vertical projection and on an rectangular info area, projected next to the colored areas on the top-down view.
To facilitate the construction of rows of identical objects, e.g. to build a residential area of a certain housing type, we offer the possibility to define a line by setting its both end points. Two triangular objects of a color previously loaded define the end points of such a line and are filled up with identical objects, spaced at adjustable distances.

Adding roads and flows
To decide on the types of transport, speed and concurrency, we let users define different types of roads and flows of animated objects on a given path. To create roads, rectangular objects have to be positioned at both endpoints (see Figure 6). Depending on the orientation of the rectangles, a Bézier curve is created between both points. Colors can be allocated with the configuration board to create highways, normal roads, footpaths and tramways in different densities. As soon as streets are places, the network is immediately populated with different types of flows. Animated objects (pedestrians, bikes, cars and trams) advance on the respective roads in both directions.

Defining land use
To define and discuss specific uses of land, we created the possibility to create polygonal areas that can be filled with a color or a texture representing a specific land use. Each border of the polygon is defined separately by creating several overlapping connections. The area can then be filled with a color or a texture representing a specific land use by placing a circular token inside (see Figure 7). The 7 different colors can be assigned with a texture using the configuration board.

Exploring Soundscapes
Each object on the ColorTable has both a visual representation and a 3D sound associated to it. The resulting soundscape can then be explored in three different manners by activating a different hearing position. Users can activate the camera view as hearing position and listen to the sound which corresponds to the panorama or video feed. Another possibility is to activate the hearing position as part of the flow, the resulting soundscape corresponds to the path of an element moving in the flow. Finally, the hearing position can be interactively controlled by a colored token, defining the virtual listener's position and orientation.

History and persistency
When the users agree that an interesting scene has been composed, they can trigger a 'freezing'. All color tokens currently placed on the table are permanently added to the scene, and the corresponding tokens can be removed from the table. This configuration is then stored in a history file to be loaded at a later time. A frozen object can only be removed with a special eraser token.
In addition to the freezing capability, users can take snapshots of their compositions at any time. The current views are then saved as an image and automatically printed.

 

Publications

  • Maquil V.
    The ColorTable: an interdisciplinary design process
    PhD Thesis, Institute of Design & Assessment of Technology, TU Vienna, 2010, Supervisor: Ina Wagner. .pdf
  • Wagner I., Basile M., Ehrenstrasser L., Maquil V., Terrin J., Wagner M.
    Supporting community engagement in the city: urban planning in the MR-tent
    Proceedings of Communities and Technologies, June 25 - 27, University Park, PA, USA, 2009, .pdf
    © ACM, (2009). This is the author's version of the work. It is posted here by permission of ACM for your personal use. Not for redistribution. The definitive version was published in the Proceedings of the Fourth international Conference on Communities and Technologies, University Park, PA, USA, June 25 - 27, 2009.
  • Boerner A., Maquil V.
    Enhancing synergies between computer science and urban disciplines: Semi-automated applications for tangible user interfaces, a case study
    Proceedings of CAAD Futures 2009, June 17 - 19, Montreal, Canada, 2009, .pdf
  • Maquil V., Sareika M., Schmalstieg D., Wagner I.
    MR Tent: a place for co-constructing mixed realities in urban planning
    Proceedings of Graphics Interface 2009, May 25-27, Kelowna, British Columbia, Canada, 2009, .pdf
    © ACM, (2009). This is the author's version of the work. It is posted here by permission of ACM for your personal use. Not for redistribution. The definitive version was published in the Proceedings of Graphics interface 2009, Kelowna, British Columbia, Canada, May 25 - 27, 2009.
  • Maquil V., Psik T., Wagner I.
    The ColorTable - A Design Story
    Proceedings of TEI 2008, Feb 18-21, Bonn, Germany, 2008, .pdf
    © ACM, (2008). This is the author's version of the work. It is posted here by permission of ACM for your personal use. Not for redistribution. The definitive version was published in the Proceedings of the 2nd international conference on Tangible and embdedded interaction, Bonn, Germany, February 2008.
  • Maquil V., Psik T., Wagner I., Wagner M.
    Expressive Interactions Supporting Collaboration in Urban Design
    Proceedings of GROUP 2007, Nov 4-7, Sanibel Island, Florida, USA, 2007, .pdf
    © ACM, (2007). This is the author's version of the work. It is posted here by permission of ACM for your personal use. Not for redistribution. The definitive version was published in the Proceedings of the 2007 international ACM conference on Supporting group work, Sanibel Island, Florida, USA, November 2007.
  • Idziorek M.
    Tangible Tabletop Gaming, Die Ebene zwischen Brett- und Videospiel
    Master Thesis, Institute of Design & Assessment of Technology, TU Vienna, 2007, .pdf
  • Maquil V.
    Tangible Interaction in Mixed Reality Applications
    Master Thesis, Institute of Design & Assessment of Technology, TU Vienna, 2006, .pdf

 

Media

 

News items

 

Contact

 

Acknowledgements

This research is part of the project IPCity (FP6-2004-IST-4-27571) funded by the European Commission.

 


Figure 1: The setup of the ColorTable


Figure 2: Users interacting with the colored objects.


Figure 3: A barcode interface to control additional settings of the application.


Figure 4: Creating new billboards with the billboard sketcher.


Figure 5: The ColorTable is set up inside the MR Tent.


Figure 5: A mixed reality scene shown on the perspective view.


Figure 6: Placing roads and flows using rectangular objects.


Figure 7: Defining land use on polygonal areas.

 

Last updated on June 22, 2010