Spring 2020 – Page 2 – Alternate Realities

Project 3 Documentation | The Fall of Octavia

Project Description

The Fall of Octavia is an immersive experience in Unity that depicts the demise of the fictional city of Octavia. First described in the novel Invisible Cities (1972) by
Italo Calvino, the city of Octavia is said to be hung across two steep mountains above an abyss by ropes, bridges, and chains. Due to such a precarious nature of the foundation of the city, it seems like the city’s inhabitants all know the city will come to an end, sooner or later.

Adopting the perspective of a mother’s journey to find her daughter in the falling city, the experience invites the player to a precarious situation where the player must navigate through. The experience, thus, is two-fold. Firstly, the main objective is to find the daughter among the inhabitants of the city. Secondly, through the task of traversing the city to find the daughter, the player immerses themselves in this strange world of Octavia, trying to make sense of the city, its geometry, its direction, its motion, and its people in action through environmental storytelling elements.

The experience is open-ended. There is no time limit. Even though parts of the city are destroyed over the course of the experience, the player is welcomed to explore the city at their own pace. However, once the player crosses over to the mountain, the rest of the city will fall, signalling its eventual demise happening right in front of the player’s eyes.

Process and Implementation

We started off with the ideation phrase. Having unanimously agreed that we did not want to create an escape room experience, we were left with recreating a city from Invisible Cities or an apocalypse. How about combining both of them: we were all impressed and intrigued by the city of Octavia, whose unique foundation puts it in a precarious situation that would lead to eventual destruction. Octavia’s unique geometry would also leave a lot of room for environmental storytelling elements.

Originally, we came up with an idea in which the main character (the player) had to save the day when the spider that laid the hanging foundation of the city had returned and threatened to destroy the city out of vengeance (for occupying its net). However, after pitching the idea to everyone, we realized that the incentive of the experience were not explored sufficiently and would be hard to do so. Would the goal be cutting the ropes that hold the city and thus destroying the entire city AND the spider along with it (which is the only viable way to fight against the enormous spider)? Wouldn’t that go against the idea of saving the city in the first place even though the effort would save the people who already made it to safety across the mountain? But then would we have to explain that the spider would now try to kill the people who already made it to safety instead of destroying the city itself?

Our very first sketch involving the spider

The idea turned out to be a rabbit hole. After much efforts into patching the idea together, we decided to come up with another incentive for the main player to traverse the city: a mother’s journey to find her daughter in a chaotic, gradually disintegrating city and get to the mountain before the entire city collapses. The task of finding the daughter would give the player an incentive to put active efforts into exploring the environment and take in as much as possible what it has to offer, as opposed to rushing to the finish line. We also narrowed down the main navigable route of the city to be a straight line (which is of course decorated by out-branching bridges and ropes which act as the backdrop for the city), with the reason being we did not envision this experience to be similar to an escape room where the player needs to take different paths to find something.

We also envisioned some sorts of interactions between the player and the NPCs to further detail the environmental storytelling elements. Instead of asking the player to carry out a traditionally proactive interaction (either by pressing a button or holding a gaze), we decided to take in the feedback from Sarah and let the NPCs unravel their animations when the player came close to them, i.e. them being in the player’s field of vision. Because looking is an active choice in a virtual reality space, the player sees the world and the story that the NPCs deliver through their emotions and the reactions to the presence of the player. For instance, a woman who can be seen praying from afar begins to cry and lash out of frustration at the player upon coming closer to her. Another example is an injured man who is trying to run away from the crippling city drops dead when reaching the player’s field of vision. The act of seeing the man drop dead is an active embodiment of the dying city itself: the player is surrounded by the process, not the just the aftermath, of the destruction. The act of seeing the man drop dead evokes more emotions than just seeing dead corpses lying around, which leads us to the finale: after making their way to safety, the player and the daughter will witness the eventual obliteration of the rest of the city, wrapping up the entire experience.

Early on, my main responsibly was to create Non-Playable Characters (NPCs) and their animations. A more detail account of the process can be found on my developmental journal but the process can essentially be summarized as:

Using Adobe Fuse for 3D character creation

This image has an empty alt attribute; its file name is Screenshot-34-1024x576.png

Rigging in Mixamo to applying animation -> importing into Unity

This image has an empty alt attribute; its file name is ezgif.com-video-to-gif-4.gif

Tweaking the materials properties so that the character look as good as intended in Unity
Creating Animator Controllers in Unity and scripting them so that they change animation clips when the player is in the vicinity

Creating a special script for the daughter so that she follows the player

This was where things got trickier. At first, it was a straight-forward process to rotate the daughter so that she always faced the the player before she was picked up; it was also easy to anchor her rotation and position to the player’s respective data when she started to follow the player (using transform.position and transform.rotation). While the player itself utilizes the NavMesh and thus cannot walk through walls or other objects, the daughter is caught in a weird position (no pun intended): she would knock over walls and other objects if she is set to be isKinematic or alternatively she would be knocked over upon collision with other objects set to isKinematic. Unfortunately, when both were set to isKinematic, she could walk through them as if the Collider was not applied. The goal was to have the daughter AND the player stop when either of them hit any obstacle, which proved to be difficult. It might involve passing information around different scripts (daughter and player) when collisions happened and moving the daughter using Rigidbody instead of transform.position. I had to settle with the current imperfect implementation as I had to move on to other components.

As some suggested adding an introduction to our experience, we decided to do a flyby over the city while narrating the situation in the beginning. The narrator briefly introduced Octavia and its unusual traits while setting identity for the player (mother/parent) and setting a goal to incentivize the player to traverse the city (find daughter and head to the mountain). Text narration was discussed at some points; however, we agreed it would be competing for player’s attention with the moving scene of the city below. The only text element in the entire experience is the title of the experience which is displayed when the narration finishes.

Reflection/Evaluation

Overall, I am happy of the what the project turned out (or not turned out) to be. During the ideation process, I would often feel overwhelmed because of the scale of the city. Thankfully, with the simplifications we made with regards to where the player can go and what the player can interact with, the experience still retains its most essential essences while we managed to strip down unnecessary elements.

