The Study of a Design Process Intended for Interactive Environments

Gabriela Carneiro FAU USP Rua do Lago, 876 05508-080 SP,Brazil +55 11 3091-3153
gabicarneiro@gmail.com

Diego Spinola Poli - USP Av. Prof. Luciano Gualberto, trav. 3/380 05508-010 SP,Brazil +55 11 3091-5733
spinola@gmail.com

Guto Requena Estudio Guto Requena R. Oscar Freire, 1996 050409-011SP,Brazil +55 11 2528-1700
gutorequena@gmail.com

Carlos Zibel Costa FAU USP Rua do Lago, 876 05508-080SP,Brazil +55 11 3091-3153
czibel@globo.com

ABSTRACT

This article is about the development and construction process of an interactive environment designed to be the new headquarter of a digital producer company. It begins with the first ideas; describes the logic and structure from the interactive system; the participatory approach used to fundament the content production; and ends with the project description. This case study aims to explain the design process, highlighting existing challenges and opportunities within this innovative way to think and apply digital technologies.
Author Keywords

possibilities offered by the digital technology. This all combines to indicate a way forward that connects the physical and digital, and offers us the chance to design interactions that are full of the richness of form and movement, freeing us from the feeling of being constrained by our computing devices. [4] When this computational power is used to amplify the design possibilities of spaces and buildings, several possibilities are open. More recently, technological innovations such as smart materials and embedded computational resources have begun to influence design, in emerging areas such as smart textiles and interactive architecture [7]. Each day more, digital technology has been incorporated to spaces and buildings to accomplish the inclusion of dynamic and responsive elements to their shape and perception. Therefore, the digital programming of ephemeral characteristics from spaces, such as light, sound and movement, becomes also a design issue. This article describes an experience where interaction design principles and technology were applied to an architectural project. Although the described process is not intended to be a replicable model, it searches to illustrate the complexity and multiple variables included on this style of design. It aims to provide a real case example of a project that integrates physical and digital spaces in the design process and final outcome.
DESIGN SCOPE A CALL FOR INTERACTIVITY

Ubiquitous computing, tangible interfaces, interactive spaces, design process.

ACM Classification Keywords

H.5.2 Information interfaces and presentation: User Interfaces: Haptic I/O.

INTRODUCTION

The design of interactive environments explores concepts related to pervasive and ubiquitous computing within the contemporary society. Its an outcome from a context where these two trends the massive increase in computational power and the expanding context in which we put that power to use both suggest that we need new ways of interacting with computers, ways that are better tuned to our need and abilities [3]. These trends, together with the increasing accessibility to components and the development of high level computer languages, has been an incentive to designers and architects, to deeper explore the

How to quote this article: CARNEIRO, G.; SPINOLA, D.; REQUENA, G.; COSTA C. Z (2011). The Study of a Design Process Intended for Interactive Environments. In: Proceedings of Interaction South America 2011, Belo Horizonte, Brazil.

A digital producer was willing to have a new physical space. The new headquarter was supposed to reflect the beliefs and activities developed by the crew, as well as the kind of interfaces that they develop. Its a young, curious and lively company, notably open for new experiments. They work along with publicity agencies on the production of interactive experiences and most of their projects are focused on the development of websites and applications in which they always prioritize unexpected approaches. The space is located in a 70m2commercial room at Avenida Paulista. Within this context, the designers biggest pursuit

was to create an architectonical identity where experimentation and interaction were present in the creative process as much as in the final results. Two offices, one comprising mainly architects and the other interaction designers and electrical engineers, composed the design team, who worked with a very limited budget to create the proposed space.
PROCESS WALKTHROUGH

discreet intervention, acting only on the background of the space perception, without disturbing the daily activities, they were designed with only one color.

The initial brainstorm was inspired by references sent by the clients. Together, one member of each office discussed the vast compilation, which included a basic requirement list with initial guidelines, the companys own professional and experimental projects, examples of interactive installations, as well as likes and dislikes regarding spaces, colors and objects. With this in mind it was clear that this case was a good opportunity to fuse digital technology and architecture into one same project. Preliminary discussions attempted to formulate the connection between interactive system and architectural issues in this project. The initial goal was to pursuit a result that could integrate principles, languages and processes without ambiguity in the final result; in other words, the final design should encompass both, digital and architectural system, as one single entity. Thus, the final result would be what is understood as an interactive environment by the team.
System Structure and Logic Fig. 1: First sketch of sensors distribution in the space.

