Ninjapit almost finished

[markusT]

NINJAPIT

(in dev preview)

 

Hi there, 

I really have to share the latest in dev progress of the current game called "NinjaPit". I'm close to a release and some "real world" feedback would be nice. I will create a full tech post on inkfood.com once the game is released, about all the technical stuff and how Phaser can help to create HTML5 games....

 

Ninjapit is already fully enjoyable. The game targets mobile devices, but it is playable on desktop computers as well (thanks HTML5!!). The game features Gyro control on mobile devices and keyboard control on desktop. There are settings to change either the control type or gyro sensitivity. 

There are 8 random levels to play with, these levels are not in the same order as in the final game.

The Arcade mode is a get as high as possible mode, with highscore and ranking system. The base code is already prepared to create endless levels without any large ram or cpu usage. More on the tech post...

Unfortunately Arcade mode is not ready to show off.. It will be a challenge... I promise.  

 

There is currently no sound, cause its not finalized and would be really distracting while playing the game. Just random "blings" and "boings".

 

The game should not crash in any way, if so please let me know. Anyway, let me know what you think about the game, or the base idea of the game itself, or whatever... 

 

Have fun on...

http://inkfood.com/play/

 

Demo playable for limited time!!

 

P.S. Phaser is AWESOME!!

[Robske]

The only thing lacking would be sound and music. Some ideas:

 

http://soundbible.com/tags-martial-arts.html

 

http://www.freesfx.co.uk/soundeffects/martial-arts/

 

Cheers

[IQpied]

Ok, tell me do you plan for the ninja to be able to move left or right while standing on a platform, cause I can only choose direction while jumping. Playing on a PC.

[markusT]

The only thing lacking would be sound and music. Some ideas:

 

http://soundbible.com/tags-martial-arts.html

 

http://www.freesfx.co.uk/soundeffects/martial-arts/

 

Cheers

Thank you, I am already working on sound and sfx. The links seems to be promising...

[markusT]

Ok, tell me do you plan for the ninja to be able to move left or right while standing on a platform, cause I can only choose direction while jumping. Playing on a PC.

Nope, you can only move while you are jumping. I think the gameplay would not change that much if you could move on the platforms. And it also add some difficulty, to bounce off things to get into the right position, if necessarily. 

[hellspawn_bg]

Overall looks good, but not being able to move while on ground makes it kinda feel stiff.

[chg]

Tested on PC first and then on Android tablet. Found the experience better on the PC.

 

Playing on the PC initially I was tempted to complain about the controls. As Hellspawn_bg says it feels a bit funny not being able to move unless jumping, but I also didn't really like the horizontal velocity/acceleration change when moving while jumping either - it feels too 'slippery'.  Additionally with keyboard based horizontal movement I would have found a keyboard based jump key more playable than clicking the mouse - it just seems needlessly inconvenient making me click to jump...

 

Of course this pales to the difficulty I experienced playing on the tablet, so after trying that I thought you actually maybe are trying to inconvenience PC players on purpose in smalls ways to kind of level the playing field a bit [?!]

 

