Category Archives: Citrus Engine

Geophysic, making AIR shine thanks to Feathers

Update: The project has been FWA mobile of the day! Note that this blog post was written 3 months before its publication.

This new project was kind of special for me, I made an iPad application, Geophysic® with one of the best French agency Soleil Noir for the famous luxary watches Jaeger-LeCoultre. No less!
When I was a student, Soleil Noir was the best French agency and we all dreamed to work there! So you could imagine how fun it was to work with them! As a luxury brand, Jaeger-LeCoultre, has a very high expectation of the final product. Combined with Soleil Noir’s graphic designers, it results in a top quality iPad application.

Continue reading Geophysic, making AIR shine thanks to Feathers

Mission Eau : being Agile with Flash Pro

missioneauintrologo
Stores/Web:
kezakeau.fr
google play
apple store

Intro : This is a serious game designed to teach players a bit about how water treatment and supply works; specifically how its organized in the Île-de-France region – around paris. The game map is loosely based on that region and divided by areas which corresponds to the master water supply facilities that share connections around the region. The map shows you which levels are accessible to play or re-play, you can zoom it or out with many graphical details. The three areas need to be completed and in order to complete one, you need to connect all buildings together by playing the game levels, and also buy the missing buildings using the coins you collect.

This is not a management game however, you do not have to save money or buy things in advance, it is balanced so you can easily get to the end without worrying too much. The action of buying or clicking buildings on the map will tell you more about what these buildings do and how they relate to others… Their in-game worth also gives players a hint on how important they are.

The challenge here was to keep the package size as low as possible yet keep the graphics at maximum quality.

missioneaumap

Continue reading Mission Eau : being Agile with Flash Pro

GPU render mode hell, and how we barely got out of it alive.

Hello everyone, Tam here!

I’m going to recount the story of one of the projects I’ve been working on in the past few months, and how it all went downhill from the very beginning.
Oh don’t worry though. This is not a fancy post-mortem for the biggest game of the year, but its my first so I’ve got at least something to smile about.
In fact in order to be able to write this article let me pull up a happy image just for you and me, and then let’s jump right in.

Friends-With-You_Happy_Rainbow-01

Continue reading GPU render mode hell, and how we barely got out of it alive.

Silly Family, being an indie dev

Edit: Apptoonomy is no more. Selling games is even harder than making ones. I only focus on Da Viking Code now as a cross platform developer.

The game.

Hey guys, this blog post is very special for me :
– it’s my hundredth article!
– my first game as an indie dev is out!

100 blog articles
When I started blogging 4 years (already!) ago, I didn’t imagine that someday I’ll reach the hundredth article. I started mostly as an exercice in style, improving my english communication skills and coding different things for sharing (unpretentious). I continued and now when I give a look in the past I’m smiling : I can see my evolution, how I’m better as a programmer, and all the different things I did in 4 years.
Also thanks to this blog I had my first client as a freelancer! I would recommand to any programmer to have a blog and post each month an article (that’s what I’m doing since 3 years) on what he is doing.

Apptoonomy
With some friends we created a new company, Apptoonomy. So does it mean that I’m not anymore a freelancer at Da Viking Code? No way! What does a programmer on his spare time? He is programming. With Apptoonomy we mainly focus on making our own games. Let me introduce the first one!

Silly Family
silly1Silly Family is a familly-fun Puzzle Game! Do you know Suzan? Of course you do! Suzan is my father’s son’s sister’s mother’s mother! Suzan is my grandma!!!

In Silly Family, you train your logic by resolving more and more complicated enigmas about increasingly crazier families! You’ll have to find the family relationship or run through the family tree.

We offer 3 different gameplays, 5 families (maybe more) and crazy designs… not to mention the animations! Also a multiplayer mode to defeat your friend!

Obviously questions are generated dynamically, I wrote the algorithm using (family) trees and recursivity. That was funny especially managing the different languages (the application is currently available in English, French, Spanish and Italian). We’re waiting a little bit for German, it won’t be easy 😉

