top of page

The End of 
Two Dimensions

The End of Two Dimensions
is a RPG + adventure + meta game. 

I worked with an information engineering student on projection- mechanics in this project. This game draws inspiration from Flatland(a novel), guiding players to explore the Utopian implications of breaking the rules within a two-dimensional space.

 

  • Work as Game Designer

  • Designed Art Style and Assets

  • Designed Five Levels and Two Endings

  • Narrative

  • Made with Unity

 

Digital Game Design

Team Work
Autumn 2023

Game Link: The End of  Two-Dimension by Jiaqi(Jackie)Han (itch.io)

WEBgl Version:

https://jackiehan.itch.io/the-end-of-two-dimension-web-online-version

Game Overview:

After hearing a strange voice from the three-dimensional Spaceland, Cubik was born in Flatland.

His arrival led to the creation of a third axis in the plane, thus dividing the world into three planes. He originally intended to convey the gospel of three-dimensional space to the citizens of the Flatland. Still, not only does no one understand him, but he is also treated as a pagan.

Cubik needs to use his understanding of the three-dimensional world to conceal himself from his pursuers——Circle class and to enlighten two-dimensional citizens——the figures.

level End.png

Control:

↓ Key: Project to the xz plane (yellow plane)
→ Key: Project to the xy plane (blue plane)
← Key: Project to the yz plane (red plane)
↑ Key: Switch to 3D view​
Space: Three-dimensionalize the figures/accelerate conversations

covernew.png

Concept: 

This game aims to discuss the representation of 2D to 3D in the game. The adventure story is designed for the protagonist with a three-dimensional concept in his mind to embark on a unique adventure in a two-dimensional world.  

Although the protagonist, Cubik, is unobstructed in three-dimensional space, his shadow is subject to various limitations on the three two-dimensional planes. Perhaps you need to switch the current projected plane occasionally to break through different obstacles.

3D-new.png
By pressing different arrow keys, players will see three displays shown below: 
↓ Key:
xz plane
(yellow plane)
yellow plane.png
→ Key:
xy plane
(blue plane)
blue plane.png
← Key:
yz plane
(red plane)
red plane.png

Different dimensions on computer screens:

This game aims to discuss the representation of 2D to 3D in the game.

In order to present the three-dimensional world on a two-dimensional screen, there are two projection methods for games——orthographic projection and axonometric projection.

A. Orthographic projection refers to the process where light rays are perpendicular to the projection plane of an object. 2D platform games typically use this method to depict the virtual world.

B. Isometric Projection: It is based on the principle of showing all game elements at a certain angle along the coordinate axis, allowing players to see multiple sides of the object, resulting in a 3D effect. Industry insiders often refer to this type of game as 2.5D.  
三视图.png
(Figure.A cube presented by orthographic projection)
等轴图.png
(Figure.A cube presented by isometric projection)

The spirit of liberalism spanning different dimensions:

This game is inspired by the novel "Flatland——A Romance of Many Dimensions," written by Edwin A. Abbott.  

Edwin A. Abbott's book "Flatland" was published in 1884, nearly 140 years ago. Only 21 years later, Einstein proposed special relativity to explore four-dimensional spacetime. It was 126 years later that Liu Cixin described the "dimensionality reduction attack" in the novel "The Three-body Problem: Death's End". One hundred thirty years later, Nolan's science fiction film "Star Trek" showcased the "four-dimensional cube."

Before that, Edwin Abbott had already explained the multidimensional world through simple geometry. 

It is extremely difficult to imagine the truth of the world you don't know (you can try imagining a four-dimensional world), and opportunities that cross dimensions (classes) are not something you can achieve through hard work.

We can refrain from indulging in comfortable spaces, not mistakenly think that our small world is the whole world, and constantly explore the world's boundaries with skeptical and pioneering eyes.
flatlandbook.jpg
(Figure.Flatland——A romance of many dimensions, written by Edwin A. Abbott)

Characters:

Player: Cubik
The player is always a special, unlucky, and brave protagonist.
Cubik.png
Cubik is a philosopher from Flatland who can see the third dimension. After hearing a voice from the three-dimensional world, Cubik has gained a breakthrough understanding of "dimensions." He successfully transcended dimensions, saw the vast, real world, and tries to promote to those around him that Flatland is not just a plane but rather a multi-dimensional world.

