Author Archive

The City of Love – Wearables and more.. Chen & Frank & Mehnaz

IMG_0354 (1)

Ideation & Brainstorming                                                                                                                           

When we decided to create a wearable device in an amusement park environment, we first thought that creating human emotions and human contact..from coming there, first idea that we generated was as Toronto being an immigrant city, having people contact in a different level with the loved ones. Taking this to consideration, we thought that we can map a camera view of a person on an object and having this in both sides of the world for both people who are in communication through computers. Since we found out that XBees do not travel that long distance we reshaped our thoughts around keeping it in a short distance but adding more love to our idea.

The next step was improving the idea of HUGGING in a meaningful manner with a narrative behind.

IMG_0356         IMG_0352        IMG_0349


On the street of Toronto, the big installation takes its place, made out of plastic, (white acrylic) boxes the structure represents the city scape. 2 projectors to be installed as they are located to project on 4 sides of the sculpture. Mapping with a mapping software the images represent the cities which are known as most romantic cities in the world beside Toronto city image.

One block will capture a flashing banner which is; ” Can Toronto Be The City of Love?” question.

Having a wearable device sawn shirt which includes XBee, LilyPad and conductive material, one person will welcome visitors who are also wearing a conductive shirt or a necklace. As they hug the person who has the device, they close the circuit and an identifier coloured LED starts lighting on the person’s shirt who has the device. This colour represents the first person who hugs first. At the same time, same colour of light bubbles start floatin on the structure’s surface to represent filling it with love.

When second person hugs, new coloured LED takes place and new colour starts floating on the structure. As many people hugs, the structure collects more colours as representing more love. For people who don’t have the shirts, like public walking by, we designed a necklace to share the experience. The shirts and the necklace can be thought as marketing feature, or supporting a cause, as a result of public contribution, those can be the key items to be sold and/or given away.

IMG_0433                                        IMG_0434

Conductive fabric added necklace : We also used sheet copper to connect the two pieces of necklace to create flex possibility to reach to close the circuit on shirts with the necklace.

 3D Printing:

Before setting the city scape idea, we thought about having a small 3D printed model of the actual sculpted piece.


Rhino 3D model representing HUG


Rhino 3D Sketch


Four views of Rhino 3D model



The City of Love is made of;

3 wearable shirts,

LilyPad Arduino 328 Main Board

Lilypad XBee

2 XBee devices

JST Lipo Battery connector

Arduino board


Conductive fabric

Conductive thread



IMG_2684  IMG_0418  IMG_2691 (1)



How did we make it work?

We thought that if the person hug the wearing device is better. So we choice the LilyPad Arduino 328 Main Board, XBee and Lilypad XBee to send and recieve the wireless signal.

As this project is our the first time to work with XBee, we needed to experiment with XBees many times .

1. XBee—XBee, two XBees send and receive signal from each other.

2. XBee—Arduino, We used XBee with breadboard through Arduino to send and receive signal to another XBee

we had a problem as we couldn’t  upload the code to Arduino when we  connect it

with XBee, so we have to take off the two PINs – TX & RX, so Arduino can receive the


3. XBee—LilyPad Arduino & XBee,

IMG_2691 (1)


First problem we had that we couldn’t send signal from Arduino to XBee , but we could have received  signal from the XBee to Arduino. After discussing with our TA, which also made him think a lot, we were concerned that the PX-PIN on Lilypad should link to the same PIN in the Lilypad XBee, but Ryan told us that maybe the problem is the RX-PIN onthe Lilypad should link to the TX-PIN on the Lilypad XBee, and the TX-PIN link to RX-PIN. We tried it, and it worked. An other question is that the LilyPad Arduino 328 Main Board doesn’t have the case to link the battery, it has 6 holes and we were not quite sure what they were for. After searching the Schematic about the board in Sparkfun and we found the power hole and the the ground. Then we bought a JST Lipo Battery connector and soldered it on the LilyPad.

