Interactive Spaces Final: ZoeBike

ZoeBike

The ZoeBike is a spatial device that aims to promote an eco-friendly lifestyle by combining the bicycle and the zoetrope. The rear wheel of the bicycle is used as a gear to spin the zoetrope to display a light-projected animation of a running deer. As the user mounts the bicycle and holds on to the handles, a projected video plays in front of them to simulate the feeling of actually cycling out in the mountains to be closer to nature.

Going Green

With the current state of our planet, as excessive amounts of carbon is being emitted every day, straining on our climate and the Earth’s ecosystem, it is important that we realize and discuss how we could change and improve our daily activities to make sure that we maintain a sustainable way of living.

Taking public transportation and driving an electric car are just some of the ways where we could reduce air pollution and increase fuel efficiency. Excessive use of fuels could possibly destroy the environment, depleting wildlife as well as natural resources.

The ZoeBike creates a space for users to realize how important the environment is to us and how it provides shelter and resources for millions of species. The deer, being one of the most common species found in the forest, is used as a representation of the very planet we live in. If we stop caring for the Earth, we might not be able to see deers in the future.

That is why we have decided for the light-projected animation of the deer to only be played if the bicycle is being pedaled. If the user stops pedaling, the animation would slow down and come to a stop. Having pressure sensor pads on the handles of the bicycle to start and pause the POV video symbolize how important it is for us as the most intelligent species on the planet to maneuver carefully to be able to move forward.

Changes to the Original ZoeBike Design

The previous ZoeBike had several flaws. One is that the support that is used to hold the zoetrope up was not strong enough, resulting in an inconsistent and lop-sided animation of the deer. We installed wires and fasteners to make sure that the PVC pipe (previously an uneven bamboo pole) was stable enough to bear the weight of the zoetrope. The PVC pipe is then further secured with a plastic chair and bricks to elevate it.

The zoetrope’s design was also changed with the silhouettes of the deer inverted to have it be projected better. We have decided to use the flash light in strobe mode as it allows for sharper projection of the animation.

For a digital spin of the original design, we have added pressure sensor pads to activate a POV video to the handles of the ZoeBike. The pressure sensor pads attached to the icubeX were programmed to start and stop the video that is projected in front of the bicycle.

Documentation Video

Done by: Goh Cher See & Anam Musta’ein

Teteque: Storyboards

As Wayan made his way down the dining room, he flashed over the writings knifed to the walls. One wrote “Beware of the witch! She’s watching us!” and another wrote “Her insatiable bloodlust! Hide the men and protect the children! For it is them she seeks!” The writings sent chills down Wayan’s spine. The air was cold but he was sweating from his palms and feet. He then sensed a presence in the room. It was almost as if someone was heavily breathing down his neck. Without looking back, Wayan raced into the halls as fast as he could.

He soon reaches a dead end where he could no longer distinguish right from left. Wayan turned his flashlight on to reveal a huge mirror that impeded his way. The mirror was covered in bloody fingerprints and a finger-painted writing that reads “Look out for Teteque!” And at that moment, he realized that he has trespassed and led himself into the den of the monstrous demon that brewed fear in the villagers. As he took his focus off the writing, he spotted a vague reflection of a boney old lady with piercing red eyes standing behind him. With sheer force, he immediately breaks into the mirror and ran to find an exit. He could hear her grunting while she chased him down.

Wayan quickly entered a dark room and locked the door behind him. He was breathless from all the panic that struck him and fell to his knees. He teared at the thought of him being hunted down by Teteque before he could make his way out of the endless labyrinth. He reached into his pocket for his phone but mysteriously found crumpled paper packaged around it instead. He unwrapped the paper and hovered his phone over the contents of it to unveil a note. It reads:

“To whom it may concern,

