Building The Thief Minigame
Hi everybody! Pull your belly up to the bar, and let me get you a drink. Because it’s time for another Innkeep developer update.
Last time, we had a big picture overview of the kinds of things that we’ve had to work on now that we are moving from a prototype to an actual game. Check out that post if you haven’t already to see what we’ve been up to the past year!
Next I think it would be cool to do a series of posts looking at these different systems in more detail. (I’ve already talked a bit about the eavesdropping and charming system before, although I think we can revisit it at some point to show more concretely how it works).
Let’s kick off this series with a look at the thief minigame.
Initial Concept
From very early on in the development process for Innkeep, I realized that you should be able to go into the bedrooms of your guests and steal from them while they slept. To this end, I built out the playspace to allow you to walk into the bedrooms. We have eight rooms along the back wall of the commonroom, and as you enter each the walls fade away to reveal the inside.
(Exploring bedrooms at night.)
I also was quite happy with how the lighting turned out. As you can see here, the player is holding a candle during the thieving sequence, as it’s during the dead of night. Getting cast light to look decent with our 2D space was a bit of a challenge, and there are several layers of tricks used here. It worked out pretty well! It might be deserving of its own blog post in the future.
As for the thief minigame itself, I knew you would interact with sleeping guests to launch a separate window, but I wasn’t sure exactly what it would look like. Eventually I put together a mock concept for use in an early trailer for the steam page.
As you can see, we have a window showing a sleeping guest, and the player stealing different items from different places. Some of those items are hidden beneath other things, like a blanket concealing a ring, or a shirt concealing a chain. We also have a sleep bar, which is slowly depleting. The idea was that once it had fully depleted you’d be kicked out of the minigame (and the room). Items that you steal were displayed in a little box at the bottom of the screen.
In Search of an Inventory System
After this mock-up the design stayed untouched for a while, before I revisited it early this year. Although I was generally happy with the direction, it definitely needed a bit of work. One of the most important things to consider was the player inventory. The little box at the bottom of the screen which I had included in the mock-up was just a placeholder. In fact, until this point, the player had no inventory in general to speak of. All the supplies of the inn are actually stored somewhere physically in the play space. For example, the tankards are under the bar. The firewood is by the fire. And so on. When you grab those items, your sprite actually changes to show you holding them. You can only grab one kind of thing at a time with this system. This was to help give you a more tactile sense of actually being in the play space, handling these different objects. An abstract general inventory makes sense in a lot of games (like in RPGs for example), but didn’t seem like the right fit for what we were doing with Innkeep.
But with no inventory system, how could we store and view the items we were stealing from guests? If we just had a little box at the bottom of the screen, what would happen if we ended up stealing a couple of dozen items? (That will definitely be possible towards the end of the game when you have more guests visiting.) And how would those stolen items then be visible in a future trading screen?
On top of this, there was the question of guests having bags, backpacks, sacks, saddlebags, and so on. Containers that we could open, to steal things that were inside them. Our mock-up had nothing like this in it.
The Power of GUMPs
It became clear that we needed some kind of approach towards inventory items. One which could later be integrated with a yet-to-be-designed trading system. In thinking about it a bit, the design I gravitated towards was the GUMPs (Graphical User Menu Pop-up) system from Ultima 7, Ultima 8, and Ultima Online.
(Ultima 7: The Black Gate)
The GUMPs approach to 2D inventory was to have containers possess an “inside” sprite, within which objects could be placed anywhere. Draw order was handled on the basis of what had been touched when, rather than a y-axis depth sorting. In other words, whatever object was grabbed and moved last was considered to be “on top”, with every other object being shuffled down a step in terms of depth. On top of this, the interior of containers could be dragged around the screen to suit the player’s convenience. This system was first seen in Ultima 7, and was part of the big step towards mouse-centric play that the series took with this entry (Incidentally, Ultima 7 was released in April 1992, the same month as Windows 3.1, which further helped popularize dragging “containers” (folders) around the screen with a mouse, a feature I believe had previously been unique to Apple Macintosh computers).
(Ultima 8: Pagan)
The GUMPs system was really novel. One of the things I loved about it was how you could seamlessly drag objects from the world-space (bread, books, swords) into open inventory containers. You could also put containers inside other containers (sacks inside backpacks, etc.) This helped with organizing your loot. Unfortunately, it came with a significant down-side. One which probably contributed to the system failing to catch on, and become something of an evolutionary dead-end in the history of computer game inventory systems. Basically, sorting large inventories came with too much overhead. Because the player was responsible for the exact positioning of every object in their bags, and because objects could hide other objects, you would be forced to spend inordinate amounts of time moving small things from one container to another, and even so end up furiously searching through every container looking for a damned key. This issue became particularly acute in Ultima 7, Part II: Serpent Isle, due to the sheer number of quest items (As Majuular discusses as part of his recent epic overview of this title). The Ultima series discontinued GUMPs with their final entry, Ultima 9, opting for a grid based approach.
(Ultima 7, Part II: Serpent Isle. From Majuular’s video.)
Part of what attracted me to the GUMPs inventory system was the way its tactile drag-and-drop nature would work well with the overall style of Innkeep. However another big draw was actually its “flaw” of being unwieldy. I wanted the player to spend time digging into the bags of your sleeping guests, trying to uncover valuable items while not making too much noise. In this context, having a pair of pants hide a valuable key was not a negative (as it would be if you were already the owner of said pants and key), but a positive. You don’t know exactly what is inside the bag until you’ve had a good rummage around. And rummaging comes with an opportunity cost (noise, time).
So I had a starting direction. The idea was to give the player a loot sack which would exist as an icon on the screen, with items dragged over it, in order to insert them in the sack. But the sack itself could also be opened in order to check and see what items had been stolen so far. Guests would also have bags next to their beds within the minigame window, which could be opened (generating noise), showing their interiors in GUMPs style. Later, we could integrate this system of displaying loot with our trading system.
(Initial work on the loot bag.)
The trick then was to figure out mechanically how to pull this off. If you’re interested in some game dev / programming details, I’ll go into it for a bit here. If that sounds like too much information, feel free to skip past the italicized section to see the end result, and what else has been added to the thief minigame.
Programming Tangent
Still with us? OK. So I knew that I needed to utilize arrays.
For those of you who are unfamiliar, an “array” is a way of storing data that is super crucial for making things like computer games. Regular “variables” store a single piece of data. For example, the variable “amount_of_stew” might store a number, like 3, representing how many servings of stew remain in a cauldron. Or the variable “type_of_contents” might contain the string “stew”, representing that a bowl has stew in it, and not, say, cheese, or bread. If you need to store a small amount of data, you can always just use a lot of variables. But there are many times where we need to store and manipulate large amounts of related data that has some relationship to each other. In such cases, variables are a bad idea. For example, if we have a container, and that container has ten items in it, we probably don’t want to have ten variables, named “container_item_1” and “container_item_2”, and so on. What if we wanted to swap items between positions? Or what if we wanted to add an 11th item? It’s not flexible enough for our needs. Instead, we can use an array.
An array allows us to store multiple pieces of data under one name. Putting some data in an entry within a 1D (1 dimensional) array might be done like this: inventory_contents[0] = “bread”. The number in brackets represents which entry in the array we are looking at.
As you can see, arrays are super useful. We can even make arrays with multiple dimensions. In other words, we can have lists of lists. For Innkeep, I have a master inventory array, which is a three dimensional array. The first dimension references the specific container we want, identified by a name. The second dimension references the objects inside the containers. And the third dimension stores information about those objects (the x, y coordinates of where they are within the container, the name of the object, the sprite, and so on.)
Using arrays, we could open a bag, and have the game reference the array entry for that bag, figure out what items are inside it, and then create those actual items, ready for the player to be able to drag them around, moving them out the way, or just stealing them. Having all of these containers in a single array also lets us have simple scripts that find a given entry and add or remove items, and later makes save-game systems easier to implement.
The tricky part was figuring out depth order. In other words, determining what items are drawn on top, and what items are drawn further below. This is always an important element of 2D games, and can be quite the challenge with tricky edge cases needing special handling. As mentioned above, the GUMPs system sorts depth according to what objects were moved last. This is in distinction to the typical depth sorting for 2D games, which utilizes the Y axis, so that whatever is lower on the screen is generally “higher” in the draw order (think, Stardew Valley, Don’t Starve, or Ultima 7).
I couldn’t get away with simply shifting every other object in a container down by 1 in the draw order whenever you grab an object. This is because if you repeatedly grabbed just the top two or three objects, everything else would keep getting pushed deeper, and deeper. Instead, I created a temporary array, putting the recently grabbed object at the top, and then moving down through all the items in the container array, skipping the entry for the object we had grabbed. The depth of any object would be relative to its position within the array.
(Grabbing a “bottle” puts it at the top of our array.)
This gives us a properly sorted list that represents object depth. Then that list could be copied back to our master container array. Something similar was done when adding or removing items. Fortunately I’d used arrays a bit for some earlier prototyping, so this all went pretty smoothly!
The only remaining thing to do was program a universal “grabbable object”, which would be loaded up and given a sprite when created (upon opening a container), and have different behaviors in different contexts (for example, what kind of sound it makes, if it can be manipulated, etc.)
Once the mechanics were figured out, it all came together pretty fast. Here you can see the system in action. The player can move things around to find other hidden things underneath, just as intended. (And of course the lovely art here by Ben Chandler has elevated it a lot!)
Strongboxes
More recently, I’ve expanded the system a bit more. We now have strong-box containers, which are unlocked by paired keys. You can imagine situations where that key can be quite hard to find, and might even be held by somebody else in a group other than the owner of the strongbox.
Bundles
We also have a unique kind of object called a “bundle”. These are objects that can be opened / untied to reveal other items inside them. For example, a bundle might be a coin pouch that holds a bunch of coins. Or, it might be a sealed envelop, holding a letter. For now, these bundles stand-in for putting containers inside other containers, an original feature of the GUMPs system that we might be able to get away without adding. That said, if we do end up adding containers inside containers, bundles could still be useful in a number of contexts!
There are also a couple of other areas that have had some work done on them:
Time Candle
During the thief sequence, time is gradually running out. This is shown with a candle GUI element, which slowly burns down.
Sleep Bar
Originally, this depleted gradually over time (but faster when you touched things). Now, it replenishes when you stay still. This means that if you are careful enough, you can surely steal almost anything a particular guest has. However, given the candle is burning down, the player is motivated to work fast. Our sleep bar now also changes color when it gets lower, and is accompanied by a sleeping face element, and some cool snoring noises care of our sound designer Philipp. The snoring stops when the guest starts to wake. 🙂 Eventually, I hope to swap the generic sleeping face element with the unique portraits of our guests.
Blankets
With our nice drag-and-drop interface in place, it felt like the blankets also needed to be dragged, rather than uncovered by simply clicking on them. This is now in (although the art needs some work). This involves several layers of sprites moving in tandem, some visible, some invisible (used to subtract from other sprites). It definitely feels a lot nicer. 🙂
Ring Stealing
There are a number of mini-minigames, or sub-minigames, that I’d like to see added. One of these is now in, at least in simple form: ring stealing. This involves wiggling a ring off a finger. Of course, the ring first has to be visible (if it is under a blanket, you need to move the blanket out of the way first.) In the future, we may also have little vignettes for looking under the bed, under pillows, stealing things gripped in hands, and so on.
Overall, the stealing minigame is now feeling a lot like a real mechanic, rather than a mock-up. There’s much to be refined as we go, but we are now in a place where we can start adding content and playtesting this part of the game!
Thanks for reading! See you next time with another closeup of an Innkeep game system.
Previous Post
Next Post