Update 11 jun 2010.

For those interested, the VorbisPlayer has now been published on Codeplex. Find the source code here.

----

I have finished the playing part of Slengo. Next are the titlescreen, the highscore, making some levels and… adding sound effects. When I started adding the sound effects, I instantly remembered why I use little effects in my games: the slow latency.

It is like this. On the screen you push an icecube, and half a second later (or longer) you hear the sound effect. The visual and audio are so much out of sync that it breaks game-playing experience.

In Avios, I solved this problem by delaying the graphics. The event of a bomb falling into the sea works with this principle. This was possible because the sounds in Avios are not bound to user-events. They are bound to in-game events. With user-bound events, this has the drawback that the game will appear to react slowly on user input.

The delay has two causes.

1) Mp3’s are standard encoded with a gap at the beginning;
2) The MediaElement has an internal buffer which is filled before even one sound is played.

Also Silverlight has problems with short sounds (less than a second), they make the delay worse, or you don’t hear them at all.

Countering the audio gap
I have thought of two ways to deal with the gap, encoded in audio files. Either find a gapless format or gapless encoder, or skip the gap when starting the sound.
If you encode Mp3’s gapless with WinLame, then the audio quality is very bad (I’ve tested a short sound).

In Silverlight, it is possible to write your own sound decoder. Larry Olson wrote Managed Media Helpers which inspired about everybody else. What I understand from this project is that only the Mp3 frame headers are decoded, while the compressed sound data is send to the MediaElement, making use of the decoder already in Silverlight. If this is true, then this scheme is not sufficient to skip the gap programmatically, because you cannot set a start pointer in the middle of compressed data.

DDtMM wrote a library for seamless audio loop, for Mp4 encoded files. Expression Blend Encoder can encode gapless. I had many troubles downloading the library in the past (timeouts), so I was unable to investigate this code. Recently I had more luck, but being too occupied with MoonVorbis (see below) I haven’t studied the code very well yet.
Ahura Mazda wrote the Saluse Media Kit, fully decoding Mp3’s and sending the raw audio to the MediaElement. This code is a good option to skip the gap at raw-sound level. Unfortunately I had problems playing short sounds repeatedly, so I looked further.

A project which really drew my attention was MoonVorbis from Atsushi Eno. Casy Wireman wrote on GameDev that Ogg Vorbis is a pretty good format for games. It seems that Ogg Vorbis is encoded without audio gap. MoonVorbis decodes to raw sound samples. So if there is a gap we can skip it.

Countering the audio buffer

MoonVorbis is not production ready. I had problems with the pitch of my test-sound, and problems with repeatedly playing a short sound. However, I’ve worked a solution. But still, there is latency between user-event and sound being played.

I have introduced a Play function on the stream. The MediaElement’s source is set to the stream and starts playing directly. The stream produces silence when the sound is not played. When the Play function is called on the stream, it starts to send sound samples. With this approach, the short-sound problem is solved, because the standard silence extends the length of your sample.

Now to reduce audio buffer latency. The MediaStreamSource has a property called AudioBufferLength, which is measured in milliseconds. The standard setting is 1000 (1 second), making the latency very slow. If you set this property to its minimum, 15 milliseconds, the latency is much better, but the sound begins to stutter. A setting of 50ms gives a little more latency, but with good sound quality. I am still investigating whether this is the best we can get.

Further

Solving the short-sound problem is a major improvement. I would still like to reduce the sound latency a little more. However, I still have the option of delaying the graphics, but now for a much lower latency. That is an improvement. Still, I need to find out how all this works out in practice when I bring it to the game. Although I have a preference for WMA audio, Ogg Vorbis is a good enough choice for me.

Avios is a great game if you liked Wings of Fury during the nineties. It took 5 months to develop, but it isn’t very well appreciated. There are different aspects for improvement. One aspect is to get a better loading time experience.

Players of online games don’t like to wait very long for a game to load. I have seen different approaches for better a better game-loading experience.

