ionDrift:epsilon (3D anti-grav racer using Canvas 2D)

[b10b]

Game can be played at http://b10b.com/iondrift/epsilon/html5/

 

3D futuristic racer with speed boosts and trance music. Game controls:

• Cursors (or WASD) to steer, Space to select
• Or touch screen virtual joystick (drag to move)

Features 3 unique tracks each with 2 events:

• "Time Trial" to beat the clock or personal best over 2 laps
• "Race Opponent" place first against an AI driver over 5 laps

Speed of vehicle automatically increases (up to 200%) as more levels are unlocked.

 

 

I ported this game from a Flash game we made a couple of years ago.  It uses a Mario Kart "mode7" type pseudo 3D engine to create the ground plane, and billboard 2D sprites for the scenery items.  No WebGL or 3D transforms are used, this is just Canvas2D drawImage calls.

 

The original game was made using Haxe and awe6, so porting it to Html5 (via OpenFL) was easy enough for the gameplay aspects.  But the rendering performance was a challenge, and we ran into problems with GPU memory limits and slowdowns as texture memory was moved around in accelerated modes.  Ironically non-accelerated modes performed better.  Therefore developing workarounds took most of the (limited) time we had available.

 

User interface isn't great for mobile, nor is input method or framerate - so mostly intended for desktop usage.  This was my third Html5 experiment and I continue to be impressed with it's capabilities and the default debugging tools available in browser.

 

 

[mentuat]

looks great and runs smooth on desktop, it crashed chrome a couple of time on a Samsung Tab 2 (not seen that before) and on an iPad air it seemed to get as far as loading the game but would not display the ground texture or seem to move

[skiffcz]

Asus fonepad (7", android 4.1,intel chipset)

- chrome crashes on race start

- browser loads everything with some texture issues, sounds trying to play (i guess they would have if the performance was not 5fps)

 

desktop (pretty old laptop):

- awesome performance even on high details, im impressed

 

unsorted notes:

- I like the dilemma between going with the better inner lane versus taking the boost on the outer lane

- Track design and UI design is really cool overall and all the details add to the "feels right"

- I hate the engine sound not looping seamlessly (I know the html audio sucks big time, but maybe two overlapping tracks?)

- The whole concept of rocket propelled racing calls for much narrower tracks and faster experience. See SW Episode I Racer

- It would be awesome with multiplayer support or at least scoreboard. Technical side is excellent, but singleplayer gets boring really fast.

 

The engine is really fine tuned though for desktop. Id build something awesome around it if I were you. Add multiplayer, port battlezone with that and Ill pay $100 for an annual subscription.

[rich]

Very nice! Only played it on desktop but of course it ran really smoothly.

[b10b]

Thanks for taking the time to play the game and give feedback.

 

My next effort will be a mobile game.  I look forward to applying what I learnt here (small hints like the overlaying sound and the devices used to test are very useful).  Html5GameDevs.com is a supportive community, thanks.

[Varyn]

very well done. i thought the controls were very responsive which is always what makes or breaks these types of games.

[b10b]

Sorry to add to an old post.  We just ported this game to CreateJS (via Haxe + awe6) for a side to side comparison in performance against the OpenFL HTML5 renderer.  Changes were minor, improvements were major.

 

Original OpenFL version:

 

http://b10b.com/iondrift/epsilon/html5-openfl/

 

New CreateJS version:

 

http://b10b.com/iondrift/epsilon/html5-createjs/

 

Preloading audio via CreateJS seems slower but in all other regards it looks like the stronger option.  Really impressive library, we didn't encounter any odd gotchas.