0

Idea for Gameplay

I will be using the story, Bawang Merah and Bawang Putih (Onion and Garlic) for my game.

My game play will be a platformer game, which means the character will go through obstacles by jumping, walking, running, and stomping on enemies.

Based on the story, Bawang Merah stole Bawang Putih's magical fish. However, in this version, instead of Bawang Putih ends up eating the fish, Bawang Putih notices Bawang Merah kidnapping the fish. And she runs after Bawang Merah to retrieve her fish back. Bawang Merah tries to avoid getting caught by Bawang Putih so she unleashes her Onion army to slow Bawang Putih down.


Enemy : Onion creatures / Bawang Merah.

Protagonist / Main character : Bawang Putih.

Goal : Go through levels to retrieve the magical fish.

Level based. (Currently will be 2 levels)

As for the controls on the interface, I've searched up on what's the best way to put arrow key controls on a touch screen interface.

And I found this tutorial: http://www.stencyl.com/help/view/mobile-input/

Or I can include arrow key images onto the interface and set it to control my characters :

For example:


Grannell C. 2013, Cliffed: Norm's World XL (universal) .[electronic print] Available at: <http://www.techradar.com/news/mobile-computing/tablets/60-best-free-ipad-games-692690> [Accessed : 28th September 2013]







0

Art styles reference

Before I get to develop the story further to make it suitable to become a game, I looked up on art styles that might be suitable for the game.


I wanted a traditional feel towards the game to relate it to the folk tale. My references would be batiks and wayang kulits. 


An example of wayang kulit. (shadow puppet)

Mallett M. 2013, The Wayang Kulit Theater of Indonesia .[electronic print] Available at: <http://www.marlamallett.com/puppets-2.htm> [Accessed : 25th September 2013]


An example of batik.

Prima B. 2012, Indonesian Batik Style .[electronic print] Available at: <http://knightfightband.blogspot.com/2012/12/idonesian-batik-style.html> [Accessed : 25th September 2013]

A few examples of the similar art styles :





