Making an Idle Game Pt V

Blog23.jpg

This is part 5 of a series of posts of making an idle game. See Part 1, Part 2Part 3 and Part 4 here.

The Main Menu

Blog20_1.png
Best looking menu ever!

As the game drew close to being published, I was looking up another game called Enchanted Cave, and then looking at my game, Idle Heroes. Suddenly, my friend said “Enchanted Heroes”, and I looked at the name and I went BINGO!

That was going to be this game’s official name. I was told that this game had an enchanted feel and this title fit well with the game.

Aside from a new game title, I wanted to redo the main menu at the same time.

I wasn’t quite sure that the new one was better. I felt that neither of them had the “wow factor” unlike the menu which I did for Introvert. But well, I didn’t spend as much time on the main menu for this game, and even less time was spent on my Tower Defense’s main menu.

There were other designs I had. How it works is that every time you enter the main menu, the background changes.

Blog57.png

It is actually pretty fun but not many people will notice this. I intend to only include two main menu variations in the final game.

I also re-designed the game icon. I wanted to show the hero character since the game primarily revolves around the heroes, but it seems pretty ordinary – I checked out the app store and a lot of icons are showing the hero’s face in the icon. I suppose that’s the trend I guess? I also focused more on the head in v2 based on feedback. Since the final app icon is going to be very small, adding lots of details (like the armor) into the icon will simply clutter it unnecessarily. As far as app icons go, it’s better to be as simple as possible.

The v2 icon looks less appealing when enlarged, but it works really well on phones whereas v1 could be modified and widened to be used as the game’s icon on the web where icon sizes are generally larger and wider.

EnchantedHeroesIcon_v1_Wide.png

Level 101+ Backgrounds

In most incremental games, when you reach the 100th zone, the area loops back to the first zone and reuses the same monsters and background graphics.

It does feel a bit weird to do that. But most games have good reason to do that. It’s not just that they don’t want to put in effort to draw the new areas, but when I actually considered having 20 different theme areas, I realized that there will always be a point where you will have to loop back and restart from the same area. This is especially true in an incremental game.

Having so many theme areas also means that the game’s size will be really huge. Is it really worth it?

I decided to loop back to the first area at Zone 101 and wrote a little note about it in the storyline – that the heroes actually traverse back to the first area. But instead of reusing the backgrounds, I had a stroke of luck and thought of something.

Introducing… the random background generator!

I wrote two simple lines of code that randomly generates the background graphic and platform. A swamp in space? A tree in a desert? You got it!

The results were pretty comical but the game does not have to be so serious. (Hey it is a game after all and having the heroes go to space and fight without oxygen in the first place is pretty unrealistic!)

Blog32.jpg

This made me feel like a lot could be done with a small amount of assets. The memory constraints of WebGL means that I can’t throw in as much art as I can into the game even if I wanted to. Your computer would need higher amount of memory to keep the game running. Maybe in some parts of game development, there will be times where you need to work smart to try and make things look refreshing while using little effort and not needing to add much to the game size.

The random background generator was just a test and I will not be using randomly generated backgrounds for Zones after 100. Instead, I will choose the ones that look really cool and put them in the game.

The good thing is that I can even apply certain colour tones to invoke a certain mood or theme.

Blog97.png

 A previously day scenery can turn into night. The possibilities were plenty. I can swap backgrounds and platforms in and out to see what combination fits.

Blog49.png
Or which combinations don’t…

However, I still retain consistency with the game’s area flow. The game has 10 theme areas and they follow a fixed order.

{“Grassland”, “Village”, “Jungle”, “Desert”, “Swamp”, “SnowyHill”, “Cave”, “Space”, “Candyland”, “FieryMountain”, “StarryDream”};

The 11th area, StarryDream is not actually an area. It’s just a codename for the hidden area called the Crossworld. It will never appear in the normal maps.

Sounds

Blog104.png

Sounds were not an intention to add in my game. I did want to add some skill sounds and some hit sounds when you use an attack skill but I decided not to do sounds in the end.

However as the game got close to publishing, I decided to add a few audio tracks. It started out with 3 basic sounds, then there were 5, and now there’s 10.

Blog105.png

I have an audio player class and any time I play sounds, it calls the Audio Player. The Audio Player has its own sound volume control. This is in case if in the future I want to add music, I can keep the music and sound volume controls separate. If this is not done early, it might become tedious to try and separate sound and music volume controls if you design the code poorly, an issue I faced in the past when I had left sounds all the way to the end of development.

Unlike in Introvert, I don’t have budget for sounds so I source for free ones. But free sounds do not always fit my game, so I use Audacity to try and tweak the sounds.

Blog106.png

I’m not a sounds person so I do really minor things. It’s really minor – it’s stuff like adjusting pitch or cutting off silence at the start of the tracks. (When you press a button or a skill, the sound has to play instantly. Most sounds I found have a few milliseconds delay which is very distracting and makes the game feel like it’s lagging).