The Missus killed the Master today. He was a good man. He never meant any harm. He treated me with respect unlike that old cunning bitch! She never gave him what he deserved. And I was simply repaying his kindness. I loved him. And he loved me. I was bearing what was ours. She took it away from us. She left me bleeding next to his dead body. So I killed the Missus before she could take off. She was not a good woman. I lost everything. So help me, Lord. Let me find what I have lost for not another moment is worth living if I am already dead inside.

The Mistress.”

There was nothing more to it. Wayan could not believe what he just read. There was nothing but vengeance blanketed under its tone. His phone started to shut off. And as his light flickered, Wayan realized that he was sitting next to a skeleton all this while. Just before his light died off, he came face to face with the demon Teteque, What was left of this misfortune was Wayan’s unfading scream which slowly echoed through the walls of the manor.

Teteque: Character Designs

Teteque Character Design

Teteque is portrayed as a skinny, almost skeletal, elderly witch with silver hair, pasty pale blueish skin, dark dilated eyes, razor-sharp teeth, long claws and long veiny breasts latched on her back. A worn out cloth secured by a loose rope belt covers he genitalia.

Teteque’s anatomy is designed in a way where she could move as a bipedal or a quadrupedal based on the speed that she is going.Her breasts are extensions to her limbs, able to move them independently like serpents. The constriction of her breasts could kill a grown man.

On both feet, she moves rather slowly with her shoulders leaned to one side, a slouched back and her arms loosely draping down as she drags the weight of her heavy breasts.

She will only be on four limbs when her predatory instincts are activated. She could crawl faster than a roach in the dark and her spine arches outwards to counter the weight of her breasts. Her breasts could sometimes be swinging in mid-air depending on how fast she goes.

Wayan Character Design

Wayan is portrayed as teenage boy with a slightly athletic build and broad shoulders. He has the tan of an Indonesian native with light brown hair. He wears flip-flops, a t-shirt, cargo pants and a digital watch on his wrist.

Sequences for Narrative

Since I have decided to tell my story through an interactive comic experience, I had to narrow my ideas down and focus on a particular part of the plot. I have chosen to develop on the third act of my story as I find that it would keep my readers at the edge of their seats with the captivating visuals and exciting revelation at the end.


Act Three of Teteque: Wayan’s Encounter

As Wayan made his way down the dining room, he flashed over the writings knifed to the walls. One wrote “Beware of the witch! She’s watching us!” and another wrote “Her insatiable bloodlust! Hide the men and protect the children! For it is them she seeks!” The writings sent chills down Wayan’s spine. The air was cold but he was sweating from his palms and feet. He then sensed a presence in the room. It was almost as if someone was heavily breathing down his neck. Without looking back, Wayan raced into the halls as fast as he could.

He soon reaches a dead end where he could no longer distinguish right from left. Wayan turned his flashlight on to reveal a huge mirror that impeded his way. The mirror was covered in bloody fingerprints and a finger-painted writing that reads “Look out for Teteque!” And at that moment, he realized that he has trespassed and led himself into the den of the monstrous demon that brewed fear in the villagers. As he took his focus off the writing, he spotted a vague reflection of a boney old lady with piercing red eyes standing behind him. With sheer force, he immediately breaks into the mirror and ran to find an exit. He could hear her grunting while she chased him down.

Wayan quickly entered a dark room and locked the door behind him. He was breathless from all the panic that struck him and fell to his knees. He teared at the thought of him being hunted down by Teteque before he could make his way out of the endless labyrinth. He reached into his pocket for his phone but mysteriously found crumpled paper packaged around it instead. He unwrapped the paper and hovered his phone over the contents of it to unveil a note. It reads:
“To whom it may concern,

The Missus killed the Master today. He was a good man. He never meant any harm. He treated me with respect unlike that old cunning bitch! She never gave him what he deserved. And I was simply repaying his kindness. I loved him. And he loved me. I was bearing what was ours. She took it away from us. She left me bleeding next to his dead body. So I killed the Missus before she could take off. She was not a good woman. I lost everything. So help me, Lord. Let me find what I have lost. For not another moment is worth living if I am already dead inside.