At the beginning of the project, we wanted to use a pressure sensor to control the signal with the interaction. After discussing it told us that we came to a point of not thinking as a button but an initiator, so it can be anything magical like using conductive fabric. At this point project started to be more fun. We used the conductive fabric as the buttons. We made one fabric circle to be connected with power and two other connected to the ground. Ground connected fabric was also linked with #7 & #8 PIN. There is also a resistor between the pins and fabric.


When the circle cut fabric of #7 or #8 PIN is connected to the fabric which is attached to power, the Arduino can recognize the signal and send it to Processing to control the animation. We set up two colours, one is blue and one is yellow. We sewed the context on a black microfiber shirt with conductive thread which created the “base” shirt. We also sewed two bigger pieces of conductive fabric on a blue shirt and a yellow shirt. Person who wears the blue shirt hugs the person who wears the base shirt, as conductive fabric on the blue shirt covers the two fabric circles on the base shirt as it closes the circuit, Arduino recognizes the HUG.

We sewed two LEDs which are linked in #10 & #13 PINs on the base shirt to distinguish and show whether the HUG works. As the sewing is a hard work it was very challenging to connect the LED on a synthetic material which has no grip. As the thread shouldn’t overlap each other, we had to try to create a different direction with each connection.

IMG_0430  IMG_0419  IMG_0421


After this step we started testing and found out connection problems. For example, if the height of the person who wears the base shirt is different, conductive area on the coloured shirts did not meet the circles. So we have added more fabric to yellow coloured shirt to raise create more coverage. With more testing we found out the best area of the body to contact when two people hug, and sewed the bigger conductive fabric there.

IMG_2699  hugteam  IMG_0420

IMG_0422    IMG_0421    IMG_0424


IMG_2703 (1)



In terms of Arduino codes, there are two main functions to achieve the interaction human hugging and computers. One is to communicate with processing program. The other one is to detect signals from different digital pin ports.

The principle of detecting different identities can be seen as a simple example of enlightening a LED by pressing a button. Specifically, on our t-shirt, the trigger of interaction is that assumes the conductive fabric as a button. Then, open or close the circuit to detect the statement of “HIGH” or “LOW”. The statement can be detected easily by digital pin ports of Arduino board. Therefore, according to different pin ports, we can achieve detecting different identities.

IMG_2688    IMG_2687 (1)

Arduino code

To achieve the collective love bubble effect, we use communication between Processing and Arduino. Processing detects different values from different digital pin port so that Processing can detect different identities as well. Additionally, singular color dots will be active after one circuit has been completed. The increasingly colorful dots rising effect is achieved through decreasing y-axis value. Also, random method has been added to vary speed of the dynamic effect. Another function of Processing is to play music after detected the first closed circuit.

IMG_2724 IMG_2726 cond

Processing code – Collective love effect

Collective love effect (test vision without XBee)

To fit the surface of the structure, we use VPT to adjust the interface. Also, for creating the sense of city, we simulate neon light effect on our slogan by using random color on the text.

Neon light effect

Creating the structure:

We wanted to use this setting as a street installation in Toronto downtown. Setting a big base structure of acrylic blocks on about 10’X 10′ area about 10 feet high, and projecting the images on 4 or more surfaces…also the reality can bring more development such as having different interacting images on each surface as an addition to city pictures and the code projection.

persp  IMG_0431  IMG_0446

Mapping with VPT

IMG_0445  IMG_0444




Bill of Materials

Assembly List

Label Part Type Properties
LED1 Blue LED type single color; color Blue; polarity common cathode
LED2 Blue LED type single color; color Blue; polarity common cathode
Part1 Lilypad Arduino Board type Lilypad Arduino
Part2 LilyPad XBee type Wireless; protocol XBee
R3 220Ω Resistor bands 4; pin spacing 400 mil; tolerance ±5%; package THT; resistance 220Ω
R4 220Ω Resistor bands 4; pin spacing 400 mil; tolerance ±5%; package THT; resistance 220Ω
U1 LIPO-1000mAh variant 1000mAh; package lipo-1000

Shopping List