Screenshot from the video above. (Glue Studio's Bawang Merah and Bawang Putih)







Shadow Puppet style.
Andrew O. 2008, The Adventures of Prince Achmed .[electronic print] Available at: <http://theotherandrew.blogspot.com/2008/10/die-abenteuer-des-prinzen-achmed.html> [Accessed : 25th September 2013]



Sagecraft.com, 2013, Puppetry Definitions. [electronic print] Available at:<http://www.sagecraft.com/puppetry/definitions/> [Accessed : 25th September 2013]



Hill J. 2006, Toon Tuesday: Recycling, Disney Feature Animation-style. [electronic print] Available at: <http://jimhillmedia.com/editor_in_chief1/b/jim_hill/archive/2006/10/10/6133.aspx?PageIndex=3#.UkSwMYYziSo> [Accessed: 25th September 2013]


I'm also thinking of adding in some RPG (role-playing-game) elements, as Stencyl do work well with rpg.

Some reference for rpg styles :


Jelle W. 2012, How do I make an awesome RPG style map out of this. [electronic print] Available at: <http://www.cartographersguild.com/how-do-i/21611-how-do-i-make-awesome-rpg-style-map-out.html> [Accessed: 25th September 2013]



Doppleganger. 2007, Obligatory RPG mockup. [electronic print] Available at: <http://www.pixeljoint.com/pixelart/27489.htm> [Accessed: 25th September 2013]



Square. 2013, Secret of Mana. [electronic print] Available at: <http://www.gamefabrique.com/games/secret-of-mana/> [Accessed: 25th September 2013]


As for my camera angles, it will most probably be like this :


Tebited15. 2013, Adventure Time RPG: Party Members. [electronic print] Available at: <http://tebited15.deviantart.com/art/Adventure-Time-RPG-Party-members-388024180> [Accessed: 25th September 2013]


Tebited15. 2013, Adventure Time RPG: Grasslands Battle Arena. [electronic print] Available at: <http://tebited15.deviantart.com/art/Adventure-Time-RPG-Party-members-388024180> [Accessed: 25th September 2013]

Or just a flat horizontal camera angle :


Wayofthepixel.net. 2013, Pixel Art / Re: [WIP] Cartoon RPG [C +C]. [electronic print] Available at: <http://wayofthepixel.net/index.php?action=profile;area=showposts;u=7586> [Accessed: 25th September 2013]


Wayofthepixel.net. 2013, Pixel Art / Re: [WIP] Idle Stance for Platformer NPC. [electronic print] Available at: <http://wayofthepixel.net/index.php?action=profile;area=showposts;u=7586> [Accessed: 25th September 2013]


0

Selection of folktales to be made into game

During tutorials, Mr. Muzamir suggested that I look into Malaysian folk tales to be use as my content for my game development. I've always been reading folk tales, fables and fairy tales when I was younger because I love the myths and the stories.

Here are some selections which I'll be choosing from :

1. Bawang Putih and Bawang Merah
2. Si Tanggang
3. Hang Nadim and the swordfishes

Bawang Putih and Bawang Merah (short summary):

Once upon a time, there was a farmer with two wives. The first wife had a daughter named Bawang Merah, while the second wife had a daughter named Bawang Putih. The farmer passed away from an illness and not long, the second wife died because the 1st wife killed her by pushing her into the river. Bawang Putih was a kind and gentle person while her step-sister is the complete opposite.

The stepmother and her daughter treated Bawang Putih badly. Bawang Putih often sneak away to the river where her mother died. And she found out that her mother had reincarnated into a fish that lives in the pond. Bawang Merah who had been spying on her found out about the fish too. Bawang Merah and her mother cooked the fish and served it to Bawang Putih.

Bawang Putih was devastated when she found out she ate her mother and buried the fish bones near the river. The fish bones grew into a tree with a swing attached to it. Bawang Putih sings while playing on the swing. A prince noticed her singing and chased after her but she ran and hid in her house.

The stepmother told the prince that the one singing was her own daughter, Bawang Merah. However, when she sat on the swing, the swing refused to move. When Bawang Putih sat on the swing again, it moved to her singing. And so she lived happily ever after with the prince.

Si Tanggang (short summary):

Si Tanggang lived with his mother in a fishing village. They are poor and he had always dreamt of being wealthy. One day, when Si Tanggang was working hard near the sea, a grand ship sailed ashore. The captain was impressed by Si Tanggang's hardworking attitude. So he invited him to work on his ship. Si Tanggang agreed and bid farewell to his mother.

His mother waited many years for Si Tanggang to return to the village. Many years later, Si Tanggang, who is now the captain, sailed back to the village. His mother dressed in rags was excited to meet him and ran up to him. However, when Si Tanggang saw her, he denied knowing her. The mother was really upset and cried out to God asking Him to teach Si Tanggang a lesson. Then a lightning strucked Si Tanggang and his crew and turned them into stones.

Hang Nadim and the swordfishes (short summary):

There was once a place called Temasek and the place was attacked by thousands of swordfishes. The cursed started when the king persecuted an innocent man. Many people were injured from the swordfishes attack and none of them knew how to break the curse. However, there is a boy named Hang Nadim who was an intelligent boy. He told the people to build barricades from banana stems, forming a wall around the place. The swordfishes were stuck on the walls when they were trying to attack the people. Hang Nadim was rewarded by the king.

1

Publishing the Swf into an app issue

My initial idea was to publish my game into an app for ipad. Currently, I'm researching on how to publish my game onto an ipad. As I'm a student, buying the full version of Stencyl to publish my app is too pricey for me. (It would be great if they offer full versions free for students like autodesk...) Now, this worries me a little..
Anyway, my alternative way is to try to get the swf into an app.

I did a few research and found a way, but have yet to try it out.

Tutorial link:
http://www.nathalielawhead.com/candybox/making-an-adobe-air-ios-app-flash-xcode-and-submitting-from-itunes-connect-walkthrough

The way is to use Adobe Air SDK to package up the swf. I'll use a default game just to see if I can get swf to app.

More updates on my adobe air try out in my next post..

0

Switching Scenes

I've also tried out switching scenes. For example, main menu to level select and so on.

I followed this tutorial : http://www.youtube.com/watch?v=IyoEB7qG35I

As usual, create my images first, in this case I created two buttons. One for normal view and the other is when the button is selected. 


After that, I make the button as an actor,


Then, I need to code in puzzle blocks :

This code is for when mouse is clicked down.


I've created an attribute as a scene to be included into the code:



And when button is clicked down using the mouse, this code is the transition to the next scene:


And this code is for the click effect when button is clicked :


After that, I go back to my dashboard and select the scene tab to place my button into the scene:


Then back to the dashboard to mark which scene is the starting scene :





Here's my try out on switching scenes :






1

Tile solution

In my previous post, I've stated that I have issues with the tiles, as it appeared smaller than the actual size..



I searched a few tutorials and found out that in order for the tile to appear in the size I want, I have to create the tile by doubling the size. For example, if I want the tile to be in 32px x 32px, I'll have to create it in 64px x 64px.

  32px x 32px

 64px x 64px

And here's my updated testing game:




0

Customising my game

After learning a few basics on how to get around Stencyl, I've tried customising my own character. Here's how I did it :


First, I create my character, in this case it's an evil apple, where I named it "testingapple". I created it in several different layers because when I import it into Stencyl, the movement is done in frames by frames.


The first box of apple, is the first frame for the walk right animation. And the 2nd and 3rd, which will get it looping. 


I've created the 3 basic stats that I'm gonna test out. Idle, Left and Right. Currently I'm testing to make my character move from left to right and vice versa.

After that, I've created a 32x32 tile as a ground for my apple. (currently I have issues with the tile, I'll get back on this later)

