Alexander Krug Posted February 28, 2014 Share Posted February 28, 2014 Hi, its been a while since my last post, but today I would like to update what we have learned while licensing over 250 HTML5 games in the past 2 years to maybe make developing games a little bit easier for you! If you have a great game please feel free to contact us for exclusive or non-exclusive sponsorships at [email protected].Top 10 Tipps for HTML5 GamesGame texts: Do not put game-texts on images, within your game-code or your css/html code. The one and only right place for texts is a seperate file, that stores your texts. Furthermore always provide a separate file with all texts your game uses. This file usually just contains an json-object like this: var mytexts = {'en':['this is englsh',...], 'es':['esto es español',...]}. This will make localization much easier for all sides!Loading time: Be efficient with the game assets and include a loading bar while testing your game on EDGE, 3G and not only WIFI.Size: Your game should not be larger than 3 MB including all assets, code and sound files. The less size the better! If you use sound make sure it can be switches on/off via an ingame button.QA: Be aware that different operating systems have their very own strengths and weaknesses, while tablet and HD devices are getting very popular. Try to test it on as many real devices as possible!Fullscreen is King: Make your game auto-resize by any resolution. This also includes hiding the URL bar to create a more native like experience.Tutorials: Create more player interactivity and less text. Players hate to read and want to play. This also applies to the tutorial!Gameplay: If advancing in HTML5 games programming try to create something unique and not another Construct2 physic game. The key to success is a good balance of appealing casual graphics, smooth gameplay with long play sessions and giving the player a reason to complete the game within multiple game sessions.Landscape or Portrait view: When designing your games decide already at start if you want your game to use portrait or landscape format. Show the player a simple icon to change orientation, if needed. Don´t let the game scale to e.g. landscape mode when it´s optimized for portrait!Payments: If you are based in the EU make sure that you get a VAT-id to avoid additional taxes on your payments. If based outside of EU get a certificate of incorporation or a certificate of residence.Invoices: Create fast and easy invoices through various online invoice creators as e.g. http://invoice-generator.com/#/ or any other! We will be posting more insights soon and hope you enjoy them! Contact us for exclusive or non-exclusive sponsorships at [email protected].P.S. We created special plugins for e.g. Construct 2 plugin to make connecting to our API like a piece of cake! Thanks! fatalfluff and OadT 2 Quote Link to comment Share on other sites More sharing options...
Sebi Posted February 28, 2014 Share Posted February 28, 2014 Nice list. Hiding the URL-bar is not possible on all devices due to security reasons. To hide the bar you would have to place your game into a webview which will then use the stock browser to render your game and cause pretty low fps at least on android. I think right now there is no way to avoid native if you plan to release a game for android/ios. That is actually easier than most people would think. Most important is to keep the code as clean as possible. For the fullscreen part:I do agree on this. But that is not easy to do. 1. You need different graphic assets for different screensizes. If you use your mobile assets for tablet/desktop screensizes then it will be all blurry. If you use your tablet/desktop assets for mobile you will be wasting a lot memory.2. You have to decide how to scale the screen. Have blank areas to either left/right or top/bottom side or cut the nonfitting part of the stage.3. And you have to place your sprites in relative position to the screensize. About tutorials: For my first game that I will hopefully finish this weekend, I don't plan to write any tutorials at all but to keep the game mechanics simple. The user will have to figure out how to play and that can be a nice experience instead of just telling people what they have to do. I'd like to know how you deal with displaying HTML5 Games on mobile.Are you displaying the game in a webview or are you creating native versions of your games? I stepped away from "write once for all" for now because the risk is too huge to lose out on users. Instead just keeping my code as clean as possible to be able to rather easily port it to native. Quote Link to comment Share on other sites More sharing options...
LastDragon Posted February 28, 2014 Share Posted February 28, 2014 Great tips for both beginners and experienced game devs... Quote Link to comment Share on other sites More sharing options...
snowkie Posted March 1, 2014 Share Posted March 1, 2014 hmm, resizing all the assets to make a games to be available on HD and non-HD is a bit tricky.. especially to aim 3mb game size Quote Link to comment Share on other sites More sharing options...
ozdy Posted March 1, 2014 Share Posted March 1, 2014 Good list, although it seems a little bit SoftGames oriented. I've gotten deals with other sponsors while "breaking" 6 of those tips Quote Link to comment Share on other sites More sharing options...
alex_h Posted March 3, 2014 Share Posted March 3, 2014 Regarding the game 'size' requirement, is your concern the overall bandwidth cost to the user or the amount of time they are prepared to wait for the game to load up front?If it is the latter then presumably I could work around this restriction by preloading some of my assets after the game has already begun? For example my initial load might come in under 3MB but perhaps I then preload some more images and sounds that are used for later levels while the game is being played. Additionally if your chief worry is waiting time for the user then sounds that are used for HTML5 audio tags shouldn't be included in the 3MB quota since they are not preloaded and the user doesn't have to wait for them. Quote Link to comment Share on other sites More sharing options...
Alexander Krug Posted March 3, 2014 Author Share Posted March 3, 2014 Hey guys, thanks for the feedback! @ Sebastian: We dont use webview - as we purely distribute our licensed games via web - thats why I also posted the info about hiding the URL bar, where possible.About Fullscreen: You are absolutely right, this is what needs to be done to have high quality games. Good summary! @Ozdy: True, but thats where our experience is coming from ! I believe quality will rise in the next months so eventually also other sponsors will require this. @Alex_h: Yeah, mostly the waiting times are the main issue we have been seeing as people simply hate to wait and HTML5 games should keep an instant access&play policy. If you have a good workaround everything is possible and definitly not limited to 3mb.From my market understanding bandwidth costs shouldn´t be a major issue anymore.(unlike 2 years ago)..of course there are still some market exceptions. Quote Link to comment Share on other sites More sharing options...
alex_h Posted March 3, 2014 Share Posted March 3, 2014 Cool, that's good to know that work-arounds are seen as acceptable for the size restrictions - thanks! Quote Link to comment Share on other sites More sharing options...
Sebi Posted March 3, 2014 Share Posted March 3, 2014 Are there any numbers to compare the ad revenue of solely web distribution vs. web + mobile distribution?Depending on the game, I believe the ad revenue that you lose by not distributing to the android/ios app store will be greater than the cost to port the game. Quote Link to comment Share on other sites More sharing options...
ozdy Posted March 3, 2014 Share Posted March 3, 2014 @Ozdy: True, but thats where our experience is coming from ! I believe quality will rise in the next months so eventually also other sponsors will require this. I'm fully expecting quality to rise, and I believe my games are above the HTML5 average game. However, none of your tips is about game quality or am I missing something? EDIT: Maybe the "gameplay: tip, but so far I'm doing almost only physics games, so I guess I break that tip too. Quote Link to comment Share on other sites More sharing options...
totor Posted March 3, 2014 Share Posted March 3, 2014 @Alexander Krug, do you provide a framework or a library that enforces your javascript requirements (like hiding the url bar) adapted to all the devices you use to test games in your QA department? Or do you have a zipped html5 template games with all the files you need as an example for what you are looking at when people submit games to you? it would be very helpful. Quote Link to comment Share on other sites More sharing options...
Neoprofessor Posted March 5, 2014 Share Posted March 5, 2014 I posted some examples of JavaScript after I was just turned down for those reasons recently. You can the examples here:http://www.scirra.com/tutorials/877/hiding-the-address-on-mobile-browsers . Since then, I've been doing a lot of work to get it right. I received a very courteous email with an important checklist of those issues covered above and few others from a representative of softgames.de. I'm very grateful for the insights and while I've made major enhancements, I'll be doing even more over the next few days. A real eye opener that I really appreciate. I've also tested on more devices and use web based emulators to test. You can see my games here http://www.neoprofessor.com/ Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.