Amount Part Type Properties
2 Blue LED type single color; color Blue; polarity common cathode
1 Lilypad Arduino Board type Lilypad Arduino
1 LilyPad XBee type Wireless; protocol XBee
2 220Ω Resistor bands 4; pin spacing 400 mil; tolerance ±5%; package THT; resistance 220Ω
1 LIPO-1000mAh variant 1000mAh; package lipo-1000



Case Studies: 

1- Pillow Fight Club Study

  • Interaction: person to person, person to object

When two people have pillow fight, interaction sends signal to display images

  • Technology: sensing and display

They used same technology as our project XBees and Arduino, processing software as they created images as a result of a wireless interaction

  • Narrative: simple

It is a simple narrative which is already a life experience for many people.


2- Super Hero Communicating Cuffs

The Superhero Communicator Cuffs enable brave souls to call on their partners in a time of need. This tutorial demonstrates how to send and receive wireless signals without the use of micro controllers or programming. You will learn how to configure Xbee radios, build a basic soft circuit , and work with conductive thread and conductive fabric.

How it works: Each pair of cuffs has an electronic switch made of conductive fabric. When the wrists are crossed, a wireless signal is transmitted which
activates the LED on your partner’s set of cuffs, beckoning to them that you need Super Hero assistance! Since you’ll be making two pairs of communicator cuffs, this tutorial will be great to make with a friend!

  • Interaction: person to person, person to object
  • Technology: sensing and wireless communication
  • Narrative: simple


3- SMILE – Interactive Lights

SMILE was originally created for an all-night outdoor installation at Toronto Nuit Blanche in the historic Fort York park. Each cube is outfitted with a high-brightness RGB LED, a SLA battery, and is wirelessly programmable. Additionally, the cubes can form a mesh-network, communicating with each other or receiving commands from a central computer.

  • Interaction: person to object, object to person
  • Technology: wireless communication
  • Narrative: simple


4- Dream Jammies

Icon: Chizuko Horman
Embroidery: Melody Litwin

Dream Jammies are pajamas which are aware of your body in several ways. They know whether you are standing or laying down, tossing or lying quietly. Dream Jammies also know your body temperature. This information is relayed to your partner’s iPhone, and expressed on their screen in color, changing in realtime.

As you lay down to sleep, the screen fades from green to blue, the shade of blue reflecting your body temperature. As you roll around, the screen flickers red. By shaking the iPhone your partner is able to reach out, causing the chest of your pajamas to vibrate. Not pleasant while you sleep, but a perfect alarm clock. Not only are you able to keep in touch while living on opposite sides of the world, Dream Jammies offer insight into how you sleep by capturing data as you snooze.







Make: Wearable Electronics , Hartman K., 2014, Toronto, Canada

Social Body Lab, OCAD

Super Hero Communicating Cuffs

Moment Factory

Water Park – Water and Sky


When it comes to water, sky is the limit!


Water Park project was fun to work. When it comes to water there are millions of ideas passing by when brainstorming.. experimenting certainly can be forever and unlimited..


Sky and Water 1 –  1938, Woodcut


Sky and Water I

M.C Escher

Maurits Cornelis Escher (1898-1972) is one of the world’s most famous graphic artists. His art is enjoyed by millions of people all over the world, as can be seen on the many web sites on the internet.

He is most famous for his so-called impossible constructions, such as Ascending and DescendingRelativity, his Transformation Prints, such as Metamorphosis IMetamorphosis II and Metamorphosis IIISky & Water I or Reptiles.


Water and Sky

Project # 1Sky and Water 1 – Escher 

Presenting overlay & image coordinates:

Theme and inspiration:

When I was searching for my project, one of the strongest images of Escher came to my mind as the word water brought it up, I thought this would be great metaphor to use for such a dreamy headline, water. As Escher played with forms, symmetry and illusion, all apply to water movement and how it also changes its surrounding elements. Art effects and creates transforms humans and human behaviour. Whichever medium art comes in, it always brings some kind of human interaction with it.


1.reciprocal action, effect, or influence.
-the direct effect that one kind of particle hason another, in particular, in inducing theemission
 or absorption
 of one particle byanother.
