Bitmap Game

Description

Feeling a little stressed? Follow the recipe steps to make your own cup of chai. Use your mouse to click and drag spices, use the mortar and pestle, adjust the heat dial, and move the glass to catch the chai.

Background

One of my most cherished memories from my adolescence is the daily ritual of making tea. Having a eating disorder throughout my teen years often prevented me from being fully present in gatherings that centered around food (aka, most gatherings). Chai was the one constant. It never made my "no" list, because it was tea. This simple drink became the one way I was able to re-establish connection and find grounding through a tumultuous time.

Story

• Title: The name of the game, "Chai Time," pays homage to what my mother used to call our afternoon ritual.
• Intro: The animation in the beginning depicts an overwhelmed protagonist, who feels better after a little tea.
• Panels: Three panels follow, which walk the player through three different steps of chaimaking: crushing fresh spices, boiling the tea, and aerating the final strained product.
• Outro: Mission accomplished! The protagonist feels a little better after taking some time to be present, and hopefully the player does too.

Process

I began by storyboarding the beginning, middle, and end scene for the project, seen below:

As you can see, most of these scenes do not include a protagonist. Originally, I intended for this game to be devoid of a main character to emphasize the focus on the chai-making process. However, for the purposes of this assignment, I included a pixelated doppelganger later in the introduction animations.

After storyboarding, I began grayboxing each different scene, here's a screengrab of the first one:

One hurdle that I had to figure out was a clear click-and-drag mechanism for this scene. Much of my understanding for how to build this came from Daniel Shiffman's "Draggable Objects," seen below:

Another source of information was learning the noise() function to create a smoother randomization. I used this feature in my final aeration level, but originally worked with the math sine wave() seen below:

Styling the Game

I created pixel brushes on ProCreate to create a Bitmap effect. I wanted the color palette to be soothing, yet playful.

Next Steps

So much more to explore here! There are a few key items that I would like to further develop:

• Adding more levels: there are more steps that I could have incorporated into this process, e.g. toasting the spices, straining the tea, etc.
• Adding animation for additional aeration. Originally, I had planned on switching the two glasses back and forth for a few rounds to emulate the actual chai aeration process. I would love to see this in later iterations of this bitmap game
• Continuing to play with pixel art, and include transitions between scenes that contextualize each step of the recipe