I also soften sounds that are likely to be played repeatedly. For example, sounds that play when you tap the player or enemy will likely be playing many times a second and I had to soften them so they don’t overwhelm the player or drown out other sound effects.

It’s actually pretty addictive to add sounds into your game. You feel like everything would be better with sounds, but not all the time.

Sounds shouldn’t be added just for the sake of adding it. Sounds can be very important and helpful to your game.

Using sounds and animations to enhance your game

The sound in this game is very minimal. I use them to highlight important things. I noticed that players often don’t know when they have cleared a zone and can go to a higher one. They just keep farming the same zone over and over again!

The first thing I did was add an animation that appears when a zone is cleared.

ZoneClearedAnim (Legacy).gif

The issue is that this may become repetitive during ascensions, so I track two variables:

  1. Highest zone achieved in the current run
  2. Highest ever zone cleared (lifetime)

During ascensions, if you have cleared this particular zone in a previous ascension, the animation is 1.5x as fast, and NO SOUND is played. If you however, beat your old record, then the animation and sounds play as normal.

So if you had achieved a highest zone of 150, you won’t hear any sounds until you beat 150 and go to 151. This ensures that the effect of the sound and animation doesn’t become something that the player will ignore over time. (Having a lot of animations makes each animation have lesser weight on the player. The player will be like “oh,”. What I hope to make the player feel is “OH! I cleared it!” and this way, the player is able to distinguish clearly that he has beaten his previous record.

The animation has to be prominent enough since one cannot always rely on sound to provide feedback to the player (the game can be muted). I use sounds as additional enhancements on top of already existing effects.

ZoneClearedJiggle.gif

I later added a jiggling exclamation mark icon that appears over the ‘next zone’ button since it may not be clear that you can move on to the next area/zone when you are done with the current one.

The same can be said of the free gold mechanic. Every 60 seconds, you get some free gold and you can click on this button to collect it.

FreeGoldBar.gif

Previously, I noticed that my friend did not collect the free gold even when it reached its max stack. So I made the button flash when the bar is full.

 

FreeGoldFlashing.gif

And it also plays a sound (if you have sounds enabled, that’s a plus). The same rules apply on animation as with sounds – flooding your screen with animations will just overwhelm your audience with too much information.

Autosave

Early on in the game, I had added an autosave feature. Every 30 minutes, your current save file is duplicated and cloned and saved as an autosave file. This isn’t a very powerful safety feature or anything, but say if your computer suddenly shuts down without warning while the game is saving, it may corrupt or wipe the save file. However, chances are the auto save file will still be there to act as a backup to restore your progress to an earlier point in time.

Blog31.jpg
Restoring a savefile from the autosave

Losing save files seemed to always have been an issue in the game. But if you wipe your cookies or do anything that would wipe out the save files, then the auto save will not help. It’s purpose is to save you from crashes or the like.

Offline Progress Fix

Blog25.jpg
An early game screenshot of the offline progress panel

On a side note, I also found a potential tiny bug in the offline progress. This is more for mobile devices where the game can be paused. How offline progress works is that when the game is saved, it stores a time stamp. For example, last saved at 7.30PM. If it saves every 5 minutes, the next time it will save is likely 7.35PM.

If the game is minimized on mobile, onApplicationPause() is called. So if you paused the game at 7.32PM, and come back at 7.34PM, you should have gained 2 minutes worth of offline progress.

But I did not put a timestamp when the game is paused. So when you come back at 7.34PM,the game assumes 7.30PM was the last time saved, so it gives you 7.34PM – 7.30PM = 4 minutes of offline progress.

OfflineBug.gif

I basically just added a time stamp whenever onApplicationPause is called so you correctly gain the same amount of rewards equal to the duration spent offline.

What’s next?

I suppose I will want to focus on uploading the game soon, perhaps making it compatible with both WebGL and WebPlayer and perhaps adding some basic analytics / API so I can see how players are playing the game, which can be cool to see. It also has a practical use – to identify any potential problems with the game.

That’s all for now!

Advertisements

2 thoughts on “Making an Idle Game Pt V

  1. Leo June 4, 2016 / 2:36 am

    Hey Dev, I just started playing Enchanted Heroes and I’m loving it. Only problem is, I need to know where the save file backup is saved, as some people here living with me just love clearing the browser’s cookies. I searched but I didn’t find that info anywhere, if you can, please tell me where it is. Thanks.

    Like

    • yyz291 June 4, 2016 / 10:15 am

      Hi! The savefile is stored as PlayerPrefs using the browser’s IndexedDB API. There is no simple straight forward way to retrieve it easily and it can be confusing to do so, but I will be adding a local cloud save so that you can save your save file to the cloud, and load it from there when needed. This is currently my top priority task.

      Like

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 )

Google photo

You are commenting using your Google 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 )

Connecting to %s