The Menu

At first glance most games have a main menu that is fairly inconsequential. It’s a place that a game player spends very little time. They use it only long enough to start a new game, load a saved game, or configure game options. Despite the menu seeming unimportant, the menu actually gives the player an initial impression of the game – it conveys art style, quality, detail, and the style of the user interface for the rest of the game.



At least I think it should.



I’ve seen a lot of menus in games that have annoying problems that I don’t want to repeat. I don’t like waiting through 14 splash screens of middle-wear, company logos, and legal disclaimers. I don’t want to wait for an animation to slide the current user interface elements off the screen, only to wait while the next menu slides in. I don’t like waiting thirty seconds for the main menu to load so that I can immediately pick my save game and wait another thirty seconds for the game to load. And don’t get me started on complicated loading screens that have to load assets first so they can be displayed before the actual game content starts loading.



With those things out of the way, I start thinking about what I want my menu to look like. I’ve had the interactive parts of the main menu working for a long time, but it hasn’t been backed up by any art or sound. Here’s what the menu has looked like for the last year.

I’ve swapped out screenshots as a background now and then, but I’ve disliked them all in a presentation sense.



Because the player spends so little time there, I feel like I should spend less than an hour to make an awesome main menu, but I’ve been agonizing for days over getting it right. The menu needs to fit the game and currently I’ve only been cringing at how poorly presented it is.



What I had in my mind most for Banished’s menu was fast load time. Fast as in you start the game and immediately the menu is presented. I long for the days when games came on cartridges and all data was just a memory access away – no need to load from physical media into RAM. But since that isn’t the case, I decided I wanted some nice art displayed behind the menu, the name of the game, and some music playing. Many games do this successfully.



For this setup I only have to load the font, user interface elements, a few sounds, and the music streams in the background. This certainly meets my goals in only a few megabytes of data.

Unfortunately, I’m a very poor 2D/traditional artist. I can apparently make textures for 3D objects, but I can’t draw full images very well. Anything I attempted looks out of place with the game or is so ugly that I don’t let anyone else see it. So drawing anything stylized was out.



Straight screenshots from the game are out too, that just looks strange to me. I tried taking screenshots at custom camera angles and then painting over them to make the artwork easier on myself, or even using filters that look like paintings, but these just came out cartoony compared with the actual game.



Next I thought about setting up and rendering a scene with fancy materials and realistic lighting. After thinking about the work involved with this I discarded the idea in less than five minutes.



Why is this so hard? It’s just a menu with a few options on it! I decided to forget about the menu for a day and work on some other things that need to be done.



Doing builds for testing was getting a little annoying so I worked on some build scripts to automate the process. The script gets the latest code and data from the source repository, compiles all code targets, builds all the resources the game needs from source assets, packs them into a pack file, and then copies the resulting executable and data file to a directory outside the development tree. While I can do all this by hand, now I can set it off on another machine and continue working instead of wasting twenty minutes.

After writing the build system, I started the resulting build to check that it actually worked, and I noticed and remembered that loading a save game and getting back to the action for a small map only takes about two seconds. The developer build I usually play is much slower than the actual production build, due to error checking and the thousands of file open/close accesses it performs.



This event reminded me that loading data from a hard disk isn’t really all that slow. I’m used to shipping games in the console world where usually a game is reading from a optical disc at a slow rate. And so I throw away my idea about just loading fonts and an image, and decided that I can squeeze in some loading of some 3D assets and still maintain fairly fast response from executable start to interactivity. So what to render?



I decided to build and load a nice town scene where the water is animated, the trees sway in the wind, and the camera moves slightly – this is much nicer than a still screenshot, and as a bonus, you can change video options in the main menu and see the results in the background immediately.



Because no game logic will be running, frame rate issues won’t ever be a problem (unless you have a really slow video card), and the game only has to load a terrain and a few models. Once I got that working, starting the game and showing the menu menu took under a second, despite the extra data loads.

After getting this working I talked to a few people, expressing my annoyance that the main menu was taking me far to long to make and that I wasn’t fully happy with it. After telling them my current solution, without talking to each other, they both suggested that the background should show the last thing the player was doing, so that each time the menu is shown the background is different.



At first I didn’t like this idea, because you could show a scene that isn’t ‘Artist Approved’. But really it’s genius. The content is dynamic, the player will always be reminded of what they were doing when they left the game, and all I have to do is find a scene in a game I play that looks good for the initial display.



It’s really perfect for the game. Now when I start the game, I might see a menu with a snow storm. Or sometimes I’m looking down on a town from far above it. Sometimes it’s a farm scene. Sometimes I see a boat coming down the river.

Once I decided to do this, It took me less than an hour to make the menu display the last thing the user saw and to make nicer title text. So in the end it did take under and hour to make a nice menu, and it still loads fast. I just had to explore the multitude of ways that didn’t work for several days before I figured out how to do it.



Now onto important things.