That being said, however, if I were to nitpick, there would be still some aspects of the experience that can be improved upon given enough time. Having said before, I would love the daughter character not to walk through objects like a ghost. Also, having some more characters wouldn’t hurt, especially having some NPCs make it through the bridge to safety; for now, the player and the daughter are the only sole survivors of the city. While such a scenario in itself is not entirely impossible, it would be a bit more realistic to have other survivors in the mountain congregate to witness the demise of the city as well.

Final Project Documentation

Escape Room: Watching

Documented by: Keyin

Group Member: Ben, Chris

PROJECT DESCRIPTION

— This project is basically an escape room designed for Google Cardboard environment. The game begins in a hospital and our protagonist will be restricted on a wheelchair while moving around and seeking clues. As the user explores our world, he/she is supposed to feel the anomalies and get into our story that it’s essentially an AI/machine-dominated world. Our character, as a human, is only a research object and is monitored all the time. We have a few designs based on this setting which I’ll explain more in the next session.

— But also, since we didn’t describe the background obviously by words, users are welcome to relate different things during in-person experience and we are also open to other possible interpretations if any. I believe after polishing up our indicative designs, different understandings can also add to the depth of our work.

— Based on the story we have in mind, we go with the psychological horror style to build the space. There’s no screams or ghost faces to scare people. But we do have multiple sound effects to create the skeptical and tense atmosphere. To meet the conditions of using a Google Cardboard, the main interaction in our project is only clicking as well as long clicking, the former for interaction and the latter for movement. The wheelchair setting was also made to fit how Google cardboard works, because we were intended to let the user sit on a chair and use Google Cardboard to play. At the same time, the wheelchair restriction can give the user different experience on moving around the space and pushing or interacting with objects.

PROCESS & IMPLEMENTATION

— When building the space, we made a basic hospital structure with a few sections. At first, our mood board chose some horror style, but later we went with psychological horror and tried to create a creepy clean style. That’s why we mostly used white, grey and red. As we were searching for assets, we didn’t find any that was very suitable. So we just chose a zombie hospital asset as it has a complete set of hospital stuff. And we set the light in a sense that it looks like psychological horror.

In order to construct our story, we’ve made effort on a few designs.

1. Player Setting

— The player is sitting on the wheelchair where he can only rotate his head to look around or move the wheelchair to move around. The movement is controller by character controller. When he moves, there will also be animation of his hands moving as he’s pushing the wheels. The angle the user can look up and down is also limited (delta y from -90 to 90) so that it composes a reasonable field of view for the person. The speed of the movement is also set as a relatively low value considering the situation, and it also turned out appropriate during the play testing.

Player Animation

2. Scenes/Objects Consistency

— To match the body model style, the clue photos of the character are also made in the similar low poly style. The elements of red circles and red rectangles are also applied in photo collection interface and the ending scene.

— The photos were made as if taken by CCTV. If you notice the dates on them, you may realize all of the four photos are about the same person, our protagonist, from young to old. Connected with the space the player is locked in, we are trying to convey that the player is undergoing monitor the whole time which may raise questions to the player. Who stands behind the monitor? What’s the relationship between the space and the player? What is he doing here or who locks him here for purposes? And the player could possibly have some answers by the end of the game.

3. Sound Effects Design

— We specially included some sound effects to make our scenes more expressive and immersive and also gives the player some motivation to get out instead of only idling in the space.

— Besides the basic wheelchair sound effect, there’re sounds only played once, sounds within a range of area, and sounds that will be triggered if the user enters certain space. The broadcasting sound at the beginning is cut off abruptly. The combination of unknown footsteps and baby cries near the mortuary is meant to create some tension and indicate something undesired may happen. There’s also one moment when the sound of moving beds is left-panned to make the user feel something is on the left. But when he steps out of the trigger area, the sound will stop suddenly as if what he heard is only his illusion. Generally the sound effects are designed to strengthen our “storyness” as well as improving the user experience.

Sound Effects Demo

4. Ending Scene

— After the player gather all of four photos and notice the dates on them, he could open the door by connecting all the dates as the password. The game is ended at that moment. However, we connect the door animation with another ending scene to make our story more complete.

— Instead of the first perspective, this ending scene is a third perspective from a CCTV screen. There also includes the audio of computer talking which can help with our illustration of the story idea. It echos with the previous four photos which are taken by CCTV and indicates that the player is still under monitor. What we want to convey is that it seems the player has escaped successfully. But does he really escape?

Keypad + Door Animation + Ending Scene

5. Other details

— We’ve turned the player to face the album on the bed at the very beginning of the game because it’s an important clue in the whole process. We also have a glowing effect on the album to highlight it. By the way, if the player doesn’t interact with the album at the beginning, he’s still able to go through the process and whenever he comes back, he can get the clue that there’re four photos in total. And although we refer to it as an album for convenience, in the story it’s more like some archives or records about our character.

— At the keypad interface, we’ve provided an indication that there’re five digits in total if the user clicks “?” at the right bottom. The player could thus more easily think of the highlighted dates which are right five digits in total on all the photos.

EVALUATION

— Generally I think we did a great job in composing all the stuff together to build the scenes and making effort on constructing a relative solid story background. Meanwhile it’s also very playable and can make sense to people who play it. In terms of Google Cardboard environment, it can also fit very well and the use of Google Cardboard would definitely be a plus to our project.

— The only thing is that due to time constraint, we did not add intuitive word/visual descriptions of our story. On the one hand, it can be a style that we leave some space for users to imagine the whole story by themselves depending on what they get. On the other hand, for users who are eager to know what the exact story is, what we’ve presented may not be enough for them. If we have more time, we could add some introductory animation at the beginning or conclusive words in the end to reveal what the whole story is like. Also we could add more ways of interaction the user can experience. One last little thing is that in the ending scene, we forgot to show time at the corner, because a CCTV monitor should always record time.

Watching (Escape Room)

For our final project, we ultimately decided on creating an escape room. In the beginning, we were undecided in the identity and feeling that we were trying to convey and we looked at multiple different assets. After some discussion, we agreed to create an escape room based off an eerily creepy hospital room. We wanted the hospital room to resemble a mental asylum and that you the user, would wake up in. Additionally, we wanted to create an escape room based off of someone in a wheelchair and the disabilities you would face. This also added into the creepy feel because you know that something is wrong with the character. It also adds a sense of curiosity since you do not know how you became disabled. This adds into the entire narrative because you want to escape the room but also find out who you are and what happened to you.

