top of page

Once Upon a Flame

Once Upon a Flame is a 2D Puzzle Platformer where you play as a tiny elf. The player has a flame companion they must protect from the rain with their umbrella, while also solving spatial puzzles.

This project was developed in Unity3D.

Gameplay Trailer

Design Process - Feedback

Prioritizing

The first step in this project was to figure out what needed feedback in the game. We knew what our mechanics were and how the flame spirit was going to react, so I could figure out what feedback I needed to create.

FlameLight1.png

3 cups

Flour

Light Color Changes

Mouth turns

Eyes Change

Size Changes

Flame.png

Flame Spirit Health Feedback

Size

FlameShrinkOnly.gif

The flame spirit loses health when they're hit by water. To show its health to the player I have a couple of different feedback events happening. Because the flame is getting hit by water I have it shrinking as the health decreases. 

Face

FlameFaceOnly.gif

The flame's face also reacts as it dies. His eyes go down and his mouth turns to a frown. 

Light

FlameBackOnly.gif

These are small changes that might be missed, so to really sell the point I also have the light emitting from the flame change colors and fade. 

Combined

FlameAll.gif

HUD Feedback

Together the feedback is able to convey that the flame is losing health, but some of the small details can get a little hard to read with how small the flame spirit is. Also, if the flame is ever away from the player the player wouldn't have anything telling them the current state of the flame. To help mitigate these issues I added the flame to the HUD. It reacts the same way as the flame, except it doesn't shrink. That way it is always easy to understand the status of the flame.

Feedback with HUD

Once Upon A Flame 2020-05-05 11-00-07_2.

Other Necessary Feedback

The flame spirit has more to show than just it's health. The player needs to know what the AI is doing or wants so they can properly interact with them. In the story, the flame can't actually speak, so we can't just have a dialogue appear. We needed something else to show the player what to do. What I came up with was to have thought bubbles appear from the flame that shows what they want/need/feel. Each thought bubble has a key event that makes it happen. Some thought bubbles go together, such as the flame might show that they want kindling and when they eat the kindling they show that they love the player with the heart thought.

Flame Spirit Thoughts Feedback

Rain

FlameThoughtNoRain.gif

When the flame gets hit by water a small thought bubble appears to let the player know the flame doesn't like water.

Love

FlameThoughtLove.gif

When something happens that the flame likes a thought bubble with a heart appears. It pops up when the flame is fed and intermittently while they're following the player.

Kindling

FlameThoughtWood.gif

If the flame's hungry, low health, or wants food a thought bubble appears showing kindling. 

Burn

FlameThoughtBurn.gif

The flame can burn certain items when it has full health. To show when the flame is going to burn something it has a thought bubble with a burn icon.

Scared

FlameThoughtScared.gif

There are a few times when the flame is scared of a bird and goes to hide. A thought bubble with a scared face appears when that happens. I chose to do a scared face instead of a bird because I wanted to show the flame's emotion more. 

Design Process
Health Feedback
Thought Bubble Feedback

Design Process - Menus

Menu Types

Before I could start the menus, I needed to know what menus would be needed for the projected. The class requires us to have both a Main Menu and a Pause Menu. In our second semester, we added a journal collection mechanic, so the player needed to have a way to look at their collected journals. At that point, the pause menu was created so having it be apart of the pause menu wouldn't work. If we combined the pause menu with a journal menu, things would feel cluttered and be confusing. The player would have a lot of different things going on in one menu which would feel overwhelming. There are no other mechanics the player has that required a menu, so I had 3 required menus to develop for the project.

Main Menu

The game is set to be inside a storybook. The most logical choice for the Main Menu was to be the page of a storybook and have said book open. The transitions are then the page flips between the sub-menus and different scenes. To differentiate going between levels I have the page flip be endless flipping until the scene transitions. Whereas going to the options menu is a single page turn in the book. 

Pause Menu

A big aspect of this game is the umbrella mechanic. The player uses it to traverse through levels and protect the Flame Spirit. Because of that, I wanted to take the umbrella and use it in the pause menu. I made the background of the menu the actual umbrella and I put the buttons along the center of it. To show which button is hovered there is a small raindrop animation to the left of it. I had initially thought to left align all the text, so the raindrops lined up, but that didn't fit with the umbrella background. It also felt weird that the text wasn't centered aligned with each other, since you don't always see the raindrops.
 

A big part of this menu are the animations for when you pause and unpause. To fit the theme of the umbrella the menu floats in as if riding a wind current. I spent a lot of time tweaking this animation so it was slow and steady, while not feeling like it was too slow. The unpause animation flips the menu over and blows it off-screen. With the pause animation being so slow and calm I wanted the unpause to almost oppose that. It flies off in the opposite corner from where it came in. This helps both animations feel balanced.

Journal Menu

The journal menu was probably my favorite menu to make. The player can pick up to 12 journal pages in the levels. Some of the pages are impossible to miss others are optional. Our narrative designer wanted a way to show the player's backstory in-game and came up with the idea of the journal pages. In the game, these are supposed to be handwritten by the main character and are simply fluff. I wanted to make this page feel dynamic. The player should be able to view all that they've collected, see how many they're missing, and view the pages in more detail. 

Menus
bottom of page