Hi everybody! Hope you’re ready for another article on Innkeep development. This week I’m taking a closer look at the work I did on the exterior location leading up to the Inn: the Valley of Ancestors.
--------------------------------------------------------------------------------------------------
Hang on, tell me what Innkeep is again please!
INNKEEP immerses the player in the experience of running a fantasy world inn as a less-than-scrupulous master of the house. Each day, groups of unique guests will come to visit. Eavesdrop on their conversations as you serve them, learning their secrets, and acquiring new stories and jokes to tell. Gather a band of down-and-out bards to help fill them with mirth and keep them drinking until late. Then, when they are sound asleep each night, sneak into their rooms, rummage through their belongings, and take their pretty trinkets for yourself.
Sound’s pretty cool, right? By the way... Did you know that Innkeep now has a Steam page? It's true! Go check it out, and hit that Wishlist button. More wishlists helps a lot with getting steam to recommend the game to people, or for when I try pitching to publishers for financing to finish the project.
So: Do it! Do it now!
Alrighty then. On with the show.
--------------------------------------------------------------------------------------------------
Into The Valley
Practically the entirety of Innkeep takes place within a single location: the interior of the Weary Pilgrim Inn. This is by design. From the very beginning, I wanted to be careful with scope, given that this was (more or less) a project I’d be making by myself. And Innkeep was about the experience of being an Innkeeper, and interacting with your guests in a clever way as part of that fantasy.
The Inn is also located somewhere isolated. There is no surrounding town. This distinguishes it somewhat from certain other titles that might seem similar (like Graveyard Keeper, or some tavern simulators, etc. that have certain SNES / Stardew Valley influences). There is no farming. No local residents to go and visit. No dungeon to go and mine in. It’s just you, your guests, a kitchen, a stables and pantry, and some bedrooms.
That being the case, I could have probably gotten away without creating any exterior location at all. Perhaps a few simple illustrated cinematics, and maybe a map or two, would have been sufficient for gesturing towards the environment that surrounds the inn. That certainly would have been the smart choice!
However, what I opted for in the end was an exterior that the player can actually walk through. This is The Valley of Ancestors.
There are a few reasons for this:
First, I wanted the initial prologue sequence to really help establish how isolated the inn is, and who the player character is (a hooded wanderer, looking for shelter), in a way that was somewhat interactive. I wanted the player to be able to look around at landmarks in the area and comment on them, to actually see the Inn as they approached it, to look at the sign above the door, and “choose” to enter. This would help establish an immersive sense of place better than a few simple cutscene images.
Second, I wanted a space that could potentially be used for a number of other sequences during the course of the game’s narrative. The Valley of Ancestors itself will feature quite prominently during the unfolding of the story, so I really wanted to actually show it at numerous points.
(I’ll write about how that’s the case in more detail for a subsequent article.)
First Steps
My first task when starting on the exterior was to figure out the rough dimensions of the total space. For this, I had to consider things like where the camera would be moving through the introduction sequence.
Then I had to work on the design of the Inn exterior. I tried to have the exterior closely reflect the scale and shape of the interior, without it perfectly matching 1:1.
There were quite a few iterations required, but fortunately I was able to re-utilize some of the textures I had made for the interior.
One of the trickiest parts was the roof tiles. I’m still not entirely satisfied with how they turned out. This was a lesson in learning about how something looks from a given distance. The tiles might look OK when zoomed far out, but seem a bit overly detailed when zoomed in. I also learned here the importance of using repeatable "tiles"! (pun intended). Too much of the touching up of these (actual) tiles was done by hand, instead of using "tile-able" (i.e. repeatable) sprites. It helped ensure the result was more organic, but made it far too time consuming.
Next, I needed to do a mock-up of the background layers that would move in parallax, showing off the valley in the background. Alongside the foreground area, there would be a low-lands, some foothills, and then some mountains.
Getting this working wasn’t too tricky, and I was pretty pleased with the parallax result.
Touching Grass
After some time away from working on the exterior, I came back to it this year with the goal of cleaning it up nicely for a new trailer to use on the steam page.
The initial grass I designed for outside was a fun way of practicing with a tablet (for years I had done all my art on Innkeep with a mouse like a madman.) The problem was though that it looked far too static. Esp. considering the location was a windy valley.
So I needed a solution that would let me draw a lot of moving grass on the screen, without it hitting the FPS performance terribly.
My first attempt was to use a shader based approach. This would let me draw a lot of grass to the screen that would move in a semi-dynamic manner, using some calculations handled by a single object.
Unfortunately, this approach had a lot of problems. The movement of the grass was still very uniform, it was prone to bugs, I had issues with how to handle different draw orders (the player being behind grass, or in front of it), and the performance was actually not very good. I’m sure a more competent coder than myself could have made this work nicely, but it wasn’t looking like an efficient answer to me. It was time to get back to basics.
What I opted for in the end was to actually create thousands of grass objects. These had the obvious benefit of being simple to implement, basically bug free (not many bugs to worry about with an object drawing a sprite!), and easy to adjust.
The approach was this:
- Create a grass generating object that would create several thousand individual grass objects in a random fashion, over a large square field (everywhere visible to the camera) when the room was first loaded.
- Use other invisible objects mapped over the landscape to tell those grass objects if…
- They should delete themselves (because they are in the sky, or on a road, etc.)
- They should adjust their general depth level (because they are “behind” the road, and hence behind the player, regardless of Y axis position, or “in front” of the road, and “in front” of the player.
You might reasonably assume that thousands of grass objects would be significant system hit. Especially considering they were all going to be running their own individual animation calculations later on for moving in the wind. However, Gamemaker does allow you to “freeze” objects without deleting them. All I needed to do was make sure that only the grass visible on screen was active every few frames (with a little buffer to take into account player movement). This was enough to secure an FPS quite safely above the target of 60, even on my fairly dated system.
Blowin in the Wind
The final problem was how to get these grass objects moving in a believable manner. I wanted gusts of wind to visibly blow across the surface of the grass, rather than them all just randomly moving back and forth.
Given I had opted for using objects, the obvious answer here was to have them interact with yet another object: “wind”. This wind object would be randomly generated on the right side of the screen, and would move towards the left quite quickly. Although entirely invisible, it has its own sprite (randomly chosen from a selection) that is used for calculating when it comes into contact with a grass sprite. When grass is in contact with the wind object, it “charges” up, bending back further. Once it is no longer in contact, it releases that charge, returning to its original state.
This was one of those happy times in gamedev where the solution was fairly obvious, quick to implement, and pretty much bug free from the get go. A rare but lovely thing.
It also had the added benefit of allowing me to have other objects interact with the wind. For example, I could make the players cloak “charge up” like the grass, or the sign above the door of the Inn itself.
Revisiting the Background
With the grass looking good, it was finally time to revisit the background art and turn it into something more or less viable for the final game.
I’d had a bit of practice with using the tablet by then, so I hunted for some references, watched some art videos, and got to work.
First, a basic outline.
Then, thinking about light, and some detailing.
Expanding further on the details here and there.
Eventually, I ended up with this.
Not bad, but still not quite there yet. This is where I was able to commission the help of a particular talented artist, thanks to my Patreon supporters.
With just a few hours of work, he was able to adjust the hues and contrast to give us this:
Now THAT is a nice background. ;-)
Putting it all together, you have an exterior area that is far more evocative, helping to set the stage for the game’s broader narrative and themes.
Hope you enjoyed this not-so-little update. I'll follow up with another soon. :-)