The first considerations regarding this integrated approach comprehended the tangible portions of the system, composed by sensors and actuators. Sensors are physical structures responsible for transforming different kinds of energy (light, movement, sound, etc.) into digital information ready to be computed (inputs); actuators are structures in charge of transforming computation results (outputs) back into different kinds of energy. During the preliminary design iterations the sensors moved from the floor to the ceiling. The first idea was to develop a custom-made carpet with sensors sewed over it, or to reconstruct the floor with sensors embedded in it. These proposals would end up either not robust enough or too expensive. The solution was to lift them up to the ceiling combining them with the uncovered structure, an important element of the space design (Fig. 1). Light patterns were defined as output for the system. The critical issue about using light as actuator was to move away, as much as possible, from screens and high resolution LEDs panels. The goal was to think about these patterns coherently with the rest of the shapes and colors from the space. Based on the references set, the company name and the clients beliefs, irregular triangles were defined as the carpentry basic shape that would cover part of the wall and ceiling structure (Fig.2). Small light triangles were allocated behind the perforated panels, becoming visible only when turned on. To make this a

Fig. 2: First sketch of the light patterns in relation to the space proposal.

The light triangles layout was decided together with the wood structure. They were fabricated out of wood and the LEDs were manually inserted into their perimeter. By that time, LED strips, which now are very accessible, would have been too expensive in relation to the project budget. After the LEDs attachment, the triangles were mounted one by one between the wall and the perforated wood panel (Fig. 3). Interactivity, adaptability and participation are key concepts to this project. They supported all design decisions and can be noticed on several aspects, ranging from the customized furniture designed to be rearranged according to the clients needs, to the openness of the interactive system. The open system derived from the companys skill to program website and software applications. With that in mind, a PHP command library was created, allowing the clients to reprogram and reconnect the system in future interventions.

One master is connected to all sensor nodes and the other to all actuator nodes. The connection between master and nodes follow what is known as a BUS topology, which simply describes the way the nodes are arranged and how the information is distributed. Different from a star or ring topology, physically the BUS topology means that there is a single line to which all nodes are connected (Fig. 4). Logically it means that one big package of information is sent through this line and each node is responsible to understand the piece that is important to it (Fig. 5 and 6).

Fig. 4: From left to right: star, ring and bus topology. Fig. 3: Light triangles being mounted and installed on the space.

Besides the PHP language, all the system hardware was designed following the Open Source principles. According to them the hardware's source, the design from which it is made, is available in the preferred format for making modifications to it. () Open source hardware gives people the freedom to control their technology while sharing knowledge and encouraging commerce through the open exchange of designs. [1] Therefore, this system can be replicated and modified by the client as well as reconstructed by anyone with adequate microelectronics knowledge1. To understand how this structure works it is necessary to explain the application topology, namely the way sensors and actuators are physically and logically connected. First, each sensor and each actuator is defined as a node, which means they are single entities, each one of them with a specific address, able to get instructions and send information. The information is sent and collected by other entity called master. To better organize the interactive system, two masters were defined; in this case, in order to pursue the OPHW principles, both of them are Arduino micro-controllers2.
1

Fig. 5: An illustration showing the BUS logic, all the nodes are connected to one single line, responsible for sending and collecting information.

The hardware, drivers and libraries documentation are available on this web-site: <http://www.hackeneering.com/mwiki/index.php>. Accessed on September 28th, 2011.
2