He needs to find a way to escape capture from the circle class and three-dimensionalize all the shape residents.
Guide: Mobius
Guide is a wise existence and also a mischievous spirit.
morbis.png
The voiceover is the Mobius Ring, which has been guiding Cubik.
The Mobius Ring itself is a three-dimensional object that controls the technology of three-dimensional space, but it only appears in a two-dimensional form.
Citizens: Figures
The citizens of the Flatland do not have feet, so they are like the flounder or flatfish in the Spaceland.
They are not affected by gravity and can only move on their own plane.
In Flatland, men have distinct levels, with more edges and closer to the circle, resulting in the higher class. 
Triangle.png
Triangle
The triangle is the lowest ranked resident.
Rectangle.png
Square/Cubik
Rectangles are free commoners who are neither nobles nor slaves.
Hexagon.png
Hexagon
Hexagon is a nobleman of the lowest rank. He easily accepts new ideas and is willing to overthrow the rules of the circle.
(yellow)Rectangle.png
(Color)+ The Figure's name 
This kind of citizen has absurd ideals.
If their psychological color is different from their current color, Cubik needs to satisfy their wishes before three-dimensionalizing them.
Ruling class:The Chief Circle
The highest-ranking circle class also has a kind of wisdom, which is the annihilation of the acknowledgement of the three-dimensional universe, and they will not hesitate to erase those who know the truth of the world.
Circle.png
Pantocyclus
The highest class in Flatland is the circle class. As the supreme ruler, they deny the existence of three-dimensional space.

They have fast speed, flexible movement (scrolling all the time) on a flat plane, and cannot be three-dimensionalized at all.

Most of the time, when Cubik is approaching the 'circle,' they will rush towards Cubik, causing the Cubik to be assimilated into a two-dimensional object and unable to use the 'switch dimensions' ability for 5 seconds.

Game Mechanics:

Narrative: 
conversation and tutorial.png
There are six chapters in the game. 
When Cubik meets a specific figure, a dialogue will be triggered.
So we designed a chat system with shared configuration, which also functions as a toturial system at the game's beginning.
Projection Puzzle: 
projection.png
The main mechanic is the projection of Cubik to three different planes. We set 4 cameras in total; one camera is set for the three-dimensional perspective, and the other three cameras correspond to the orthographic projections one by one.
The function is realized by scripting for Cubik's movement, camera switching, camera follower, and synchronizing the active camera with Cubik's status.
Chase/Evade Reaction: 
chase and evade.png
The citizens are reluctant to accept Cubik's three-dimensional concept, while the Circle class tries to chase Cubik and stop him.
Their reaction to Cubik is controlled by the citizen movement script.
Tint:
tint.png
tint2.png
When applying the synchronizefigures' desirable color to them, Cubik needs to paint himself first and synchronizes his current color to the touched citizen.
The process of color change is achieved through the Dotween plugin.

Story Board:

Full narrative video: https://youtu.be/08WQxhPk0Vs
Chapter 01: Another Plane
Cubik was born in Flatland, and one strange voice appears.
Chapter 02: Cage
In this level, Cubik will encounter some citizens and learn how to three-dimensionalize them.
Chapter 03: Stratum
In this level, Cubik will be chased by the Circle class and receive support from the Hexagon class.
Chapter 04: Chromatic Sedition
In this level, Cubik will meet citizens wanting to change their regulated color and learn the skill to tint them.
Chapter 05: New World
In this level, Cubik will apply all the skills he has learned to enlighten all the citizens in Flatland.
The End: No Cube
In the bad ending, Cubik is two-dimensionalized forever. There will be no Cubes in Flatland.
 
The End: Three-Dimension?
In the good ending, Cubik saves the citizens and creates a seemingly three-dimensional world.
However, there are not any three-dimensional lives on computer screens,
The adventure of Cubik is only his illusion created by scripts and game engines.

 

Level Design:

Chapter 01: Another Plane
All the levels are designed within a limited cubic space. We encourage everyone to solve the puzzles by themselves, but in order to make everyone have fun in this game, we show the work through screenshots here. 
 
level 01.png
Game walk-through: 
level 01-work through.png
Chapter 02: Cage
level 02.png
Game walk-through
Click the slide-bar and see the walk-through:
Chapter 03: Stratum
level 03.png
Game walk-through
Click the slide-bar and see the walk-through:
Chapter 04: Chromatic Sedition
level 04.png
Game walk-through
Click the slide-bar and see the walk-through:
Chapter 05: New World
Game walk-through
Click the slide-bar and see the walk-through:
The End
In this level, Cubik knows the truth of the three-dimensional world. In his view, he has already seen the end of the two-dimensional world and the end of the three-dimensional world.

Early Prototypes:

Use a Mirror to illustrate three dimensions: 
At first, we considered using a mirror mechanism to control the shadow of a character to move in a symmetric plane. When the protagonist is walking on the plane formed by the XZ axis,  his shadow is walking on the plane formed by the YZ axis. 
The spatial experience is more like in the game Monument Valley
.
However, we found it very hard for players to understand the concept of Flatland, where every character must move on a large plane. 
So, in order to show the protagonist's ability to cross dimensions, we finally decided to use four cameras to describe this ability and project the character on three different planes.
01.png
02.png
Level Design Revision
The first version of the level design is too flexible. In order to start a conversation between Cubik and citizens, we decided to reduce the number of enemies and provide a limited walkable area.
As for a mini-game, the nature of the puzzle is more important than the real-time action part.
cover.png