The space is divided into a few different areas. Firstly, there is the ward in which you wake up in. There’s a bed next you with an album, a cart blocking your path, a chair, and a sink.

Once you exit, there’s a hallway that connects to the rest of the space.

From there onwards, the user can explore the space and there’s a room on the right side with a table.

If we go forwards from the hallway (refer to figure 3), we enter the operating room. There’s a bunch of miscellaneous objects, a recycle bin and surgical equipment.

If you turn left, there’s another hallway and it leads to another part of the hospital. If you turn left from that hallway, there is another ward. In this ward, there’s two beds and a drawer.

On the right side from the hallway, there’s an empty room with a box.

The last part of the hospital is the exit where there is a large metal door and a broken screen.

The objective of this escape room (other than to escape the room) is to piece together your past. To create this “storyness” we threw the user directly into a ward with little to no backstory. On the bed next to where you wake up, you notice an album and upon clicking, it displays an image that showcases four missing images (Refer to figure 2). The main mode of interaction is a click and a long click. We designed this with some restrictions in mind: this was designed for a Google Cardboard. This meant that we only had one click to interact or move. The process of this escape room requires one to click certain objects and explore via long click. In figure 9, the user would move the crosshair over the album and click to show an image. From this, the user would understand that the objective was to find photos.

The user then goes around the hospital looking for clues.

On each of the photos, there’s a number on them. These are used in the end when you have to enter a password on the keypad near the exit.

Once you enter the correct password into the keypad, the doors slide open and a cut scene plays.

Through this, we hoped to create an environment that resembled an escape room but in the context of someone trying to leave an abandoned hospital. The motivation for the user to continue exploring to figure out the character’s past. The interactions are simply clicks that would display an image or clicks to enter in the password. Furthermore, we wanted to paint a picture of a futuristic world in which our actions are being watched (hence the final scene with the security camera) and humans were research subjects. However, this is all up to the user’s imagination and how they perceive this.P

The brainstorming process was quite straightforward when we were creating it. The bulk of the planning process was coming up with the idea and what type of feeling we were trying to convey. We had various different types of hospitals (Figure 16), but we felt we wanted one that was creepy but not gory.

While we were play testing (in both the actual and the paper prototype), we received lots of helpful feedback. This included adding a motivation to escape and highlighting the interactions. We tried adding a motivation by discovering your past. The album in the beginning was also to indicate what the user should look for in the game. To increase immersion, we added audio that simulated an eery feeling through baby cries, rolling wheels, distorted radio sounds, and whirling of surgical tools.

Keyin was the creative genius behind most of the design decisions while Ben and I provided our thoughts and feedback. From the beginning, we needed implement a first person view and we decided that we wanted the user to be on a wheelchair. To implement this, we combined the wheelchair asset with the character model (the character looks like a zombie). We then added a character controller script that had the ray-cast, first person camera view, and interactions. If the player is close to an interact-able object and clicks it while the ray-cast is hovering it, an image will display.

I spent the bulk of my time animating the door and writing the script to open the door. I animated it via Unity and incorporated a simple script to test it out in the beginning (press space to open door). These largely adhered to the tutorials that Sarah posted. Once I made sure the animation was working, I added the keypad via GUI. I followed a tutorial on Youtube to complete this part: https://www.youtube.com/watch?v=ne41wItQmdo.
The script can be described as follows: when the user approaches the box collider of the door, it tells the user that if the user clicks one more time, a keypad will appear (this is done via onTriggerEnter and onTriggerExit along with boolean values).

If the user clicks, it opens the keypad (clicking turns a boolean variable keypad to true). The user can then hover and click on the buttons. The password is set in the code (“35296”) and there is a variable called input that is initially “‘. When a user presses a button, input = input + “x” with “x” being what number they press. Once the input is equal to the password, the door opens (another boolean variable is set to true). Pressing the “?” button will prompt a GUI interface to show writing “Enter a 5 digit password.” Pressing the “x” will turn the keypad boolean variable to false, closing it, and allowing the user to move again.

Originally, I had an issue where the user would not be able to click on the keypad because it followed the user’s camera. I resolved this by this line of code:
“Cursor.lockState = CursorLockMode.None;
Cursor.visible = true;”

This allows the user to move the cursor without the camera moving.

Sarah raised an issue where the cursor detracts from the immersion of the story since it wasn’t similar to the crosshair in the game. I tried to resolve this by changing the cursor to be the same as the crosshair, but that wasn’t shown in the build.

Another issue I faced was a nullExceptionError but that was due to me not capitalizing the “s” in void Start().

When animating the door, I had an issue in which the door would slide over the wall. This was resolved by adding another wall over the first wall so that the door would slide in between those two walls.

I felt like we definitely met our expectations in creating an escape room that had a “storyness” to it. I felt like there was also a motivation for the player to explore and try to escape. I am very proud of the work that we produced and I had a lot of fun making this. I was so absorbed in making this that I lost track of time and was 45 minutes late to a class. However, there are definitely some things that we could improve on.

Firstly, in terms of performance, there are some issues with the door. When I was coding it, I used onTriggerEnter and onTriggerExit to create this interaction. This would sometimes lag the user when they entered the box collider. Additionally, it was a bit clunky since you need to click to move and it would interfere with it. If I had more time, I would love to polish this up.

Secondly, in terms of aesthetics, there are some things I would like to improve. The keypad on the door does not really fit the overall feel of the hospital. Additionally, the text is quite small and the size of the keypad should be bigger. I tried to fix it before the deadline, but the changes weren’t big enough. The text on the keypad should also be a bit bigger.

Thirdly, in terms of “storyness”, I felt like this could be improved upon if we had more time. The objective was to explore the hospital, try to find out about your past, and escape, however there wasn’t much background information given to the user. Additionally, when the user went around looking at photos, it doesn’t add much information. Perhaps, some text at the back at the photo would aid in telling the story.

I also felt like there wasn’t much clarity and some controls aren’t that intuitive. One thing that was difficult was identifying what were clues and what we could interact with. We also didn’t know what we were looking for. Adding clarity such as when you hover over an object you can interact with, it lights up, would help.