In the case of this system composed by multiple sensors and actuators managed by a PHP language, the master entity has also a second function; it acts as a gateway between two network technologies. To understand that, it is important to have in mind that the way the information was logically arranged between these nodes and master is different from the way the Internet protocol works. Therefore, in a computational language, a gateway is the entity that makes possible the communication between different networks. Ultimately, both masters were then connected to the Internet, providing online all the information that the actuators. (Description available in the Arduino web-site: <http://www.arduino.cc/>, accessed on September 28th, 2011.

Arduino is an open-source electronics prototyping platform based on flexible, easy-to-use hardware and software. () Arduino can sense the environment by receiving input from a variety of sensors and can affect its surroundings by controlling lights, motors, and other

sensors receive as well as the information regarding the actuators control. This feature wouldnt be necessary if the interactive system was designed not to be an open system, that is, if the future intervention of the users was not part of the project. If that were the case, the solution would be to connect the sensors to the actuators through one single micro-controller, which would also contain programmed in itself how the values obtained by the sensors would affect the triangle wall, namely the system behavior.

light percentages and to set the transition speed for both actions. With this reprogramming possibility available, the triangles could, for example, be controlled according to the data flow within the office network. Abstract and Keywords
Participatory Workshop

The development of an open structure allowed the definition of the final fixed behavior simultaneously with the hardware construction. This was done based on the data collected on a participatory workshop conceived by the interaction design team, where mixed teams, composed by clients, users, architects and researchers, discussed different possibilities for the system. With the triangles already being installed, the main purpose was to obtain insights to design the basic system behavior and define which would be the most appropriate sensors to achieve that.

Fig. 6: Actuators nodes fabrication, test and installation.

In the designed system there are two behavior possibilities. One is fixed, part of the space design, developed from the insights collected through a participatory workshop, and will be further detailed later in this article; the other is open, and can be constantly customized by the users. Both of them are allocated into the companys web-server, in a way that it is possible to remotely access them. Once the sensor and actuator network is turned on, theres a script on the server that looks for a new behavior and if theres none, it automatically runs the fixed one. To program the system, one specific library of commands to the sensors and another to the actuators were designed. From the sensors library, it is relevant to mention three main kinds of values that can be obtained and used as input values in a desired behavior. The programmer can use the instant value captured at each moment, the minimum and maximum value captured within a desired interval and the medium value also from an interval. Because these values are available online, it can be used to control the light triangles or any other desired output, for example, the companys web-site background. The same way the information obtained by the sensors can be used by any web application, the triangles can be controlled by different kinds of applications. Its possible to send specific commands to each triangle or to broadcast the same commands to all of them at once. The three main functions include the possibilities of setting specific light percentage; make the triangles fade in and out between two

Fig. 7: Structural (left) and conceptual (right) cards from the i|o Cards.

The workshop was conceived and conducted by one architect from the team. This person was responsible for the time control and activities explanation, giving directions to the participants without directly inducting the content. As a support material, it was adopted the space plan together with the i|o cards [1], a card set developed to stimulate conversation and ideas exchange during the development of tangible interfaces. Its a multipurpose tool, previously applied on different kinds of workshops. The card set is divided into two groups. One deals with structural topics regarding interactive systems and its composed by graphical representations of the main sensors and actuators which a beginner on physical computing needs to address [6], together with a micro-controller card in which the components should be connected. The other group has on the front side important concepts to be employed on the narratives development and on the backside short explanations [5]. They represent, as separate entities, the behavior potential and the physical constrains of the system. As a result, these issues can be combined differently according to the workshop goal (Fig. 7). In this case, the participants formed two groups, divided according to their background and function in the project in a way that architects, researchers, client and user composed both groups. The cards were distributed to the groups in an alternated order, one group received first the concepts and

the other received first the structural cards. After fifteen minutes each group received the missing cards. After 30 minutes of internal discussion, they had some time to summarize their insights and the activity ended with a collective presentation and discussion (Fig. 8).

Within this context, the activity also improved the conceptual repertory of all the participants. This was especially important for the clients, since they are in charge of keep doing experiments with the space. As the participant 2 stated, at the end, my own perception of the overall project has evolved and now Im more excited than before3. The participant 6 went further and said, I believe that all of this has produced an incredible number of ideas and also ideas to other ideas4. Without the clients and users engagement concerning the future content production, all the effort to produce an open system would have been pointless.
SPACE DESIGN

The described process was fundamental to the development of a consistent interactive space proposal. The image of an unfinished space is always present to invite people to participate, making them an essential piece to complete the meaning of the space. On a more abstract level this concept appears through the preservation and emphasis of some original features from the building. The old carpet was removed and the remaining floor received layers of resin, highlighting its imperfections.

Fig. 8: Teams working during the workshop, using the cards over a floor plan.

The final presentation was recorded and transcribed into a text. Afterward, this information was filtered and discussed by the design team, which sought to understand the motivations and expectations behind the statements and produce a coherent narrative proposal to be implemented on the space. With this in mind, it was also possible to choose and allocate the sensors as well as design the different light patterns that would respond to the actions. The workshop was essential to this project for diverse reasons. First of all, this is an singular way to understand and envision architecture and digital interactive systems, which means its still hard to find similar cases to inspire and support the design decisions throughout the process. Therefore, on the architects and designers side, the activity provided fundamental insights that came straight from the client, which validated all the effort employed on creating this sort of hybrid spatiality. On the clients and users side, while giving important inputs for the project, they could better understand the proposal and how it is linked to the activities that they already perform. As a result, the workshop increased the acceptance of a space that will still need the client and users intervention to improve its significance.

Fig. 9: Images from the final design (Images by Fran Parente).

Informal feedback sent by the participant 2 by e-mail after the workshop.

4

Informal feedback sent by the participant 6 by e-mail after the workshop.

Following the same concept, the ceiling finishing was removed and all the electric, air-conditioning and hydraulic systems were incorporated as important aesthetic elements in this room. This apparent structure is also where six ultrasonic sensors and one microphone are located. Together with one magnetic sensor installed on the door, they compose the group of eight sensor nodes, responsible for the data input into the system.

Three kinds of wood and different shades of blues, greens and purples were used for the chromatic identity of the space. This chromatic identity is complemented by 25 light triangles hidden behind the perforated wood panel. Six of them are located on the ceiling and the remaining 19 on behind the wood wall. The triangles fade in and out their white light according to the received instruction, acting discreetly on the periphery all day long.The furniture was designed to allow flexibility of usage, reinforcing an invitation to the clients to actively participate on the space reconfiguration. Its layout can be transformed through the relocation of the wheeled furniture, which has been dimensioned to be easily adapted to different needs. As a result the workstations can be constantly rearranged and the space can be configured as a big meeting room, be ready for a video game round or even a movie session (Fig. 10 and 11).

Fig. 10: Space elevations.

The rustic treatment of the basic structure is partially covered by the woodworks, carefully designed in order to create different visual effects according to the proposed narrative. With an area of only 55 square meters, every corner of the space instigates the visitors eyes to different angles, textures, colors and lighting patterns.

Fig. 12: Location of sensors in the space.

The data obtained through the workshop was used to define the sensors and develop the basic narrative, inspired on the day-by-day activities of the clients and their expectation about the space. As Figure 12 shows, three kind of sensors were installed: six ultra-sonic sensors and one microphone on the ceiling, and one magnetic switch by the entrance door. The behavior is based composed by three interactions: one pattern interaction and two events (lunch and door). They obey a chain hierarchy where the lower ones can be interrupted by the higher ones (Fig.13).

Fig. 13: Behavior through time: higher ones can interrupt the lower interactions when once they are triggered.

Fig. 11: Space plans.

The standard behavior makes use of the data collected by ultra-sonic distance sensors installed on the ceiling structure. They capture nuances of people moving around the space, which triggers different lighting patterns along the day. Since the patterns are showed throughout the whole

day, it was developed a soft and discreet movement that acts as peripheral information. Given that people in the company have daily habits such as having snacks together, the sounds in the kitchen are also captured generating a more dynamic lighting pattern that represents the playful interaction that happens during this activity. Finally, the light triangles also react to people coming in and out the office, every time a door is opened or closed a specific lighting pattern goes on.
CONCLUSION

Requena and i|o design for the information about the process; to FAPESP for financing the research that contributed to conceptual discussions within the project.
REFERENCES

1. CARNEIRO, Gabriela (2010). i|o Cards. Available for free download and distribution on the web-site: <http://www.objetosinterativos.com.br/290/iocards/>. Accessed on September 28th, 2011. 2. Definition of Free Cultural Works (2011). Open Source Hardware OPHW. Availabble at: <http://freedomdefined.org/OSHW>. Accessed on September 28th, 2011. 3. DOURISH, Paul (2004). Where the action is: the foundations of embodied interaction. Cambridge, MA: The MIT Press.Mather, 4. MOGGRIDGE, Bill, (2007). Designing interactions. Cambridge, MA: The MIT Press. 5. MONGIAT, Melissa; SNOOK, Kelsey (2007). Exchange Pieces: Tools and Strategies for Engagement In Design. Proceedings of Include 2007: designing with people. 6. OSULLIVAN, Dan; IGOE, Tom (2005). Physical computing: sensing and controlling the physical world with computers. Boston: Thomson. 7. VALLGARDA, Anna; REDSTROM, Johan, (2007). Computational Composites. Proceedings of the SIGCHI conference on Human factor in computing systems. San Jose, CA: ACM.

The project for the digital producer space is a result from a new generation of designers and clients who aim to explore original approaches to work, characterized by experimentation, openness and cooperation within the processes. It shows that even with a limited budget and in a developing country such as Brazil, where hardware and software are still imported and associated to high costs, it is possible to work creatively with interactive digital technologies adding poetic layers and narratives to our spaces. The final result is the integration between physical and virtual instances in one single project, in a way that it extrapolates the functional discourse among which technology is normally associated. In a world where objects, cars, clothes and spaces exchange information with people and detect their emotions and needs, theres a need to reflect on how to use, amplify and add new relations between man and its habitat. Its on the architects and designers role to manipulate this technology in order to create places and objects that inspire creativity and imagination on people daily routine.
ACKNOWLEDGMENTS

Special thanks to the D3 Digital producer for the opportunity to develop the Project; to Estudio Guto