The Story of ‘Introvert’

If you want to know what went on Behind the Scenes of how I started off making this game, feel free to read on.

A long time has passed since I started development on a game called Introvert, or what I call ‘Project ITV’. Introvert is a story-driven platformer flash game and is my very FIRST game.

Menu Oldest

The first menu screen I made for the game. Remember how it looks, because you’ll see how it is transformed later on.

I remember the first day I set out to make this game, it took me 8 hours just to make a square move with the arrow keys. I remember how my first few lines of code endlessly returned errors. I was just starting out Flash and it was really, really tough, especially when I am more of an artist than a programmer. Those were the times where I spent hours figuring out how to make a simple thing work. Don’t even talk about a main menu. Getting the cursor to show was already a problem for me. You never know how hard it is to make a game till you actually try to make one.

But I never gave up.

I started learning ActionScript, a totally new language, in a totally new world of Flash, using a totally new engine called Flixel, with a totally new IDE (FlashDevelop). Ultimately, I think it was my passion that fueled me, because within three weeks, I had my game prototype. I had a controllable player (yellow square) that could walk and jump, enemies that had some basic AI. I even coded some puzzle elements like keys that could open passages, doors that could teleport you and buttons that activate elevators. There were levels, a level selection, a menu. I was excited. I had actually created a game! My first game!

itv1Yes, that red square is your character. Just imagine your happy face on it.

And then came the massive jump. At that time, I was still using Paint to draw my art. I had been using Paint for years that I had sort of become a master at it, and it became a problem for me because it had become my comfort zone, and I was unwilling to part with it. I didn’t want to learn anything else.

portal3ll

An animated swirling portal drawn in Paint

grass tiles transformation2

Paint for the win

For a long time, I was using Paint to draw my my tiles, objects, portals. I even “hacked” transparency. Because Paint doesn’t support transparency, all my sprites had a background colour to simulate transparency. That was until I bought the Adobe Package, and with it, came Adobe Photoshop. I didn’t like Photoshop. Too complex, I said. I could draw the same thing in Paint twice as fast. But my friend told me to give it a try, and so reluctantly, I did. And then…miracles happened.

I found myself drawing better quality art. I drew clouds, hills, flowers, and before I knew it, I had beautiful backgrounds for the game! Suddenly, Introvert had become something more than just squares jumping on other squares.

IntrovertChanges

The menu on the left was drawn in Paint. Do you believe it? I made the buttons and gradient with Microsoft Powerpoint.

Lots of things changed, and not just the Main Menu, I mean… really A LOT of things. It was like a brand new game altogether. I could’ve released the first one there and then. It would have been a really awesome first game since it had everything I wanted. I know this isn’t an inspirational story, but had I stuck to using Paint, I would not have learned to improve myself and push my limits. So the first lesson I learned? #1: Get out of your comfort zone

turtle_walk

Wait…you’re wondering how the turtles got into this game?

While my original idea for the game was a story about two squares, my friend who tested my game said that an actual character would inject much more life into the game. So I replaced the square with a character.

itv3

Say goodbye, squares…

But guess what, I really sucked at animating. You know, thinking back, that was my first time animating anything by modifying actual pixels. My walking animation looked like a guy with legs swaying lifelessly back and forth as though dangling helplessly from the air. And when i started to draw the female character, it was worse. She looked really awkward. She first looked like an old auntie.

girl32px(old)

girl20px(old)I know the bottom character looks a bit small, but trust me, you don’t want to enlarge her / it.

Notice how there are two spritesheets, one is 20px in height and the other is 32px in height. This is because a unique mechanic in the game is how you can grow real time during a level. I think this is one thing unique about this game that playtesters praised. There were many problems that using a square solved. Now, as your character grows, he can be distorted and at a huge size, looking very pixelated.  It was a headache to solve these issues because very few other bitmap games have this mechanic and you have to sort of find a good way to scale the character and have it look good, and then there comes the problem of how the character looks so small at the start that I had to research into how to maximize pixel usage. I think some pixel artists would be familiar with a technique called selective outlining. God, as if handling the code wasn’t hard enough. Now, the art? I was about to find out a lot about what goes into developing a game.

20150326_201755

Also includes spending hours on level design

Of course, I soon learned that level design would take me far much more time than I expected. There were a few flaws in the way I placed text that tell the story. I had to remove some levels because they were pointless and caused players to lose track of the story progression. I conceptualized many levels and put the best ones in. Certain puzzle elements had to be removed in the process. One cool idea I had were “magnets” which could attract metal platforms to you, but it was scrapped. “There were some levels that were praised in the way they were designed, mostly with how they help to tell the game’s story in a creative way, and I feel motivated when I receive such positive comments.