The Mistress.”

There was nothing more to it. Wayan could not believe what he just read. There was nothing but vengeance blanketed under its tone. His phone started to shut off. And as his light flickered, Wayan realized that he was sitting next to a skeleton all this while. Just before his light died off, he came face to face with the demon Teteque, What was left of this misfortune was Wayan’s unfading scream which slowly echoed through the walls of the manor.


Story Panels

Keeping in mind that I am only using key sequences in the act to visually tell the story, I have planned to present the scenes in a way that it captures the moments in the most precise and presentable way without betraying the exact emotions and feel I wish to evoke in this interactive comic. I have also taken into account of the mise en scène of each and every panel to stay true to the ingenuity of the story.

In total, I am telling the story within 15 panels – each having its own identity while serving the purpose of staying connected to build a smooth flow in the story. Here is a brief description of the contents of each panel:

Panel 1:
Wayan makes his way down the  stairs and into the dining room, navigating with the light in his phone camera. Dusty antique furniture covered in cobwebs slowly illuminated by Wayan.
Panel 2:
Wayan flashes over the huge and heavy writings on the wall of the dining room. Deep knife scratches embedded into the walls that reads “Beware of the witch! She’s watching us!”.
Panel 3:
Wayan feels a presence as he makes his way deeper into the hallway. Teteque is hovering beneath the ceilings of the room.
Panel 4:
Wayan runs for his life down the halls. More old furniture are seen while his light illuminates the path in front of him.
Panel 5:
Wayan reaches a dead end. He no longer knows where to go. He notices a mirorr in his way.
Panel 6:
Wayan flashes his light over writings in the mirror. The writings were all written with someboy’s fingers in blood that dried up over time. It reads “Look out for Teteque!”.
Panel 7:
Wayan shifts his focus to the reflection in the mirror. A vague image of a smiling Teteque appears behind Wayan in the reflection.
Panel 8:
Wayan breaks through the mirror. Bits and pieces of the mirror shatters across the panel.
Panel 9:
Wayan falls into a dark room. His phone is no longer lit.
Panel 10:
Wayan rummages in the dark for his phone. A dim trail of light guides him to his phone.
Panel 11:
Wayan finds a paper wrapped around his phone and reads it.
Panel 12:
Wayan reads the contents of the paper which tells the story of the occupants of the manor. A letter specially written by the housekeeper. It reads

“To whom it may concern,

The Missus killed the Master today. He was a good man. He never meant any harm. He treated me with respect unlike that old cunning bitch! She never gave him what he deserved. And I was simply repaying his kindness. I loved him. And he loved me. I was bearing what was ours. She took it away from us. She left me bleeding next to his dead body. So I killed the Missus before she could take off. She was not a good woman. I lost everything. So help me, Lord. Let me find what I have lost. For not another moment is worth living if I am already dead inside.

The Mistress.”

Panel 13:
Wayan is astounded. He sees a decaying body from across the room. His face turns pale as his phone flickers in the dark due to its low battery.
Panel 14:
In its last few flickers, Teteque appears in front of him.
Panel 15:
Teteque takes him out and only his scream is heard from outside the manor.


Software

I’ll be using Adobe Muse and Animate CC to achieve a responsive website design with scroll effects as well as other visual effects.

 

Plot for Narrative

After much research, reading and talking to some of the elderly in my family, I have gathered some insights on the legend of the Hantu Tetek. I have decided to take the plot on a linear storyline as I feel that it serves scary narratives best. And I have also taken the liberty to modernize and glamorize this demon to “Teteque” instead as it gives a sense of ingenuity and character to it.

churelThe Hantu Tetek

In Malay folklore, the Hantu Tetek is believed to be a ghost-witch, which existed back in the early days, with enormous mammaries that preys on little children and young men at the brink of dusk. Once her prey is entrapped in the constricts of her breasts, she suffocates and devours them.