Moving on, I got to the dashboard and set the controls :



This is the default control, since I only needed right and left, I removed the rest :


After that I set up the scene :


And now I have to code...but in puzzle form:



At first when I saw this, I don't really know how to use it, but after a little bit of analysing, it does look strangely familiar. And that's when I found out that I'm actually coding using puzzles. The shapes of the blocks, such as the blue one will only fit in the shape of the orange one. So it's like playing with a puzzle piece. 

And this is my apple's codes:


And after I hit "test game", it gave me an error, because I've forgotten to include one value which is 0 for x-speed.


Now it's working but I've forgotten to set the physics (gravity) for my scene, hence my apple floated in mid air:



I did a few trial and errors with the codes because at some point my apple didn't move left or right or keep moving right :



Stencyl also allows users to preview the codes, if you want to manually change the codes:




And here's my testing game (still finding solutions about the tile) :
My tile appeared smaller which I don't know why..I'm still finding the solution..


0

Creating Games with Stencyl

For my first try in Stencyl, I used the default characters, stage and sound that came with the software.
I followed the tutorials from here : http://www.stencyl.com/help/view/crash-course/

Firstly, there will be a box on the screen next to other default games which is labeled "create a new game". I clicked on that and named my testing game.


After that is done, I'll be brought to this screen :


The little critters on the screen are my "actors" aka "characters". Pronger will be the enemy while Mambo will be the main character. 

Then, I double click on Mambo's icon and I can edit Mambo's animated movements.


The software already has the default animation for Mambo, so all I have to do is select the suitable animations for his movements.

Now, for Pronger, I did the same thing that I did for Mambo :


After that, there will be tabs on the same page listed Appearance, Behaviours, Events, Collision, Physics, and properties. 

I clicked on behaviours and I get to add behaviours for my characters such as walking, jumping etc. 



I can choose the controls to move right and left. And the idle animation for my character's current direction it's facing. 


Now I can leave that aside for a while..

Then I clicked "dashboard" to get to the main menus. And clicked "tileset" on the left. There is already a default tileset available for me :


And now I can create a new scene by clicking at the dashboard on the left "scenes" :


And then I get this:


On the right side of the screen, there will be 2 tabs, "tiles" and "actors".

By clicking tiles, I can create a ground for my characters to stand on :


After that, I switched to the actors tab and added my prongers and mambo :



After that, there will be a few tabs at the scene too, and I clicked on physics to set the gravity for my scene :


And now I am ready to test scene (just like flash) .
Test scene's icon is at the top right of the screen, after clicking the icon I get my swf :


After saving, I wanted to open my file again, however I have no clue as to where the file is saved to because when I was saving, I am given no options to choose where my file is saved to.

I did a few google search and found out how to find my saved game.
All I have to do is to click the Debug tab and click on "view workspace folder".



However, I cannot open the game file (for editing) simply by clicking it. I have to open Stencyl to open my game for editing :


That's all for my first try outs, the next try out I'll try to create my own character rather than to use the default ones.