Jump to content

Recommended Posts

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 partners@softgames.de.

Top 10 Tipps for HTML5 Games

  • Game 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 partners@softgames.de.

P.S. We created special plugins for e.g. Construct 2 plugin to make connecting to our API like a piece of cake!

 

Thanks!

 

Link to post
Share on other sites

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.

Link to post
Share on other sites

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.

Link to post
Share on other sites

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. ;)

Link to post
Share on other sites

@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.

Link to post
Share on other sites

@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.

Link to post
Share on other sites

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/

Link to post
Share on other sites

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.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...