-the mathematical  expression that specifies thenature and strength of this effect.
Interaction, as it always has slight misunderstanding attached, does not necessarily mean human’s physical contact to one another or to any object. Today’s technology brings social media, visuals, audio which all add certain values to interacting with art or interaction.
My inspiration is Escher’s work, his way of seeing world, and how his art interacts with us.

Goal:My goal with this project is, applying  code & technology to physical objects, creating an art installation which communicates with children and youth in a water park environment through physical experiences and objects.


1- Installation:

-Creating a screen frame

-Stretching fabric on the frame

-Creating milky water environment as projection surface.

-Creating a paper kite

-Setting an electric fan

-Creating a fishing rod and a toy fish

-A data projector



Wood frame

Ryon fabric

Duct tape

milk + water

Plastic bin

An electric fan

Paper kite

Wood fishing rod and string

a toy fish



2- Writing the code by Processing:

Code included layered images and by using overlay command I created sliding futures in a loop and added extra single cut out bird images to the actual art work. As Escher’s work continues and has no limit to repetition, I thought having the code in a loop is the best way to express its infinity.


E1:Changing background image

At the very beginning of this step, I had to create a new background for my project.

Originally created background consist of two parts which is equally divided height of the actual art work. At the beginning background was created by using two equal size rectangles and coloured in solid colours with filled command. After having the top layer ( original image) I decided to add photo realistic images of sky and water ..this way the graphic work meets with real world as in the context of technology dreams meet reality objects.

By using add file command, I have tried adding the image to my code. In the meant time I identified image at the void set up section, and used the identified name for image entry when writing the code. But in this experiment it did not work as the image was either missing from its original location or identified differently than the one on the code.

Also before setting its coordinates the image is created by using Graphic Software, and pre-calculated coordinates added for height and width.


E2:Adjusting image coordinates

After adding the main image, the water part which includes fish images,  was cut by half and saved as jpg image to be worked on. I cut a single fish image and emptied the background, then coloured it on Graphic Software Gimp. Changing its scale and adding back to the code as a separate layer brought a coordinate problem as it wasn’t the part of the original image anymore.

I have had many trials on the code until I found the good number of coordinates to locate the fish on the water surface, previously it was on the sky image.

I also noticed that adjusting coordinates on the single sliding layer does not effect any other future except run time gets shorter in the loop.


E3:Adding birds & changing amount

Escher’s work is playful so I wanted to add more action and magic to explain how it can come to life more. I have cut and paste single birds from the main image, only three birds to be repeated in the code, and created png. images for each bird with no background.

Each bird needed to stay its original X ,Y coordinate on the individual images. Before thinking and getting help to use overlay command, I was originally planning to enter each bird by its coordinates. This would result a heavy image on the code and overlay helped solving the problem, and bird flock is created on a different tab in the same code.

As changing the value on bird count expanded the original art work and subtracting it created questions about its emptiness.


E4:Movement speed and changing its value

x+= movementSpeed; //move the escher image to the right

On this experiment I tried different numbers for slide movement speed. The goal here was, to move the main image slower than the big coloured fish so it can give the feeling that the biggest and the fastest fish can get the food, also will get caught, as on the physical interaction, person with the fish rod will wait for the big coloured fish to approach and try to catch it. Instead the person will end up catching a toy fish.

When added value to x gets bigger the image gets faster.

E5:Experimenting the single image coordinates with Graphic app Gimp

As I tried to explained above, a single bird image was adjusted on the Gimp Software to be added as separate layer image. After cutting and pasting I saved as png image and added to Gimp app to re-identified its coordinates. I have created guides on the gridded surface. After adding to the bird flock code, changing values resulted as having the image overlapped on the wrong coordinates with the original art work.

Most importantly, this experiment helped me the understand benefits of using grid before starting each processing project. Even with a simple explanation of X and Y coordinates are the very basics of coding.

E6:experimenting surfaces for projection

Before deciding screen and water installation for my presentation, I have tried many surfaces, as walls on different angles, table tops, furniture, clear water, and ceramic. The best result came with milky white water and shiny ryon fabric. As I wanted to include wind effect by using a fan, silky ryon created the best result.