Technical:

1. Projection Puzzle
TThe main mechanic is the projection of Cubik to three different planes. The function is realized by scripting for Cubik's movement, camera switching, camera follower, and synchronizing the active camera with Cubik's status.There are four types of Cubik's projection states in space: on the yellow plane, on the red plane, on the blue plane, and on a 3D view (not projected onto a 2D plane).
projection.png
projection.png
We set 4 cameras in total, one camera is set for the three-dimensional perspective, the other three cameras correspond to the orthographic projections one by one.
When the player presses the corresponding directional key, the view of a certain camera will be activated.
Switching  Camera
 
switchcode.png
camera3.png
camera2.png
camera1.png
camera0.png
Red plane
Yellow plane
Blue plane
3D view
The motion of Cubik on one plane causes changes in two-dimensional vectors, requiring synchronization in three-dimensional space. Three axes are marked to determine which vector has changed.
Projection Data
projection data.png
input.png
move.png
Enumerate the axes contained in each plane.
Get Input from Keys
Sync Movement
Inner Collision Checker
The main role of the inner collider is to identify the protagonist's location on the current projected plane. This ensures that any actions such as coloring, paralysis, or other effects are only applied to the current plane. It also helps to determine whether the citizens who are affected by these actions are on the same plane as the protagonist.
On the left, there is a picture to show the walkable area (pink color), unwalkable area (with yellow box colliders) and dyeing area(red color).
collider.png
area.png
Inner collision checker
dyeing
area
unwalkable area
walkable area
collider checker.png
2. Narrative
There are six chapters in the game. 
When Cubik meets a certain figure, a dialogue will be triggered.

So we designed a chat system with shared configuration, which also functions as tutorial system at the beginning of the game. 
4-6.png
conversation and tutorial.png
Modular Configuration
Each character's configuration for the game has been identified including their sprite pictures, locations, and names.
UI config.png
Immersive Conversation 
 

When thinking about how to provide a more immersive reading to the player.
We finally accelerated the conversation speed, although we had realized the technique to show words individually.
Since there is too much text content, in order to decrease the reading burden, we decided to display a line entirely at once.
Some box colliders are set up on specific locations of the map to initiate conversations using a chat script.
Chapter Headings 
Each chapter begins with a scene fader that controls the fading of chapter titles, evoking the feeling of watching an early movie. Here is the main title from D.W. Griffith’s “Intolerance” (1916), which many reviewers and historians consider the greatest film of the silent era. 
3.Citizen Reaction
The citizens are hesitant to embrace Cubik's three-dimensional idea, and as a result, they are avoiding any interaction with him. Meanwhile, the Circle class is attempting to chase Cubik and prevent him from spreading his ideas. 
The citizens' behavior towards Cubik is being controlled by a script that governs their movements.
chase and evade.png
Citizen Movement
The flow chart is shown below:
When Cubik does not reach the vicinity of citizens, these citizens will automatically hover within their own grid. When Cubik approaches them, they will react accordingly, obtain Cubik's position, chase or dodge.
Patrol
Evade
In order to keep the Circle in motion, when Cubik is changed into two dimensinalized, the state of the Circle is from chase to evade. This causes the Circle to leave Cubik. When Cubik quickly moves away from the Circle, it returns to its chase state again.
The smaller the EulerAngle, the more likely it is for an object to pursue its target.
Chase and Evade
The EulerAngle is used to clarify the motion of chase and evade. The goal of chase is to stay as close as possible to Cubik, while evade aims to stay as far away as possible from Cubik.
2D to 3D
To convert characters from 2D to 3D, we hide the 3D version of the character and switch the display state. To enhance the character's performance, we have implemented three stages of transformation using code:
1. Conversion of 2D to 3D. 
2. The character turns around and expresses confusion. 
3. The character flies out of a two-dimensional plane.
Three-dimensionalize Citizen
Citizen's
performance when being transferred
4. Tint
Tint Cubik
When applying figures desirable color to them, Cubik needs to paint himself first and synchronizes his current color to the touched citizen.
In the game, there are dyeing areas called tint zones that can change the color of Cubik. When Cubik comes into contact with these zones, it will change to the corresponding color.
SetDye in PlayerMove.cs 
SetDye Performance in Unity
tint.png
Tint Citizens
The process of color change on citizen is achieved through Dotween plugin to achieve a visual effect of gradually changing colors.
In order to complete the dyeing process, CitizenSwitchColor.cs will be mounted on each Citizen. When Cubik's inner collector detects a collision with the citizen, it can call the ApplyColorToCitizen function to apply its own color to the citizen.
bottom of page