Lastly, in terms of interactivity, there is a lot more we could improve upon. As of now, the only interaction are with objects that act as clues or the keypad. Adding different interactions such as being able to hold objects and using this interaction as a key component of finding clues would make the entire experience more interactive (and probably more fun).

There are a bunch of things we could spend time on improving, but for the given time frame I am extremely happy with the work that we created. In the summer if time permits, I intend to work on it. I’ve shared this with many of my friends and I’m asking them for feedback. Overall, I loved what we created and I hope to continue working on game projects in the future.

Development Journal: Project 3

For this project, Keyin, Chris, and I decided to go with the Escape Room idea. We had several specific ideas in mind, but we eventually settled on one where the user is wheelchair-bound. The reasoning is that by forcing the player to stay seated while playing/viewing in VR, we can not only easily create immersion, but also counteract any motion sickness felt while moving within the VR world.

In terms of scenario, we eventually settled on using a hospital setting, mainly because we felt it would create a compelling narrative around the wheelchair as well as create a suitable environment for a wheelchair-based user to navigate around in. We also decided to go for more of a “fake-happy”/”light-hearted” low-poly theme rather than an outright horror theme to give our game more of a psychological horror ambience.

My portion of development

https://streamable.com/gs96wb

Extremely barebones first prototype showcasing movement + interaction mechanics using only one button.

https://streamable.com/1ae7el

Collision-based pushing and physics interactions between objects within the world.

https://streamable.com/tiypks

Wheelchair pushing animation.

Project 3 Development Journal // Reflection

Update 1 (04/12) : Brain Storm Meeting for Theme

To decide on the theme of the final project, our team, Ganjina, Will, and I, met over zoom. We decided to give more time to brainstorm further individually on the the four final themes chosen in class (Apocalypse, Escape Room, Wonderland, Invisible Cities). We met again couple of days later with our respective ideas. The following ideas were shared and the potential for each were discussed collectively:

APOCALYPSE

User in a normal room, where if they touch anything / try to do anything, it triggers an apocalypse.
- Plays with the idea of affordances.
- Focuses on micro-narratives.
User in a cylindrical room, with many doors. Opening and entering a room → experience different types of apocalypses.
- Can focus on what apocalypse means.

ESCAPE ROOM

User is a kid in a bedroom with monsters.
* Therapist / Escape your mind!
User is a prisoner in some jail (narrative needed).
* Detective has been trapped by criminal mastermind (Joker/Riddler + Batman, Moriarty + Holmes, etc.)

WONDERLAND

User finds themselves on a street / in a room / in a different world where everything seems happy but interaction leads to hallucination that feels disturbing.
- Could go Matrix route / revealing the true world underneath
- Could go the mushroom forest route / world becomes psychedelic

INVISIBLE CITIES

* City built over a lake → have characters in reflection do different things from characters in view (sort of Hawaii/Bali in terms of style)
* City that colors memory and time travel (Bring back a friend or reversing an apocalypse)
City which only looks down upon the earth → could be sky city with telescopes and things pointed downward, (like Bioshock Infinite but more angelic/futuristic)
City filled with earth → dust everywhere, time slowed down, or literal carvings that come to life as you interact with them.

After much discussion for each idea, we came down to two possible ideas:

Idea 1: City, color, time travel

Initial Idea: A palette, composed of multiple colors, is used as a way to time travel to memories – all of which take place in different cities. Each city has a certain atmosphere, expressed through color in this case, that capture a memory between two individuals. The story is driven by the friendship of two individuals, that which has broken in the present time. The user – one of the two individuals – uses the palette to travel back to these memories and cities, to reverse their past mistakes. The story would have two possible outcomes – one where the user makes the right decisions and wins back the friend and the other where the friendship remains broken.

Idea developed after meeting: The second approach, developed after the meeting, was to base the story on reversing a global apocalypse instead of reversing a relationship. We were more attracted to the idea due to its clear objective, less focus on dialogue and characters – expanding the interaction with the actual environment and setting, hence less limiting.

Idea 2: City built over a lake, reflection [Final Idea]

Inspired by the “Valdrada” (Cavino, 45-56), Will shared his idea on building a city reflected by a lake. Calvino describes it as a city “built. . . on the shores of a lake, with houses all verandas one above the other”. The cities resemble in some aspects but are not equal. Like a mirror, the objects are inverted. Inspiration was drawn from these descriptions. With reflection being the central component, it was essential for the city to be surrounded by water. As such, Will suggested building in a tropical island setting.

Reflected House
Reflected town
Evil vs good
Will’s sketches of reflected tropical island
showing two conflicting actions

We decided to go forward with the idea of the reflected city. The idea of reflection had interesting ideas worth expanding on. After deciding on the theme, we decided to brainstorm individually on the story before the next meeting.

Update 2: Story Ideation Part 1 (4/13)

After the meeting, we individually brainstormed the story. Attached are some records:

After individual brainstorming, we met over zoom. We explored deeper into what the reflections would mean in our world. Discussion on the deception of reflections, on the mirror, was discussed. Mirrored images are familiar to the eye, but they are the inverted version of an object. We establish a preference for the familiar. Yet, when we are faced with the ‘true’ images, we feel uncomfortable (ex. un-mirrored images). The idea of discomfort when faced with a truth seemed interesting to expand on. This also relates to how people feel uncomfortable to face the truth, or express themselves in the most honest ways, as it requires vulnerability. Hence, the truth is often masked due to the discomfort that comes with facing such truth.

Another idea that was considered was – what things are reflected and are not? For example, a mirror. When we stare at a mirror, it is only the sight that is reflected – what we see. The four other senses – smell, touch, sound, taste. Also, Colors are the wavelengths reflected by an object. If an object is red, it absorbs every other color but red. So, for something to be reflected, two components – something that is reflected by the object of reflection (mirror, water, etc) and something that is not (which goes through). Leading to the thought – what goes through the reflection and what does not?

With this idea came the thought, what if there was a body of water which refuses to reflect in an entirely honest manner? A reflection which refuses to reflect back the lies and removes any form of deception of the real world? Hence, the reflected city would only show truth.

After the meeting, we had a more clearer sense of what the reflection meant in the world we were trying to construct. But, we were still unclear about the story.