Also used wind effect on water surface for especially the second project. Cartoon orange fish supposed to be captured by hand while wind intended to make it playful and harder.

Shooting this experiment created the big question which was the location of the projector. It needed certain angle to capture the L shaped screen& water installation. I wanted to use VPT software but the code was already created and I found out that already having a background would make this process harder and it needs adjustments on the code..As it was a late discovery, this thought me to plan better at the very first phrase of each step as well as think about the last step in every step.


Project # 2Water and Sky 2 – Birds and fish:

presenting mousePressed & image sliding

Goal: My goal to create another project which is base to the previous one is more like an experiment itself. On this project my goal was surprising the user with more interaction and let them to scoop the projected fish image in the water by hand.

E7:Adjusting the amount of mousePressed

The second project included the same sliding base futures and the code, but this time instead of using Escher image, I wanted to create more like a game display for kids.This came as another experiment to be tried as the amount of mousePressed made the presentation flawless. Before changing the value from 20 to 200, after 20 pressed later the game was stopping. I figured out by trying, as the number gets bigger the action continues.

E8:Changing value of bird mapping speed

On this experiment, I gave different values to single bird mapping speed.As the value got higher, birds were added slower to the image.

Challenge ; In general, the project had three main speeds to follow each other. Managing them and finding the right combination was challenging. Big coloured fish needed to go fastest. Then the image and after that the single birds. The speed difference between the single bird addition and the sliding image matter most, because the goal is to be able to see every added bird before the sliding art work reaches to the right side.


Sky and Water I


Creating the screen, adding fabric with staples


Fabric Screen – Ryon


Locating the fan


Adding duct-tape on the wood frame edge to cover and secure the fabric



Project Idea # 2- Creating Salad dressing by using increments code & and mixing it with Servo and magnets


Salad Dressing Project idea #2 Calibrating Olive Oil & Vinegar


Shopping list for Olive Oil&Vinegar experiment


Thinking process for Salad Dressing project


Project Idea # 3- Moving image projected water droplets by using chemicals

Project idea #3-Moving decanol droplet

Alcohol is attracted to salt 

The droplets start to move when they sense salt in their environment.

“Salt is the stimulus that makes them move. They move because the salt gradient provides a different energy landscape. It is like taking a ball that is laying still on a flat surface and then suddenly make the surface hilly. The ball will roll to the lowest accessible point. That is what the droplet is doing. Without a salt gradient every direction in which a droplet might move looks the same (flat). But with a salt gradient coming from one direction the droplet can move energetically downhill into the salt gradient. And stronger salt concentrations will attract the droplet more,” says Martin Hanczyc.



Project Idea # 4- Using colour wheel with selective colour code to create complimentary colours projected on water


Project idea #4 – Colour wheel projected on water


Brainstorming on water


Researching for salad dressing project


Adding idea of increments control with Processing software to wheel colour


Shopping list for Salad dressing project



Setting Projector

IMG_5684 IMG_5683 IMG_5682


Early Development of Water and Sky


IMG_0104 IMG_0106 IMG_0107 IMG_0108 IMG_0109 IMG_0110




IMG_5716 IMG_5723 IMG_5717 IMG_5719 IMG_5718 IMG_5721 IMG_5720 IMG_5722final







Water and Sky 2 – Mousepressed

Water and Skay 1 – Esher


Code Academy

Sayal Electronics

“Getting Started with Processing”

Casey R. & Ben F.


Special Thanks To:

Hart Sturgeon-Reed and Chen Ji for my codes



Haunted Hause-Space- Alien Egg Nest

Experimenting the powder options

What is it?
It is an Alien Egg Nest
if you wonder around the box with a flashlight
it will haunt you..

When I was creating the Haunted House project, I came up with the idea of having a wonder box, so when researchers in space walking around it with flashlights, they can get a sudden attack..Then the idea of an egg incubator came to my mind as mechanics can add and make the project more interactive and also can add human relation to the final product.


