Mobile game development: putting finishing touches on visuals and sound

For my latest mobile game project, I decided to spent more effort on the overall player experience, in particular the visuals and sound. After I worked out the basic gameplay rules and level design, before releasing the game I went back to put some of these finishing touches on.

For the experienced mobile game developer, these types of things are second nature, but for the hobby game developer who is still learning the ropes it can take some time to shift one’s thinking to be player-centric. These refinements also contribute to the game’s overall appearance and can result in more downloads if they are showcased in screenshots and app preview videos. Ultimately, one of the best types of marketing is a game that markets itself with appealing graphics.

In this post I’ll highlight some of the visual improvements I did, followed by some audio and sound ones.

Visual

  1. I used a star field animation rather than a plain background on the screen behind the game board. This took some tweaking to get right, and I ended up using different layers of stars to add depth, with colors and speeds set accordingly. For example, stars that are closer move faster and are brighter looking. The stars also fit well with the ‘meteor’ element which is introduced into the later levels.
  2. I added an animation at the beginning at each level where the tiles fall into place from the left and right sides of the screen.
  3. When a game ends, the tiles fall away off the screen.
  4. Touching and holding the screen causes the tiles in the same column and row to be highlighted up. This has to be done since the actual square being clicked on is usually not visible because the user’s finger covers it. The color of the highlighting is white for valid spaces, and red for invalid ones.
  5. I spent a great deal of time tweaking the animation for when tiles expand or ‘grow’ outwards. I ended up with using a random timing for when tiles appear, and this gives the game a certain chaotic feel I thought was fitting. Also, rather than a tile suddenly appearing, the color grows quickly from the center of the tile.
  6. I added a white square showing the last tile placed by each player, since it’s easy to forget.

Sound/Audio

  1. I added background music which had a retro feel to match with the visuals, and a high-energy feel to make the game more exciting.
  2. I added sounds corresponding to winning or loosing a game.
  3. I added a sound signifying that the user tried to place a tile at an illegal location.
  4. I added a sound for when the tiles fall into place at the beginning of each level.
  5. For each tile appearing as part of the expansion process, I play a chime-like sound that gradually increases pitch.

For the app preview video, I found another high-energy song which I really liked so I used that instead of the game’s actual music. I also shut off the sound effects since I thought they would be distracting. But the visuals are all intact, so if you are interested you can check out the app preview video here.

Advertisements

One thought on “Mobile game development: putting finishing touches on visuals and sound

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s