Update 3: Story Ideation Part 2 (4/15)

We looked in to the history of some tropical islands. An example, colonization. The colonizer approaches the town with an intent to take – resources, culture, tradition, etc. However, they conceal their intent through packaging their acts as ‘service’.

Not fully satisfied with the idea, also due to not wanting the story to be too political, we kept on brainstorming the story. While googling images of reflected cities, images of Amsterdam came up. Specifically, Amsterdam’s canal houses.

The setting was capable of encompassing our theme of while introducing new aspects worth exploring and integrating into our story. New topics explored were:

1/ Society

Being a part of society, being truthful is not always an option. One puts on a façade and perform for others. Whether that is stemmed from one’s fear of truth or an act of being considerate other than themselves is highly subjective. Regardless, concealing inner truth to some extent is almost required for a social creature.

2/ Internal vs. External World (The home)

Houses protect people from the external world. Hence, when one is inside a house, their actions become more overt and in sync with their internal thoughts. They become more honest.

3/ Day and Night

From some personal accounts, the time of day seems to change the nature of conversations. Some of the most real talks have taken place during night, when the world has died down and you feel more present with your thoughts.

With these additional aspects came the idea:

Update 4: Paper Prototyping (4/15)

[Will’s notes]

During the first play test we were given the following feedback:

How will we guide the user to the pier? Dimming the sky to increase visual salience of the cue may help. Using NPC interactions and dialogue would be even better. Starting the user nearer to the pier might also help.
How are we moving? We could do automatic moving, like in TrailVR, or we could do GoogleMaps style point-and-teleport.
How much animation are we doing? Trying lots of animation means higher potential for making good use of VR storytelling space. It also means more overhead and more work.

Update 5: Environment, UI, Story

To move the project forward, we decided to each take part in the three main components of the development process. Ganjina took charge of starting to construct the environment using the assets (low-poly style) we have decided on, Will took charge of the user interface, and I took charge of the story development.

STORY DEVELOPMENT

Story Summary:

Confined Town
Way in for merchants, no way out for villagers.
Villagers unaware of the outside world.
The Queen and King assign villagers to dig for “stones” (gems) under the town pond in exchange for housing.
Stones used as currency for life-time housing.
Stones are high worth, and sold externally for personal profit of Queen + King.
Main Conflict: Unaware of outside, corruption, topics all of which are not addressed in the main world, only comes out in the reflected world.

Above Reflection (Dialogue directed towards player, but player doesn’t have to reply)

Player: character with no-impact
Aim: player ‘converse’ with each villager, explore their surface-level character
How?: when the player approaches npc close enough and clicks, a set of monologues starts playing on the text box. (each monologue aimed to introduce / build the surface character, all of which will be contradicted in the reflected world with action + dialogues)
Player input: clicking button for next dialogue to appear. After the user walks away, they can come back for another set of dialogues to play for more context.

Under Reflection (Action / Animation + Dialogue between characters)

Player: Ghost with no-impact
Aim: watch npcs interact with each other, watch how their real character shows up through action and words.
How?: User walks to the houses of npcs and clicks for a set of actions / dialogues to start.
Player input: click the house. look around to watch the scene.

The characters pre-existing in the asset is where I drew my main inspiration for the story. The story started with characterizing each npc and through that, I gave a role for each character to construct a larger functioning society.

Record of character development:

female npcs
male npcs

Record of story development:

Attempt 1: Dialogue in World 1 [Failed]

In the first attempt, user was assigned as ghost with no impact in world 1. The user would go around listening to dialogues between NPCs.

This seemed like the wrong approach because it did not give enough room for individual character development. By allowing the interaction to merely eavesdropping on these dialogues, this did not allow the user enough time to get to know the characters. Hence, it seemed essential to clearly set character and they slowly integrate and progress the story. To do so, in the second attempt, I made the user character with no-impact and reshaped the form of interaction into a monologue style – more commonly used in games with NPCs. NPCs would say couple of lines towards the user, but the user does not have choice to respond.

This approach seemed to make more sense. With this set, I started writing the monologues and dialogues which took place in two worlds.

World 1: monologues
World 2: Dialogues / Scenes

Read the entire script in google doc:

https://docs.google.com/document/d/1-318n3Ysps96i4_eqbyc9LK_rBQRA5qb3l46raZSHAQ/edit?usp=sharing

The monologues were organized by character. The order of the interaction did not mater. The dialogues, however, in the reflected scene was organized in a chronological manner and through scenes. The scenes would be highlighted through light and space. A light would turn on where the user has to look. The scenes are organized spatially as seen in image below.

Update 6: Implementation of Story in Scene

Project 3: Development Journal

Project Members: Yeji, William and Ganjina

In our first zoom meeting, we chose two prompts; Apocalypse and Invisible Cities. After talking about our idea in class we decided to end up with the idea of using Invisible Cities which considering the situation that we are right now, would be easier to work on in VR.

We decided to create an impression of the city Valdrada from the Invisible Cities by Calvino, where he says: “the traveler…sees two cities: one erect above the lake and the other reflected upside down”. For the environment we decided to make something similar like Amsterdam streets vibe, where houses are just next to each other.

user looking at the window (people arguing)

Yeji – started working on the story

I started building the environment based on the ideas we had in mind, though we had to change it a bit since we couldn’t find some assets. As for now I need to add some more decorations and buildings.

Will – started working on building the dialogue system.

Update:

Added – skybox, decorations and buildings

Project 3: Development Journal

For the final project, we decide to establish one of the invisible cities, Octavia and integrate it with another theme apocalypse to convey “storyness”. To begin with, Octavia is a city built on a spider web between two steep mountains. The net is the main support of the city and also the track that traverses the entire city.

When it comes to the structure of the city, paths in the city are made of wooden ties which make people feel shaky and unstable. We would potentially add squeaking sound effects to intensify this feeling.

Although inhabitants of Octavia live in such an environment that seems to be uncertain and frightening for people living “on land”, they are certain about one thing: the fate of the city that it falls when the net is broken, since they know the net will only last so long.

