ICM Final: The Forest
- lr2855
- Dec 13, 2021
- 2 min read
Concept & Inspirations:
The idea of The Forest comes from the branching narrative game. We hoped to create a game that can have different endings based on the player's choice and the theme of the game is inspired by the 57 north which is a story with hundreds of decisions and multiple endings. Another inspiration comes from the Black Mirror episode Bandersnatch which makes audience to choose plots development by themselves.
Thus, we make the Forest which happens from a story book that tells you a local legend from a village. In this game, you could enter a new world from the forest and entered two separate fantastic worlds based on player's choice.
57 North:
Create visual effect:
reference- p5 wabGL https://p5js.org/reference/#/p5/WEBGL
testing out material, texture, light, ect.
Object Hover Effect
Unselected Item
Text Selection:
Creating Narratives
source website: https://twinery.org/
Background
The story takes place in a small town. According to local legend, there is an entrance to a different world. They say the portal is located in a dense forest and only appears once a year. Some people saw it but were afraid to go in, others went in and never came out, and those who came out described it as an extremely dangerous but beautiful place.
Structure
Essential Idea: players will observe both visual and text information from the story. And players are making choices from 1-3 options. Some options will lead them to a completely different results. At the end, the player will land on one of the universes I planned out. Because of the time limit, the storyline is not fully finished, and the universe scene has not reach the visual I want.
Coding
We are using WEBGL mode in P5.JS. In the WEBGL mode, we are able to import obj file, using 3d geometrics and light for our scenes. Also, based on the texture and the scene of the objects, we used different materials.
pointLight
shininess
ambientMaterial
emissiveMaterial
Unlike many text adventure games I have seen for reference, I don't like using keys to represent options. Instead, I started with coding using mousePressed, and count the number mousePressed. When executing into my code, I need to know the specific mouse count for each option.
Water waving effect
For the moving effect like water waving, we set up the changing sine angle to change the translate location and create the moving feeling.
State Change Condition
To change the scene, we use clicks to count the mouseClicked time and based on the time to change the scenes.
Model
Most of my models come from two sources:
These two websites are great resources to purchase or download free 3D models.
Final Result
Go To The Code: https://editor.p5js.org/jiaxinhuang2020gra/sketches/bcJS_L_Io
Example Scenes:
Comments