UX, Data & Research



Do Tangible User Interfaces foster collaboration?


    Datablocks is a data visualization and tangible user interface (TUI) research project done at the Visual Analytics lab (OCADu). It was presented at IBM’s CASCON and ACM’s CHI. This design is an iteration of a research project conducted previously at the lab and was arduino-based. The visualization code was rewritten and its design updated.
    Physical blocks placed on a table act as tokens that selects which data to be visualized from a dataset. The visualization and interaction was tested with two datasets: radio listeners audience and UN global employment. Bar graphs represent each data category and each category can be broken down by its demographics (age group and gender). A ‘compare’ token allows two tokens to be placed next to it in order to compare their values.
    The system uses the TUIO framework to read and parse the token information. A camera placed under the table reads the fiducial mark under each block and a Processing code parses and connects the information to the visualization. The system was also tested with JavaScript and Tableau using the same tokens.
    Datablocks was created with the objectives of fostering a collaborative data visualization environment and to serve as an educational tool in schools. A common question asked by researchers at the conferences where it was presented was “how would this system handle larger datasets? Would it need hundreds of tokens?” That question was one of the motivations for the development of the TIME magazine project, showcased bellow.

Code (Bar Graph)
Code (TUI - Bar Graph)
Code (TUI - Tableau)



    Building on the ideas developed in the Datablocks project and trying to address its main shortcoming - namely, the difficulty to handle larger datasets -, a tangible user interface for navigating and accessing the entire TIME magazine database was designed. It was demoed as a design case at ISEA.
    Three tokens are used for navigating through all the issues. One token represents the issue’s decade, another the year and the last the month. Moving the token along the table’s X axis chooses between the available selections. The fourth and last token selects the desired issue and lets the user flip through its pages by rotating the token.
    This tangible user interface design could be extrapolated to browsing other large periodical collections or datasets.
Code


Mark
I’m a UX researcher and motion designer based in Montreal.