donut bakery | emily huang

introduction

For my individual final project in my Multimedia Programming for Art and Design class, I developed an interactive simulation in the form of a game using Java. Since I worked at a bakery, I based my project around making donuts, one of my favorite tasks at work.

rough sketches

I roughly drew out quick storyboards for how I wanted my interactions to work within the project. There were 8 main steps, with each step being either a drag and drop or click option. Figure 1-3 shows my rough sketches laying out the steps of the game.

rough sketched steps of first stages of game where donut is cut out and fried — Figure 1: The user drags the shaper tool over the dough to cut the donut shape out. Then, the user clicks the fryer to turn it on, and drags the donut dough over the fryer.

rough sketkched steps of second stages of game where donut icing colour is chosen — Figure 2: Once the donut is done, the user turns off the fryer and drags the donut onto the counter. The user then selects a color for the icing, and drags the icing bag over the donut to decorate it.

rough sketched steps of last stages of game where donut is decorated with various toppings — Figure 3: The user is given the option of various decorations that they can use to decorate the donut with. Once they are done they can click Serve to serve their donut and end the game.

1st prototype

In the 1st prototype, I focused on making sure my code worked with placeholder shapes for the interactable objects. Figure 4 shows a screenshot of my project during this 1st prototype, with each shape labeled with their function.

1st iteration of the donut bakery, where the objects are represented with shapes — Figure 3: The user is given the option of various decorations that they can use to decorate the donut with. Once they are done they can click Serve to serve their donut and end the game.

final version

For the final iteration, I used MediBang Paint Pro’s pixel brushes to digitally draw pixel graphics for the donut, decorations, and other interactable objects. Figure 5 shows a screenshot of the final decorating step, with the new pixel graphics implemented.

One problem I ran into while implementing these pixel graphics was adjusting the bounding box of the complex shapes. Because the objects were no longer just simple shapes, the bounding boxes had to be adjusted accordingly so that interactions were still smooth. The solution I implemented here was to use several smaller bounding boxes to merge together into a larger one, which helped with complex shapes such as the decorations, where they weren’t just a circle or rectangle.

final iteration of the decorating step of bakery process — Figure 5: Screenshot of decorating screen for final iteration of project

Finally, to help guide the player through the game, I added instructions at the beginning and for each step of the process, as seen in Figure 5 and 6.

start screen of game screen with instructions — Figure 5: Screenshot of start screen for final iteration of project 4