Narratives Sharing: How far away is Mars? (5)

Done by David Paliwoda and Jesse Williams, Distance to Mars illustrates the Earth (100pixels) and its relative distances away from Mars. The webpage takes us on a virtual journey towards Mars, which is 428,000pixels away (by scale).

Check out the website here!

This is a simple webpage done to illustrate the realistic distance between Earth and Mars. While it is only based on one fact and may not have a strong narrative behind it, I feel that the travelling experience it provides is rather interesting and unique, and perhaps, has the potential to expand into a whole solar system.

Narratives Sharing: Flat vs Realism (4)

Flat vs Realism is an interactive story and game website that illustrates the battle between flat design and realism, in 2013. Created by inTacto, the webpage tells an epic story of the kings – flat and realism, leads to a classic video game battle, and ends with a peaceful reconciliation and a new year greeting from the company.

Check out the website here!

This webpage has awesome graphics and animation that clearly demonstrates the difference between flat design and realism. The personification of these design styles as kings and the physical (but virtual) battle between them helps build an immersive experience for the players.


Narratives Sharing: Gods Will Be Watching (3)

Gods Will Be Watching is a survival concept game with pixelated graphics. The back story involves a team conducting research on a certain virus, which then went wrong and left to fend for themselves in the wild. The aim of this game is to survive 40 days along with your comrades, and fix the radio in order to send a message to your headquarters.

Click here to play!

god1 god2

The player tries to survive, along with 5 other people and 1 dog. Each of those 5 characters has his/her own profession – psychiatrist, doctor, engineer, soldier and a robot. You can choose to interaction with these characters differently, by making use of their skills to help the group survive, to talk, or to kill.

god3 god4

What I like about this game is the challenging aspect of it – players need to ration (only 3 actions per day) and strategize in order to survive. It also brings forth moral issues and prompt us to analyse the situation carefully before making a move (cause the gods are watching!). E.g. Is is necessary to kill the weak in order for the rest to survive, or is it just easier?

Narratives Sharing: NoStranger (2)

NoStranger (available on GooglePlay!) is a user-choice-driven narrative that revolves around having a conversation with a stranger. By conversing with the stranger, his/her name, background story, motivations and intentions are revealed, bit by bit. The player gets to choose between different actions to take after finding out certain information about the stranger. Through the browsing of blogs, websites, social media and related contact profiles, bits and pieces of the whole story can be put together.

screenshot_2017-02-16-15-34-54-45 screenshot_2017-02-16-15-35-11-01

This game captured my attention due to its unique form of interaction and its relevance to the issues faced by the current society. As the nature of the story is slightly dark, topics like suicide and violence are involved, along with several moral decisions that the player has to make.

Narratives Sharing: “The Grudge” (1)

“The Grudge site was created to promote the film, “The Grudge”, starring Sarah Michelle Gellar. Rather than a traditional production site, the client wanted an immersive, frightening environment that would evoke the spirit and tone of the film and generate interest throughout the target online demographic of males/females aged 18-24.” –

Click here to check it out!

This is a horror-themed interactive narrative story that provides an all-rounded experience for the player to immerse in – from its dark, flashing creepy visuals to the eerie background music.


Apart from its excellent visuals and audio, one thing that really struck me was the build up of suspense throughout the story. The inclusion of the player’s name and initials made the game even more immersive, as though placing the player right at the centre of the story. As someone who has never seen or read about the movie “The Grudge”, I felt that the story had a strong start, as the mood, theme, setup and location of the whole story was neatly portrayed. The player is guided throughout the game by small notes with clues and instructions as to where to go or what to do next, e.g. go to the laundry room and mum’s room.

Narratives for Interaction: Twine vs ChoiceScript

I’ve decided not to go with ChoiceScript for my project because I found its structure rather rigid, in terms of the story flow and possible designs of the page. After much googling, I found another program that supports the creation of interactive web stories.

Twine is an open-source program for creating interactive, nonlinear narratives. Twine provides a framework for us to structure the flow of our stories, but can be published directly to HTML. Hence it is possible to extend the story beyond just text – music, sound effects, visuals, using variables through JavaScript and CSS.

Example of a Twine code:

Here’s an example of an interactive text-based story done using

“The Garden of Forking Paths” by Jorge Luis Borges

       The passage starts off with a brief historical excerpt of World War I, where a planned offensive by the British divisions against the Germans was delayed. A recount of the event, written by Dr. Yu Tsun, then starts abruptly from its third page.

Dr. Yu Tsun, a German spy hidden in London, is forced to escape after the murder of his comrade Viktor Runeberg, by English serviceman Captain Richard Madden. In a mission to relate the information of the British artillery whereabouts to his Chief in Germany, he quickly plans his next move. In this reading, Yu Tsun gives a detailed recount of his journey, or escape, towards a man named Dr. Stephen Albert, with the help of a well-timed train departure and some children. Upon reaching the home of Dr. Albert, Yu Tsun identifies himself as the descendent of Ts’ui Pen, who abandoned his career as a Governor of Yunnan and dedicated the rest of his life to the writing and construction of a novel and labyrinth, “The Garden of Forking Paths”.

      Dr. Albert and Yu Tsun then proceeds to discuss about the controversy of the published novel – deemed as a shapeless, disoriented mass of drafts. However, the two ventures further into the real conception of the novel and the symbolic representation of the labyrinth. Ts’ui Pen’s labyrinth explores the infinite dimensions of time, presenting a network of converging and diverging possibilities, ever-spreading. For example, one can be a friend in one dimension and an enemy in the next. Interestingly, this mirrors the present conflict between Yu Tsun and Dr. Albert. To Yu Tsun, Dr. Albert is a friend because of his help in the restoration of Ts’ui Pen’s garden, but an enemy because he has to be killed in order to convey his message to his Chief. Madden is an enemy because he arrested Yu Tsun, but also a friend because he helps to ensure that both Yu Tsun and Dr. Albert’s names appear in the same newspaper article.

      Overall, The Garden of Forking Paths is rather captivating, though confusing on the first read. It compels its readers to think critically about present day situations and the complexity of time.

MAX Assignment 2: Eye Tracker

Task: Create an eye or movement tracker that follows you as you move left and right

  1. Detection of your face, calculation of the x-coordinate of the midpoint (sensing)
  2. Uploading of eye movement clip, scale the frames of the video to the position of your detected face (effecting)

The first portion of this assignment involves detection of the face, inverting and extracting the coordinates using jit.iter, similar to the magic mirror.


New objects/messages used in this assignment: @autostart 0, frame_true $1, bang, getframecount


(left) Calculation of the x-coordinate of the midpoint of the face detected: adding the top left and bottom right values then divide by 2.

(right) Uploading of video using read and, play the video by a specific range of frames determined by the scale.



Problems encountered:

Jumping of the frame when no face is detected -> abrupt
Solution: if value <=0, then play frame (middle)

(To be updated!! Have yet to get this part^ to work)

An image I didn’t take


The sky was a beautiful gradient of azure to midnight blue. The sun had just set, leaving rosy streaks of orange, yellow, and just a hint of purple right above the horizon. The sea, in its glorious vastness, was a deep prussian blue. The water was rippled, with large white waves in the distance gushing towards the little silhouettes of travellers lingering by the shore. Two large sail flags stood out on the darkened shore with their vibrant hues of red, yellow and green, fluttering in the sea breeze. Warm, spherical lanterns lit up along the beach, gently illuminating the little wooden restaurant tables and beanbags placed around them.

Image for class: 323035_10150481819668819_1045153988_o