Tag Archives: develop

WordMix on tablets, learning Japanese

A recent WordMix update brings much improved support for Android tablets as well as experimental support for Japanese dictionary.

Improvements to the layout for 7″ and 10″ Android tablets were long overdue, fixing some issues where activities and controls looked out of place because they were initially created and optimised for mobile phones.

WordMix in Google Play Store

Further I based the App’s theme on Holo for Android 4 and on Material for Android 5, ditching the DeviceDefault as a recommendation. In my experience, vendors quite often ship a DeviceDefault implementation, that is inconsistent, incomplete and quite often breaks visual appearance. In order to work around inconsistent presentation on some Android devices, I have decided to pin the theme to a set of known appearance with some custom styling, bringing a consistent look across all Android 4 and Android 5 devices (Android 2 and 3 support has been removed).

WordMix Pro in Google Play Store

Only new feature is the experimental support for Japanese as a language, including a Japanese dictionary (needs to be downloaded after installing the App). Japanese is particularly difficult to implement in this game due to the high number of different letters and combinations. Similar sound combinations have been combined as single letters, allowing to choose the specific sound by tapping on the dice. Feedback is appreciated!

As always, get it in Google Play Store, while it’s hot!

Water splashes

Sometimes tiny little details can make all the difference. If an egg in Chicken Tournament for Android hits the water, a watery particle system is spawned for the splash. This is just a modification of already existing particle systems but it feels super nice and looks flashy. Of course this is miles away from looking like real water but that’s not the goal and the pure reaction and feedback of an egg hitting the water does make all the difference.

Chicken Tournament for Android

Long time no post about the Android version of Chicken Tournament. But it’s doing very well, despite lack of time. 🙂 And the best, you can already check it out in Google Play!

Screenshot_2014-09-07-16-14-52

New particle systems

A couple of updates later, the completely rewritten game now features improved particle systems like blood, feathers and fire and comes with limited keyboard support. Especially the new feathers took careful design and tuning to get the physics right but I’m very pleased with the optic result and performance. Of course, cranking up the amount of effects, I’m sure it can bring every device down.

UI sound effects improve overall feeling and experience. Having in mind that this game was completely written from scratch using a self written engine and pretty much not reusing any code, I am extremely proud of the result.

Career mode

Screenshot_2014-09-07-17-50-27

The new career mode features an experience and skill system for your hero, level by level. You can collect different hats that will further improve your skills and stats.

In Google Play

Chicken Tournament Demo in Google Play
Chicken Tournament Demo in Google Play

 

The demo version can be downloaded free of charge, it’s ad-free but has a limited feature set. Those features are without limitations tough, like pay-2-win or In-App-Purchases. There is a fully featured full version, meant to support me and my work.

But some important features are still missing though, like:

  • Multiplayer mode
  • Playing as chicken
  • Highscores and ranking lists
  • More and more and more optimisations

I’m just one man, please be patient. If you find bugs of have suggestions, please email me at ct@saschahlusiak.de.

Screenshot_2014-09-25-21-48-16

Thoughts on Google Play Game Services and games

I recently updated the Google Play Game Services library of Freebloks 3D for Android and the BaseGameUtils, as recommended by Google. Not reading the ChangeLog, I was confused that my game tried to auto log in to Google on the start, disrupting the user experience I built around that. Even after dismissing the login dialog once would show the dialog again in the next Activity that is derived from BaseGameActivity or uses a GameHelper object.

Searching the Interwebs I found the FAQ, which explained the change of behaviour, and I am sad that the game itself once again becomes more and more insignificant:

The default behavior of BaseGameActivity and GameHelper is to show the user the sign-in flow (consent dialogs, etc) as soon as your application starts. Naturally, once the user signs in for the first time, they won’t see the consent flow again, so it will be a seamless experience. […]

The first time a game is started, the user will be prompted with a full screen dialog asking the user for consent to post on their behalf to Google+.  The user hasn’t seen anything of my App yet and still Google tries to put itself into the foreground. After the user signed in, this might become a seamless experience but being prompted with this dialog does not seem like a good experience. Especially because there is no warning or explanation of what this dialog does.

It is important for the user to sign in as early as possible so your application can take advantage of the Google Play Games API right away (for example, saving the user’s progress using Cloud Save, unlocking achievements, etc).

I noticed that usually I want to explore the game a little before signing in to Google. I’d like to find out if the game is a game I’d continue to play and once I get engaged with a game, I am willing to sign in to use the additional features. I know I am not an everyday user and I am aware that logging in to Google gives up some privacy. And before I haven’t decided to continue playing a game, I do not want any information to leak or social activity to be generated.

