What is Batter Up!?

Batter Up! is a VR game for the HTC Vive where players can bake cakes, earn money by completing customers cake orders, and using the money earned to upgrade your bakery.

One of our areas of focus is creating a progression system that’s more than your typical level based / infinite wave type progression. We have designed a system where based on the amount of money you have made from baking and selling cakes to customers during the day, you are able to upgrade your appliances, tools, and the bakery itself.

In Batter Up! because there are no “levels”, the difficulty is tied to the items in the players bakery. The more upgraded your items, the more efficient they are. The more efficient the items are, the more customers are drawn to your bakery and order more elaborate cakes.

We will be updating this site regularly as we go through the development cycle with posts about our design processes, concepts, art, and the multitude of other things that go into making a great game.

Designing for everyone

When making games people often forget there’s a ton of different languages that you should support (EFIGS – English, French, Italian, German, and Spanish used to be the norm, but it’s expanded much larger than that nowadays) The more languages you support, the larger the audience is that can experience your game. We don’t have a localization team so we have to do our best with using clear and easy to understand iconography to compensate.

PlainMainMenu.jpg
Main Menu basic implementation

Using the main menu above would mean that anyone that doesn’t speak English can’t even get into gameplay without trying every option, and probably accidentally exiting the game… To remedy this we added simple icons to guide the player to at least know which one that play button is.

IconsMainMenu

Now any player can easily understand which one is the play button. Everything looks pretty plain though… So we ended up adding some colour to it as well. Colour can also be used as a tool to help clarify designs.

ColourMainMenu

This simple concept should be applied to as much as possible to ensure as many players as possible can enjoy baking cakes in VR!

Tutorials

Tutorials in games are very difficult to get just right. You want to be able to teach the player without them getting confused, overwhelmed, or impatient. All the while making sure they completely understand everything so they don’t feel confused later on when certain game mechanics appear.

Everyone has their own preference for tutorials though. For example, in The Legend of Zelda: Breath of the Wild the game doesn’t do much tutorial hand holding at all. You are basically shown as a player that you’re completely free to figure out everything on your own. For some people this is the most amazing first time tutorial flow. For others it could be very confusing and frustrating as they need more guidance.

One thing that we both feel is that tutorials that hold your hand and force you to go through this long tutorial flow are especially painful…You know exactly what games we’re talking about…

We have quite a number of things to teach the player (though we’re sure if players skipped all the tutorial screens they would be able to figure out everything on their own). We have all the different tools to teach the player (3 different ovens, dispensers, frosting tools, and topping tools) as well as how to complete a customers cake order, and last but not least how to make money and what the point of it is.

We could have had a giant “how to use” screen with EVERYTHING on it, but that would take up the players entire vision as well as be incredibly overwhelming.. We could have pop ups that appear every time the player hits a point that we haven’t taught them yet.. But that sounds annoying and could interrupt the flow of gameplay..

We also need to take into consideration, what if the player is playing with friends and they’re taking turns in between rounds? How would that player know how to play and use the current tools if they haven’t been taught anything previous?

Our Solution

We came up with a solution that we think does a good job of covering all of the questions above. The order board slides towards the player (for readability sake) and displays diagrams and descriptions according to the following parameters.

  • We must figure out which tools / equipment the player is using and only show that specific tools instructions. (For example, if you’re using a level 2 upgraded dispenser, only that tutorial info will appear for that tool)
  • If the player hasn’t unlocked a frosting or topping tool yet, tell them what those tools are.
  • At the beginning of the game, the player won’t have a frosting or topping tool, so explain how to complete a cake order, as well as explain what money is and can be used for.

TutorialLevel1

The order board shows them all this information after 1 of 2 things.

  • The player has selected their save file and is going into game, the order board will then appear with the tutorial information before starting gameplay.
  • The player has completed a day of baking, the player has chosen which items they would like to upgrade (perhaps a new tool which would need some “how to use” information). Then before the next day begins, the order board will have all the appropriate tutorial text on it.

TutorialLevel3

One of the most important things to note here is that Continue button at the bottom. This button is here as soon as the tutorial screen pops up. That means that if you’ve already seen how to use all the tools then you don’t have to wait, you can just grab the continue button and get into game right away.

Customers

In Batter Up, the object of the game is to bake cakes for your customers as fast as you can so you can earn more money and tips in order to upgrade your bakery and the tools that you use.

The bakery resides in a town full of donut people. They’re a nice people, calm, sweet, and hungry for cake. Some might see this as cannibalism, maybe it is, or maybe it’s just a nasty sweet tooth. Either way, they’re paying you to bake them cakes, so cakes we shall bake.

CustomerWalksIn.gif
So, this customer walks in and is like “HEY, MY SWEET TOOTH IS KILLIN’ ME RIGHT NOW, I NEED A CAKE STAT!”

If you take a long time to bake the customers cake, the order board begins to fill up. While the customer is waiting, the tip (the stack of cash on the orderboard) begins slowly decreasing. After the customer has waited for too long, the tip eventually dissapears and the price of the cake begins to slowly decrease.

TheyreWaiting.gif
Customers patiently waiting for their cakes

Be sure you make as many cakes as fast as possible so you’re able to maximize your profits and buy upgrades to tools or buy some decorations for your bakery. Buying tool upgrades allows you to bake cakes faster, while buying decorations will increase the uniqueness of the cakes customers order. The more unique they are, the more the customer is willing to pay for it.