Being an indie dev
Silly Family is the first (finished and published) game that I made as an indie dev. It’s really a longest process than programming games for clients. A client has to be sure (or at least should) that his game design is strong and developer implementation won’t show design flaws. Otherwise programmer’s bill may be painful. I started to develop Silly Family in October 2013 so six months ago. And obviously we already had a game design document. But so many things changed during its developement. Also you can add the fact that you must be satisfied with your game’s direction, and to still have the will to work on. Anyway, it’s a very interesting experience and it improved my skills as a game designer. We’re already looking forward for the next game!

Technology
Obviously I used my beloved Citrus Engine for making this game and Starling framework. The IPA size (before submitting to Apple) is less than 17Mo! How did we achieve this size? It’s thanks to DragonBones and its awesome .dbswf format. AS3/AIR technology was perfect for making this game!

Belle et Sébastien, fighting Android’s APK 50mb limit

It’s already time for a new app, Belle et Sébastien!

IMG_0067IMG_0068Belle et Sébastien is a famous old french book and there was a TV series. A movie is planned for the end of the year.
In this mobile application, we discover B&S’ world: an album introduce the characters and relates several informations based on elements existing in the movie: Génépi, snow, WWII, wolf, sheeps…
There is also a game, a kind of Where’s Wally?. Through pictures from the movie, you’ve to search hidden characters, animals, objects, etc.

Android’s APK 50mb limit
The development was going great until we had to release the application for Android. The app is 90mb, we wanted to be sure that it could be downloaded via 3G on mobile phone for iOS devices (limited to 100mb). When we uploaded the Android’s APK it fails because of its size: an APK can’t exceed 50mb!
I didn’t know that, what a mess! Quickly, I heard about APK expansion files. Apart form the APK, we’re able to upload two obb files, each file could be up to 2Gb! I can’t understand why Google is limiting APK to 50mb when the final application could be up to 4.05Gb. Anyway, that was the way to go. Note that you can also download yourself a zip and save the its content on disk to be used in your application, but it sounds so much user friendly to have everything downloaded at one time!

The issue finally was: how to use this obb file with AS3/AIR? I discovered this Actionscript Native Extension: Android APK expansion files, and everything worked like a charm!

To generate an obb file (don’t forget to add .obb extension to the file):

./jobb -pn air.com.europaapps.BelleEtSebastien -pv 1 -o /Users/Aymeric/Documents/Workspace/Flash/2013/Europa\ Apps/BelleEtSebastien/obbToUpload/air.com.europaapps.BelleEtSebastien/main.1001001.air.com.europaapps.BelleEtSebastien -d /Users/Aymeric/Documents/Workspace/Flash/2013/Europa\ Apps/BelleEtSebastien/bin/images

More informations there.

Available on iOS and Android, gives Belle et Sébastien a try! Note that translations are coming 😉

Monsieur Bear’s ABC and the myth of not being able to run SWF vector graphics on mobile

I’m glad to present a new application I’ve developed: Monsieur Bear’s ABC. Available for iOS and Android.

Monsieur Bear’s ABC
mb1A funny animated alphabet book designed by the talented Virgo!

Virginie Aracil aka Virgo is back in the app world for a new adventure! Now, she comes with an alphabet book, Monsieur Bear’s ABC! This cute little bear will help your child discover the letters, the sounds and words in an original and acidulous universe. With hilarious animations, cartoon sound effets and a French Touch style, this application will give hours of fun to your child!

– An alphabet book completely animated !
– Cute drawings !
– Discover Monsieur Bear, the bear made by Virgo !
– Original animations and fun sound effets !
– Available in French and English !