The legend was told to scare little children to keep them indoors when night falls so that they would not be up to any mischief. Young men were also discouraged to be out at night as they too could become victims of the Hantu Tetek.

Although the idea of the Hantu Tetek may be too ridiculous and daunting to many, those who claimed to have sighted her described her as a monstrous demon with large breasts draped from her back. I would like to interpret her as a skinny elderly witch with silver hair, pasty pale skin, bloody-red eyes, razor-sharp teeth, long claws and long veiny breasts latched to her back that are too heavy, she has a hunch and sometimes goes on all four limbs to move around.


Teteque: The Plot

Wayan is a 15-year-old boy living in the outskirts of a quaint little village called Wesya located in the center of the dense jungles of the Malayan territory. He works for a local grocer, delivering goods to various households in the village on his bicycle after school. On most days, he would be home before dusk, just as how his single mother preferred it to be. She would fret every time he gets home late, even if it was for a few minutes, as she feared that he would go missing. Just like his father.

Wayan’s father has not returned home since he went out one night when Wayan was still an infant. The villagers believed that he and several others were taken away by a demon, called Teteque, who lurks in the forest at night preying on little children and young men. Due to the many disappearances in the past, parents would discourage their children from being out at night.

On a cold evening, Wayan raced up the rocky paths of a hill to make his last delivery for the day. He knew that if he paddled any slower, he would not make it home before sunset. As he attempted to make a sharp turn along the route, he swerved and fell into a ditch. He rolled down the roaring undergrowth that carpeted the forest floors and ended up on a shrub that cushioned his fall. He got up and pulled through the mishap with only a few scrapes and scratches on his arms. His bike, along with the groceries he intended to deliver, was nowhere in sight.

Wayan tried to retrace back the path where he fell from but instead found himself lost in the thick foliage. He reached into his pocket for his smart phone to see if it could be of any help for him to get home. However, there was absolutely no signal making it impossible for him to make any calls or navigate through the forest with GPS. The sky grew darker and Wayan knows that the best option for him now was to head forward and hopefully get back on a trail that would lead him home.

Within several minutes, Wayan came across an old abandoned manor in the woods. It seemed as if the large house once caught fire with part of its structure being close to collapsing and walls that were singed to its grounds. A rusty old Bentley covered in moss was sitting in the empty fountain at the porch, almost as if the person who drove into it was in a haste. Wayan was not able to piece together the tragedy behind the mess but whatever it was, it could not have been pleasant.

Night began to fall and Wayan was left with no choice but to take shelter in the abandoned manor. He knew that it would not be wise of him to maneuver through the forest in pitch dark and decided that he would resume his route back home as soon as dawn breaks. He used the flash light on his smart phone to find his way through the deep, dark and dusty interiors of the house. What he found next with the dim light of his dying phone was beyond astonishing.

There were black-and-white photographs, probably taken in the early 20th century, of a wealthy couple hung on the moldy walls of the manor. The man was in a tuxedo, with his hair sleeked back into a comb over and a gelled-up handlebar moustache, while the lady looked like she was dressed in the roaring twenties. The frames that shielded the photographs from decay were all covered in speckles of dried blood, similar to a scene from a horror movie. Wayan could not help but notice an unfamiliar figure within the many photographs of the couple. It was a girl who looked like she was no more than eighteen. The way she was dressed suggested that she probably worked for the couple as a housekeeper. Her gaze was alluring yet somewhat menacing.

As Wayan made his way down the dining room, he flashed over the writings knifed to the walls. One wrote “Beware of the witch! She’s watching us!” and another wrote “Her insatiable bloodlust! Hide the men and protect the children! For it is them she seeks!” The writings sent chills down Wayan’s spine. The air was cold but he was sweating from his palms and feet. He then sensed a presence in the room. It was almost as if someone was heavily breathing down his neck. Without looking back, Wayan raced into the halls as fast as he could.

