Memovox, AIR toujours au top

Il y a deux ans, nous avons codé une belle app nommée Geophysic pour la célèbre marque de montres de luxe Jaeger-LeCoultre. Réalisée avec la technologie multiplateforme Adobe AIR, ainsi que Starling & Feathers, nous avions terminé le journal de développement en nous demandant quelles autres technologies auraient pu faire cette app, sans jamais trouver de réponse tranchée. Aujourd’hui, avec l’agence Pixelfordinner, nous sommes fiers de partager cette nouvelle app nommée Wake-Up Memovox, pour le même client, disponible pour iOS et Android. Elle a été développée avec la même technologie, et même si le marché du développement de jeux penche clairement en faveur d’Unity, AIR tient toujours la route pour faire des apps ! Voyons ensemble la partie développement !

Pipeline graphique Travailler pour Jaeger-LeCoultre rime avec une précision extrême, l’app doit être pixel perfect ! Je ne suis pas un grand fan des mesures faites à la main sous Photoshop mais je ne connaissais pas de véritable alternative. Heureusement, Pixelfordinner nous a présenté Zeplin comme passerelle entre designers et développeurs. C’est un outil ultime pour récupérer facilement des mesures, des couleurs, des visuels mis à jour, et annoter/commenter les maquettes. Vivement recommandé !

Date Quand on fait une application de réveil, impossible d’échapper aux opérations sur les dates. L’objet Date d’AS3 offre moins d’options que celui de C# ou de PHP, mais il a fait le boulot correctement. La partie la plus difficile a été de déterminer, pour un jour donné, la prochaine occurrence :

// I want the next sunday:
var dayNumber:uint = 0; //(0 sunday, 1 monday...)
var date:Date = new Date();
var dayUntil:uint = (dayNumber - date.day + 7) % 7;
date.date += dayUntil;

Il a aussi fallu gérer les récurrences journalières et le snooze.

Processus en arrière-plan À cause du mode sandbox d’iOS, impossible de créer une application de réveil identique à l’application native. Mais on ne peut pas non plus louper l’alarme, n’est-ce pas ? Il faut donc que l’app tourne en arrière-plan ! Pour vérifier le réveil pendant que l’app est en arrière-plan, il faut activer :

NativeApplication.nativeApplication.executeInBackground = true;

On ne peut pas faire d’opérations Stage3D sur iOS en arrière-plan (attention !), mais l’app peut exécuter du code et donc faire vibrer l’appareil, jouer un son, etc.

// if you want to hear a sound while your app is in background add:
SoundMixer.audioPlaybackMode = AudioPlaybackMode.MEDIA;

Sur iOS, il faut spécifier les UIBackgroundModes, en ajoutant ce code dans votre *-app.xml :

<key>UIBackgroundModes</key>
<array>
	<string>audio</string>
</array>

Toujours sur iOS, il a fallu mettre en place deux astuces : - Pour une raison quelconque, sous Adobe AIR, un son ne se joue pas quand l’écran est noir. Du coup, je déclenche une notification locale pour réveiller l’écran. - Il faut bien garder le canal audio vivant, juste mettre en pause/reprendre la sonnerie, sinon iOS risque de « perdre » le son et ça prend une éternité avant de l’entendre !

Sur Android, une application peut se réveiller elle-même, même si elle a été tuée ! C’est une fonctionnalité incontournable pour une app de réveil, donc j’ai demandé à Distriqt (fournisseur d’ANE) s’ils supportaient l’AlarmManager API d’Android. À l’époque ils ne le faisaient pas, mais ils l’ont rapidement ajouté à l’Application ANE, génial !

Enregistrer une sonnerie sur l’appareil Parmi les fonctionnalités demandées, il fallait pouvoir enregistrer l’alarme sonore comme sonnerie afin qu’elle puisse être utilisée avec l’app native.

Sur iOS, il a fallu activer le partage de fichiers, en ajoutant dans le *-`app.xml` :

<key>UIFileSharingEnabled</key>
<true/>

Ensuite il suffit de copier/coller le fichier wav local dans File.documentsDirectory.

Pour Android, j’ai essayé de placer ce fichier à différents endroits sur l’appareil, mais il n’était pas reconnu directement comme une sonnerie. Après avoir consulté la documentation, j’ai découvert qu’il fallait certaines métadonnées. Malheureusement, je n’ai pas trouvé d’ANE, donc j’ai écrit le mien.

Langues, plein de langues ! En plus des langues latines, cette app supporte le chinois traditionnel et simplifié, le coréen, le japonais et le russe. Le poids des polices est de 30 Mo ! La langue par défaut étant l’anglais, je n’ai pas besoin d’avoir toutes les polices prêtes au démarrage de l’app si elles ne sont pas requises. J’ai donc créé un SWF par police (pas un SWC pour ne pas gaspiller de mémoire), puis, au runtime, je charge la police nécessaire si besoin.

var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, function(evt:Event):void {

	loader.contentLoaderInfo.removeEventListener(Event.COMPLETE, arguments.callee);

	//trace(loader.contentLoaderInfo.applicationDomain.hasDefinition(_dicTypo[currentLang].font));

	var fontClass:Class = loader.contentLoaderInfo.applicationDomain.getDefinition(_dicTypo[currentLang].font) as Class;
	Font.registerFont(fontClass);
	TextField.updateEmbeddedFonts();

	//trace(Font.enumerateFonts(false));

	_dicTypo[currentLang].loaded = true;
});

loader.load(new URLRequest("swfs/" + _currentLang + ".swf"), new LoaderContext(false, ApplicationDomain.currentDomain));

// dictionnary is defined like: _dicTypo["ja"] = {font:"HonokaMincho", loaded:false};

À cause des restrictions SWF sur iOS, je ne pourrai pas la décharger plus tard, mais ça ne changeait pas grand-chose que je les ajoute via un SWC ou en embed.

Vidéo L’app a été réalisée avec AIR 23, donc avant qu’Adobe n’ajoute l’upload de texture asynchrone (la cerise sur le gâteau). VideoTexture ne fonctionnait pas bien si on uploadait des textures en même temps. J’ai testé avec StageVideo et ça marchait bien sur iOS ! Il y a quelques soucis entre StageVideo et Android, et malheureusement AIR 24 n’était pas encore totalement stable, donc pas de vidéo d’intro sur Android pour l’instant.

AIR brille, et les autres technos ? Avec les dernières mises à jour d’AIR (Workers, VideoTexture, upload de texture asynchrone), Adobe tient une plateforme solide entre les mains. Quelles autres technologies multiplateformes auraient pu réaliser cette app ?