In order to get the best result on CocoonIO using Construct 2 as Framework you should use the recommended Project Settings.
Always use a loader layout! This lowers the black screen gap on the first game start. So set this to On and setup your Loader Layout.
Set this to “On”. This will reduce the CPU Usage needed for rendering positions. So if your object has the position 103.243, 123.232 it will be rounded to 103,123.
To fit best on both, a mobile phone and a tablet, it’s recommended to use a 16:9 screen ratio (1280,720). But the latest tablets are using mostly 16:10 display ratios, so I personally recommend you a Window Size of 1280×800 px.
Fullscreen in Browser
Games made with CocoonIO do not support any Letterbox Scale methods. Only Scale Outer and Scale Inner are supported. I personally recommend you to use Scale Outer.
Let this on High Quality (default value).
Use high DPI Displays
Let this on Yes! Mostly each new device has a high DPI Display (especially Apple devices).
Set this to On! Otherwise your game scaling will not work like it should. Moreover the overall performance is better then.
Use here the Box2D web engine.
Do not use the new Construct 2 Splash. This will lead to a black screen and your game crashes right after start. Moreover do not use any loader style with a progressbar while using Canvas+. Due to the fact that Canavs+ do not support progress bars (DOM restrictions)
Following settings are optional, but recommended.
If you have a lot of sound files in your project, this option can cause a long gap (Black Screen) on start of the game. Just set this then to off and preload the sounds manually when they are needed.
If your game background is coverd by an object, like a background image, set this option to No.
If you are using any of Ludei’s Cocoon Plugins, make sure that you add the condition “Is Canvas+” BEFORE you use any actions or conditions of those plugins.
You find the Construct 2 templates attached to this post. Just click on the (+) below.