We picture the ending of Octavia in a different way. It turns out that the web is made by a spider a long time ago. One day it comes back and finds out humans have taken over and messed with his web. It is so angry that it climbs over the net and tries to kill all the people there. Inhabitants could only escape from Octavia and run towards the mountain on the other side. Our player is one of the inhabitants and reaches the mountain with all other people. The spider keeps chasing after people and it destroys the buildings and everything in Octavia. The spider is closer and closer to this mountain. To save the inhabitants and kill the spider, the only choice left is to cut the string/rope that connects the net with the mountain. Eventually, the city of Octavia falls together with the spider, disappearing in the abyss below.

Storyline Update:

After presenting our idea of the story, we got the feedback that the incentive of cutting the rope to save Octavia seems unreasonable. Even though we could still do some editions to the story to make more sense of it, we realize our problem that we were focusing too much on the interaction instead of the story itself. Therefore, we make a radical change to our story and try to add some depth to Octavia rather than just its fascinating look. In our new story, the player has the objective of finding his daughter and escaping the city from the only way out. On his way to his daughter, he will see villagers running, crying, or praying, each having some different feelings and faiths.

Scene Building update:

Steven is responsible for the environment construction and destruction animation of houses. I assisted by making modifications to the particle systems of fog and fire, and applying physical properties to the objects on the main path. It is designed that the player couldn’t walk up the small bridges to the “floating islands” along the path. We use the skybox of sunset as the background against the foggy atmosphere around the player.

4.29 Update:

For the movement of player, I’ve experimented with several different ways of walking. The first version that I started with is autowalk, to add to the intense ambiance in the collapsing city, I added some small effects like head and body swaying. However, autowalk makes it hard for the player to stop and observe the surroundings. In addition, the swaying effect doesn’t work well with the GoogleVR SDK and it could be more dizzy for VR players. Therefore, I give up this effect and stick to steady walking. The second version is walking by looking down. This version is simple to implement but when much effort is made on looking down to navigate oneself, the joy of looking around while walking is eliminated.

Therefore, I come to the third version, which is clicking on the path with reticle to walk. Only the walkable surface is interactable and by using NavMesh system, a path is automatically chosen from the current position to the clicked spot. After discussion today, I got the feedback that since there are many houses “floating” above the view of the player, looking down at the road could be a little inconvenient. One suggestion is to have an arrow with a distance to the ground so that the angle change of the player’s view is smaller. I think this is a good idea to experiment with but one of my concerns is whether the appearance of an arrow is consistent with the relatively realistic style of our environment.

Interaction Update:

For the movement of the player, we decide to use clicking on the ground to walk instead of long pressing (with or without arrow navigating). One reason is that there are many blocks on the path like small bricks and wood pieces. NavMesh navigation solves the problem of walking into things blocking the way by generating a path to the selected position. The maximum distance that each movement could reach is increased so that the angle of looking down is smaller. The player could walk a longer distance each clicking and look around more conveniently.

NavMesh over walkable surface is baked in the whole scene

After Vince imported the characters from Fuse to our scene, we worked on looking at the character to trigger its change in posture. The characters each have two animations. When the player walks close to the character and looks at him/her, the character changes to another posture. The transition between animations has to be natural so we choose in the library for the most suitable pairs. In our implementation, the interaction is actually not triggered by gazing at the character since we think it’s hard for the player to figure out how it works without any guidance. It’s triggered by walking to a close distance to the character and the raycast reaching him/her.

The woman in fear when the player is in distance
The woman prays on the knee when the player walks up and looks at her

Development Journal – Project 3: Underwater Experience

4/13 UPDATE

Team Member: Luize, Nhi, Tiger

Project Theme: Apocalypse

The idea for our project had evolved a lot before we decided to go with the apocalypse theme. When I was brainstroming for the project, since the main focus of it is to present “story-ness,” I came up with a quite cinematic idea based on the escape room theme (can be found at the bottom of this post in italics). To cover it in a few words, I wanted to play with the concept of escape room and design an environment that is inescapable and thus embodies a mind prison. Both Luize and Nhi liked the idea, but we also agreed that the story would be a hard one to tell, because we would need to come up with a very strong background story for the protagonist so the user could relate to it.

Thus, we changed it into a story that is more easily understandable and relatable, but kept the time travel feature and the circular structure of the storyline.

Reality
- The user will first find themselves in an empty room that has nothing but a television (scene 1). Once they interact with the television, they will watch a video clip and then go on an underwater time travelling journey
1st period (1920)
- The user will first go to 1920, where there are a lot marine creatures undersea (scene 2)
- Something leads them to walk towards a sunken ship (scene 3)
- Once they enter, they will find a button (scene 4)
2nd period (2020)
- The button takes them to the present, year 2020. They remain at the same location, but the setting has become the interior of a submarine (scene 5)
- They are led to walk outside of the submarine, where they will find that the sea has been polluted by human waste, and that the nubmer of marine creatures has decreased (scene 6). Surrounded by plastic garbage, they will find another button
3rd period (2120)
- The button takes them to the exact same location a century later, while everything has been much different (scene 7). The scene looks lifeless. All they see are plastic waste and animal skeletons
- Finally they are led to a huge pile of gargabe, underneath which they can find the last button (scene 8)
Back to reality
- The last button takes them back to the real world (scene 9 a.k.a. scene 1)

The original escape room idea

