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!
Project ITV
Sunday, October 7, 2012
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~
Sunday, September 30, 2012
Introvert: The Beginning
Sunday, 30 September 2012 - Introvert: The Beginning
Hello! It has been thirteen weeks since I last worked on Introvert, a personal Platformer project that I had worked on for three weeks before the start of school. It is now my holidays again! (Yay!)
I have roughly three weeks of holidays left and I do not intend to waste it. I began working on Introvert last night. Some of the things I have to get settled is a schedule and a list of the several milestones I hope to achieve in time to come. Unfortunately, I realised that I cannot really do a lot in three weeks. After these three weeks, I have to do an internship that will shorten the development time I have even further.
Today, I researched for some references on how games did their backgrounds. Two games I looked into were Super Granny, a platformer by WildTangent and MapleStory.
I first decided to do the background for the dark forest scene.
I took quite a number of hours, but I did manage to create something rather decent. Although I had never used Photoshop before at the beginning, after 12 weeks I have somewhat picked up a little bit of Photoshop. It is indeed a really good tool. I am currently slowly transiting to Photoshop from Paint. It was really fun creating this picture. Also, it reminds me of the game Slender, which is a horror game. I went to draw a slender guy in the picture (the "ghost" in that game), but of course I deleted it eventually so you can't see him. I also added some fireflies because I did not want this to be scary, but more peaceful instead.
I also went on to create a second background. This one is for the early levels.
This picture took a shorter time. I also went on to create a third background. (This really is more time consuming than I thought).
This picture looks incomplete, but the bottom right is actually covered by platforms so I did not draw that area. This background will be used for one stage only, so unless I will reuse it for other stages, it's unlikely I'll fill up the bottom. The top left wall is pretty plain though, and I might add something there. But this is what I have at the moment.
I found many reference pictures that I saved in my powerpoint, but I don't think I want to upload them here. I need to draw at least three more backgrounds:
- Level Selection Stage (this is an actual playable stage so it needs a background)
- BG_WhereWeMet: This will be composed of a happy scenery.
- BG_Melancholy: A scene which portrays the mood of the late levels.
THE 3 BACKGROUNDS ALL LOOK REALLY AWESOME! I am very satisfied with the backgrounds so far. I was complimented that I had drawn them well and relatively quickly, and I was really happy to hear that. There is one problem though. When I tested the backgrounds with the levels, I found that the DarkForest background does not match with the tiles in those levels. The green wasn't the same, and the style just seems so different. The background just does not match with the tiles. I am going to rectify the tiles to fix the problem.
I might have to redo all my tiles in the future.
----
After much testing, and a slight recolouration of the forest tiles, I went to implement the backgrounds in the game. I also prepared a code to animate the backgrounds, because there is a possibility that I will animate the backgrounds in the future. Currently they are static and does not look very good to me. For example, the fireflies in the forest background aren't moving. I hope animating the background won't add too much lag. The game is going to have more animations in the future.
What about the TD Game I was working on previously?
Well, I have decided to give up on the Tower Defense game. I wanted to only work on it during my free time. However, I have absolutely no free time to dedicate at all. Since it would take years to finish this particular TD game, I have decided to abandon it. I did create some artwork for fun, but those are purely for fun. If I were to create a second game, it would not be a TD.
Bye bye TD.
Oh one last thing
A friend gave me the idea of making a sequel, and name the different "games" appropriately because this is more of a story based game.
One of the ideas he gave me for this particular chapter was "Introvert: The Beginning". Frankly speaking, I don't think it will be possible for me to create subsequent chapters unless some friends are willing to help me. It definitely isn't easy making this game. I am already very happy with what I have now, but of course, I won't strike off the idea of multiple chapters since after all, it's an interesting idea. I shall focus and work toward the completion of this game.
Hello! It has been thirteen weeks since I last worked on Introvert, a personal Platformer project that I had worked on for three weeks before the start of school. It is now my holidays again! (Yay!)
I have roughly three weeks of holidays left and I do not intend to waste it. I began working on Introvert last night. Some of the things I have to get settled is a schedule and a list of the several milestones I hope to achieve in time to come. Unfortunately, I realised that I cannot really do a lot in three weeks. After these three weeks, I have to do an internship that will shorten the development time I have even further.
Today, I researched for some references on how games did their backgrounds. Two games I looked into were Super Granny, a platformer by WildTangent and MapleStory.
I first decided to do the background for the dark forest scene.
BG_DarkForest
I took quite a number of hours, but I did manage to create something rather decent. Although I had never used Photoshop before at the beginning, after 12 weeks I have somewhat picked up a little bit of Photoshop. It is indeed a really good tool. I am currently slowly transiting to Photoshop from Paint. It was really fun creating this picture. Also, it reminds me of the game Slender, which is a horror game. I went to draw a slender guy in the picture (the "ghost" in that game), but of course I deleted it eventually so you can't see him. I also added some fireflies because I did not want this to be scary, but more peaceful instead.
I also went on to create a second background. This one is for the early levels.
BG_Reminiscence
This picture took a shorter time. I also went on to create a third background. (This really is more time consuming than I thought).
BG_GrowingUp
This picture looks incomplete, but the bottom right is actually covered by platforms so I did not draw that area. This background will be used for one stage only, so unless I will reuse it for other stages, it's unlikely I'll fill up the bottom. The top left wall is pretty plain though, and I might add something there. But this is what I have at the moment.
I found many reference pictures that I saved in my powerpoint, but I don't think I want to upload them here. I need to draw at least three more backgrounds:
- Level Selection Stage (this is an actual playable stage so it needs a background)
- BG_WhereWeMet: This will be composed of a happy scenery.
- BG_Melancholy: A scene which portrays the mood of the late levels.
THE 3 BACKGROUNDS ALL LOOK REALLY AWESOME! I am very satisfied with the backgrounds so far. I was complimented that I had drawn them well and relatively quickly, and I was really happy to hear that. There is one problem though. When I tested the backgrounds with the levels, I found that the DarkForest background does not match with the tiles in those levels. The green wasn't the same, and the style just seems so different. The background just does not match with the tiles. I am going to rectify the tiles to fix the problem.
I might have to redo all my tiles in the future.
----
After much testing, and a slight recolouration of the forest tiles, I went to implement the backgrounds in the game. I also prepared a code to animate the backgrounds, because there is a possibility that I will animate the backgrounds in the future. Currently they are static and does not look very good to me. For example, the fireflies in the forest background aren't moving. I hope animating the background won't add too much lag. The game is going to have more animations in the future.
What about the TD Game I was working on previously?
Well, I have decided to give up on the Tower Defense game. I wanted to only work on it during my free time. However, I have absolutely no free time to dedicate at all. Since it would take years to finish this particular TD game, I have decided to abandon it. I did create some artwork for fun, but those are purely for fun. If I were to create a second game, it would not be a TD.
Oh one last thing
A friend gave me the idea of making a sequel, and name the different "games" appropriately because this is more of a story based game.
One of the ideas he gave me for this particular chapter was "Introvert: The Beginning". Frankly speaking, I don't think it will be possible for me to create subsequent chapters unless some friends are willing to help me. It definitely isn't easy making this game. I am already very happy with what I have now, but of course, I won't strike off the idea of multiple chapters since after all, it's an interesting idea. I shall focus and work toward the completion of this game.
Subscribe to:
Posts (Atom)