Is this plausible in Phaser?

[Splashsky]

Hey guys. I'm completely new to the HTML5 game development arena (and actually quite new to game development in and of itself), and I saw that Phaser is a highly recommended framework for JS game development.

 

What I was wondering is if it's plausible and good to use Phaser for a game like Rage of Bahamut or Kantai Collection. Both of them require multiple screens with different actions on each, both require simple animations and calculations, both require events/things that recharge over time, etc...

 

Would Phaser work for this, and if so, are there any tech demos/examples which can help me get started on a game like those?

 

Thanks!

[lewster32]

Possible yes. A good choice? I'd have to say no. Given these games contain lots of text, buttons and controls, I'd say using CSS and HTML for your game would be a better choice, and use JavaScript to drive it all. I think this would be a project suited to something like AngularJS, Ember or Backbone.

 

Phaser's main strength lies in providing a framework for building more traditional arcade-style games, whereas games like Rage of Bahamut stem from 'browser games' in the truest sense, games that are pretty much just fancy websites.

[SoulBeaver]

Lewster, are you sure? It looks as if most of the game is taking place in a canvas. I don't see why such games cannot be implemented in Phaser and complemented with a website built with Ember, or others. The only obstacle I see is that Phaser doesn't have premium networking support, and that could be relatively difficult to implement. Of course, I'm still new to Phaser as well and *very* green around the ears. I would very much like to hear your reasoning for considering Phaser as a less viable choice compared to other implementation strategies.

[Splashsky]

Well, while I agree on the point about Phaser being more for arcade-like games and them being fancy webpages, I'd like to point out that Kantai Collection and similar games in the browser typically run on Flash. I suppose you could say that my real question is "can you clone Flash games in HTML5", and the follow-up is "what framework would be best for it?"

[lewster32]

What Phaser lacks right now is a mature and fully featured UI framework, which is something that will be very important for these types of games with their reams of text, buttons, lists, dialogues and so on. With Flash you have the likes of Feathers for Starling, and HTML+CSS also does this really well (perhaps better than people will initially give it credit for) but if you were to implement this kind of game in Phaser, you'd need to put a lot of work into getting things like touch scrolling, text wrapping and flowing, tables and all of the other stuff that you get natively in HTML and CSS. There's possibly a case for using a mixture of HTML, CSS and Phaser for the parts of the game with animations and so on, but I still think Phaser is maybe overkill for those parts too, which may be better served by just using pixi.

 

As for the networking, I'm not sure a game like this requires particularly clever network code - I think it'd be served fine by a RESTful API on the server and some ajax calls on the client.

 

This isn't to diminish Phaser in any way; there's no better HTML5 game framework out there in my opinion, but these kind of games would be using maybe 10% of Phaser's features, and need to you write from scratch a lot of what the browser environment Phaser runs in does for free. In that situation it seems better to just go with the easier option - I don't see what Phaser could specifically bring to the table with games like this that would make it a better choice.

[Splashsky]

Well, fair enough. Honestly, though, I'm not sure how to go about it. Flash is something I want to stay away from at all costs; from everything I've read it's inferior to the web as it is. Are there any frameworks within the HTML5 development world that have plugins or native support for UI elements? 'Cause at this point the UI is the biggest pain in the arse I'm seeing.

 

Though, thinking of what they plan to do with Phaser (that is, letting you choose which components to download) would make it not all that bad to use Phaser for the generally non-UI parts. Would you know of any UI plugins for Phaser? If not, might be prudent to learn how to do it myself, then make a plugin for Phaser.

 

EDIT: It's come to my attention (after thoroughly looking at the Phaser.io examples) that Phaser does indeed support basic buttons. That's really all I need right now. I mean, progress bars wouldn't be too difficult to accomplish, and the only other thing that's necessary is moving sprites around. Being able to click on images and click buttons are all that is - at this moment - necessary. The Tanks example also helps for whenever I decide to add a more... interactive combat system.

[SoulBeaver]

If you're okay with an alternative programming language that is close to ActionScript, checking out Haxe might be worth your while. They have some good UI libraries to use with HaxePunk, HaxeFlixel or Flambe. Maybe check around there?

[lewster32]

Here's a plug-in though I'm not sure if it's still under development, how well documented it is or how flexible and configurable it is: https://github.com/drawapp8/gameui-for-phaser-js

 

I'd still personally rather approach a project like this primarily from a standard HTML+CSS+JS app rather than try to shoehorn a lot of features already present in the browser environment into Phaser. Certainly creating a good UI library is not a simple proposition.