WindyDonutMachine.gif
Chocolate fountain decoration on the left | donut machine decoration on the right

 

Some bugs along the way…

SpiderDonutPeople.gif
whatisthisidonteven
DonutSwagger.gif
Donut Swagger

Small changes, big rewards

The thing about game development is there’s a MASSIVE ton of work even for something small.

For example, imagine the player opening a door. The amount of work involved could be

  • Concept art for the door
  • 3D modeling the door
  • Unwrapping/Texturing the door
  • Animating the door to open/close
  • Importing the door into the game and ensureing it fits and is scaled correctly
  • Programming functionality for the player to be able to grab the door handle
  • Programming functionality for the player to be able to move the door back and forth realistically
  • Audio for when the door knob turns
  • Audio for when the door opens
  • Audio for when the door closes
  • Particle effects to be created and played once the player has successfully opened the door

That’s just for a door… We have a whole game to create in VR.. We need to find as many optimal ways possible to make the game better.

Small changes, big rewards

Sometimes you’re able to find things that with just one small change, it makes a huge difference. For example, we’re using the Unity Standard Asset Toon Shader. Initially we were just using the default UtilToonGradient (which is just a gradient on the toon shaded object that goes from white to black) It didn’t look bad, but it wasn’t quite right, everything was a little too dark. After completing what was set out for the day, I had a few moments to work on whatever I wanted. So quickly taking 3 seconds and making a new gradient that just went from white to light grey made a huge difference to the game visuals.

ToonShaded.png
Left side is what it is currently – Right side is what it was initially

 

Even something as small as adding a simple particle effect to something suddenly brings so much more life to the game. Once you get enough of these little changes into the game, everything starts to really come together and that polish you’re expecting slowly gets closer and closer with not as much effort as everything else.

Below is an example where we were initially just showing a stack of money disappearing when the tip amount goes down.

LossOfTip_NoParticle.gif
Tip reduction, no particle effect

But I had already made a “make it rain” particle effect that took 30 seconds to modify in order to create a particle effect that makes sense being played when the tip amount goes down

TipParticle.gif
Tip reduction + particle effect

The food cannon

The food cannon is a game mechanic we added where once a day (a day being 6 minutes of real time) you have to go on lunch break. During this break we have implemented various minigames for the player to experience to break up the gameplay a bit. As you can see below, there’s a cannon shooting hotdogs at you. Your goal is to grab them and eat as many as you can in order to increase your tip modifier.

foodcannonhotdogs
First test of food cannon
cannonanim
first draft of food cannon animation
foodcannonhotdogs_two
2nd draft of food cannon animation

The model of the food cannon was based off of those elementary/high school TV carts that your teacher would roll in whenever there was a video to be watched. Every kid looked forward to that moment. When the giant 500lbs 25″ TV rolled through the door and the teacher would play one of those really old educational VHS tapes.

The Flamethrower

While designing the progression system, we had to think about how exactly we were going to make each level of an item upgrade feel. There had to be more than just a visual upgrade. Each upgrade should feel more efficient, more fun, as well as look prettier.

This is where the flamethrower comes in. The flamethrower is one of the upgrade levels of the oven. We thought it should feel more efficient than taking the time to put the batter into the oven. It should feel a lot more fun considering guns feel pretty awesome in VR. Last but not least, it should look badass cause it’s a freaking flamethrower.

FlamethrowerDrawing.JPG
First drawing of the flamethrower

I find it handy sometimes to draw what I want to model before I 3D model it. Whenever I’m creating an art asset, I NEED to look at references. It helps with visualizing what I want the final version of my model to look like. It also helps me find ideas that I really like and want to include in my model.

OldFlamethrower.jpg
First 3D model of the flamethrower
flamethroweroldoncounter.png
Flamethrower on the counter in game (seeing how it scales compared to the rest of the objects in the scene)
FlamethrowerOLD.gif
Flamethrower in the upgrade menu with the flame particle effect

So this version of the flamethrower made it all the way into game before I realized one major flaw….If the player uses the trigger button to pick up the object, and they’re holding that trigger button to keep that object in their hand…How are they going to “shoot” the gun… Both of us HATE when VR games use the Vive’s grip buttons to pick up items, so it was back to the drawing board to design a better functioning flamethrower.

newerflamethrower.jpg
Flamethrower V2 model

The solution was easy, I just needed to add a push button on the flamethrower (and any other gun type object we design) to replace the pulling of a trigger. It was a really silly oversight.. But sometimes I guess I imagine so hard in the back of my head exactly how something will/should look that I forget to question how it’s going to work exactly.

newerflamethroweringame.jpg
Flamethrower V2 model in game with some materials slapped on

So this is what the flamethrower looks like today so far. The texture/materials aren’t final at all. Nothing is ever really final until we ship.. This design should hopefully feel intuitive enough to the player that they press on the pad on the Vive controller instead of pulling the trigger in order to shoot. But that’s something we should be able to figure out with some quick play testing.

 

Patterns and colours

 

Adding simple patterns and colours together can create an entirely different feel.

Tile+Blue.jpgWarmTile+RedPink.jpgGreen+PinkRed.jpg

In the screenshots above the only things that have been changed are the wallpaper and the flooring.

 

Woodcounter.jpg

TileCounter.jpg

In the screenshots above the countertop and the topping boxes have changed materials.

With the variety of materials we have created,  we can use our upgrade system to give the player the power of customizing the bakery exactly how they want to.