Posted May 22, 2020 by Itooh
Today we're talking about UX! Specifically, start screen, end screen, and menus. Not the most exciting part of game design, but still a bit interesting. While deeply functional, there is still room to be creative. Bazza Nava is a game that I wants to feel silly and playful, so the user interface should reflect that.
Camera focused on the title, and a blinking "Press Enter". The font used is Comic Neue, an open font offering a great alternative to Comic Sans. It's casual, playful, but not ugly or too silly. The angular variant especially gives it some robustness. I then used an outline and a shadow to give it some volume and ensures it stays readable regardless the background.
Anyway, once the player press Enter, here is what happens:
Slow reveal of the stage, in sync with the music. The player cannot interact with the instruments until this animation is finished. The idea is to present a clean room that will turn into a mess once the player starts to play. The only rule of the game appears right when they can interact, and stays on screen just a few seconds. As always, I only explain the bare minimum. Once the player knows on which button to press, it's up to them to figure out what they do and how to use them. I like that kind of game-design that encourage fiddling and exploration. Later, a second text appear in the same way to tell players that they can press Space to toggle "bouncing sounds". But before that I made sure to let some time to allow the player to familiarize themselves with the game mechanics and the system. The "toggle sounds" control is an option mostly for comfort or exploring a different way of playing, and doesn't make sense if you don't know the game's basics. Plus, by waiting before revealing this info, I hope to make the player curious about this feature and make them try it! It's then up to them to figure out which setting they like the most (bouncing sounds on or off). Finally, to display the state of bouncing sounds, I simply wrote "Bouncing sounds enabled/disabled" in the top left corner when the player hit space. Very simple, but absolutely clear.
By the way, did you notice the change in the lighting? Instead of using a single source of omni light, I put several directional lights in the room (later I will probably put light-bulbs or tubes on the roof). It removes the "cartoon" aspect, but gives also more consistency and volume to the room and its objects. The result is less bright than what I had before, but I find it more pleasant already. The downside was that I had to change the settings on some shaders because they didn't look as nice as before! I will probably have to do that again later, as I intend to change the texture of the floor and add some decorations on the walls and maybe the roof as well…
But there is another reason for those lights! And it has to do with the ending…
The music in Bazza Nava is not a loop. It has an introduction, build up some tension, varies moods through solo sections and chorus, then concludes peacefully. It leads the player somewhere, to create a “musical journey” with variations and emotions. Thus, there is an end, and the game should definitely do something special for the occasion! Once again, I don't want to abrubtly display a screen that says “That's it! Thank you for playing.”. So here is what I did:
Having instruments that float when they are playing, it sort of makes sense to drop them when they become inactive. This happens not exactly after the song is finished, but on its last chord: the gravity is progressively set back to 1, and the lights slowly fade out. Notice that the instruments are still bouncing! I hesitated to reduce their bouncing property, but I find the effect quite fun. Plus, they are still making some noises doing so!
Combined with the beginning, I wanted to have some kind of storytelling. At first the room is normal, filled with static instruments tidily placed. Then the music starts, and the objects start flying around as they play, escaping the laws of reality to participate in a dream. When the music ends, so does the dream, and the instruments turn back into their normal state of inanimate objects. But the room is in a mess now, as an echo of the chaos that happened earlier.
And of course we prompt the player to quit or start again. If they chose to play more, we cut the intro and just turn on the light and remove the gravity once again! But wait… Why do they have to hold ESC to quit?
There isn't really a need for a menu in Bazza Nava. I considered a volume setting, with separates "music" and "instruments" sliders, but it took me so much time to find the right balance that it would be pointless to let players mess it up! As for a pause option… There is no challenge in the game, no pressure, or anything that would justify a need to pause it. The player can just put the game in the background and return to it, they wouldn't miss anything. It's only a five minute game anyway. The only option is the "bouncing sounds" setting, that can be immediately toggled with a single press on Space.
So there is no menu! Therefore, The ESC key should be used to directly exit the game. But wait! What if the player actually expects to see a menu? Wouldn't they press ESC by curiosity, and thus close the game inadvertently? Closing the game with a single key press is a little abrupt. Especially for a musical game! There should be something to make them confirm that they want to quit. Maybe a double press, maybe a combination of keys… Or holding the ESC key for a few seconds!
This last solution has several advantages. First, it's pretty intuitive, and eliminates the risk of closing the game by accident. Secondly, it allows me to add a feedback animation to quit the game in a pleasant way! Here is how it looks:
Of course the animation can be interrupted, and if so it is quickly played in reverse. It's once again simple, but it makes the interaction a bit playful, which fits nicely with the tone of the game.
And thus, we have a complete UI! And in fact, a playable game! The only thing it needs now is some polishing… Making the room prettier, decorating it a bit, tweaking some specific instruments for the last time… The release is really close! I'm impatient to show you the game in its final form and to let you play it. See you next time!