Obviously this reads to me as:

it’s important for the developers and Google to get user generated activity and data as soon as possible.

And is again another step towards games telling the users what to do.

If the user cancels the sign-in flow, BaseGameAcitivity/GameHelper will remember that cancellation. If the total number of cancellations reaches a predefined maximum (by default, 3), the user will no longer be prompted to sign in on application startup. If that happens, they can still sign in by clicking your application’s Sign In button, if you provide one.

Is not signing in to Google not a choice anymore but an error? If I dismiss the dialog because I do not give consent, is that assumed to be an error? Do I have to be prompted again even though I made the choice to not log in? Do I really have to dismiss the dialog 3 times until the game believes me that I do not want to log in?

The games are taking over!

I noticed the trend of games beginning to control users, of being needy, wanting attention, and developers seeing games only as a way to generate a stream of content or resources back to the developer.

Games these days:

  • show popup notifications that they want to be played.
  • make the user attend the game by long running tasks in the background that finish whenever. Building a building may take 5 hours, after which I have to open the game again.
  • want you to share everything on Facebook or Google+ (“Your creature took a dump. Share on Facebook?”). This is not to make you happy or to provide a game element, it is purely to attract other people and make them install the game.
  • tell you exactly and in detail how to use it. A lot of games begin with a 10 minute intro (“now click here”, “now buy upgrade”, “now shoot”) to make sure that the user understands the concept of buying upgrades and in game currency. This leaves very little room for experimentation and explorations, because users need to follow the strict predefined path that generates revenue.
  • lock you in. Using In-App-Purchases basically makes you rent the game, it is like Prepaid and the decision to stop playing a game is harder, because you have money that will expire. When you buy a game and own it, you have the freedom of choice to not play it. Buying your right to play the game over and over will most likely leave you hanging in an awkward spot when you decide to stop. Oddly enough these games are advertise as Free or Free2Play or, less often, Pay2Win.
  • use gamification to seem more interesting. Most games implement achievements in a way, so that they are not game elements. The Google Play services offer achievements that are outside of the game, meaning they don’t change the game flow, giving the user no actual value of an earned achievement. While the wording suggests the user benefits from earning an achievement, this is likely to drive engagement with the game but will not result in higher user experience or even fun. I fear the day users wonder about the motivation to achieve anything.
  • artificially restrict themselves but still take over your time. Why does building a house takes 5 hours sometimes, while the game does not any other game elements during that time? I’s making me hooked, telling me to go on with my day but of course I will always have the game on my mind and I have to come back after 5 hours. The game dictates when the user can play with it and when he can’t. It is not the users decision anymore to play and spend time with the game.

Where did the games go that gave power and freedom to the players to do what they want to do? With room to explore? With having game elements to actually fill 5 hours of time, then waiting and being ready when I come back to it? Where did the love go to provide the user with a fun way to pass his time?

This is not about the user anymore. He is not the customer, he is the good to be sold, the “conversion” to be made. The game is just the means and additional game elements are in the way. Games became a pure medium for developers and Google to say to users: “Give me your money”.

Where was I? Oh yes, disable the auto-login.

Easy enough the above behaviour can be reverted by

getGameHelper().setMaxAutoSignInAttempts(0);

but that’s not the point. Give the power back to the user!

moosic.fm in google play

The client app for moosic.fm is available in Google Play. It is by far my most polished and stylish app, that I developed for the German start-up moosic.

moosic.fm in Google Play
moosic.fm in Google Play

With moosic.fm you can keep track of the music that’s running in your favourite location. Browse past playlists or see what’s playing right now, all together with previews and cover pictures.

In the backend, the moosic listener listens to music in the background and uploads the recognized songs as a playlist. Users can browse these playlists using either the nice web frontend or the native Android App.

Note that the technology is currently being tested and evaluated. Kodus to T O-12 in Stuttgart for being available for the beta test and to Gracenote for their music recognizing api. For questions, don’t hesitate to contact the guys at moosic.de.

Screenshots

Chicken Tournament for Android in development

After more than 10 years I decided to port Chicken Tournament to current Android smartphones. Due to the differences between the platforms, this will result in a new game and a new engine, but because of lack of time and resources, I will reuse the models and most of the textures. OpenGLES 2.0 though allows me to massively improve the quality of the graphics.

The PC version and the android version will not be compatible.

Please follow the official Chicken Tournament facebook page to receive more information and updates. A very early development version allows driving the harvester over a plain using the accelerometer to steer. The chicken are nicely animated using vertex shader.

Development screenshot of CT for Android
Development screenshot of CT on my S3