As time passed, I began to wrap up the game, but not before adding 10 bonus levels with a secret extended storyline. I personally like the art for the final few levels. It’s like the game rewards you with better art the longer you play.

MelancholiaLevel

Featuring a new theme, as well as the first area to implement rain, and tons of new puzzle mechanics

Took me a couple of weeks to code and perfect all that, but I made it. This was back when I was still studying in polytechnic. While most people are out partying during their holidays, I spent pretty much most of my holidays at home developing this game, which I kept very low-profile, showing it to only a small handful of people. Even still, most of them only saw the game in its early, 3-week ‘infancy’ state. It was a rush with time, because in a few months I would be enlisted into National Service, which would make it hard for me to get any work done.

Before I was enlisted into National Service, two really amazing things happened.

fgl_license

DVGMusic

With the game nearing its ‘publishable’ status, I uploaded my game to FGL, hoping to get a sponsor for my game. I was very confident when I sent my game for review. But when my game was reviewed, I was in for a disappointment. One thing you have to realize is that when you upload your game to FGL, you are competing with the entire flash game industry. It’s not just about you any more, it’s about competing with games made by other, more experienced developers. People from all around the world upload their games there. I wasn’t just up against some classmates or developers in Singapore, I was actually experiencing first hand what the game industry was like, and boy it’s a big world out there. My game got an average score of 6/10 for the art, design and other factors. But the sound scored 3/10. The sounds fared the worst. I had sourced out free sounds and apparently, they were terrible.

After I got back to my feet, I thought long and hard about what to do. I decided to contact DVGMusic. I remember being so nervous about it because I really wanted his help. I spoke to David Carney, the CEO of DVGMusic. He was unwilling at first, but I eventually decided to take some risks. I ultimately managed to persuade him successfully! He was a really experienced sound designer and had lots of experience in the game industry, so much that he suggested a couple of things to improve the game’s design and even its art aspect.

I remember how I was staying up late, past 3am in the morning just to discuss with him because he’s from the U.S, so our timezones are vastly different. The time I go to sleep is literally the time he wakes up. We communicate via Skype and during the day, he’s usually offline. He’s a nice guy and he even made a video on his progress of music on Introvert !

I get really jumpy and excited every time he has a new soundtrack ready for me. In fact, I was so pumped up that he had to remind me that I had hired him to do all this.

I learned a lot of things from working with him. Once again, Introvert was about to undergo a major transformation.

ITV_VersionControl

The pictures above is brought to you by VersionControl. Notice the UI redesign as well.

menu Introvert

I demand a new main menu with each transformation!

editor(playing)

To be honest, Introvert was pretty much a learning journey for me. Starting out with Flash, Photoshop, and getting to work with DVGMusic on the sounds and music for the game was really awesome. The most fun and invigorating times were when I was working with him to actually push the game to greater heights.

I never imagined that Introvert would grow to become the game it is now.

The sad thing… is that sometimes I feel that’s what Introvert may merely be – a learning journey.

Eventually, I was enlisted into National Service, which physically and emotionally drained me. To keep my motivation up, I sometimes sketched story scenes when I was not at home and digitalized them when I got home.

378a6-introvert_story_simplelifet1

Story27_Big

Here’s an apple. I specially gave you the one with a worm in it.

I also started drawing these story scenes, to add value to the game. However, my testers had mixed feelings about them.

itv10

Story scene drafts I drew… on my phone, just because I can

Progress started to crawl and in my absence, David began to move on. While I was serving National Service, I lost motivation many times, but one very good thing happened. I invested in a drawing tablet some time after completion of my BMT (Basic Military Training). Together with the shipping fees, it really cost me a bomb.

wacom

Tada! Drawing will never be the same again.

And indeed, drawing art assets had never been easier, faster, more efficient. Here’s a look at my new workplace.

comp setup

YYZ’s studio

Not to mention I now have three monitors. One for coding, one for drawing, and the last one for playing Cookie Clicker.

Talk about multi-tasking, my tablet again took me to a higher level.

Everytime6Compilation

So…you’re asking why I drew the same picture 5 times in different mediums? I have no idea either.

I began to develop my own drawing style with the WACOM.

GardenTilesBigInProgress

As if the tiles weren’t awesome enough already…

Level 32