Protagonist (the user) is a prisoner, wakes up from amnesia, finds themselves in a dark small cell, doesn’t know why they’re there (because the user wouldn’t know the background story of the protagonist either, they would need to explore themselves for the story to unfold gradually)
Finds on a desk some of their personal belongings (e.g. a photograph torn in half, a wallet, etc., something that alludes to their identity, will become clearer later)
A giant clock on the wall of the cell shows red digits and counts down from 1 hour (brings anxiety)
Thus starts looking for tools and tries jailbreak
Somehow (needs further discussion on how exactly) finds a secret door behind the bed to a very very long dark corridor and walks into it
While walking, finds the corridor getting brighter and brighter, surroundings changing into a few different scenes over time (e.g. a park scene where they used to date their boyfriend/girlfriend, a classroom scene, a childhood bedroom scene, etc.)
Sees a screen on the wall of corridor every once in a while, thus stops to see what it is, finds that it plays a video clip (where a part of the protagonist’s story is told)
- For the video clips I don’t have anything specific in mind yet, but generally they should be something joyful that contrasts the reality that the protagonist is in
- It could be some image that matches the aforementioned torn-up photos, so that the user realizes that the video is from the protagonist’s memories
- The main idea here is, the farther they walk into the corridor, the more they go back into the protagonist’s memories, so it would be like walking through a time travelling tunnel and going back in time
After walking past a few different scenes (like three or four? Each having a short video clip), the user will have had a basic understanding of the story
The protagonist comes to a final scene that represents their childhood (meaning the time travel is about to end at the very start of their life)
Sees a door at the end of corridor
Opens the door and finds that it leads to the cell at the beginning
Eventually realizes they are actually trapped in their own mind because they are stuck in memories from the past
Two alternative endings:
- Happy ending – suddenly wakes up and realizes it has been a dream, finds that everything (family, boy/girlfriend, friends, pet dog) is still there (main message: cherish what you have right now (?) )
- Bad ending (but more interesting in my opinion) – finds a note on the desk that puts the story together, revealing that the protagonist used to live a good life, but they destroyed it bit by bit. The clock on the wall finally counts down to 0 but, to their surprise, restarts at 1 hour (meaning that this is an infinite loop)

4/14 UPDATE

Link to our paper prototype.

4/17 UPDATE

Nhi and I worked on the first scene together. Inspired by a scene in The Matrix (1999), this white room will serve as the starting point of the experience.

4/21 UPDATE

Considering the switch of platform from Google Cardboard to PC/Mac, we decided to further simplify our project to two scenes, where there would be no more sunken ship or submarine. Instead, the user will first find themselves inside a white room, from which they can go to the underwater scene through watching a video clip of the project overview. I built the room scene (shown below) going for a bright, casual, everyday atmosphere, so that the user would feel familiar upon entering the environment.

4/26 UPDATE

The building of the underwater scene was started by Luize, and I touched it up a little bit after that. We tried to make the environment feel fantastical and wonderland-ish by using the jade-colored water asset and adding a lot of marine creatures.

4/27 UPDATE

Luize edited a video to play on the television in the room scene, which talks briefly about the impact that man-made plastic waste has on the ocean and serves as an introduction to the background and reasoning behind this project.

5.10 UPDATE

I made some more changes to the underwater scene. I added a path for the user to walk along, and laid out more plants and corals.

5/12 UPDATE

I added the plastic spawning effect to the character.

Project 3 Development Journal

13/04 Update:

When we first met up to brainstorm our idea, we discussed themes such as recreating a city from Invisible Cities or creating a version of an Escape Room. Our first idea was to represent each of the cities that we chose for the Spring Break blog entry into different scenes in our world. The player would then be able to travel through these cities and learn about each of them based on their inhabitants and environment. As much as we liked the visuals of such idea, however, we were worried that this theme would not portray much of a story. Therefore, we moved on to brainstorming new ideas and considered the Escape room theme where the protagonist would wake up from amnesia and finds themselves in a prison cell where a clock would be ticking and they would have to find a way out of the prison. However, we were worried that by choosing this approach it would be difficult to convey the story to the player in a relatable way.

After more brainstorming, we settled on the Apocalypse theme. Our take on Apocalypse in this project is a representation of how both conscious and unconscious actions and habits of human beings lead to ocean pollution. When creating the initial storyboards, we laid out 9 scenes. The first and the last scene is the same – the player finds themselves in a room with a television. After interacting with the television, a video would play and they would become familiar with the theme and learn some information about plastic pollution in the ocean. Then they would enter an underwater world where they would go through different scenes all in different times. The user would follow a path on the ground that guides them through different scenes and to switch to a new scene the user would have to press a button or interact with an object in the ocean. Starting in the year 1920 the ocean would be clean and a lot of sea creatures would be swimming around. Moving on to years 2020 and lastly 2120 the ocean would become more and more polluted with plastic and there would fewer sea creatures around them and they would realize that the underwater world cannot be saved anymore. The user then goes back to scene one where actions can be taken to do something to save the environment. Here are the storyboards of our project.

27/04 Update:

Since the last Development Journal entry, we have modified our project after the update that we wouldn’t be able to use the Google Cardboard, as we do not have Android Phones. However, we will still create the project as if it would be built for Google Cardboard, therefore using a reticle. After the first playtesting session where we shared our storyboards, the feedback we received very helpful and valuable feedback. Here are some of the storyboards we showed to the class.

Based on the feedback we decided to significantly reduce the number of scenes. We also decided that there will be lass interactions, as there was no more need to switch between many scenes. However, the transition between the remaining scenes becomes more integrated into the story and seems a lot more seamless instead of just pressing a button. The remaining scenes will be the room with a television and an underwater ocean world. We decided that after watching a video about pollution and how it has affected our oceans on the television screen in the first scene, a nautilus painting would light up next to the television which would indicate that the user needs to press on it. After pressing on the painting, the player would teleport to the next scene which is the underwater ocean world. In the underwater world, the user will walk alongside a path on the ocean bed and after them there will be a trail of plastic waste left behind. The trail of plastics represents that despite being environmentally conscious and practicing eco-friendly measures, it is almost inevitable to produce no waste and that our actions have an effect on the ocean’s purity over time.

In terms of working on the scenes Nhi and Tiger worked on the room with the television and the initial set up of the game when the user enters the world. We have also decided on adding plastic containers in the first scene that the user would be able to interact with – pick up and drop them. Therefore, when the plastic containers start appearing in the following scene, the user would make the connection that their actions may have impacted the fact that the plastic appeared in the ocean. I worked on designing the underwater ocean scene and editing the video which will be played on the television in the beginning. It gives an overview of general facts about the ocean and then about how oceans have been affected by plastic pollution. For the underwater scene I am using a set of great assets that I managed to find when creating the budget for asset purchase. One of the assets contains an underwater background with bubbles and jellyfish that are animated and give a realistic feel to the environment. Besides that, the rest of the ocean is a combination of different rocks, corals, seaweed and sea creatures.

a still from the video about plastic pollution in oceans

05/05 Update:

After doing the first playtesting session with our classmates, a recurring response that we received was about the interaction with the plastics in the first scene. The user is able to pick them up and “drop” it, however, it goes back to the same location, as it was picked up from. Also, the movement after picking up a plastic container is only possible vertically, thus feeling less natural. We will work on being able to move around the object both horizontally and vertically and drop it properly using physics on the object. Instead of the user teleporting to the next scene through the painting, we also changed it to a coral that is located closer to the television, thus being more obvious that this is the object that needs to be clicked. Also, the light in the room goes dark after the video finishes playing, thus there is more emphasis on the coral that is now lit up. From playtesting we realized that sometimes players were confused, as to where to click after the video stops playing. I will also shorten the video, as it seemed too long. In the underwater world, the scene was also updated and a path using seaweed was added that would guide the user, in order for the user to not wander off too far in the ocean. Now we still need to work on improving the interactions, improving the ocean scene even more, and adding plastic in the ocean over time.

09/05 Update:

The interactions with the objects in the first scene have significantly changed, as it is now possible to pick up objects and drop them around the room. This provides a lot more interactivity and the user is more stimulated to pick the plastic containers up and drop them. I am currently working on making the fish and other sea creatures more in the underwater scene. All though I have managed to make the fish move in a straight line, I am still struggling with adding rotation by 180 degrees over time, in order for the fish movement to seem more natural.

12/05 Update:

I finished the script for moving the fish and rotating them after some elapsed time. Tiger has been working on the transformation of the ocean – after the user walking through it for a while, the ocean becomes darker, sea creatures start to disappear, and instead plastic containers from the first scene start floating around. Lastly, I also finished shortening the video for the first scene.

Project 3 Development Journal

Brainstorming

In this final project, Mari and I wanted to work with the themes of wonderland and escape room. Wonderland is defined as:

but we only wanted to work loosely off of this definition, as we knew we wanted some kind of “darker” side to the wonderland. Within our brainstorming for the wonderland setting, we looked at Alice in wonderland’s infamous door know scene found here:

We looked at this scene in particular due to the fact that Alice is indeed in a wonderland, but faces troubles and fears within it due to a fear of the unknown. In this example of a wonderland, there isn’t something inherently bad, but the main character is frightened in the uncertainty that shrouds the strange place. We knew we really wanted to try our best to incorporate this into our assignment; the idea that a wonderland inherently carries a sense of the unknown which can make it frightening, although the wonderland may not have any conventionally frightening things.

Within the idea of causing anxiety to our user within the environment, we briefly looked into the SAW horror films as an example of a (literal) escape room type situation.

An image from the Official Saw Escape room found in Las Vegas (site found here: https://sawescaperoom.com/)

This was quickly dropped, as we decided we wanted our wonderland to follow more of a “fear of the unknown” rather than a blatant horror style.

An escape room, according to wikipedia, is defined as the following:

Again we wanted to loosely interpret this, and so our idea of an escape room is meant to represent the goal of the user to look for a kind of relief within the wonderland. This fit in nicely with our idea of the fear of the unknown, as so we had a general basis to work with from there.

Concretization of the Idea

At this point we knew what we generally wanted, and so we had to pick a concrete idea to work with within our wonderland environment. We liked the idea of creating something from folklore, and after some discussion settled on Shintō Folklore from Japan. Specifically within Shintō folklore, we looked at the Yōkai. We liked the idea of focusing on Yōkai, due to the fact that they are not necessarily associated with “good or bad” and playing with the gray area they fall into.

A brief definition of Yōkai from Wikipedia

Narrowing it down further, we really liked the myths of the Kitsune. This is a type of fox yōkai, or spirit, that has various abilities such as being able to can shape-shift into a human. According to Shintō folklore, the Kitsune have multiple tails and can reach up to 9 tails. The tails represent their age, power, and intelligence, so a Kitsune with 9 tails carries the implication of being of the highest caliber in these regards, and is a very rare sight.

There are also various types of Kitsune. The two that are key figures in our game are the following:

Nogitsune: Nogitsune are wild foxes that do not serve as messengers for the gods. They are known to torment, trick, and even possess humans, sometimes using their shape-shifting powers to do so.
Zenko: Also known as benevolent foxes, the zenko are mostly associated with the deity of rice, Inari. These kitsune are white in color and are also known to be able to ward off evil, also at times serving as guardian spirits. They also help protect humans against nogitsune.

In Japan, there are many Kitsune statues found within Shintō shrines. Therefore, we decided to use a Shintō shrine as our setting for the project.

Along with making the environment be a shrine, we were also influenced aesthetically by the Nintendo game Muramasa Demon Blade . The game is 2D, but we really liked some of the visual cues used in the game in order to articulate more specifics in the setting.

An example of visual cues: the shadows of the pagodas in the background help add another layer to the scene, as it is not just a forest the main character is running through, but a dense forest right next to people. As you continue moving as this character, the pagodas in the background become less, showing that you are progressing away from civilization.

A Shintō shrine (shrines can be cemeteries as well.) A great visual cue here is the green, frightening hue that environment takes on in order to create a sense of otherworldliness.

Storyline so far . . .

And so finally for our story, we decided that we would like it to be based off of the zenko and the nogitsune foxes. The current layout of the narrative would be as follows.

The user finds themselves alone in the middle of a shrine/cemetery during sunset
As the sun sets, the environment starts looking more hostile/surreal (haze, colored skybox, creepy background sound, based off of some of the aesthetics shown above in Muramasa Demon Blade)
Once the environment is fully “surreal”, two foxes appear in front of the user. Both have 9 tails and look similar. (one is an Inari fox, the other is a wild fox that has disguised its appearance)
The user is prompted to “make a choice” and pick one of the two foxes.
If the user chooses the Inari fox, or the “good” fox, the environment goes back to how it normally was (we are still considering different options on how to make this outcome more interesting/exciting)
If the user chooses the wild (bad) fox (which is disguised as a good Kitsune), they stay trapped in the surreal space.

Finally, a helpful summary of some of the feedback we heard in class:

Ending: does it end due to a user’s option? Or just naturally? Or does the user just take the Google Cardboard off ?
How do we hint at the choice that the user has to make? → we could possibly have the kitsunes be on different path and then the user chooses between them → does this mean that they move somewhere else after following the path? The user appears in another part of the shrine?
How do we create a satisfying ending for the good fox? (right now the “bad ending” seems more interesting)