Technology?
mb2Like Sophie la Girafe, Monsieur Bear’s ABC is built using AS3/AIR technology with the Citrus Engine framework on top of the display list.
I won’t explain the choice of the display list and the gpu mode, it’s well described in Sophie la girafe’s article (here we have the same problematic).
However behind this catchy title, it reveals a strong reality: no one think we’re able to run correctly swf on mobile. Please have a look on this thread on Starling‘s forum. I know it’s Starling forum, it’s normal that everyone recommend the Starling’s way. But common’ guys, if you tried this app how the hell would you be able to make it running with Starling? The DragonBones framework, would be a way… but it won’t correspond to many animations, and it will be so long to do all the animations for it!
Here no one think it would be possible to make this project on the display list. At first, I tried to just run the swf animations but it was crap then tried using the rasterize process but it wasn’t good too. I was in a blind alley. Then I remember that I’ve already been able to run many SWFs correctly on the display list (again the goal isn’t to target 60 fps with particles, blur etc), so why I’m not able to run correctly this swf? I contacted the graphic designer: each model is made in Illustrator. I grabbed ond of them, it has so many points: 500 000! Everything became obvious… There are optimizations in code, there are also optimizations on graphics!! And obviously it should be done before code optimization 😉

Using directly SWF format, I was able to rescale everything to the perfect screen dimensions and it’s priceless! Also the final weight for all the animations is 7Mo. This is just impossible to achieve using the spritesheet way.

AddFrameScript magic
It’s very a common way to make vectors animation with Flash Pro. For example Tiny Thief is a beautiful game using vector graphics (that’s very easy to rescale everything!!). However they used Scaleform technology to export on mobile, and not Adobe AIR.
With iOS (using AIR) we’re not able to reload SWF which has code in them (a simple stop() on the timeline is considered as ABC code). It means if a SWF has AS3 code, you won’t be able to dispose it and reload it. It will always stay in memory. When you’ve more than 300 SWFs that’s a big deal 😀 So obviously the solution is to not add any code in this SWF, but how are we able to stop animations easily or do other operations? Using the undocumented addFrameScript method:

_currentAnim.addFrameScript(_currentAnim.totalFrames - 1, _animCompleted);
 
function _animCompleted():void {
      _currentAnim.stopAllMovieClips();
}

That was a very simple example. Using this method you’re able to inject code to a specific frame of a MovieClip. And it won’t cause any problem to be unloaded and reloaded! Obviously it is a bit harder to manage because the code isn’t directly in the swf, and so if you change your animations don’t forget to change the addFrameScript code too. But if your code is well organized, it shouldn’t be a big deal!

Rdrct.it
Now let’s follow this link: http://rdrct.it/monsieurbearsabc. Depending on your OS you will be redirected:
– on a website for all the computers.
– on Google Play for Android.
– on the App Store for iOS.

That’s a very convenient way to share a link, isn’t it? There is also a powerful feature, if you open it on your mobile and you already have the application installed, it will open it! Don’t wait anymore, give a try to rdrct.it too!

Live Coding in AS3 using COLT

Hey guys,

I hope many of you have seen this amazing video made by Bret Victor: Inventing on Principle. This is one of the best introduction to live coding if you never heard about it.

Recently, Code Orchestra, released an amazing tool named COLT. It enables live coding in AS3, you will find many great video examples on their page. You can use the tool with a free trial during 15 days, don’t hesitate! It comes with many examples to help you understand the basis, oh and there is one running with the Citrus Engine 😉

Continue reading Live Coding in AS3 using COLT

Alef is out!

Hey there,

It has been a long time since I wrote my first game, Kinessia, with the Citrus Engine (and start contributing), one and a half year. Less than one year ago, I made an other one, Tribus, using a Citrus Engine’s port in Objective-C. That was my first project in Objective-C so the source code of the port shall not be very clean, that’s why I’ve never released it officially.

We all know the problem making a framework / library and never use in real context project. That’s why I started my carreer as a freelancer 4 months ago, to be able to make applications / games for companies and show what can be done with the Citrus Engine. And now I’m proud to add a new reference to the engine: Alef.

Continue reading Alef is out!

Citrus Engine V3 and a new website!

Hey there,

I’m glad to announce the V3 release and a new website for the Citrus Engine! It has been a long and hard work. Most of the new tutorials and news will be displayed on this new website. Don’t know how I will manage this blog on Citrus Engine subject due to the new website, I will certainly replicate some contents.

Anyway I let you explore the new website 🙂 Don’t hesitate to give some feedback.