My colleague and me made an HTML 5 iPad game ( http://braille.gandzo.com/ ) and we would like to upgrade it, and our framweork is not enoguh, for what we want. Some of the things we would change are: graphics update, animations/"effects", multi-player, achievements and so on. The game would stay 2d. Now, as far as I understand, both Unity and Cocos would be good for this task, with Unity having the advantage of being multi-platform.
What I want to know is are there unknown qualites/"flaws" to these two programs which would influence my decision (maybe even by choosing something else). Examples that come to mind are "Unity is too complicated/has too much unneeded options/hoops because it's made with 3d in mind" or "Cocos is significantly more suited for 2d games".
If the game is pretty much in 2d... I would suggest for cocos2d. I am working on cocos2d for past 1 and half years... I don't have experience in Unity but ya my colleagues who used to work on Unity had so many problems with animation, texturing etc.
BTW I was not able to play you game on my Chrome. :)
Related
For the past year I have been working on an isometric city builder. So far I have not used any framework apart from a loose PureMVC clone.
I have heard of Starling but only recently have I played with it.
From my research, the performance boost is fenomenal, but this forces me to manage my resource a lot tighter.
At the moment, I am exporting building animations one building at a time, in ~16 frames/pngs. These are cropped, resized and exported in Photoshop by a script and then imported in Flash, then exported as a swf, to be loaded / preloaded / postloaded on demand.
The frames are way too big to make a spritesheet with them, per building. I believe its called an atlas.
These pngs are then blited between lock() and unlock(). After the buildings + actors walking around are sorted, that is.
I am unsure if just using starling.Movieclip for the buildings, where instead of loading the pngs, I would build a MovieClip symbol with its frames. So bliting wouldn't even be necessary. Unless adding bliting on top of Starling would improve performance even more. That would allow fatter features such as particles effects, maybe some lighting.
Google isn't offering me a strait answer, thus I am asking here.
Google isn't offering a straight answer because there isn't such. It depends very very much on what you've done, how much knowledge you've got and what are your goals.
Using Starling gives benefits as well as drawbacks. Your idea of resources will change totally. If you really have enormous amount of assets, then putting them into GPU will be really slow process. You must start from there - learn what Starling does, how resources are managed with it and what you need to change in order to make the transition between the two.
If this is not that hard and time consuming task, you will have some performance optimization. BUT again it depends on your current code. Your current code is really important in this situation as if it's perfectly optimized your gain won't be that much (but commonly would still be).
If you need to switch between graphics regularly or you need to have dynamic assets (as images for example) you must keep in mind that uploading to GPU is the slowest part when talking about Starling and Stage3D.
So again, there is not a straight answer. You must think of GPU memory and limit, GPU upload time, as well as assets management. You also need to think of the way your code is built and if you are going to have any impact if you make the switch (if your code heavily depends on the MovieClip like structure, with all that frames and things) - it will be hard for you. One of the toughest things I fought with Stage3D was the UI implementation - there is almost only Feathers UI which will take you a few weeks to get along with.
On the other hand, Starling performs pretty well, especially on mobile devices. I was able to maintain a stable 45fps on a heavy UI app with a lot of dynamic loading content and multiple screens on an old iPhone 4S, which I find great. Latest mobile devices top at 60fps.
It's up to you to decide, but I'll advise you to have some experimental long-lasting project to test with, and then start applying this approach to your regular projects. I've done the dive to use it in a regular very tightened deadline project, and it was a nightmare. Everything worked out great, but I thought I would have a heart attack - the switch is not that easy :)
I would suggest using DMT for rasterizing your vector assets into Straling sprites at runtime, and it'll also keep your DisplayTree! meaning that you'll still have the parent/child relations that you had in your Flash Assets.
DMT will not duplicate assets, and will rasterize the vectors into texture atlases only one time (Cache is saved)
you can find it here: https://github.com/XTDStudios/DMT
I'm a beginner in programming world, never touch any programming language before. But last 3 days I decide to try make a flash game, I looked some tutorial about AS3, try it, yes I understand a little bit. But I'm still confused about this:
How do I know or to decide what codes I write first, what next? example: I want to add a hero, then a enemy, then a tiles, then a background, event listener.
Is it okay if I write code randomly, example: first I add enemy, then add tiles, add background, then add hero, etc?
What is the best way to completely learn all AS3 codes, especially about flash game dev?
I'm now in frustration mode, so I decide to learn from you all who have mastered AS3.
Check out this guide by Michael James Williams. I was in the same situation as you, and that guide helped me a lot. It goes through a lot of the basics and does a good job of explaining each step.
To answer some of your questions, the order in which you code stuff doesn't matter too much. You can always go back and adjust your old code, and you'll definitely end up doing that at some point.
For learning AS3 syntax, just look through some examples and tutorials, and don't be afraid to read the official AS3 docs. They might be intimidating at first, but once you start learning some of the terminology, they're very helpful.
you can try some video tutorials like these
http://www.lynda.com/ActionScript-tutorials/AS3-language-fundamentals/123492/129625-4.html
http://www.lynda.com/Flash-tutorials/Building-Flash-Games-Starling/98951-2.html?srchtrk=index:1%0Alinktypeid:2%0Aq:flash%2Bgames%0Apage:1%0As:relevance%0Asa:true%0Aproducttypeid:2
If you're frustrated NOW, are you sure that you're ready to invest a couple of YEARS in becoming half-good with Actionscript? You'll have to like learning from your mistakes (an excellent way to learn, actually), because you will make thousands of them and they will cost you thousands of hours!
Do NOT write 'randomly' unless you want to greatly lengthen your time to mastery. Everything you do should have a purpose. I would start (if I were starting again) by giving myself a series of the smallest challenges: make an object appear; make it disappear; make it appear in one second from now; make it appear when I tap a key or click my mouse; make it move across the screen; make it move back; make it follow my mouse... etc.
There are many hundreds of basic programmatic elements like these that will add to your growing grasp of logic, data-structures and language. There are usually many ways to accomplish the same task -- learn and practice all of them.
Luckily, the Internet is full of good tutorials and references to Actionscript, and some decent forums like this one where you can get help.
I know this is king of old but someone might still find this useful.
I think that if you are serious about game development and also want to learn some techniques that are independent of the platform (Flash/AS3 in this case) you should use a framework.
For Flash the best game framework is the Starling along with Feather for UI.
They run on Stage3D which means that run on the GPU not the CPU which make them very fast.
With Starling you can also create mobile games that run in AIR so I think it really is something to consider.
On hsharma.com you can find a free video tutorial that goes through everything you need to know to get starting with game development so it should answer the question on how to create enemies, backgrounds, etc.
Hope this helps someone.
I'm making a flash app for AIR. The app is mostly made, but I'm not happy with rendering speed on mobile (render mode - gpu).
I know there is a framework that allows user-friendly way to work with Stage3d called Starling, but I've never used it.
After looking into it and following through some tutorials I've noticed that I need to rename all package flash default classes, e.g flash.display.DisplayObject -> starling.display.DisplayObject.
But such action might be destructive to my code base, plus, I have other frameworks attached that work with some flash package classes.
Is there a way to attach Starling to a complete project without re-naming all the package names, changing assets and re-factoring all frameworks that work with default AIR API?
If you're thinking of switching to Starling, you'll have to redesign your whole rendering code. Starling is no drop-in solution. Just renaming classes in your existing code will not do because it completely replaces flash display list for Direct3D, which does all it's rendering with GPU, with all the differences it brings: bitmapped graphics, texture atlases, careful draw ordering. Learning curve can be a bit steep in the beginning but once you get familiar with basic concepts it's a breeze to work with.
IMHO, it's well worth the effort, especially on mobile. Code that ran in low 10s of FPS in classic display list can easily be made to run at solid 60fps with Starling. Basically, for flash on mobile, Stage3D is the only game in town. And Starling is the best supported and widely accepted framework for 2D stuff on Stage3D, with lots of supporting libraries and a very helpful community of developers.
Go on, take the plunge, you won't regret it.
You can run Starling and a native flash application layer at the same time but it wouldn't give you an optimum experience.
If you want to take full advantage of the gpu acceleration of Stage3d and Starling though it would be preferable to refactor your existing code to use Starling display objects rather than Flash display objects.
You might want to post this question on the Starling forum, they are very helpful guys and it's a thriving developer community! - http://forum.starling-framework.org
I'm here to ask for help.
I'm trying to implement a simple Slots (casino) game for Android and iOS in html5.
My company asked me to look at frameworks that will speed up development.
So I've chosen KineticJS, because of good design and tutorials.
The project is mostly completed, but there is an issue:
it runs great on the iPad and iPhone5 but not so good in Android.
At the very least it must run on Android 2.3.
I used the kineticjs library to increase development speed and surely it helps, but the price for that is rather harsh.
I changed most of my Kinetic.Image objects to Kinetic.Shape, and it kinda helped performance a bit.
Also I stripped down some of the unused variables and now I'm using
this format: (var i =0, ln = something.length; i < ln; i++) for loops.
I realize there is also a cache but I am kinda scared of losing control, since I am still developing it.
What else can I optimize to help solve this situation?
Maybe stripping down some of the highlights and animations in Android.
The worst situation so far is the loading of the client itself on Android.
It doesn't load on first load very well, sometimes it position objects incorrectly.
Well if you know any magic tricks to speed up Kineticjs game, then please let me know.
Sorry but I can't provide a demo right now, since I am still developing and it will affect testing.
Thanks!
paper.js
EaselJS
fabric.js
KineticJS
Hello guys I am new in html5 canvas development and I am lost in choosing canvas frameworks. There are so many of them that I can't find out what to use. So here I am! I want your help to choose which one is better for my needs. There are my needs
1) I want the framework used Vector graphics, I know canvas is not DOM, I realy don't care about it but what I mean is I want to manipulate with objects after its creation, PaperJS has this feature I don't know about others. If advanced mouse events will be available it would be better.
2) I want to use the framework for images, I will load image and animate them with canvas, move, animate some colors...
3) I want the framework to be fast because of my needs (image animation should be smooth)
4) I want the framework to have good community because I know I will need some help.
So what do you think which one is better for me? and please if you can write down from my list which are the strength and weakness for each framework?
HTML5 canvas is still very fresh environment. You can get impression there is a lot of tools already available, they are often quite immature though.
My answer will cover only part of your question because I used only KineticJS and EaselJS.
You can start from reading opinions at this page (mine is the last one at the bottom).
Speaking shortly KineticJS has lower entry barrier. It's simple drawing library and has some support for mouse events too. At the time I was trying to use it it was barely extendable. I found it really hard to customize for my needs.
EaselJS is a bit harder to start with, but it's more advanced too. Now it's part of other libs set known all together as CreateJS. It seems that lot of development going around there.
Both Kinetic and Easel supports mouse event. I don't remember
well the Kinetic, sensing 'onMouseOver' is costy with Easel though.
Also both mentioned libs allows objects manipulation. You can find
here TweenJS also useful as addition.
Again both Kinetic and Easel allows this. Easel also has support for
sprites - 'animated images' well known for web game developers.
I'm not sure about Kinetic as I haven't reached animation part of my
project before I dropped it (the lib, not the project). With Easel
speed is tricky. It has some optimization methods implemented like
for example objects cache or snapToPixel flag. Examples seems to run
really well. However for my project using Easel smoothness still is
an issue despite quite a lot of effort put in optimization. Maybe I
misused the API or there is still place for more optimalization I
haven't noticed.
Both libs are quite young but seems to be actively developed.
Authors are rather responsive. Community still isn't big, but I
guess CreateJS as more complete set of tools for creating games will
grow faster.
If you want to check here is the project I mentioned. It's a web page made with usage of EaselJS + TweenJS. Still needs some minor tweaking though.