Emanuele Feronato

Talking about Actionscript 3, Flash, Game development, Monetize and Users contributions.

Did you ever play Claytus Hood Tower Defense? Yes, you should, if you are an old time reader.

It’s a game (and what a game!) by Raphaël Roux, who also used Flex to create and release a level editor full of interesting features such as database management, Facebook connect, and more.

Raphaël shares with us his experience:

Previously on Claytus Hood Tower Defense

Let’s take Claytus’ story where we left it off last time :

The first episode of Claytus was released on summer 2010, and it was the subject this post.

Then between September 2010 and April 2011, I was hired as a web development teacher at the University of Savoy (France). This was a really good experience combining programming and social relations, I loved it !

On the last post dedicated to Claytus, I talked about a tower defense level editor.
At this time, I had built a simple tool coded in Flex to help me balance the waves of enemies of the original game, but the software was not really designed in a friendly user way.
I had a wish : make this software available for players, and this is what we’ll be talking about in this post!

Define the functionalities

I wanted a browser application, with no installation needed for the player, like any Flash game, so I chose to improve my Flex skills.

This is commonly called Rich Internet Application (RIA), when you’ve got a complex software running on web browsers and Flash player.

This level editor must have a lot of features, this is a quick overview :
– Manage users : creating account, log the users, and Facebook connect
– Design your own tower defense levels.
– Save your work on Claytus’ server.
– Share your work with Claytus community.
– Linking all this in a community website, with all the common features such as comments, rates and scoring.

Time to code!

Building a Rich Internet Application (RIA) in Flex 4.5

I’ve learned how to work with Flex on the Flex 3 SDK with the “training from the source” official book, so I had to learn a lot about Flex 4.5, because in the meantime, there has been a lot of changes on the Flex 4.5 SDK.

Always the geekish way for me to learn about IT

Most part of these changes was about the new Spark components library, and how to deal with the new layouts.
A bit less intuitive, stricter than the Flex 3 SDK and its MX components, but this is all for the good !

Nowadays, Flex 4.5 is not totally finished, in my opinion.
Most of the components of MX are ported in Spark, but the features aren’t all enabled for some of them, so I had to mix between MX and Spark components, this was pretty tricky to make good choices.

Communicate with server and databases

First thing I had to do was to find a reliable and powerful way to communicate between my RIA, my server and databases.

So I chose to use amfPHP, a messaging system, very handy to do these kind of communications.

You can easily share an AS3 object with the PHP version of this same object on the server.
This is called object versionning, and I recommend you to dig around this API !
I had to modify the amfPHP API to share the PHP session between the level editor and Claytus website, there’s a little trick about the session name :)

During the sharing process of your level, amfphp allows me to send the byteArray of the level, so that I can save jpeg on server side and make thumbnails.
It also receives the data of the level (tilemap, landscape and waves …) that I save into a XML on the server.

I use this API each time I have to deal with server side stuff.
As I said, the PHP scripts used with the level editor are the same that in the website, so I have a pretty flexible webservice !

What about the website?

I designed the website like a community website.
I had to implement comments, ratings and score board, everything is home made.

Three major parts :
– Original game
– Shared levels : levels created by the members of the community.
– Level editor : introducing the level editor with a tutorial (a new video will come asap).

I also setup a forum based on a myBB forum.
The trickiest thing was to automatically create a forum account when you create a Claytus account.
So I manually edited the PHP code of myBB, so that users can login both on the forum and the website with their email and password.

I worked a lot on a natural way to rank my pages on search engines, I put all I got in term of SEO.
I also implemented the Facebook Open Graph :
if you take a look at my html sources, you’ll see meta tags especially for the Open Graph.
This way, Facebook considers each of my pages as an Open Graph object, and it appears on Facebook’s search engine.
I can also specify the picture or the video that appears on your wall when you share one of these pages.

I tried to make smooth animations and interactions all over the website with the JQuerry API to have a modern webdesign.
It is very important not to reload the page when the user wants to comment or rate a shared level. If not, the game would be lost and more than one user would certainly be upset and the feature would bring nothing to the community !
I also tried to innovate with the “Explorer” button, that shows you a nice site map to explore Claytus’ world.

Facebook Connect

I had to implement Facebook connect both on the website and the level editor, not easy as it sounds…
An AS3 API for Facebook Connect exists, called GraphAPI.

The thing is that you can’t test your script locally, if your RIA is not uploaded on a server, it won’t work…
” Compile > Upload > Test ”
Several minutes between each of my tests, this drove me crazy :)

There is a way to test without uploading, but your app has to be for AIR.

The other thing is very, very important :
First week, not all of my Facebook Connect requests were successful.
I mean, registrations were well done, but the users couldn’t log themselves…

Why ?!
Because when you store a Facebook user id in your databases, please DO NOT use a INT(11) for your user ids, but set a BIGINT(20) ! If not, you’ll get troubles, because now, FB uids are very long.
This is the first thing FB should say in their documentation in my opinion :)

Funding, monetizing

This time, I plan to make money with my project, it’s a full time job and I hope to earn my living with this project.

A big part of Claytus is still available for free but I now sell lifetime licenses with Paypal.
With a license, players will have full access to all of the features of Claytus community with no restriction.
It was not so easy to code the Paypal callback because their documentation is pretty large and you find a lot of outdated tutorials. I finally found my way in this mess.

I chose a single Paypal button for payment, so you can pay both with a Paypal account and classical credit cards.
After the payment, I send a serial number to the payer’s email, so that he can easily activate his license.

I got no external funding for the development, I hope the customers will cover the future development fees.
During the development I sell licenses 50% off, like Minecraft does.

What next?

Depends on the selling of licenses, there are many ways to plan the future:
– Just a few selling : It will fund the server.
– Reasonable selling : I will update the community as much as I can with new avatars, new landscapes items and enemy sprites for the editor, if I get enough to live and pay the illustrators / musicians.
– Good selling : Smart phone application and Xbox live ?

In the meantime I’m dedicated to community management, and I’m trying to code some little projects in freelance during my spare time (when is it ?)

Conclusion

After one year of work, I learned a lot about many things in IT.
I would like to thank all the developers who write articles and share their experiences about these subjects, they’re all my teachers.
Emanuele is one of them of course, he does a great job with his blog, but you already know that, because you’re reading this article!

I’m here to share my experience with you, please feel free to ask me your questions about coding techniques or Claytus community, whatever you want !

I hope you will enjoy my work, I put all the love I have for video games in this project, and I hope it will survive through years to come with a nice community !

At this time a tutorial should be available on the level editor’s home page in English.
I can’t wait to have your feedbacks :)

Spread the word !

Thank you !