Jane Apostol
Flooded Folds
Team Size
4 Person Team
Tools
Unity Engine, C#, Jira
Date
May 2024 - July 2024
About
An educational isometric puzzle game about folding paper to reach the evacuation zone during a flood.
In this project, I took on multiple roles. I was the Project Lead and a Technical Designer. I was involved in UX/UI design, level design, and systems programming.
My contributions helped design and build tutorial levels to introduce players to the game's mechanics, expand the codebase to enhance gameplay, and polish the overall user experience.
This was a project made for the University of Florida (UF) Cross-Cultural Engineering in Japan program in collaboration with Kyoto University (KU).
Gameplay Screenshots
Project Management
Leading The Team
I coordinated the team through weekly sprints and assigning tasks in Jira, prepared our digital landing zone on itch.io, organized team work sessions to support real-time feedback, and pioneered our milestone presentations to present to stakeholders.
Biggest Takeaways:
-
Mitigating Risks: Our passionate team had exciting, out-of-the-box ideas. Some of which were big risks. I learned to identify what was over-scoped and we cut down to what was realistically feasible.
-
Firm Communication: My deep bonds with my peers made it challenging when we disagreed on ideas. However, we took our time ironing out conflicting ideas and made decisions that closely aligned with our project goals.
-
Language Barrier: Outside of our 4 developers, we had 2 additional students from Kyoto University's. Since English wasn't their first language, I was able to overcome the barrier by using translation tools and spent time outside of class learning conversational Japanese.
Technical Design
 |  |  |
|---|
UX/UI Design
I designed and iterated the player's Scrapbook UI to bridge the gap between systems and player experience.
The scrapbook has three pages to flip through:
-
Controls: Basic player controls and GIF tutorials of tile movement and paperfold UI.
-
UI Key: Explains the UI elements the player sees on screen.
-
Notes: Info about evacuating a flood, QR code to a checklist, and dynamic tips from Radio-Man.
During development I used my personal scrapbook as a reference:
-
I even went to the Konbini (convenience store) and bought notebook tabs.
-
I put them in my scrapbook because I had trouble visualizing what the player would see when flipping to the next page.
 |
|---|
 |
 |
 |
 |
 |
 |
Level Design
I implemented 3 tutorial levels to introduce the core gameplay mechanics, designed 2 hazard levels demonstrating the dangers of floods, and formulated level design documentation with other designers.
Tutorial 1 Example
Goal:
-
Introduce Player Movement: Focus letting the player understand how to move in game by clicking the tiles.
-
Introduce the Evacuation Zone: The red flag indicates the end of every level.
What changed?:
-
Bare-Minimum UI: Kept the UI basic and removed Player Turn Counter and Turns Till Area Floods systems. It was important that the level introduced the core movement to avoid on-screen clutter.
-
No Paperfolds: In the prototype, it features yellow paperfolds. However, this gameplay mechanic was moved to the 3rd Tutorial level to avoid overwhelming the player with information.
First iteration of the tutorial level.
Final iteration of the tutorial level.
First iteration of the tutorial level.
Systems Programming
I built an interactive scrapbook system to house educational tips and gameplay controls and scripted a rising water system along with its water shader.
Scrapbook System
-
Checks for user input to toggle the Scrapbook off and on and updates the page content and tab button location upon player interaction.
-
At the time, the design of this scrapbook changed a lot, and I became flexible and repurposed the system as the needs changed during development.
-
After learning software design patterns in my master's program, I then reworked the system to make it expandable by using a Model-View-Presenter pattern.
Rising Water System + Shader
-
For the rising water system, I linearly interpolate the water to its ideal risen position. I also created an electric variant that acts as a kill zone upon player collision.
-
This was my first time visual scripting with Unity's Shader Graph and realizing how shaders require complex math calculations to create graphics.