21 October 2012
I gave the latest version of the game to Li Hao to try and I took note of the really good comments he gave from his observations of what I added recently.
- Jumping sound is not synchronized with the player (we decided it was best to remove the sound altogether after analyzing several games - the problem is that the character has many animation frames and it would require a very proper sound to match the frames, plus a sound is needed for when the player touches the ground which complicates things)
- Trees in foreground should not move (they move because I attempted to do a 3D parallax scrolling effect in which objects in the foreground move faster than those in the background, but failed to create a very good visual effect. Thus I have removed it.)
- It would be nice if the turtle speaks more (the speech bubbles currently use the same text)
- Forest level rocks do not fit with the game style (hmm, maybe I should remove the rocks? But what can I use to decorate the soil?)
- Enemy growling sounds are funny, but gets annoying after a few times (I tweaked it eventually so enemies only growl once in their lifetime - at the moment the enemy's aggro is triggered)
- Levels with high zoom are irritating sometimes. (Fix zoom levels ASAP!)
- Li Hao said he really like the door sound effects (I was really pleased to hear this)
- Decorations make levels a lot better (this made me really happy too!)
- Pressing UP key at Elevator contradicts with game's standard pressing DOWN key to use portals (this has just been corrected)
Also, not a comment he made, but there was a flaw with my bonus level where the turtle collects a picture. If the turtle dies directly after collecting the picture, the bonus level is reset and the picture disappears. It is not a bug but is something I don't want to happen, so I prevented the player from falling off edges and dying on that bonus level.
Every time he gives me comments, I have a lot to tweak, but I am really thankful and happy for these comments! I really need more comments and testers to find flaws in the game that need tweaking if I want this game to work out well.
It's very important to constantly seek opinions and comments to make adjustments to whatever flaws exist and remove them early, rather than keep adding stuff excitedly and realizing at the end that there is a big list of things that need to be fixed and corrected. Now that would be really demotivating.
20 October 2012
Today is quite an exciting day! At the end of the day, I have finally managed to create a working slider that affects the zoom of the game. By sliding the bar to the left, the game is at 1x zoom. When it is moved to the right, it slowly increases to 4x zoom!
I actually opened one of my long notepad documents and played around with their slider to figure out how Microsoft actually did their sliders, because I was experiencing some problems with my slider's functionality. My slider required precise movement of the mouse, and when the mosue moves too fast, the slider is unable to catch up and stops following the mouse.
Another one of the other problems was that the coordinates of the mouse is constantly changing with the different zoom levels. When Flixel zooms, it zooms from the middle. So the origin at the top left isn't (0, 0) anymore. The x and y become negative. And the slider depends on the mouse's coordinates.
I managed to fix the issues, so the slider isn't so restrictive. It works absolutely brilliantly now! I also fixed a bug with my elevator animations not playing properly. Today was pretty much fixing areas in the game which were problematic. I learnt quite a fair bit today.
Project ITV
Sunday, October 21, 2012
Saturday, October 20, 2012
Backgrounds
Saturday, 20 October 2012 - Backgrounds
I've been working on the LevelEditor today. I managed to get the save feature finalized, but the problem lies with exporting the level in the editor into a real working and playable level.
I also spent a lot of time today creating a building level. It is a very tall map with moving, slanted platforms. It is really cool in action.
I also drew three new backgrounds recently.
1) Factory background
2) Tall Building background
3) Night City Background (tall version)
I also added decorations and special effects onto one of the bonus levels - the rooftop. When the player reaches the rooftop, there is a spot on the map that glows. When approached, it triggers a picture to appear. Some effects are accompanied with the picture. I've tested it repeatedly and it works great.
That's all for the progress for yesterday and today.
Oh, I drew a popup too:
This is a draft popup that may or may not be added to the game. Right now, pushing the ESC key during a level returns the player to the Level Selection screen without any prompts.
I most likely am not doing a pause state, since the game does not need one. But a popupconfirmation before returning to the level selection screen might be useful.
I've been working on the LevelEditor today. I managed to get the save feature finalized, but the problem lies with exporting the level in the editor into a real working and playable level.
I also spent a lot of time today creating a building level. It is a very tall map with moving, slanted platforms. It is really cool in action.
I also drew three new backgrounds recently.
1) Factory background
2) Tall Building background
3) Night City Background (tall version)
Images above are scaled to fit this window.
I also added decorations and special effects onto one of the bonus levels - the rooftop. When the player reaches the rooftop, there is a spot on the map that glows. When approached, it triggers a picture to appear. Some effects are accompanied with the picture. I've tested it repeatedly and it works great.
That's all for the progress for yesterday and today.
Oh, I drew a popup too:
I most likely am not doing a pause state, since the game does not need one. But a popupconfirmation before returning to the level selection screen might be useful.
Thursday, October 18, 2012
Week 6 of Introvert
18 October 2012
I have been working on a few things recently. Some of the new features I have added into the game are really exciting!
Decorations
Decorations seemed like a really fun thing to do at first. I created a file with all my separate, individual decorations. And then I open another file with screenshots of my levels, and slowly copy and paste the decorations there.
Now, it seems like a simple job, but then it actually needs quite some work. I need to use adjust and place each decoration of a level properly - to make sure they aren't floating above the ground, and to make sure they are attached properly. I have two layers of decorations - a foreground layer that covers the player, and a background layer that purely decorates the level.
Decorations was a matter of slowly placing the right things properly, at the right place. But other than that, I realised that I had to draw rocks too. Apart from placing decorations on platforms, there are LOTS of empty spaces INSIDE the platforms. The tiles themselves are pretty plain. I had to draw the rocks inside them to make sure the tiles looked good as well. I couldn't really get any inspiration for rocks, so I had to make do with what I could do.
I did this for a few levels, and very soon, I realised I needed more than a few days to finish up the decorations. Why? Because I had lots of levels. And I would have to decorate each level...one, by one, with each level containing three layers of decorations - the foreground deco, the background deco, and the rocks.
Oh man...this is the time when I seriously really want to ask some people for help.
I managed to decorate 20 levels in two days, including redrawing plenty of new decorations that really add value to the visuals on the levels. I really like the decorations.
Also, the tiles have been touched up slightly to remove unsightly areas.
New Feature: Speech Bubbles!
This is something I added today. I had been thinking about the logic behind this before I did it, so it was pretty simple and straightforward to do. The speechbubble looks like a single image, but it actually is made up of four sprites. I could use a single sprite, but I would not be able to change the length of my bubble smoothly. I can stretch it, but that would distort the edges, and it would look ugly. That was the first problem I had to tackle.
The speech bubble can have varying width. Thanks to Flixel's scale.x which I used for the center sprite, I can change the length of the speech bubble to anything I want. I just needed to calculate the coordinates of the origin of the speech bubble, and base the other sprites' coordinates off the origin.
The bottom sprite was quite tricky to do, because if the player were to go to the sides of the screen, the speech bubble has to stay within the screen, and the speech bubble has to look sensible. I made the fourth sprite detached from the speech bubble and made sure it was kept at a minimum of 2 pixels' length away from the player's head in either direction. If it got too close, it would flip and the coordinates would be recalculated to be on the other side.
After doing that, I found it really fun to play with the speech bubble and watching the triangle slide from left to right.
I also created a very simple function to make my life easier. In my design, I needed the speech bubbles to simulate a conversation. If I specified the speech bubble to hold more than one text, text on the bubble would change after a period of time, in the correct sequence I want it to be, and would disappear when the last text is shown. I also want to be able to control the duration of each text shown. I don't know if there is a better way to code it since I'm still quite new to this, but this was how I did it. I have a function called "addText".
public function addText(_text: String, _duration: int): void
{
textGroup.push(_text);
durationGroup.push(_duration);
}
In my speech bubble class, I had two arrays:
public var textGroup: Array;
public var durationGroup: Array;
They keep track of the text and their respective duration on which they stay in the speech bubble. Once the text is shown long enough, I access the next index and this goes on until all the text is shown, after which I close the speech bubble.
In my update, I put:
if (timer.finished)
{
if (textGroup[i] != null && durationGroup[i] != null)
{
text.text = textGroup[i]; //the text to display
timer.start(durationGroup[i]); //the duration the text is displayed
i++;
}
else
{
disappear();
}
}
I tested the speech bubbles and it works perfectly! I'm really glad I managed to get this feature done pretty quickly (within one day for a working speech bubble with customizable length is very satisfactory to me). I had some really scary thoughts of problems with this feature, but it went smoother than I expected.
UI Additions
I added two new buttons to the UI.
1 button toggles special lighting - simulate sun going behind clouds and darkens level at intervals
1 button restarts the level, as an alternative to pressing "R" on the keyboard.
New Maps
I created three new maps which I called bonus levels, which are actually extensions of the level selection lobby branching out. I love the decorations on one of the bonus levels. I spent many MANY hours doing the decorations for that level, which is actually just a level which players walk past. Not exactly the best thing to spend time on, but at least I had fun drawing.
Level Design
I took a look at one of my levels that was flawed by player feedback. The levels that introduce the new Door mechanism to players was vague.
I also dug through my papers and level sketches and started to plan the sequence of levels. I also created drew out the sketches of new level ideas I had when I was in my bed. I can't wait to implement them once I am done fixing all current issues in my never-ending to-do list.
Sound Effects
I also started sourcing for sound effects needed for the game. I found sounds for jumping, collecting friend, door opening and closing, button presses, enemy growling and achievement unlocking sounds.
I only managed to implement a few sounds in the game, and I realise some sounds don't really fit, so I have to do some editing or find other sounds.
What a busy holiday!
I have been working on a few things recently. Some of the new features I have added into the game are really exciting!
Decorations
Decorations seemed like a really fun thing to do at first. I created a file with all my separate, individual decorations. And then I open another file with screenshots of my levels, and slowly copy and paste the decorations there.
Now, it seems like a simple job, but then it actually needs quite some work. I need to use adjust and place each decoration of a level properly - to make sure they aren't floating above the ground, and to make sure they are attached properly. I have two layers of decorations - a foreground layer that covers the player, and a background layer that purely decorates the level.
Decorations was a matter of slowly placing the right things properly, at the right place. But other than that, I realised that I had to draw rocks too. Apart from placing decorations on platforms, there are LOTS of empty spaces INSIDE the platforms. The tiles themselves are pretty plain. I had to draw the rocks inside them to make sure the tiles looked good as well. I couldn't really get any inspiration for rocks, so I had to make do with what I could do.
I did this for a few levels, and very soon, I realised I needed more than a few days to finish up the decorations. Why? Because I had lots of levels. And I would have to decorate each level...one, by one, with each level containing three layers of decorations - the foreground deco, the background deco, and the rocks.
Oh man...this is the time when I seriously really want to ask some people for help.
I managed to decorate 20 levels in two days, including redrawing plenty of new decorations that really add value to the visuals on the levels. I really like the decorations.
Also, the tiles have been touched up slightly to remove unsightly areas.
New Feature: Speech Bubbles!
This is something I added today. I had been thinking about the logic behind this before I did it, so it was pretty simple and straightforward to do. The speechbubble looks like a single image, but it actually is made up of four sprites. I could use a single sprite, but I would not be able to change the length of my bubble smoothly. I can stretch it, but that would distort the edges, and it would look ugly. That was the first problem I had to tackle.
The speech bubble can have varying width. Thanks to Flixel's scale.x which I used for the center sprite, I can change the length of the speech bubble to anything I want. I just needed to calculate the coordinates of the origin of the speech bubble, and base the other sprites' coordinates off the origin.
The bottom sprite was quite tricky to do, because if the player were to go to the sides of the screen, the speech bubble has to stay within the screen, and the speech bubble has to look sensible. I made the fourth sprite detached from the speech bubble and made sure it was kept at a minimum of 2 pixels' length away from the player's head in either direction. If it got too close, it would flip and the coordinates would be recalculated to be on the other side.
After doing that, I found it really fun to play with the speech bubble and watching the triangle slide from left to right.
I also created a very simple function to make my life easier. In my design, I needed the speech bubbles to simulate a conversation. If I specified the speech bubble to hold more than one text, text on the bubble would change after a period of time, in the correct sequence I want it to be, and would disappear when the last text is shown. I also want to be able to control the duration of each text shown. I don't know if there is a better way to code it since I'm still quite new to this, but this was how I did it. I have a function called "addText".
public function addText(_text: String, _duration: int): void
{
textGroup.push(_text);
durationGroup.push(_duration);
}
In my speech bubble class, I had two arrays:
public var textGroup: Array;
public var durationGroup: Array;
They keep track of the text and their respective duration on which they stay in the speech bubble. Once the text is shown long enough, I access the next index and this goes on until all the text is shown, after which I close the speech bubble.
In my update, I put:
if (timer.finished)
{
if (textGroup[i] != null && durationGroup[i] != null)
{
text.text = textGroup[i]; //the text to display
timer.start(durationGroup[i]); //the duration the text is displayed
i++;
}
else
{
disappear();
}
}
I tested the speech bubbles and it works perfectly! I'm really glad I managed to get this feature done pretty quickly (within one day for a working speech bubble with customizable length is very satisfactory to me). I had some really scary thoughts of problems with this feature, but it went smoother than I expected.
UI Additions
I added two new buttons to the UI.
1 button toggles special lighting - simulate sun going behind clouds and darkens level at intervals
1 button restarts the level, as an alternative to pressing "R" on the keyboard.
New Maps
I created three new maps which I called bonus levels, which are actually extensions of the level selection lobby branching out. I love the decorations on one of the bonus levels. I spent many MANY hours doing the decorations for that level, which is actually just a level which players walk past. Not exactly the best thing to spend time on, but at least I had fun drawing.
Level Design
I took a look at one of my levels that was flawed by player feedback. The levels that introduce the new Door mechanism to players was vague.
I also dug through my papers and level sketches and started to plan the sequence of levels. I also created drew out the sketches of new level ideas I had when I was in my bed. I can't wait to implement them once I am done fixing all current issues in my never-ending to-do list.
Sound Effects
I also started sourcing for sound effects needed for the game. I found sounds for jumping, collecting friend, door opening and closing, button presses, enemy growling and achievement unlocking sounds.
I only managed to implement a few sounds in the game, and I realise some sounds don't really fit, so I have to do some editing or find other sounds.
What a busy holiday!
Saturday, October 13, 2012
Blend Modes?
13 October 2012 - Blend Modes?
I added some stuff over the past two days, namely the addition of blending modes and an attempt at dynamic lighting.
I added some sun beams that are on the front most layer. I have three layers in the game now.
The top layer being sunbeams and some decorations that pop out of the platforms.
The second layer being the layer with all the platforms and most ordinary decorations and props.
The background layer which consists of the background. Flixel, the engine used, has something called scrollFactor which I found to be very incredible. I set the background's scrollFactor to 0.5 so the background moves with the character, but at a slower rate. Previously, the background was just stuck there as a static, immovable picture. Now it has a cool scrolling effect that makes the game look like it has depth.
Unfortunately, I think the overlay mode needs tweaking since it does not seem to look very fantastic. If I can't get it work, it might have to be removed. I added an invert mode for fun. Might add it to the final version as an additional achievement reward.
I added some stuff over the past two days, namely the addition of blending modes and an attempt at dynamic lighting.
Normal Mode (with Rays of sunshine)
Overlay Mode (Sun behind clouds)
I added some sun beams that are on the front most layer. I have three layers in the game now.
The top layer being sunbeams and some decorations that pop out of the platforms.
The second layer being the layer with all the platforms and most ordinary decorations and props.
The background layer which consists of the background. Flixel, the engine used, has something called scrollFactor which I found to be very incredible. I set the background's scrollFactor to 0.5 so the background moves with the character, but at a slower rate. Previously, the background was just stuck there as a static, immovable picture. Now it has a cool scrolling effect that makes the game look like it has depth.
Unfortunately, I think the overlay mode needs tweaking since it does not seem to look very fantastic. If I can't get it work, it might have to be removed. I added an invert mode for fun. Might add it to the final version as an additional achievement reward.
Invert Mode
Thursday, October 11, 2012
Turtle Animations Renewed
11 October 2012 - Turtle Animations Renewed
Renewed Turtle Animation
With the recent zoom feature, I realised it was very easy to zoom in onto the turtle and see it larger. So I decided to work on improving the animation frames further. Other than the walking animation that needed improvement, the rest seemed fine, so I just redrew the walking frames. I also improved the idle frames slightly, altering a few pixels that seemed out of place. This change was done across the 10x20 px and 16x32 px version of the turtle, so both walk animations look very great now. They also play at 9 frames per second compared to the old 4 frames per second, so it looks fantastic now.
I also added a new bonus animation that plays only on certain levels. This bonus animation has many frames (and lasts a little longer than the other animations), so it has to be quite unique. It's sort of like an extended idle animation that "replaces" the old idle animation. This is used for later levels, if I do get a chance to add them.
Zoom and UI Fix Progress?
The biggest problem I face now would probably be getting the UI to show up on the screen and not move with the camera. I've been working on that today with no promising results.
Difficulty Modes
I started implementing difficulty modes today, along with the buttons to select them. The difficulty modes are also "saved" so it will stay on the difficulty the game was last set as even after entering, and leaving the levels. For now, the difficulty modes are at the bottom.
Slopes
Lastly, I also added slopes (platforms) into the game. The levels are made up entirely of tiles. I just created a new test level to test the new slope that I'm adding into the game. But I am going to make the test level an actual bonus level.
Renewed Turtle Animation
With the recent zoom feature, I realised it was very easy to zoom in onto the turtle and see it larger. So I decided to work on improving the animation frames further. Other than the walking animation that needed improvement, the rest seemed fine, so I just redrew the walking frames. I also improved the idle frames slightly, altering a few pixels that seemed out of place. This change was done across the 10x20 px and 16x32 px version of the turtle, so both walk animations look very great now. They also play at 9 frames per second compared to the old 4 frames per second, so it looks fantastic now.
I also added a new bonus animation that plays only on certain levels. This bonus animation has many frames (and lasts a little longer than the other animations), so it has to be quite unique. It's sort of like an extended idle animation that "replaces" the old idle animation. This is used for later levels, if I do get a chance to add them.
Zoom and UI Fix Progress?
The biggest problem I face now would probably be getting the UI to show up on the screen and not move with the camera. I've been working on that today with no promising results.
Difficulty Modes
I started implementing difficulty modes today, along with the buttons to select them. The difficulty modes are also "saved" so it will stay on the difficulty the game was last set as even after entering, and leaving the levels. For now, the difficulty modes are at the bottom.
The level selection lobby does look quite squeezy now with the recent additions. I might really have to create a camera for the lobby and extend the level more than 480 pixels in height. That's something I've not done yet, and I'll have to figure out how if I intend to add more stuff here.
Slopes
Lastly, I also added slopes (platforms) into the game. The levels are made up entirely of tiles. I just created a new test level to test the new slope that I'm adding into the game. But I am going to make the test level an actual bonus level.
Wednesday, October 10, 2012
More Graphics Improvements & Revamps
10 October 2012 - More Graphics Improvements & Revamps
Decorations restarted
I took a look at some of my decorations and utterly feel like redo-ing them. They don't look up to standard sadly. I am back to square one, and am considering not to use bitmap graphics. But doing that means I have to redo all my current tiles and platforms, something which I tried to do a few days ago, but had no luck with.
So today I started by redrawing the trees, but I have not updated the levels with the new decorations.
Elevator Doors Improved
I also improved the elevator doors. Having revamped the portals a week ago, the old elevator doors needed to be improved to match up to the increased quality of the revamped portal graphics. I also added a tiny buttons panel next to the elevator doors just for additional details.
The game has undergone quite a lot of graphical changes. I remember the old portals used to be circular.
I will also create an animation for the elevator doors to slide open and close when the character uses them. This is a bit tricky to do since it takes time for the elevator doors to open, but there is no delay for the player to use the elevator. So the doors have to open really fast or else it will look like the player is entering an elevator with closed doors.
Edit: I have now done the opening and closing animations and they are somewhat functional with a bug that I am trying to resolve. The bug is that the elevator doors repeatedly loop and play the "open" animation whenever I'm standing on it. It's supposed to open once and stay open while I am standing on its area. I remember encountering this bug when I first created the brown doors in the levels.
Bonus Areas
I added a bonus area in the game. It's a secret area that can be accessed through the basement and has a certain requirement to enter. The secret area can only be accessed once though. This secret passageway links the level selection lobby and the basement together. I added a key and some blocks to the level selection area as well. Oh, there is also a dimensional portal in the new Level Selection lobby as well! It is a very interesting portal.
Decorations restarted
I took a look at some of my decorations and utterly feel like redo-ing them. They don't look up to standard sadly. I am back to square one, and am considering not to use bitmap graphics. But doing that means I have to redo all my current tiles and platforms, something which I tried to do a few days ago, but had no luck with.
So today I started by redrawing the trees, but I have not updated the levels with the new decorations.
Elevator Doors Improved
I also improved the elevator doors. Having revamped the portals a week ago, the old elevator doors needed to be improved to match up to the increased quality of the revamped portal graphics. I also added a tiny buttons panel next to the elevator doors just for additional details.
I will also create an animation for the elevator doors to slide open and close when the character uses them. This is a bit tricky to do since it takes time for the elevator doors to open, but there is no delay for the player to use the elevator. So the doors have to open really fast or else it will look like the player is entering an elevator with closed doors.
Edit: I have now done the opening and closing animations and they are somewhat functional with a bug that I am trying to resolve. The bug is that the elevator doors repeatedly loop and play the "open" animation whenever I'm standing on it. It's supposed to open once and stay open while I am standing on its area. I remember encountering this bug when I first created the brown doors in the levels.
Bonus Areas
I added a bonus area in the game. It's a secret area that can be accessed through the basement and has a certain requirement to enter. The secret area can only be accessed once though. This secret passageway links the level selection lobby and the basement together. I added a key and some blocks to the level selection area as well. Oh, there is also a dimensional portal in the new Level Selection lobby as well! It is a very interesting portal.
Tuesday, October 9, 2012
Achievements, New Tiles
Friday, 5 October 2012
It is already Friday. Time flies. Another week of development is about to pass. This is the fourth week by the way. I didn't write a post yesterday as I was simply too busy. But I will now cover what I've done for the past two days.
Main Menu Touch Ups
I went to redraw many elements of the background of the main menu. The log, the turtle and the box all do not have the pixelated black outlines which came with them when I drew them in Paint. I redrew the entire log and turtle. I also went to redraw the moon, even though it was still okay, I just redid it since most of the things drawn in Paint were redrawn. I also replaced the sky with new colours. The old night sky was too bluish. The brighter colours now give it sunrise setting. I recoloured the buttons as well. Even though it was not as much work as redrawing the other assets, it was still quite troublesome.
In addition, I drew some silhouettes of trees and added them to the background as a final enhancement. The new menu looks a lot better.
Achievements
I added three achievements in the game. I also made the credits page and added a few special effects which are tied to one of the achievemnets in the game.
The basement is now the official achievements room (intended to be that way).
Today I did other things.
Fog of "War"???
In one of the maze-like levels, I darkened the level and the player can only see a certain radius around him. This was supposed to be simple, but I made it a bit more complex.
That particular level is a tricky level full of turns and twists. The zoom is high and the player cannot see far. However, the closer the player gets to the exit, the further the player can see. I made the sight radius around the player increase when the player reaches certain "checkpoints" of the maze. It is kind of cool. The sight radius eventually expands to double its initial length.
The cool thing I did was also to make the camera zoom out to let the player see the entire level when he has reached the exit. The black fog will also disappear. I found it really good to implement that.
New tiles
I also created new platform tiles to be used for the pink zones. They previously use the same tiles as the blue zones. I may switch the tiles the other way around though.
I spent A LOT of time trying to redo the old tiles. I was told that the old tiles needed to change (advised to). I spent lots of time looking at other platformer games, staring at their tiles and just seeing how they made it fit with the background and the feel of the game. It really wasn't easy trying to design the tiles. I didn't succeed in the end. I could draw tiles without much problems, but making them fit in the game, be coherent with the background and such is really difficult. It's not just drawing ability, it's also having the ability to make everything feel as one. And that's not easy for me.
Here's a screenshot of one of my tile outcomes. It will be scraped though because with the background behind it, they just don't match. There were other tiles I did but they simply aren't nice, so I am not going to show them here.
Summary
These few days I have been working more on polishing the game rather than adding stuff. I am wanting to complete the already existing features in the game and touch up the graphics.
It is already Friday. Time flies. Another week of development is about to pass. This is the fourth week by the way. I didn't write a post yesterday as I was simply too busy. But I will now cover what I've done for the past two days.
Main Menu Touch Ups
I went to redraw many elements of the background of the main menu. The log, the turtle and the box all do not have the pixelated black outlines which came with them when I drew them in Paint. I redrew the entire log and turtle. I also went to redraw the moon, even though it was still okay, I just redid it since most of the things drawn in Paint were redrawn. I also replaced the sky with new colours. The old night sky was too bluish. The brighter colours now give it sunrise setting. I recoloured the buttons as well. Even though it was not as much work as redrawing the other assets, it was still quite troublesome.
In addition, I drew some silhouettes of trees and added them to the background as a final enhancement. The new menu looks a lot better.
Achievements
I added three achievements in the game. I also made the credits page and added a few special effects which are tied to one of the achievemnets in the game.
The basement is now the official achievements room (intended to be that way).
Today I did other things.
Fog of "War"???
In one of the maze-like levels, I darkened the level and the player can only see a certain radius around him. This was supposed to be simple, but I made it a bit more complex.
That particular level is a tricky level full of turns and twists. The zoom is high and the player cannot see far. However, the closer the player gets to the exit, the further the player can see. I made the sight radius around the player increase when the player reaches certain "checkpoints" of the maze. It is kind of cool. The sight radius eventually expands to double its initial length.
The cool thing I did was also to make the camera zoom out to let the player see the entire level when he has reached the exit. The black fog will also disappear. I found it really good to implement that.
New tiles
I also created new platform tiles to be used for the pink zones. They previously use the same tiles as the blue zones. I may switch the tiles the other way around though.
I spent A LOT of time trying to redo the old tiles. I was told that the old tiles needed to change (advised to). I spent lots of time looking at other platformer games, staring at their tiles and just seeing how they made it fit with the background and the feel of the game. It really wasn't easy trying to design the tiles. I didn't succeed in the end. I could draw tiles without much problems, but making them fit in the game, be coherent with the background and such is really difficult. It's not just drawing ability, it's also having the ability to make everything feel as one. And that's not easy for me.
These few days I have been working more on polishing the game rather than adding stuff. I am wanting to complete the already existing features in the game and touch up the graphics.
Main Menu Transitions
Saturday, 6 October 2012 - Main Menu Transitions
Credits Page
When creating transitions from page to page, I think most people would probably do a motion tween. I suppose that is the most efficient and quickest way to create a transition. I'm not sure how to do it in games unfortunately. I thought of generating a spritesheet, but I do not know how to use Adobe Flash yet and that seems like a crazy way to do it to.
So, I coded the transition!
I have a camera man in my Main Menu. Yes, he literally is my cameraman. I code the game's camera to lock onto this camera man and follow him. The cameraMan is an invisible sprite at the center of the screen when the player doesn't click any of the three buttons. When a button is clicked, it triggers a particular action of the cameraMan. He has three actions.
The first action is run. He will run to the right, and the camera follows him running to the right. This is one of the simpler transitions.
The second action is fly. This is what I just coded. It is a bit complex and has some luck involved because I have to do lots of testing of values. I basically imagine the cameraman pretending to make a high jump. He squats (velocity drops), and then lungs into the air (acceleration upwards). Then when he reaches the top, I apply gravity (acceleration downward). Once he reaches the center of the new screen, I set his velocity to 0. Tada!
I didn't really name the third action. I coded this in the past. Basically it's a transition when the play presses Play. This is the coolest transition in my opinion. Haha.
The Main Menu is a very special menu, because it contains tiny secrets. You should check out the credits page and explore the Main Menu. The one in the credits page is pretty obvious for now though. I plan to make it a bit harder to find it. I already have an idea how to.
Credits Page
When creating transitions from page to page, I think most people would probably do a motion tween. I suppose that is the most efficient and quickest way to create a transition. I'm not sure how to do it in games unfortunately. I thought of generating a spritesheet, but I do not know how to use Adobe Flash yet and that seems like a crazy way to do it to.
So, I coded the transition!
I have a camera man in my Main Menu. Yes, he literally is my cameraman. I code the game's camera to lock onto this camera man and follow him. The cameraMan is an invisible sprite at the center of the screen when the player doesn't click any of the three buttons. When a button is clicked, it triggers a particular action of the cameraMan. He has three actions.
The first action is run. He will run to the right, and the camera follows him running to the right. This is one of the simpler transitions.
The second action is fly. This is what I just coded. It is a bit complex and has some luck involved because I have to do lots of testing of values. I basically imagine the cameraman pretending to make a high jump. He squats (velocity drops), and then lungs into the air (acceleration upwards). Then when he reaches the top, I apply gravity (acceleration downward). Once he reaches the center of the new screen, I set his velocity to 0. Tada!
I didn't really name the third action. I coded this in the past. Basically it's a transition when the play presses Play. This is the coolest transition in my opinion. Haha.
The Main Menu is a very special menu, because it contains tiny secrets. You should check out the credits page and explore the Main Menu. The one in the credits page is pretty obvious for now though. I plan to make it a bit harder to find it. I already have an idea how to.
Decorations!
Over the past week, I had been creating several decorations that I thought could be used to beautify and visually enhance the map so the platforms and tiles don't seem so monotonous.
These are some of the decorations that were created. The black line marks the 32 pixels in height. I made most short trees and bushes cap at a height of 32 pixels which is necessary because that is the width and height of one tile. Taller trees go up to 64 pixels and are two grids tall in height. All decorations adhere to the heights I set.
I placed the background behind so I can create decorations that more or less fit into the background. Or else I might end up getting something like this:
I was playing with the colours of the decorations. The decorations in the above screenshot has largely exaggerated colours. I got some pretty cool ideas along the way, such as a map with autumn when I adjusted the leaves to red. It was really fun playing with the colours while trying to match them to the background. There was also the problem of the decorations having insufficient contrast with the background, especially when everything is so green in this background.
The decorations were manually dragged in from a file containing all the decorations. I also need to tweak the decorations after testing the levels again in case the decorations are "floating" above the grass when I inspect them on a high zoom level.
I hope to improve the decorations if I have the time to.
Rocks
The latest new feature is the ability to throw rocks. Toward the end of the day, I decided to work on this feature. Rocks can now get rid of enemies, and destroy spikes. I also fixed a bug where the rocks were invisible (so basically enemies and spikes were disappearing for no reason before that). They can also destroy tiles! Bugs arose of course - with the wrong tiles being deleted, but I have managed to fix all the bugs in the feature surprisingly quickly.
I also generated a mini-game idea based on the ability to throw rocks. It is a very ambitious mini-game though, so I might end up not doing it.
Keys
I drew new frames for the key object in the game, effectively doubling the number of frames to make it look like they spin 360 degrees instead of the previous 180 degrees. They now spin more realistically than before.
Monday, October 8, 2012
More Achievements
Achievement Logos, Graphics
I drew new achievement logos today. I also added more achievements to the game and implemented the achievement logos into the game.
I also added a new glowing portal to the basement level, updated the friend graphics of the basement level (initially yellow squares), added the respective signboards for the achievements. I also created a new "level" accessible through the basement.
I went to redo a new achievement panel as popup, but I am uncertain of whether I am going to use it.
I spent a lot of today making the achievements and the achievements screen (the basement) work and functional. I also added new achievements to the game. There are a total of 6 achievements now.
Ideas!
Today, I generated three pretty crazy ideas. I don't know if I can integrate them into the game in time, but here are the ideas.
There will be a "secret level" in the level selection stage that can be accessible by looting a key that is in an enclosed area that seems unaccessible. However, this area can be accessed by another room. The secret level will be a very HUGE puzzle level with every element in the game - doors, keys, blocks, friends, enemies, growing. Basically it's the biggest ultimate level. The reward for completing this level will be the ability to pick up and throw rocks!
This feature will enhance the replayability factor of the game. The player can throw rocks which will kill enemies and destroy spikes! I find this a very cool addition. I did a bit of coding for the rocks (initially shooting bullets, but a gun is unethical). It is not fully functional.
Decorations
I started decorating the levels. This is so fun that it kept me awake for about another hour before I finally decided to start finishing my work to end the day.
Other Minor Additions
I went to tweak one of the starting levels. I realised that there was a chance that the player would get "stuck" in this level with nothing to do if they didn't follow the path (eg the player tries to be funny and intentionally avoids collecting friends to complete the level). I tweaked the level so there is a 0% chance to fail the level.
Problems...
This is bad. The achievement pop ups I drew don't seem to fit well in the game. And their size, though okay to me, is said to be too big in the game. For something that only appears 3-4 seconds, it is giving me such huge problems. I don't know how to rectify this.
The tiles have been a problem from the start too. They aren't good enough. But I have no idea how to improve them.
Sunday, October 7, 2012
UI, Achievements, New Tiles
Sunday, 7 October 2012 - UI, Achievements, New Tiles
UI
I began working on part of the UI. The UI is not fixed to the camera unfortunately. So when I zoom in, the UI will disappear! I have to fix it such that it is always at the top of my screen no matter whether I zoom in, move left or right. Most solutions online say to use scrollfactor. It works for games that have no zoom level. However, my game has multiple zoom levels. That makes it complicated and I cannot use scrollfactor. I can't find a solution online so I guess I have to come up with a formula to fix the coordinates of the UI.
I also drew a character selection UI. It shows up on the top right and is an indication to what character the player is controlling.
Indication Arrows (to draw attention to character's location)
I also added indication arrows that will appear above the selected character's head whenever the player switches characters. This was suggested to me many weeks ago, but I am already beginning to work on the UI now, so I decided it was time to add this feature in.
There is a bug now. The arrow will not disappear after showing the character's position.
New Tiles
I created two new awesome tiles! I really love the new tiles! I created a snow tile, which is actually a recoloring of the newest tile I created yesterday. I also created a dark, black tile. I put them in some new test levels and they looked really good. But if I do not intend to add new levels in this current game version, then those tiles might not have a chance to appear in this game =(
Still, they look really nice. I hope to create levels that use them, but I have lots of things to polish and touch up before I move onto the creation of new levels.
Achievements UI
I added a very cool achievements popup that will appear whenever an achievement is earned in the game! Sadly, it appears for a few seconds, but oh well it's meant to be like that. I also added a close button to close the achievement popup. The close button, ironically, does not work yet.
I also started to create the achievement logos. I've drawn two of them and they look very good so far.
Surfing for Background Music and Sound Effects
I started to look for suitable BGMs in the wee hours of the morning when it's all quiet. I knew it would not be an easy task. I have listened to 166 BGMs. And I am still listening now. Of these, I have picked less than 10, and a lot of them I've rated only 2/5 or 3/5 - which means they still might not be the BGMs I want in the game.
I also went to find some of the sounds that I need in the game. Although the game isn't close to completion yet, there are some sounds that I know will definitely be used in the game as I know there are areas in the game which are already fixed. (Well this is one advantage of working alone I guess, though there's probably 5 disadvantages for every 1 advantage).
End of Day Thoughts
I spent most of my day working on the UI and much of my morning listening non-stop to BGMs. It was kind of frustrating - sometimes I thought a BGM was suitable, and then suddenly it starts playing loud drum beats or sounds that were definitely not what I wanted. I can't skip to the middle because it's not buffered yet. Oh well.
I also wasted a lot of time today trying to fix the zoom bug, which I didn't manage to fix in the end. I got pretty restless and tired trying to fix that issue. Adding multiple zoom levels to the game is really a lot of work and killing me. What's worse is that the zoom level must now be designe to be able to be manually toggled by the player. I have to make sure everything works. This sure isn't easy =(
I am sleeping very late everyday and this is bad. I must try to sleep earlier. It's 8am now. Good night!
UI
I began working on part of the UI. The UI is not fixed to the camera unfortunately. So when I zoom in, the UI will disappear! I have to fix it such that it is always at the top of my screen no matter whether I zoom in, move left or right. Most solutions online say to use scrollfactor. It works for games that have no zoom level. However, my game has multiple zoom levels. That makes it complicated and I cannot use scrollfactor. I can't find a solution online so I guess I have to come up with a formula to fix the coordinates of the UI.
I also drew a character selection UI. It shows up on the top right and is an indication to what character the player is controlling.
Indication Arrows (to draw attention to character's location)
I also added indication arrows that will appear above the selected character's head whenever the player switches characters. This was suggested to me many weeks ago, but I am already beginning to work on the UI now, so I decided it was time to add this feature in.
There is a bug now. The arrow will not disappear after showing the character's position.
New Tiles
I created two new awesome tiles! I really love the new tiles! I created a snow tile, which is actually a recoloring of the newest tile I created yesterday. I also created a dark, black tile. I put them in some new test levels and they looked really good. But if I do not intend to add new levels in this current game version, then those tiles might not have a chance to appear in this game =(
Still, they look really nice. I hope to create levels that use them, but I have lots of things to polish and touch up before I move onto the creation of new levels.
Achievements UI
I added a very cool achievements popup that will appear whenever an achievement is earned in the game! Sadly, it appears for a few seconds, but oh well it's meant to be like that. I also added a close button to close the achievement popup. The close button, ironically, does not work yet.
I also started to create the achievement logos. I've drawn two of them and they look very good so far.
Surfing for Background Music and Sound Effects
I started to look for suitable BGMs in the wee hours of the morning when it's all quiet. I knew it would not be an easy task. I have listened to 166 BGMs. And I am still listening now. Of these, I have picked less than 10, and a lot of them I've rated only 2/5 or 3/5 - which means they still might not be the BGMs I want in the game.
I also went to find some of the sounds that I need in the game. Although the game isn't close to completion yet, there are some sounds that I know will definitely be used in the game as I know there are areas in the game which are already fixed. (Well this is one advantage of working alone I guess, though there's probably 5 disadvantages for every 1 advantage).
End of Day Thoughts
I spent most of my day working on the UI and much of my morning listening non-stop to BGMs. It was kind of frustrating - sometimes I thought a BGM was suitable, and then suddenly it starts playing loud drum beats or sounds that were definitely not what I wanted. I can't skip to the middle because it's not buffered yet. Oh well.
I also wasted a lot of time today trying to fix the zoom bug, which I didn't manage to fix in the end. I got pretty restless and tired trying to fix that issue. Adding multiple zoom levels to the game is really a lot of work and killing me. What's worse is that the zoom level must now be designe to be able to be manually toggled by the player. I have to make sure everything works. This sure isn't easy =(
I am sleeping very late everyday and this is bad. I must try to sleep earlier. It's 8am now. Good night!
Thursday, October 4, 2012
Working on Zoom Levels
Thursday, 4 October 2012 - Working on Zoom Levels
Zoom
I have been working on the zoom feature of the game. This is still a rather new feature and there was a huge difficult problem faced today. I was trying to fix a problem where the camera will move out of the screen and view the black background whenever the character goes near the edge of the screen.
With the help of Li Hao, we came up with a formula that determined the boundary of the camera. This took quite some time since deriving the formula was not something straight forward. The good thing about using a formula instead of hardcoding the values is so that the zoom level is more flexible. Previously I had 3 modes: 1X Zoom, 1.5X Zoom and 2X Zoom.
With the formula, the boundary of the screen can be recalculated with any zoom level. It is really convenient!
Slider
With that, I went to code and draw the slider. I have decided to put the UI at the top temporarily. Throughout the entire night (and morning), I managed to create a working slider. However, the UI isn't attached to the camera, so when the player walks, the UI doesn't follow the screen and will disappear.
That was something I was trying to do, but I wasn't successful. I guess I will have to do it tomorrow. Before I went to sleep, I embarked on another task.
Portal Graphics Readjustments
Toward the end of the day (or the start of another), I went to my Portals. I had to address the problem with them not being obvious enough and not standing out from the background enough.
Since the start of introvert, the portals have been evolving. Simple "bullseye" type portals that I had no intention of animating.
Then a week or two after, they then had an animation. It took quite some work however simple it looked back then.
And after even more weeks, I completely scraped the old portals and created new ones that put the old ones to shame.
They seemed awesome. But they still had problems. Today, I tweaked the portals again. I gave them a glow, but the glow was cut off by the edges because they cannot exceed 32 pixels wide (the width of a grid). I then restrained the glow as much as possible. After so much testing, I have finally managed to tweak the portals better once again.
Once again, they look more awesome than they previously were. The portals are less pale and the colours are now brighter to make them stand out more. There is quite a significant difference.
I don't know if I have to tweak the portals again, because somehow they just require constant readjusting for the past week haha.
Two versions of the game, with the new portals on the right. Definitely much more striking than before. I've updated the portals across most existing levels as well.
Other Minor Things
On a high zoom level, the camera will now switch to whichever character the player is controlling. It previously only locks onto the one player character.
I also intend to add WASD as the keyboard input for movement.
Current Schedule
•Slider
Zoom
I have been working on the zoom feature of the game. This is still a rather new feature and there was a huge difficult problem faced today. I was trying to fix a problem where the camera will move out of the screen and view the black background whenever the character goes near the edge of the screen.
With the help of Li Hao, we came up with a formula that determined the boundary of the camera. This took quite some time since deriving the formula was not something straight forward. The good thing about using a formula instead of hardcoding the values is so that the zoom level is more flexible. Previously I had 3 modes: 1X Zoom, 1.5X Zoom and 2X Zoom.
With the formula, the boundary of the screen can be recalculated with any zoom level. It is really convenient!
Slider
With that, I went to code and draw the slider. I have decided to put the UI at the top temporarily. Throughout the entire night (and morning), I managed to create a working slider. However, the UI isn't attached to the camera, so when the player walks, the UI doesn't follow the screen and will disappear.
That was something I was trying to do, but I wasn't successful. I guess I will have to do it tomorrow. Before I went to sleep, I embarked on another task.
Portal Graphics Readjustments
Toward the end of the day (or the start of another), I went to my Portals. I had to address the problem with them not being obvious enough and not standing out from the background enough.
Since the start of introvert, the portals have been evolving. Simple "bullseye" type portals that I had no intention of animating.
Then a week or two after, they then had an animation. It took quite some work however simple it looked back then.
And after even more weeks, I completely scraped the old portals and created new ones that put the old ones to shame.
They seemed awesome. But they still had problems. Today, I tweaked the portals again. I gave them a glow, but the glow was cut off by the edges because they cannot exceed 32 pixels wide (the width of a grid). I then restrained the glow as much as possible. After so much testing, I have finally managed to tweak the portals better once again.
Once again, they look more awesome than they previously were. The portals are less pale and the colours are now brighter to make them stand out more. There is quite a significant difference.
I don't know if I have to tweak the portals again, because somehow they just require constant readjusting for the past week haha.
Two versions of the game, with the new portals on the right. Definitely much more striking than before. I've updated the portals across most existing levels as well.
Other Minor Things
On a high zoom level, the camera will now switch to whichever character the player is controlling. It previously only locks onto the one player character.
I also intend to add WASD as the keyboard input for movement.
Current Schedule
•Slider
•Fix
all medium zoom levels
•(Easy,
Medium, Hard modes buttons)
•GUI
•Decorations
Li Hao gave me the idea of levels having easy, medium and hard modes. The difficulty is controlled by the zoom factor. The current design is that on Easy, there is a scroll bar that allows the map to be viewed at any zoom level. On Medium, there is a fixed zoom level. On Hard, the zoom level is insanely high so the player cannot see a lot of the screen.
I don't know if I am able to implement that. I didn't really intend to have zoom levels in this game. And adding stuff to the game is a very risky move. I already think that there is a chance that this game might not be able to be finished by the deadline I set for myself. The zoom factor solves some problems in the game. I sure hope it doesn't open up too many new ones.
I guess that's all about the game. Below is my personal reflection on how things are so far. If you're not too keen on reading peoples' thoughts, I suggest you stop here.
My Personal Thoughts on this game so far...
I sort of looked through some other games produced by other people in a few weeks. I realised that I have more features than those games, even when they have more manpower. However, the good thing about those games are that they are polished and have very little flaws. I also see games that have more features than mine, but as I look at them, I realise they aren't as good as those games that had done well with little features. The bigger a game is, the higher the likelihood of being flawed. This game already has some flaws that I am trying to fix.
Making a game is sure easier said than done. When I first took up this project, I had not foreseen so many design problems. I had not foreseen how hard it actually became to create this game. Not to mention, as much as I did enjoy what I did, it actually takes up a lot, a lot of time. In my first two weeks on this project, I remember having problems with bugged collisions and sprites overlapping, merging, disappearing for reasons unknown to myself. On the third week, I began to notice that the game was greatly flawed by how small the characters were.
This is the fourth week that I am working on this game. The design issues are definitely hitting me now. I also realise I have LOTS of things to polish. I have ideas for new features and cool levels, but the lack of time is simply too important to ignore.
I have to balance the levels, decorate the levels, redraw some of my tiles. There are many issues which I have to fix before I continue to add stuff. Adding and expanding the game now will give me new problems that stack on top of the old. Rather than adding stuff, I guess it is more important to touch up and polish whatever I have and make the game a small, short one, but a really GOOD one that is worth the time. As much as I want to jump into generating ideas for new levels, I have to stop doing that!
Working alone on this project compared to a team of five means I take five times longer to produce a good game. Indeed, as much as I don't enjoy group work, I have to admit there is a lot groupwork can accomplish that solo work cannot.
Despite having so much to do, I'm not in despair though, because I am still very happy with how the game is like today. It took a lot of effort and time to reach the stage it already is today.
And I must not give up!
Wednesday, October 3, 2012
Game Breaking Mechanism: ZOOM
Tuesday, 2 October 2012 - Continued on backgrounds
Touching up Background
I received some suggestions to improve my backgrounds. Today, I went back and edited one of my backgrounds.
Transparency additions
More of the sprites in the game now have a transparent background.
Friend Graphics
I created the friend graphics. The idle is mostly consisting of the same player graphics, just recoloured. I added 10 new frames to the friend character. The friend, when collected, will smile and raise his hand happily. The smiling animation has 10 frames and plays whenever the player walks over to a friend. I then coded him to fade off when the animation nears the end. Surprisingly, implementing the friend graphic into the game took less effort than I thought and was done relatively quickly. I had little bugs and I managed to fix them quickly. However, there is one issue with the smiling animation that I have to fix - the character's mouth is too big when he smiles.
This is one of the great implementations of this week. After so many weeks I finally created the friend character. I can't believe I have been using yellow boxes as placeholders for four weeks! Surprisingly, this
Implementation of Updated Portals
I implemented the updated graphics across all the levels in the game. Previously they were previewed in the level selection stage and looked okay. However, getting them inside the levels created a problem. As the portals are of mostly light colours and the backgrounds are all very bright and lightly coloured too, the portals could hardly be seen on some levels!
ZOOM !!!
This completely shattered what I had thought of the game. It blew me apart when I saw it. It all started with the player and friend graphics being too small. So I typed in two lines of codes that would change the view of the game forever and set something new in the game's history. The two lines of code were:
FlxG.camera.zoom = 2;
FlxG.camera.follow(player);
After that, I went to run the game. I entered the second level. And I could not stop spamming screenshots of the game to Li Hao. He reacted even more than me! We ever did talk about how the game would have been better if it were bigger and have a scrolling element. But I never actually tried it because all my graphics are designed to work at its current size. I did try double zoom before on full screen. But the game was still in its infancy at that time. With a ton more graphics in the game and undersized player graphics, the zoom made a HUGE IMPACT and DIFFERENCE to the look of the game. Suddenly, my characters became THAT much noticeable.
I went on to code several views for the camera and fix it so it won't go out of the map. Temporarily, the number keys 1, 2 and 3 will toggle three levels of zoom: 1.0x, 1.5x, and 2.0x. The game is awesome on 2.0x zoom!
With so much awesomeness however, comes several huge and game-breaking problems:
- Text appear on fixed locations on the map, and the player sometimes cannot see those text
- Player does not get a complete visual view of the entire level (important in certain levels and key to easy completion. This is important on levels with enemies and friends.)
- GUI does not follow camera
The first two problems are huge problems because they pertain to the design of the game. I did not intend for a 2x zoom. Neither did I intend for any sort of camera system. These are issues I have to fix urgently because should I allow a 2x zoom option, these issues are considered extremely important to fix.
Touching up Background
I received some suggestions to improve my backgrounds. Today, I went back and edited one of my backgrounds.
Transparency additions
More of the sprites in the game now have a transparent background.
Friend Graphics
I created the friend graphics. The idle is mostly consisting of the same player graphics, just recoloured. I added 10 new frames to the friend character. The friend, when collected, will smile and raise his hand happily. The smiling animation has 10 frames and plays whenever the player walks over to a friend. I then coded him to fade off when the animation nears the end. Surprisingly, implementing the friend graphic into the game took less effort than I thought and was done relatively quickly. I had little bugs and I managed to fix them quickly. However, there is one issue with the smiling animation that I have to fix - the character's mouth is too big when he smiles.
This is one of the great implementations of this week. After so many weeks I finally created the friend character. I can't believe I have been using yellow boxes as placeholders for four weeks! Surprisingly, this
Implementation of Updated Portals
I implemented the updated graphics across all the levels in the game. Previously they were previewed in the level selection stage and looked okay. However, getting them inside the levels created a problem. As the portals are of mostly light colours and the backgrounds are all very bright and lightly coloured too, the portals could hardly be seen on some levels!
ZOOM !!!
This completely shattered what I had thought of the game. It blew me apart when I saw it. It all started with the player and friend graphics being too small. So I typed in two lines of codes that would change the view of the game forever and set something new in the game's history. The two lines of code were:
FlxG.camera.zoom = 2;
FlxG.camera.follow(player);
After that, I went to run the game. I entered the second level. And I could not stop spamming screenshots of the game to Li Hao. He reacted even more than me! We ever did talk about how the game would have been better if it were bigger and have a scrolling element. But I never actually tried it because all my graphics are designed to work at its current size. I did try double zoom before on full screen. But the game was still in its infancy at that time. With a ton more graphics in the game and undersized player graphics, the zoom made a HUGE IMPACT and DIFFERENCE to the look of the game. Suddenly, my characters became THAT much noticeable.
I went on to code several views for the camera and fix it so it won't go out of the map. Temporarily, the number keys 1, 2 and 3 will toggle three levels of zoom: 1.0x, 1.5x, and 2.0x. The game is awesome on 2.0x zoom!
With so much awesomeness however, comes several huge and game-breaking problems:
- Text appear on fixed locations on the map, and the player sometimes cannot see those text
- Player does not get a complete visual view of the entire level (important in certain levels and key to easy completion. This is important on levels with enemies and friends.)
- GUI does not follow camera
The first two problems are huge problems because they pertain to the design of the game. I did not intend for a 2x zoom. Neither did I intend for any sort of camera system. These are issues I have to fix urgently because should I allow a 2x zoom option, these issues are considered extremely important to fix.
Tuesday, October 2, 2012
Achievement Screen BG
Tuesday, 2 October 2012 - Achievement Screen BG
Today, I completed the achievement screen backgrounds. Yep, backgrounds! I have several backgrounds for the achievement screen, mainly composed of one main background with different "variations" of it.
I am EXTREMELY EXCITED and HAPPY to have implemented this. I had been drawing intensively for the past hours and just managed to code something awesome for the background! This is totally something extra to the game.
First, I enter the achievements room.
I have to push the box into that empty slot on the right. After I do so, the platforms all light up as the circuit is complete. In the background, window lights switch on some of the buildings.
For now, I will slightly alter the achievements screen. (Well initially there wasn't supposed to be an interactive achievements screen with the element of pushing of boxes, collecting stuff in this room and watching the background change). I have signboards that represent achievements on the floor. Each signboard represents an achievement earned. The player can walk over those signs and doing so will trigger the achievement image, description and reward to appear at the bottom. It's sort of like a popup over the tiles. I think this is the best solution for now. The problem comes when all the walkable areas are filled with achievement signboards. The popups will keep popping up even though the player is just intending to walk past without triggering the popups.
Today, I completed the achievement screen backgrounds. Yep, backgrounds! I have several backgrounds for the achievement screen, mainly composed of one main background with different "variations" of it.
I am EXTREMELY EXCITED and HAPPY to have implemented this. I had been drawing intensively for the past hours and just managed to code something awesome for the background! This is totally something extra to the game.
First, I enter the achievements room.
I begin to collect the yellow square that drop from the ceiling. (They are placeholder for "friends" in the game). As I collect more, more lights start to appear.
There are more frames in between, but for the finale, a moon shows and lights up the entire city in the background! As an added detail, notice that the window frames also capture a gleam of the moonlight and have some yellow light on them too!
This is the entire background by itself without the blockage from the tiles.
It is a pity I can't see the floor. I am wondering if I should get rid of the platforms altogether and make the turtle character "walk" on that background's floor instead. It would seem cool, but having a bit of 3D appearance for this particular stage means that it's not going to be consistent with the rest of the game. I feel it's not a good approach so I will leave it as it is.
I really love the achievements room now! I can't wait to show it to someone badly!
One problem arises though...
Previously, I wanted the background to be a solid grey. It would be a wall and there would be achievements hung on the wall if the player earns them. Toward the end of the game, the wall would be beautified with achievements and not be so plain anymore.
But now, the "wall" has been replaced with four window panes! I might have to squeeze all the achievements below on the two grids of tiles. It's going to look very compact and I don't like it.
For now, I will slightly alter the achievements screen. (Well initially there wasn't supposed to be an interactive achievements screen with the element of pushing of boxes, collecting stuff in this room and watching the background change). I have signboards that represent achievements on the floor. Each signboard represents an achievement earned. The player can walk over those signs and doing so will trigger the achievement image, description and reward to appear at the bottom. It's sort of like a popup over the tiles. I think this is the best solution for now. The problem comes when all the walkable areas are filled with achievement signboards. The popups will keep popping up even though the player is just intending to walk past without triggering the popups.
I will think about it as I sleep or something. The situation isn't that bad. In fact, I'm glad that the achievement screen has evolved to the way it is now. It is unique and I really love it!
This idea was inspired when I was turning on and off the layers in the picture, and this idea just struck me. This is one scenario where the coding is actually easier than the actual drawing. Phew!
What I have completed today:
Another day has passed...today I have managed to complete:
- Wonderful achievements background and interaction triggering events there
- Gallery feature and related graphics (locked item, navigating buttons)
- Colour variation of portals
- Redrew and enhanced the Main Menu buttons
- Fixed issues caused by lack of transparency in level selection stage
- Some platform decorations (mainly rocks)
Gallery
11.29PM, Monday, 1 October 2012
New Mini-feature: Gallery
I was woken up rather early due to call pertaining my internship in three weeks' time. It felt like I had barely slept before I was woken. I went on to create a Gallery to view the backgrounds in the game. I went to draw a "locked" screen background for anything that has been locked.
The chains look too squarish, which became a problem when I started duplicating them. I thought of creating a currency system where you can use "keys" to purchase the unlockable backgrounds, but I don't think I have time to do that. I'll focus on getting the other important aspects of the game done first, since Gallery was never something I planned to put in the game anyway. I added buttons to navigate left and right and a number at the bottom to show which background the player is currently looking at. I plan to have 20 unlockable backgrounds. (These backgrounds don't do anything, they are just for viewing the artwork in the game). I created this feature because the backgrounds are blocked in the game and it was quite a waste of my work frankly haha, so this will put those pictures to good use.
Portal Variations
I also did colour variation of the portals. I have currently only implemented them in the Level Selection screen, so the normal stages still have the old portals. The colours might need some tweaking.
Menu Buttons Redrawn
I also went to redraw the main menu buttons.
There were three things that I and Li Hao did not like about the buttons.
1) The text looks quite awkward.
2) When hovered over, the glow looks terrible (Li Hao didn't like how the text looks more blur)
3) I personally didn't like the image of the button being pressed - it rotated 3D which though cool on its own, isn't what a button should do.
You can see a stark contrast between the old buttons and the new buttons when placed next to each other.
The new buttons have a texture to enhance it. Previously the center of the button is just a flat colour. I did that in powerpoint way before I had Photoshop, so with Photoshop now, I am beginning to touch up whatever I can. I also removed the 3D effects. The rollover and pressed down graphics were changed. The new buttons look fabulous. OH! You can also notice the addition of the new "Gallery" button which is part of the feature mentioned earlier. The placements and order of the buttons aren't finalized, just so you know that "Gallery" isn't intentionally put on top of "Play".
Platform Tile Revamps?
I also worked on revamping the current tile graphics. They don't look so bad to me, but I suppose I should try to enhance it. Unfortunately I did not have much luck with the tiles. Instead, I ended up drawing several rocks and stones.
Transiting from Paint to Photoshop
For this and the following week, I will be cleaning up my art assets. Because I had done much of my work in Paint, which doesn't support transparency when images are saved, I end up having objects with opaque backgrounds. This became particularly annoying recently when I began replacing the old flat coloured backgrounds with actual backgrounds. See the picture below to get a better idea of what I mean.
THIS. Also note that the turtle has a gray square around him. That's not an aura. That's the non-transparency issue which I have with many of my assets now. This is a tedious job going through my assets a second time, but it's a job I have got to do!
I also managed to re-add the ability to click on portals in the level selection stage. I had disabled it yesterday to test the new portals and also due to a problem with lack of transparency with the sprites that determine the click-able area attached to each portal. I also extended the click-able area of portals because portals now sink into the ground partially, and the click-able area has to expand downward accordingly.
New Mini-feature: Gallery
I was woken up rather early due to call pertaining my internship in three weeks' time. It felt like I had barely slept before I was woken. I went on to create a Gallery to view the backgrounds in the game. I went to draw a "locked" screen background for anything that has been locked.
Portal Variations
I also did colour variation of the portals. I have currently only implemented them in the Level Selection screen, so the normal stages still have the old portals. The colours might need some tweaking.
I also went to redraw the main menu buttons.
There were three things that I and Li Hao did not like about the buttons.
1) The text looks quite awkward.
2) When hovered over, the glow looks terrible (Li Hao didn't like how the text looks more blur)
3) I personally didn't like the image of the button being pressed - it rotated 3D which though cool on its own, isn't what a button should do.
You can see a stark contrast between the old buttons and the new buttons when placed next to each other.
The new buttons have a texture to enhance it. Previously the center of the button is just a flat colour. I did that in powerpoint way before I had Photoshop, so with Photoshop now, I am beginning to touch up whatever I can. I also removed the 3D effects. The rollover and pressed down graphics were changed. The new buttons look fabulous. OH! You can also notice the addition of the new "Gallery" button which is part of the feature mentioned earlier. The placements and order of the buttons aren't finalized, just so you know that "Gallery" isn't intentionally put on top of "Play".
Platform Tile Revamps?
I also worked on revamping the current tile graphics. They don't look so bad to me, but I suppose I should try to enhance it. Unfortunately I did not have much luck with the tiles. Instead, I ended up drawing several rocks and stones.
Transiting from Paint to Photoshop
For this and the following week, I will be cleaning up my art assets. Because I had done much of my work in Paint, which doesn't support transparency when images are saved, I end up having objects with opaque backgrounds. This became particularly annoying recently when I began replacing the old flat coloured backgrounds with actual backgrounds. See the picture below to get a better idea of what I mean.
He doesn't actually have a speech bubble in the game
THIS. Also note that the turtle has a gray square around him. That's not an aura. That's the non-transparency issue which I have with many of my assets now. This is a tedious job going through my assets a second time, but it's a job I have got to do!
I also managed to re-add the ability to click on portals in the level selection stage. I had disabled it yesterday to test the new portals and also due to a problem with lack of transparency with the sprites that determine the click-able area attached to each portal. I also extended the click-able area of portals because portals now sink into the ground partially, and the click-able area has to expand downward accordingly.
Monday, October 1, 2012
Revamped Portals!
1 October 2012 - Revamped Portals!
New Background!
I feel a bit crazy for posting just a few hours after the previous post. It's now 6am so I better type quickly. I just finished another background for the game. This one is for the Level Select State. I really love it!
I initially wanted a full moon, but I had incidentally created another circle to use as a glow around the moon and before I shifted this circle behind the moon, it blocked it and formed a half moon. Then I got inspired to create the crescent moon as in the background above! The stars in the picture are rather few because I might be animating the stars in this screen, but I decided not to code that today. It is already VERY LATE now.
I went to replace the old background. The old one was just a flat dark blue colour like the one above, but without the gradient. I had some problems because
1) My portals are not transparent - before I got photoshop, I used Paint to do all my assets and Paint does not support transparency. I cheated by painting any parts that required transparency the same colour as the background.
2) The portals are actually "buttons" because you can click on them to activate the AI that walks your player to the portal you clicked. Those buttons had graphics that annoyed me because I couldn't find out what the graphic was initially, until I realised they belonged to the buttons.
The above picture looks like some glass panels where your are looking out at a snowing scenery. But no, it's not the case. The red and black lines are actually my frame borders to ensure I position the frames with pixel perfect accuracy (important in small animations). I put in the regular tiles to ensure the portal's heights in accordance to the ground is appropriate. The white dots are actually "stars" that float upward by 2 px every frame and get smaller on the way up. It's clearer to see with one star:
I took quite some time to create the frames for this animation and even after completion, I had to adjust the heights of the stars and the fix some of the issues with the stars not moving in straight lines. But I managed to fix all the issues in the end. At the end however, I realized I was not very efficient. This animation is something that I was told to do in Flash. I should try it sometime in the future, to make my own life easier.
Thank you!
I seriously have to thank my mother for buying Photoshop for me. Without it I really would not be able to accomplish all the backgrounds I have done and much of the newer graphics which could never be accomplished in Paint.
I also have a very good friend, Li Hao, who will constructively criticize my art (the portals, the tiles) and help inspire me to what I should be aiming for. It was him who actually made me get Photoshop in the first place since I was pretty adamant to sticking to Paint. So, I am really grateful for how everything is like now and definitely happy with the progress of the game regardless :) Without him, much of the graphics in the game would have stuck with what it used to be.
Alright, it's already super super late by the time I typed all that. It is time for me to sleep. Cyas~
New Background!
I feel a bit crazy for posting just a few hours after the previous post. It's now 6am so I better type quickly. I just finished another background for the game. This one is for the Level Select State. I really love it!
BG_LevelSelect
I initially wanted a full moon, but I had incidentally created another circle to use as a glow around the moon and before I shifted this circle behind the moon, it blocked it and formed a half moon. Then I got inspired to create the crescent moon as in the background above! The stars in the picture are rather few because I might be animating the stars in this screen, but I decided not to code that today. It is already VERY LATE now.
I went to replace the old background. The old one was just a flat dark blue colour like the one above, but without the gradient. I had some problems because
1) My portals are not transparent - before I got photoshop, I used Paint to do all my assets and Paint does not support transparency. I cheated by painting any parts that required transparency the same colour as the background.
2) The portals are actually "buttons" because you can click on them to activate the AI that walks your player to the portal you clicked. Those buttons had graphics that annoyed me because I couldn't find out what the graphic was initially, until I realised they belonged to the buttons.
Unfortunately, much of the background is covered. I made the mistake of drawing most of my buildings at the bottom. This was very unfortunate because I had simply forgotten (I realised halfway, but it was quite late to change) that the level select stage has a HUGE block of staircase at the bottom right. About half of my buildings end up getting blocked.
OH, ONE THING THAT GOT ME REALLY HAPPY: NEW PORTALS!
I was REALLY REALLY happy at what I just accomplished a few minutes ago. I was told that the portals in the game looked really weird. And now I truly agree. I went on to create a new portal animation even though I did not have a real intention of revamping the old graphics. I initially did three frames of animations that ran at 6FPS. But I was not very happy with the jittery animation. I knew it needed to be smoother, so I went to create 9 frames.
And it was hell a lot of work just to get this one portal working!
The above picture looks like some glass panels where your are looking out at a snowing scenery. But no, it's not the case. The red and black lines are actually my frame borders to ensure I position the frames with pixel perfect accuracy (important in small animations). I put in the regular tiles to ensure the portal's heights in accordance to the ground is appropriate. The white dots are actually "stars" that float upward by 2 px every frame and get smaller on the way up. It's clearer to see with one star:
I took quite some time to create the frames for this animation and even after completion, I had to adjust the heights of the stars and the fix some of the issues with the stars not moving in straight lines. But I managed to fix all the issues in the end. At the end however, I realized I was not very efficient. This animation is something that I was told to do in Flash. I should try it sometime in the future, to make my own life easier.
Thank you!
I seriously have to thank my mother for buying Photoshop for me. Without it I really would not be able to accomplish all the backgrounds I have done and much of the newer graphics which could never be accomplished in Paint.
I also have a very good friend, Li Hao, who will constructively criticize my art (the portals, the tiles) and help inspire me to what I should be aiming for. It was him who actually made me get Photoshop in the first place since I was pretty adamant to sticking to Paint. So, I am really grateful for how everything is like now and definitely happy with the progress of the game regardless :) Without him, much of the graphics in the game would have stuck with what it used to be.
Alright, it's already super super late by the time I typed all that. It is time for me to sleep. Cyas~
Subscribe to:
Posts (Atom)