He soon reaches a dead end where he could no longer distinguish right from left. Wayan turned his flashlight on to reveal a huge mirror that impeded his way. The mirror was covered in bloody fingerprints and a finger-painted writing that reads “Look out for Teteque!” And at that moment, he realized that he has trespassed and led himself into the den of the monstrous demon that brewed fear in the villagers. As he took his focus off the writing, he spotted a vague reflection of a boney old lady with piercing red eyes standing behind him. With sheer force, he immediately breaks into the mirror and ran to find an exit. He could hear her grunting while she chased him down.

Wayan quickly entered a dark room and locked the door behind him. He was breathless from all the panic that struck him and fell to his knees. He teared at the thought of him being hunted down by Teteque before he could make his way out of the endless labyrinth. He reached into his pocket for his phone but mysteriously found crumpled paper packaged around it instead. He unwrapped the paper and hovered his phone over the contents of it to unveil a note. It reads:
“To whom it may concern,

The Missus killed the Master today. He was a good man. He never meant any harm. He treated me with respect unlike that old cunning bitch! She never gave him what he deserved. And I was simply repaying his kindness. I loved him. And he loved me. I was bearing what was ours. She took it away from us. She left me bleeding next to his dead body. So I killed the Missus before she could take off. She was not a good woman. I lost everything. So help me, Lord. Let me find what I have lost. For not another moment is worth living if I am already dead inside.

The Mistress.”

There was nothing more to it. Wayan could not believe what he just read. There was nothing but vengeance blanketed under its tone. His phone started to shut off. And as his light flickered, Wayan realized that he was sitting next to a skeleton all this while. Just before his light died off, he came face to face with the demon Teteque, What was left of this misfortune was Wayan’s unfading scream which slowly echoed through the walls of the manor.


Teteque: The Backstory

It was in the late 1920s when Dewi, an attractive 18-year-old orphan, got her first job as a housekeeper to the Lesmanas, a wealthy couple who owned a huge manor in the outskirts of the Wesya Village. Hendra Lesmana was a charming young man who became the direct successor of his family-owned business in exporting rubber to neighboring regions after his father passed away. Ri Lesmana, his tall and sociable wife, was more involved in securing business deals with potential clients overseas. The two had no children since Ri was not able to conceive so they spent most of their time on work.

Ri had to travel abroad often for business trips while Hendra manages the exports locally and works mostly from home. In her absence, Hendra and Dewi spent most of their time together and they began to develop romance over time. They kept their love affair a secret for the longest time until he got her pregnant. He did not wish for his wife to find out as he knew this could possibly shatter their marriage. He had always wanted a child to call his own.

Ri returned home before Hendra could send Dewi away to deliver his baby in secrecy. She got suspicious over Dewi’s growing womb and confronted her when they were alone in the manor. After she found out about their secret love affair, Ri waited by the porch for Hendra to get home. Hendra swearved and drove their Bentley into the fountain when he was stopped by his furious wife.

They quarreled all afternoon and Ri, in the heat of it all, accidentally stabbed her husband with a kitchen knife. Dewi rushed into the bedroom to attend to a dying Hendra. Ri caught her off-guard and kicked her in the womb several times before she fled the manor with her belongings. Dewi was left to bleed next to her dead lover. But whether she survived the tragedy is still a mystery.

Assignment 2: Opto-simulator

Objective

To simulate eyes that follows the subject depending on his/her position.


Sensing

Camera captures an image of the subject’s face.

Computing

Computer calculates the position of the subject within the x-axis and y-axis within the screen.

Effecting

The simulated eyes look and follow in the direction of the subject’s position.


Process/Execution
Overview
opto_simulator_1
Tracking the face
opto_simulator_2
Syncing face position with video playback

 

opto_simulator_3


Results

opto_simulator_gif

Assignment 1: Mirror

Objective

To create a mirror that grows dimmer as the subject moves closer to it.


Sensing