In-App Donations in Freebloks 3D

Freebloks 3D for Android is the Android port of the PC version of Freebloks 3D for Windows and Linux. Like the PC version, the Android port is completely free software, available for free in the Google Play Store and the source code being available on GitHub.

I strongly believe in Open Source software and that it can help to make the world a better place by making knowledge and power available to everyone. While many hours of work went into the Android port, I feel good to completely open the software for others to study, to modify or contribute. A lot of my knowledge and skills come from the study of others work and my contribution to open source software is my attempt to give something back in return.

If you like Freebloks, please be encouraged to contribute, send be feedback, work on the code or support the developers with a donation. The recent update makes in-app donations available for users. These in-app items acknowledge the work of the developers and are completely voluntary. Freebloks will always be free but relies on your contribution!

So if you think, the game has some value for you, please consider a donation of your choice.

Screenshot_2013-05-05-10-01-35

Much improved AI speed for Freebloks for Android using jni

For the port of Freebloks 3D to Android I rewrote all code from C to Java. While that was working fine and resulted in greatly simplified networking code, the speed of the AI was not so great. It took up to 10 seconds on a fairly powerful SGS 2 for the computer to find a good move.

I was trying to move the CPU intense routines of the AI to C again, using jni as a bridge between Java and C. The simple network routines should stay in Java.

But the transfer of relevant game data to C and back to Java turned out to be very ugly, yet the solution was incredibly simple:

The Freebloks code was always split in two parts, the GUI/client part and the AI/server part, with the client and server always communicating using network sockets. Yes, even the single player version starts a network server and connects to localhost. The original source code always contained a package for running a dedicated server.

It was incredibly easy to copy the dedicated server code into my project, compile the C code with the NDK and connect it to Java with only a single jni call. It was running out of the box, with almost no change of the original C code at all! Since the server is running in a thread started from the native C code, there is no additional jni call neccessary and no data transfers except for the sockets.

The average duration for the AI to calculate a complete game dropped from 87 sec to 28 sec on my SGS 2. The version 0.0.2 in the Google Play Store supports ARMv5, ARMv7 and x86. Grab it now! You may also download a free apk file here.

And please don’t forget to give feedback.

Screenshot_2013-02-11-14-27-24

Out of Memory in GLSurfaceView on resume

The SympTom

After publishing WordMix with the OpenGL accelerated 2D game view (using GLSurfaceView), I received weird crash reports from some devices, mostly out of memory from within the GL context:

android.opengl.GLException: out of memory
 at android.opengl.GLErrorWrapper.checkError(GLErrorWrapper.java:62)
 at android.opengl.GLErrorWrapper.glGenTextures(GLErrorWrapper.java:350)
 at [...]

From the very limited information the Google Play Developer Console gives me about crash reports, I assumed it only affects devices running Android version 3. Modifying the code only caused the out of memory exception to be thrown at random other places, even at GL10.glClear(…)!

I also found out, the crash only happens when the user finishes a subactivity that would leave to the activity containing the GLSurfaceView. Users were complaining about the crash happening before starting a second game, which puzzled me, because all my rendering code seemed to be working fine on all devices running Android 4. Everything worked fine without the GLSurfaceView as well.

Looking that the source code for GLSurfaceView, nothing interesting was changed between Android 3.2 to Android 4, so the GLSurfaceView was hardly to blame, but more the hardware, drivers or specific OpenGL implementation.

The problem

The actual problem was very hard to track down and took me several hours and was particularly hard because I did not have an Android 3 tablet for debugging:

Up to Android 2.3, views were drawn in software and later composited using the hardware. Android 3 introduced an alternative hardware accelerated drawing engine for everything that uses Canvas classes. This alternative render path is disabled by default in Android 3 and supposedly enabled by default in Android 4 (previous blog post).

When I found out, that the Samsung Galaxy S2 does not enable hardware acceleration by default, I did set

<application android:hardwareAccelerated="true" ...>

in the AndroidManifest.xml for all activities that should support hardware acceleration. Using hardware acceleration for the activity with the anyway hardware accelerated GLSurfaceView did not make much of a difference. But accelerating the results or preferences activity, for example, gave a nice performance boost on my SGS2.

It turns out that the crash happens in Android, when an activity, that contains a GLSurfaceView, is paused for a fullscreen activity, that is hardware accelerated. When that hardware accelerated activity is finished, the underlying GLSurfaceView is screwed up, throwing out of memory exceptions, even though the GL context is completely reinitialized correctly.

The solution

Yes, I should have tested more the effects of hardwareAccelerated=”true”.