With the tablet, I found the game's controls unplayable. The tilt controls seemed reversed to me (and I found there is no option to change the tile direction in the settings), I struggled with this and tried to tough with tilt controls but tilting seemed extremely imprecise - it felt like I either didn't move or zipped across the screen (admittedly I'm not the most coordinated person in the world).

 

Thinking about the problem with tilt, it occurs to me part of the problem was lack of visual feedback... with the 'slippery' controls I would only find out I'd moved too sharply too late! Perhaps you could add some kind of immediate visual feedback as to how the state of the movement system has been effected?

 

The touch screen controls were a bit better for me than the tilt and I was able to play the first level or so, but it was still more difficult than on the PC. Possibly I suggest making the horizontal controls on touch less slippery than PC, and aim to control horizontal movement with a single thumb (say via a virtual thumb stick/d-pad) and allow the other thumb to be dedicated for jumping?

 

Visually the game is stunning!

 

My only gripes visually were a rendering issue on the tablet with a bright line at the bottom of the shadowed scrolled screen when the menu scrolled in and the unhelpful graphics of the left/right touch screen buttons which were displayed at the start of the game in this mode and which overshadowed the real buttons which were more subtle (flashing the real touch controls would have been ideal, but the fake controls were worse than nothing)

 

Oh, actually three last thoughts...

 

Firstly I'd like to be able to land further over to the left or right of the very top of the pit, with the control issues I was always a bit anxious for a half second that I the game wasn't recognising my movement and I wouldn't make it when it stopped moving when I was only slightly atop the platform;

 

And secondly I think you should be invincible when flashing after being hurt (frustrating and feels unfair to lose all your health on a single particularly bad landing spot);

 

And thirdly spiked platforms that flip over should look different from spiked platforms that don't...

 

Hope atleast some of this is helpful; looks like you've got a great game here!

[markusT]

Thanks chg for your thoughts. On which mobile/tablet devices do you tested the game on, which browser? I have the best playing experience by tilting the device just slightly to move the player, but your right,  it's still i bit slippery. Invincible after hit will be implemented as soon as possible.

[zackproser]

I love the intro and general ambiance. Great job. 

[chg]

Thanks chg for your thoughts. On which mobile/tablet devices do you tested the game on, which browser? I have the best playing experience by tilting the device just slightly to move the player, but your right,  it's still i bit slippery. Invincible after hit will be implemented as soon as possible.

Nexus 7 (2012), browser is the native Android browser with v4.4.4, Chrome 37

[markusT]

Nexus 7 (2012), browser is the native Android browser with v4.4.4, Chrome 37

 

I recently changed Phasers render type to CANVAS which cause input problems on certain Android devices. Changed to Canvas render type cause of some rendering problems on IOS 8. These problems are gone now, and render type is back to AUTO, which renders in webgl on most android devices.

 

Please give Ninjapit another try, and let me know if input works better for you, thanks... 

[chg]

I recently changed Phasers render type to CANVAS which cause input problems on certain Android devices. Changed to Canvas render type cause of some rendering problems on IOS 8. These problems are gone now, and render type is back to AUTO, which renders in webgl on most android devices.

 

Please give Ninjapit another try, and let me know if input works better for you, thanks... 

 

 

Could you kindly give me more info on the issue with the 2d canvas? (As I'm trying to get into this dev stuff myself, I'd really like to know more... esp. as I don't think I have the problem you describe with my device) Note though, if you are thinking of the performance issue in 4.4.3 with the 2d canvas not being accelerated, and hence expect a poor FPS, that is fixed in v4.4.4.

 

I have retested and things seem much more forgiving today with the onscreen touch controls, and I notice now you can land anywhere at the top of the pit to complete a level which is nice. I also landed on a moving platform on the very edge of my hit box which was nice even if almost too forgiving, and at one stage managed to stand on an arrow without taking damage (was the first arrow on the right-side from the bottom of the first or second level)

 

What seems to be broken now for the touch controls however is multitouch  , so you can't do the double-jump while holding left or right nor for that matter can you move if you don't stop release the tap off of the screen from jumping first.

 

Tilt controls were also worse for me - this time tilting seemed to not be recognised most of the time, even after upping the sensitivity (I have to reload to do this - I haven't seen an option to exit a level to the menu or bring up the settings mid-level which makes it hard to play with the tilt sensitivity when you have trouble completing a level with it)

 

EDIT: My bad on the tilt, though the tilt graphic doesn't help, I have just figured out the game doesn't recognise the major axis I was tilting around - you have to tilt side to side not about the major axis of the device (as shown on the tilt graphic on level 1). And, I can confirm that it is the first right arrow on level 2 that won't hurt you.

[markusT]

About the touch problem, 

this is a really weird problem, which i think is a hardware problem. I encounter this problem only on "lower price" devices, in my case a Samsung Galaxy 7 (I think). The actual problem is, once there is an on touch event listener, and this is triggered by a touch, the requestAnimationFrame timer will pause. Well not actually pause, it just stops rendering until you stop touch. Once it starts to render again, it immediately updates the position of any object where it should be, cause the actually render tick still works while not updating the screen.

 

Test it with this JSfiddle:  http://jsfiddle.net/inkfood/km87qbky/embedded/result/

 

Just touch and hold on the screen and it will pause, release and it will run again.

Never had similar issues on a Nexus4 or 5 either on IOS, strange!

 

The levels are not finalized yet, and might have some problems. I created a Level designer to create multiple levels really quick, I will show this later.

 

Didn't test multitouch, my fault. Anyway, thinking of a change of the Button input type on mobile devices. As you suggested, something like touch and hold/move, this is not implemented yet and needs some testing too.

 

Just don't get the tilt problem. Tilt worked on any device which has motion sensors, I've tested the game on. 

 

Thank you for testing

[chg]

About the touch problem, 

this is a really weird problem, which i think is a hardware problem. I encounter this problem only on "lower price" devices, in my case a Samsung Galaxy 7 (I think). The actual problem is, once there is an on touch event listener, and this is triggered by a touch, the requestAnimationFrame timer will pause. Well not actually pause, it just stops rendering until you stop touch. Once it starts to render again, it immediately updates the position of any object where it should be, cause the actually render tick still works while not updating the screen.

 

Test it with this JSfiddle:  http://jsfiddle.net/inkfood/km87qbky/embedded/result/

 

Just touch and hold on the screen and it will pause, release and it will run again.

Never had similar issues on a Nexus4 or 5 either on IOS, strange!

I can't reproduce that issue on my device (somewhat thankfully) but my gut feeling (I'm too "inexperienced" to call it "intuition") would be that it's 100% a software issue, and occurring because you're not cancelling the browser's own drag handling and so the browser is also implementing it's own handling as well (which probably involves dragging the canvas or page which mightn't move if it already fits the screen size perfectly).

Regarding the Samsung Galaxy specifically this probably is part of the TouchWiz stuff which Sumsung has modded over the default Android image, I know the browser is modded and is not the stock Android browser from Google.

For all I know, drag issues might also be part of the reason why Phaser avoids the DOM drag event entirely (though it could also be not wanting to create something drag-able over the top of the canvas) and rolls it's own drag events based upon touch/mouse down/up events (I noted this in another thread recently as the current Phaser implementation doesn't distinguish between click and drag that well when dragging is enabled apparently)

 

The levels are not finalized yet, and might have some problems. I created a Level designer to create multiple levels really quick, I will show this later.

 

Didn't test multitouch, my fault. Anyway, thinking of a change of the Button input type on mobile devices. As you suggested, something like touch and hold/move, this is not implemented yet and needs some testing too.

 

Just don't get the tilt problem. Tilt worked on any device which has motion sensors, I've tested the game on. 

 

Thank you for testing

As per my edit to the previous message, part of the issue with tilting (at least today, I'm not sure to what extent it was an issue previously) was the manner in which I was tilting, or rather the axis I was tilting about.

The device was held so that it was directly facing me and such that down in the game was down for the device/me. So to label the axis: Y would be up/down for both me, the game and the device; X would be left/right for me, the game and the device; and the Z axis would pass through the front and back of the device's screen.

I was rotating about the Y axis (as indicated by the in game graphic) where the game was only responding to rotation about the Z axis. I hope that better explains what I described in my previous post (initially described poorly as I had only noted my rotation seemed to be almost entirely ignored)

[markusT]

Well maybe it's a software issue, but any touch control of the game is based on Phaser input and as you mentioned, Phaser has it's own touch events. This also happens on DOM or SVG based rendering, it will also pause CSS based animations on my device. I didn't investigate a whole lot of time to get a solution for this problem, but you're right it might be the browsers own touch handling event which has to be cancelled first.

 

The game only responds to Z axis input... strange. And too much rotation on the Z axis will show the lock screen and pause the game? Unforgivable.... That happened not on any device i've tested the game on. 

 

I will have a look at this problem. Meanwhile you could take a look at the gyro input main concept...

 

http://www.inkfood.com/mobile-accelerometer-input/

[chg]

The game only responds to Z axis input... strange. And too much rotation on the Z axis will show the lock screen and pause the game? Unforgivable.... That happened not on any device i've tested the game on.

Sorry, no lock/pausing was observed. I think I confused things with my complaint about having to reload(?) - I just meant that at the moment there is no way to get out of the game and back to the menu/settings, if you kill yourself on purpose on the spikes you just restart the level.

I will have a look at this problem. Meanwhile you could take a look at the gyro input main concept...

 

http://www.inkfood.com/mobile-accelerometer-input/

Ok, it looks like the deviceorientation data returned on my Nexus for alpha beta & gamma is crazy.

The data from the accelerometer looks good (eg. from DeviceMotionEvent.accelerationIncludingGravity) but the compass data is really messed up. The sensor data is combined in deviceorientation leading to it being messed up by the bad compass data I believe.

I'll have to look into whats going on further myself, sorry to muck you about...

[markusT]

Sorry, no lock/pausing was observed. I think I confused things with my complaint about having to reload(?) - I just meant that at the moment there is no way to get out of the game and back to the menu/settings, if you kill yourself on purpose on the spikes you just restart the level.

 

There is a pause button on the top left of the game screen. In the pause menu you have the options to go back to the main menu or resume the game.

 

 

Ok, it looks like the deviceorientation data returned on my Nexus for alpha beta & gamma is crazy.

The data from the accelerometer looks good (eg. from DeviceMotionEvent.accelerationIncludingGravity) but the compass data is really messed up. The sensor data is combined in deviceorientation leading to it being messed up by the bad compass data I believe.

I'll have to look into whats going on further myself, sorry to muck you about...

 

Just recalibrate the compass. Open your compass app and recalibrate, that should do the trick. 

[chg]

There is a pause button on the top left of the game screen. In the pause menu you have the options to go back to the main menu or resume the game.

Well now I feel silly, I dismissed that as a status display, like the health flags on the opposite side.

 

Just recalibrate the compass. Open your compass app and recalibrate, that should do the trick.

Compass calibrated and confirmed working in multiple apps, browser restarted, device rebooted, issued persists. Seems to be some kind of browser bug using "sensor fusion".

Gamma vales varies between -90 and +90

But Beta varies between around +25 and +90 and NaN outside of this range, it seems to be NaN quite alot of the time! 

Alpha varies between 0 to just shy of 360 but won't do values between around 110 to 245, it will jump between these readings (the exact range of values skipped seems to vary based on the other values)

I think I'm not the only one seeing this in the latest version of the browser (as per below links) but I can't see any other way to tweak the browser. I think that means I won't be able to test the tilt unless it has support for say using DeviceMotionEvent.accelerationIncludingGravity() to derive it, which is probably not worth implementing unless the issue is widespread.

 

https://code.google.com/p/chromium/issues/detail?id=382890

https://code.google.com/p/chromium/issues/detail?id=223229 (last comment)

[markusT]

I think I'm not the only one seeing this in the latest version of the browser (as per below links) but I can't see any other way to tweak the browser. I think that means I won't be able to test the tilt unless it has support for say using DeviceMotionEvent.accelerationIncludingGravity() to derive it, which is probably not worth implementing unless the issue is widespread.

 

If it's just a browser related problem, just try another one. Anyway, thank you for testing..

[chg]

If it's just a browser related problem, just try another one. Anyway, thank you for testing..

Well I transplanted the Chrome code behind DeviceOrientation into a sample Android app; I was able to reproduce the issues and I hope as a result the extra info I posted to the Chrome issue tracker will help the issue get resolved. Anyway, that me done testing for now sorry...