1. Load everything all in one
The game exists of only one xap, which is loaded at once. At Mashooo and Silverarcade they’ve found a way to improve experience. Each game is loaded by a generic preloader, displaying the current percentage. This is very well done. The drawback is however that the game will be loaded completely, you cannot split it into parts. This approach cannot distract the player’s attention if the game is very large.

2. Partial preload
A preloader loads the basic data. The rest of the data is loaded while the game is playing. This is the scheme I’ve been using for most of my games. In my case, the preloader has a list of images and sound effects to be loaded. Any music which is played during the game, is played from the server during the game. Music files can be quite large and they’re not always played completely. So this approach has an advantage over loading it all at once.
You also have more control of what will be loaded in the preloaded, and what will be loaded during the game. Nokola’s Shock for example loads the most basic things to play the first level in the preloader and everything else during the game. Avios however loads all images and sound effects for all levels in the preloader.
An improvement for Avios could be to load everything to play the first level, while loading everything else when the first level is played. No problem for Avios. But in a different game, in such a scheme, the loading and playing of music could compete with loading other data. It could interfere with the music being played. So this needs to be tested.

3. Lower quality
It isn’t surprising that visuals in many games are very small. Smaller graphics reduce the data volume and give better loading experience. For the same reason, players experience lower sound quality for the same reason. Lower quality improves game load experience but may reduce playing experience. This balance is the choice.

4. Change the Encoding
Unfortunately, using vector graphics doesn’t increase quality, while data volume is reduced. I have been playing around with Inkscape 1), to convert bitmap images into vector graphics, exporting it in XAML. In many cases, where I replaced a bitmap image for a vectorized version, the data volume increased. If you want to preload such resources, you need to dynamically load a dll, instead of loading a list of resources on the server.

For my games, I usually use PNG’s. PNG supports alpha channel –  transparency. JPG’s do not support this. In Photoshop you can export JPG’s at low quality. One could use these low-quality JPG’s, assign a transparency color to it and process the images using WriteableBitmap, to support alpha channel. I have done a little study to this option, but I found the image-quality so very low that I decided it was not worth it.

There is also a gain for sound encoding. MP3’s are usually larger than WMA’s. So it does pay to encode for WMA. It is worth it to play around with the encoding settings. I was able to encode an original MP3 file of 1.8 MB, to a 491 KB WMA file, without significant loss of quality.

For the fun of it, here a little video demonstrating the current features in Slengo:

The above is my testing level, so whenever I add a feature to the game, I put it into this level to test it. So it is not very strange that you see the same level over and over again in the video.

The current features. The enemies find their way through the maze, they can smash the icecubes and follow the player. There are some bonusses in the game, some for points, others to improve the player's powers. The enemy can be delayed before it hatches. The borders paralyzes the enemies touching it.

As you can see, currently there is only one enemy. I am currently working to add more enemies, however one enemy-type per level will not be feasible.

Over the weekend, I completed my new webdesign. It was incorporated into the website and also into the weblog. I hope everyone likes it this way. The design has two stylesheets, one for 1024x768 resolution and one for 1280x1024 resolution. If you have a higher resolution, you'll see the 1280x1024 stylesheet, because I cannot test these resolutions myself.

I've also added the Captcha's challenge for comments, as I was receiving a lot of comment-spam. This challenge requires a person to enter the two words in a distorted picture, before a comment can be submitted.

I call this the Neon-design. It is actually metal, neon-light, to give a little 80's arcade-hall feeling. For the website, I have removed the categories feature. The main page now just display all games. Clearly I do not have enough games to put them into a category. I hope the new design is able to attract more visitors.

Currently I'm working on a new website design. Until now, the "style" has really been some quick work, to get it live as fast as possible. I'm not a webdesigner. I do hope that the new design will be more appealing to visitors.

I have also been working on a Silverlight game called "Slengo" (working title). Almost all the game features which I like are in it. But I still need to add some more enemies for the player to combat. This requires more graphics and AI. Having a different baddy every level is not feasible, but some diversity will hopefully add to gameplay.