Leaving that attribute entirely unset is recommended for Android 3, especially when you use a GLSurfaceView, and should not hurt Android 4 devices as well. Setting a reasonable default value is then up to the manufacturers.

Summary

  • and suspend that activity by starting another fullscreen activity
  • and that activity is hardwareAccelerated by setting so in the AndroidManifest.xml
  • and you target Android 3 devices
  • expect weird behaviour like out-of-memory exceptions

Welcome to fragmentation. Just let hardwareAccelerated be unset.

OpenGL antialiasing in Android and transparent textures

I tried to replace the legacy 2D rendering code of WordMix, which uses the native Android canvas methods, with an OpenGL renderer to allow for fancy effects and animations.

First attempt

simple texture with full bleed image, no border

Because the tiles are simple rectangles with round corners, I created a texture with gimp and rendered a quad in OpenGL. The texture had no mipmaps and was filtered linear for both, minimizing and magnifying. When rotating that quad, I got the typical “staircase” lines, because I did not use anti-aliasing / multisampling. The result looks rather horrible:

no multisampling, no mipmaps, simple texture result in typical “staircase” borders

You can see two effects, one if it being the clear staircase borders, where the texture is not linear filtered, and you see the round corners of the texture with a grayish border, I’ll explain in the next paragraphs.

Multisampling emulation to remove “staircase”

So how to achieve multisampling in OpenGL ES 1.1? The answer I found is quite simple and easy on the hardware: use a texture with a transparent border and linear texture interpolation will do the rest. So I modified the texture to include a transparent border and rendered the quads slightly bigger to fill the same amount of pixels.

texture image with transparent border

The result looked better but I was not satisfied with the borders. I saw the interpolations but there is still a very visible “staircase”. Plus it seems, that the borders are blended with a black color, which can be seen on the overlapping tiles:

no mipmaps, texture with transparent border, still visible “staircase” and dark colored border

This is in fact due to my texture, which had the transparent pixels assigned the color black. The OpenGL interpolation would just average two neighbour pixels, which would calculate like

(argb(1, 1, 1, 1) + argb(0, 0, 0, 0)) / 2 = argb(0.5, 0.5, 0.5, 0.5)

which is a semi transparent gray color tone.

Monkeying with gimp for transparent pixel

So how to create a texture, where the transparent pixels have the color white? Gimp seemed to screw up the color of transparent pixels even though when exporting my work as png file, it offers to keep the color of transparent pixels.

The trick: combine all visible planes, create an alpha channel and change the color layer. If you have uncombined planes, the result is unpredictable and the colors are screwed up.

So now I had a texture with a white but fully transparent border (value 0x00FFFFFF) and I’d expect the calculation to be

(argb(1, 1, 1, 1) + argb(0, 1, 1, 1)) / 2 = argb(0.5, 1, 1, 1)

But I still got the same result:

texture with transparent + white border: still black border in Android

Bitmaps with transparent pixels in Android

So why is my border still black, while the texture has white transparent regions? I checked the loaded Bitmap with this code after loading the png resource:

Bitmap bmp = BitmapFactory.decodeResource(getResources(), R.drawable.stone);
Log.d("texture", bmp.getPixel(0, 0)); /* result: 0 */

Why is the result 0?? I’d expect a 0x00FFFFFF, but either Androids Bitmap loader premultiplies the alpha or recompresses the image file on compile, although I did place the image in the res/drawable-nodpi folder.

But apparently Bitmap and Canvas throw away all color information, when drawing with an alpha value of 0. This results in a fully transparent, but black canvas:

canvas.drawColor(Color.argb(0, 255, 255, 255), Mode.SRC);
Log.d("texture", bmp.getPixel(0, 0)); /* result: 0 */

while the following results in a white canvas, which is almost transparent (1/256):

canvas.drawColor(Color.argb(1, 255, 255, 255), Mode.SRC);
Log.d("texture", bmp.getPixel(0, 0)); /* result: 0x01FFFFFF */

Good to know, so now I create my texture with a border that is almost transparent, but not completely (alpha value 1/256) and the color white, which should be hardly visible, calculating like:

(argb(1, 1, 1, 1) + argb(0.01, 1, 1, 1)) / 2 = argb(0.505, 1, 1, 1)

I checked with above Log code and indeed got the value 0x01FFFFFF. So at least the Bitmap was loaded correctly now. But I still get a  black border and the result looks the same. Why?

Creating OpenGL textures with unmultiplied alpha

I found a post and bug report that apparently the GLUtils.glTexImage2D() screws with the alpha and colors too, creating texture values of 0x01010101, which gets blended with the nearby white pixels on linear filtering. What the…?