Camera captures an image of the subject’s face.

Computing

Computer calculates the area of the subject to determine the distance and generates a value for the brightness of its reflection.

Effecting

Reflection is dimmed when subject is close to the “mirror” while it is brighter when subject is away.


Process/Execution
Overview
mirror_1
Getting image from camera
mirror_2
Bounding box for face tracking
mirror_3
Calculate area of bounding box
mirror_4
Face size to brightness

 

mirror_5


Results

mirror_gif

Ideation for Narrative

Topic

1. Children & Parenting

I have expressed my disliking for children in general and the topic came to mind while I was commuting from home to work in the early hours of the morning. Children can be negligent and, at times, misbehave in public which would often end up ugly for their parents who have to act appropriately to counter their misdemeanor. However, not all parents intuitively handle the situation well. The way a child behaves at home or in public reflects their guardian’s parenting skills.

With this context in mind, I wish to come out with a “dos and donts” narrative that would approach the issue which concerns parenting in public.

2. Hantu Tetek

Southeast Asian folklores have always sparked some interest in me at a very young age. The adults in my family used to frighten me with scary tales about the Hantu Tetek to have me home before dusk falls. But is the legend true? Or is it simply a myth to scare children into thinking that if they stay out too late, a demon with gigantic mammary would come and capture them?

I am very interested in further researching about this topic and create a narrative that not only discuss about the story of the Hantu Tetek, but also how such monstrous creatures came about in hopes that the viewer unravel some truth about this mythical tale.

http://3.bp.blogspot.com/_AmhrDSWNe_g/SOz6-_sprbI/AAAAAAAAAo8/1e3GPvsgWxc/s1600/churel.jpg

Topic chosen: Hantu Tetek

Plot

Act 1:
The character has lost his way home in the dense forest of his hometown.
All he has is his dying camera phone (with no signal).
It is getting dark and he will lose his visibility of his trail in a matter of minutes.

Act 2:
He finds himself in the courtyard of abandoned manor but by that time, the sky is dark and it begins to rain.
He takes shelter in the manor, navigating with the flashlight from his dying camera phone.
He feels a presence lurking around, going after him.
He keeps on moving and finds remnants of the past that describes a monstrous breasted-creature that lusts for the blood of young man.
Vigorous sounds can be heard.

Act 3:
Possibility 1 – He finds his way out of the forest and back home.
Possibility 2 – He faces the wrath of the Hantu Tetek.

Mode and Medium:
Interactive Graphic Novel

 

 

Reflection: 4 Concepts of Interactive Narratives

3In his short text, Eric Zimmerman attempted to break down the terminologies of game-story while reconstructing the two by introducing four new concepts – narrative, interactivity, play and game, that were essential to bridge a connection between narrative and interaction. He began with raising the issue that concerned people’s dissatisfaction with the current state of game-story. His aim was to provide a deeper understanding to the relationship between game and story while resolving the problem we face to integrate the two.

I particularly loved how he juxtaposed narrative to a game of chess. When he started to break the concept of chess down was when I realize how much of a story it is rather than a game just by itself. Chess consists of a beginning state (the setup), changes to that state (the gameplay), and a resulting insight (the outcome of the game). He then went on to further explain how chess is a stylized representation of war. Upon this realization, I noticed that all, if not, most games could be a conceptualization of a story.

I also loved how he managed to distinguish the four modes of interactivity as well as how he unconventionally described play as something that opposes the bounds created for a game. Play does not only act as a utilitarian function of the system but also as an expression of the system. He even mentioned how when we take part in a game, we are submitting our behavior to the restrictions of the game.

What struck me most was that he did not raise the debate of whether a game should be considered a narrative or not, but instead he questioned how a game by itself can be narrative and how it can be narrative systems in ways which other medias could not. This excerpt from his text broaden my perspective on what narrative and interactive are and how they correlate.

Link: http://www.ericzimmerman.com/texts/Four_Concepts.html