The other great advantage of having a WACOM is that I was able to draw more realistic looking turtle expressions and animations. The pen tool in Photoshop doesn’t really flow naturally with how I usually draw turtles with my free hand, so my turtles sometimes look very rigid. This is hardly the case with a drawing tablet.

jumpSequence

Tracing a jump sequence animation with my WACOM

Because I began to develop my own drawing style, I began to draw some new art. One of the most significant ones is a level in the game called ‘Scenic Forest’. It is one of the most complex and detailed levels in the game visuals wise. The background is more detailed than all other levels and has up to 5 layers of parallax scrolling whereas most levels only have 3 or 4.

ScenicForestG1old

A compressed Scenic Forest foreground layer

Sometimes, I would get inspired on the nights I stay in camp and I would draw whatever comes to mind. Some of my best levels actually form when I sit alone and just dream about the possibilities of level designs for the game. Because I have no access to a computer, I get a lot of time to actually think about things that never cross my mind when I am too busy coding or drawing at home to think about new designs. Some of my ideas stretch my programming capabilities, but the end results often make it worthwhile.

LevelDesign1

Example of a level design concept which made it into the final game

Most of my newer levels are designed to have something happen at some point. The particular level above has some special effects that are triggered when you walk to certain areas. These levels can take an entire day to make if they include custom level art. Many of my old levels don’t have these kind of special events, so if you play the game, it is actually quite easy to tell which levels were the ones that are newly created.

One of my favourite special effects is when you are controlling the girl, looking at a picture of the boy on the wall and suddenly, he becomes controllable and you switch to him, literally “jumping” out of a picture and the scene transitions to a totally different level.

ezgif.com-video-to-gif (1)

Over time, I had begun to update many of my art assets, such as the environmental decorations in the map:

CaveBG2

And being my ambitious self, a secret world map made its way into the game, comprising of all the key areas of the game.

WorldMapProgress10

editor(edit mode)

Of course, in every game, there are bound to be some things that are not very fun to do. Take a look at this neat Level Editor I programmed. Well, if you find out how many hours of sleep I lost to it, you’d probably drop all thoughts of making a game. The good thing is that, I am able to partially export my edited levels, which makes it easier to create my own new levels, which is really just pretty cool. I’m probably going to work on making these levels fully exportable, so players can share it with their friends. To do that, I’ll probably have to use a string of arrays containing an array of arrays. Doesn’t sound too complex, right?

arrayOfArraysOfPointsOfBlocks

Yup. Pretty sure it’s simple enough that I would not need to make a picture to remind myself what my code does

The Story

StarryMoonThe reason why I want to make Introvert is because of the story that drives it. I was very sure that this would not be just a regular platformer. There are tons of those out there. I want to make a game that will bring you through a story and hopefully, one that is relatable. But by now, I have realized that even a story can be very difficult to write and tell. After looking at the game, I know definitely there’s a better way to execute the story, and if there’s an Introvert 2, I’m pretty sure it’s something I will definitely improve on. But thinking of a sequel is way too far fetched for now.

The truth is that I let the game drag too far past its “ripe” period that I began to lose motivation to finish it. I don’t have as much excitement as I used to and returning to work on such an old project isn’t quite as refreshing as working on a new one, which is why I started to work on other projects like an unnamed Space Shooter game, and OldStory.

The other issue is the unfinished sounds and music for the game, which really is a bummer because I was looking forward to hearing them completed.

But I guess, I’ll have to find a way somehow, to wrap up and finish this project, and hopefully, one day, I will publish this game.

Introvert.

My very first game.

PerfectSolitudeLogo

The End.

Introvert_Story_SimpleLife

Finally! Found a screenshot of the game that has no moon in it *sarcastic*

Advertisements

2 thoughts on “The Story of ‘Introvert’

  1. sos (stalker mode -on-) April 13, 2015 / 6:32 pm

    It’s really nice to know you’re still pursuing your dream! Can’t believe you actually invest in a Cintiq! It can do much much more. Hope you’ll do well in gaming industry. Hmm, ya, you will. Can see so so so so much effort from all these. Admire heh heh. Keep it up!!! Even though it’s irrelevant for you but just wanna let you know, thanks continuing your path.

    Like

    • yyz291 April 14, 2015 / 10:40 am

      Wow, I didn’t expect anyone to find my site…thanks so much for the awesome encouragement sos! Hope you’re doing well too, we should really have a nice chat ^^

      Like

Leave a Reply to yyz291 Cancel 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