Worry Capsule Tree

An interactive installation composed of a physical tree and a web application.

Worries surround us every day. However, as time passed, we always realize how trivial those problems are in comparison. Worry Capsule Tree is an interactive installation that listens and stores people’s current worries and sends those back to them in the future, thus allowing its users to retrieve their previous worries and revisit the past selves.

The project contains two parts, a tree that the user can talk to and a web application where the user can refer to as a guide.

 

PROJECT OVERVIEW

Worry capsule tree is a 6-week interactive installation project teamed with Hau Yuan

SHOWCASE

ITP Winter Show, New York 2017. 12. 17 - 2017. 12. 18

Maker Faire, New York 2018. 09. 22 - 2018. 09. 23

MY ROLE

Voice Recognition | Database Server | Physical Computing | Fabrication | Front-end Development | Experience Design

TECHNICAL FEATURES

Design hand sketch | sketch | After effects | illustrator

Coding Voice Recognition (p5.speech.js) | Database Server (M-Lab) | Interface (After Effects/p5.js/Sketch) | Serial Communication(Arduino)

Physical Computing Arduino MEGA | USB microphone | Jumbo RGB LEDs | Neo-pixel RGB Lights

Fabrication Soldering | Laser Cutting

 
 

USER FLOW

tree_IxDBehaviour.png
tree_workflow.png

When the user comes to the installation, he will see our tree with a computer and a microphone in front of it. The interface on the computer screen will instruct the user to say “hello” to the tree. The greeting from the user will trigger the tree to communicate with him and encourage him to tell it the current worry he holds. The tree will listen, remember and store the worry from the user. When the worry is being stored, the tree installation will be gradually lit up. In the end, the user will find his worry being stored in one of the capsules on the tree. The user can choose to tell his contact information to the tree to get his worries retrieved in the future.

 

DESIGN

PHYSICAL TREE

 

WEBSITE INTERFACE

DESIGN PROGRESS

IDEATION

  1. Brainstorming

  2. Make design plans

USER TESTING

  1. Test with users to decide user behavior

  2. Develop the interactions

FAST PROTOTYPE

  1. Create different possible designs

  2. User testing with the prototypes and develop tree design

DEVELOPMENT

  1. Physical computing

  2. Programming

  3. Fabrication

IDEATION

The original idea of Worry Capsule Tree comes from one of the creators Yuan’s desire to release daily stress by keeping his anxiety into a safe place. After Yuan talked to me, this idea of telling and storing worries reminded me of the time capsule, whose function is to help people store memories that are accessible a long time later. 

Both of us liked the concept of storing current anxiety and retrieve it in the future. On one hand, it helps release the stress we have now, and on the other hand, it provides us with a chance to re-visit our past selves and see how much we have overcome and grown.

Since we decided to build something that deals with emotions and memories, the questions of:

“how would the users best communicate with this capsule?” and “how do they emotionally engage with the device” becomes very important.

These questions triggered us to first think about the appearance of our device. Our first thought is the image of a tree. Trees have the ability to absorb substances from the environment and convert them to nutritious fruits. We think it’s a metaphor for transforming people’s anxiety to their assets in the future. Therefore, we decided to build a worry capsule tree which can respond to the users and store their worries. This has brought us to the very first stage of our design.

 

USER TESTING

In order to know which way makes people feel more comfortable to interact with the tree and release their anxiety, we did user testing with 10 people.

Based on our research, more than half of the testers prefer speaking, in particular murmuring to the tree because they believe that creates an intimate relationship between them and the tree.

We finally decided to create an interactive capsule tree which can listen to its users and store their worries.

 

FAST PROTOTYPE


Once we decided the main interaction behavior, we built two fast tree prototypes. We ask different users’ opinions on our designs. We decided to follow my (Xiran’s) proposal, a more sculptural design because we believed it looked more interesting and can create more intimacy between our tree and the users. We adapted the design later and finished with the final outcome as shown in the video.

Yuan’s prototype

Yuan’s prototype

Xiran’s prototype

Xiran’s prototype

 

DEVELOPMENT

CODING

1

Voice recognition

In order to have the tree “understands” what the user is talking about and make it respond to the user, we used voice recognition to translate the speech of user into text.

The voice recognition is done by p5.speech.library which can translate audio input into text.

 

2

Store information in a database

To store the worries in the tree, I used M-Lab’s database server. Basically, you need to register an account at M-lab, create a database, then a collection. Each account will have an API key, you will be able to use that API key to access your database, upload data and view all the documents you have sent to that database.

Easy Tutorial on how to use M-lab to create database and upload data

M-lab’s tutorial (Also easy to follow)

These two websites provide some very good tutorials on how to set up a database at M-Lab and store data into it.

While M-lab’s own sample code is written in Jquery, I used p5.js to do the same thing. I majorly used HttpPost() function to push information (voice text array) into my database.

 

3

User Interface Programming

All animations are done by After Effects and are embedded and organized into the interface using p5 DOM library.

 

4

Serial Communication

To add all the light effects to the tree, we used p5.serialport.js library to do serial communication. Basically everytime when we want the computer side to trigger the tree to change its behavior, we send one-byte binary (a number) from the computer to Arduino by doing p5-to-Arduino serial communication.

 

PHYSICAL COMPUTING

We used Jumbo RGB LEDsNeopixel RGB LED strips as well as some white Jumbo LEDs.

We first tested all the behaviors of the lights by just doing Arduino, using some switches and a sound sensor.

After we made sure that everything worked well on Arduino, we used serial communication to allow the computer to control the behaviors of all lights.

Animated GIF-downsized (1).gif
 

FABRICATION

We created the physical tree using laser cutting and soldering techniques.