The post suggests a workaround to not use GLUtils to load the Bitmap into an OpenGL texture but use the original GL10.glTexImage2D(). While the code in that post is not very efficient, it does result in nice and smooth blended borders. Of course the use of mipmaps helps too to make the texture smooth when minified:

texture with 0x01FFFFFF almost-transparent border and use of original GL10.glTexImage2D method and mipmaps

Summary

Several culprits were found to make antialiasing work with an Android App using OpenGL ES 1.1:

  1. Create textures that have transparent borders, so linear filtering emulated oversampling at polygon borders
  2. Make sure the transparent border of your texture contains color values, which will “bleed” into the border pixels of the texture.
  3. If you use mipmaps, make sure you have enough transparent border pixels or set GL_TEXTURE_WRAP to GL_CLAMP.
  4. Double check result, because gimp does screw up when having multiple layers, that are merged when exporting as png image.
  5. Androids Bitmap loader and Canvas code seems to zero out the color values when alpha is 0. The workaround to keep the color values on load: Use colored pixels with alpha value of 1 (of 255).
  6. The GLUtils.glTexImage2D implementation premultiplies alpha values with color values, resulting in very dark color, instead of the white I wanted. Use the GL10.glTexImage2D directly (example in this post).

Using mipmaps and adding a nice shadow texture results in a screen, that looks very similar to the original, but which is much faster:

final result with all workarounds, mipmaps and shadows

WordMix learning Russian

The next WordMix and WordMix Pro release will include support for Russian, Portuguese and Dutch as dictionary languages. I had a lot of fun with the Cyrillic encoding of characters and especially the database for the words as I learned that a lot of Linux tools are still not ready for handling multi byte character sequences correctly.

Mostly the tool tr kept me busy, when I tried to convert lower case letters to upper case. The normal approach of

tr [:lower:] [:upper:]

only seems to work for the ASCII character set. If manually used on UTF-8 data, it screws everything up even more, like in the command:

tr \
  абвгдеёжзийклмнопрстуфхцчшщъыьэюя \
  AБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯ

The trick was to use tr on the original KOI8-R encoded data (which is 8 bit), for which I also had to pass KOI8-R encoded parameters to the tool, which was a pain inside an otherwise UTF-8 encoded shell script. So I tried to read the KOI8-R encoded parameters from a file before passing it as arguments so I don’t screw up my shell script.

It took me several hours and attempts to find that out and to get all the encodings right, so now a working Russian dictionary is available. 🙂 It won’t be shipped by default though, so it needs to be fetched from the Internet once by the game, on first use.

Of course the global ranklist is prepared for the new languages as well.

manually enabling deflate filter

Oh my, my webhoster has the deflate output filter disabled by default, that enables gzip compression of outgoing content. This is important for huge xml/json data from webservices that travel over mobile networks and easily reduces used bandwith to up to 10%.

Putting this in my .htaccess did the trick:

AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript

You can analyze the traffic with Wireshark, Firebug or use an online tool:

Make sure, your mobile app sets the Accept-Encoding of the request accordingly.

 

Hardware acceleration on SGS2 with Android 4.0

Starting from Android 3 (API level 11), there is a hardware renderer for 2D graphics, which drastically increases performance. The hardware acceleration was disabled by default and had to be enabled by the developer by declaring in his AndroidManifest.xml file:

<application android:hardwareAccelerated="true" ...>

According to the android documentation, that value changed to true starting with API level 14:

The default value is "true" if you’ve set either minSdkVersion or targetSdkVersion to "14" or higher; otherwise, it’s "false".

This is true for some devices (like the HTC Sensation with Android 4.0.3), but does NOT apply for the Samsung Galaxy S2 with official Android 4.0.3 and 4.0.4.

Applications without above attribute explicitly set to true are not hardware accelerated automatically on that device. On the HTC Sensation they are.

So don’t forget to declare that attribute in your AndroidManifest.xml file, if you want hardware acceleration on all devices.

Users can force-enable the use of GPU rendering in the developer options, which can be used as a workaround with the risk of incompatible applications yielding render errors.

WordMix 2D view must not use hardware acceleration

Currently, the 2D view of my WordMix game uses some features of Canvas, that are incompatible with hardware acceleration and results in display bugs. These glitches did not occur on my Samsung Galaxy S2, because it was not hardware accelerated as stated above, but occured on another device, a HTC Sensation with Android 4. Took me a while to figure out, what exactly was going on, but after declaring

<application android:hardwareAccelerated="false" ...>

fixed it for the time being, until I changed the render code to be hardware accelerated.