I am a product and materials fan and always very impressed by the electronic magics of working prototypes. The Moodey Useless Machine movie which is a big hit nowadays on social platforms, inspired me a lot on this project’s brainstorming period. The switch is a great idea if the material is wood. The pleasant sound of wood closure and servo motor makes this unique box more interesting and worth watching. The relation in materials and digital ability of the object are the key factors when I think about making things happen by using Arduino. Even it is pure science, still smelling and touching materials, combining them with smart solutions is very satisfying.


Adding  user interaction:

Eggs are created by water balloons and filled with powder for smoke effect. The other mechanical effect is the idea of slime dripping down from Alien’s mouth by gravity. For this, I set a syringe behind the Alien mask and let it drip 90 degree down as the lid opens up.

I was planning some kind of smoke effect as powder is the greatest option to keep the Arduino board safe if we compare to flour or starch as well as has the perfect result for smoke effect after bursting the balloon. The ballon is being burst by a needle which is attached to one of the servo arms. Servo has 3 actions;

1- Opening the box lid

2- Exploding the balloon

3- Activating the speaker

IMG_9863 IMG_9865 IMG_9872


As it opens the box lid with a 90 degree rotation, at the same time it bursts the balloon and gives a push to the 9V speaker to activate the sound.

I also used LED chain of lights, they are typical LED Halloween lights which I cut the power supply and reconnected to the Arduino board.

Lights were programmed to start blinking with the first opening of the box and aimed to stay blinking after the box is activated.

The box is activated by a light sensor.

light sensor
servo 5v
LED spider chain lights
recordable push button speaker  with 9v & battery

Trial process:
Many explosions, painting different boxes, cutting, using different type of wires, collecting fabric samples, cutting toys, eraser pieces and many more…

I painted the box with grey acrylic paint and used sand medium on top for planet looking texture, also glowing paint as top coat. Meshed cut outs are to observe illuminated light coming from the box.



Experimenting the powder options

Experimenting the powder options


setting Arduino board and bread board into the box

IMG_9894  IMG_9918 IMG_9927

Crafting materials:
Many visits to dollar stores and electronic stores
as well as my kid’s toy chest..
rocks, sand, gallons, powder, foam models, boxes, wooden sticks, hot glue, wires, plastic toys, goo

IMG_9866 IMG_9870 IMG_9883

Case selection:

Considered material options such as; plywood boxes to cardboard as well as 3D printed FDM or SLS model is being considered;

Also the depth of the box was an issues as the balloon and mask were having interference, I searched for a more rigid material for the mask but the softness of foam was necessary to have a nice closure and fly up effect when it is opened. These whole lid installation was very challenging as it had to be light and serving to many actions at the same time.

Rocks and sand gave me the idea of  surface of a planet. Any incubation needs a natural form of this case we are dealing with Aliens but still, there is always nature behind science. So I decided to keep some natural forms at the box base.

Looked for different fluids for dripping slime idea, but having a slow motion flow gave me the chance to repeat the action couple more times until balloon pops and also kept the inside components clean.


cardboard box was too big for the servo to open the lid

molded hard mask

molded hard mask was too big



plywood box

plywood box was too hard to carve and heavy lid



Writing the code was the most challenging part of this project as I do not have the actual programming background but I am very much interested in and learning fast..after having the first help from the TA, I managed writing the first part which is the blinking LED lights..I perfectly understood the concept of writing structure starting from step A which allowed me to understand how certain inputs go to Setup and never will change and how certain variables go under Serial Loop where the all change happens. The second part was getting the servo into 90 degree angle and at the same time keeping the lights blinking and not stopping when the motor stops..for that I got great help from Hart Reed, and Stephen Keller thanks to these wonderful resourceful teachers.

I had so much fun and learned a lot in such a short period of time while producing this project. This created a great urge to learn coding and programming as soon as I can.



Haunted House_pcb



Haunted House_schem

Please watch @

Use of this service is governed by the IT Acceptable Use and Web Technologies policies.
Privacy Notice: It is possible for your name, e-mail address, and/or student/staff/faculty UserID to be publicly revealed if you choose to use OCAD University Blogs.