Nouvelle app Android pour le Hockey

Posted janvier 15th, 2011 by admin

Hello,

juste un petit ticket pour dire que je viens de releaser une nouvelle appli android sur le championnat Suisse de hockey sur glace. Bien plus évoluée que la dernière. Voici les features de cette version:

-résultats en direct et classement

-notifications durant les matchs de son équipe préférée

-un fil qui permet aux utilisateurs de commenter et d’échanger pendant les matchs

-les dernières news relatives au championnat

Si ça vous intéresse, c’est par là: apps.meta-for.net/swisshockey/

Tags: Android, app, mobile

Face.com API, le trombinoscope en AS3

Posted juillet 20th, 2010 by admin

Voilà un petit article pour dire que je viens de publier un portage de l’API face.com qui permet de faire de la détection et de la reconnaissance faciale sur une ou plusieurs images, le tout en AS3. C’est du WIP, donc attendez-vous à quelques bugs, ou à certains appels manquant. D’ailleurs n’hésitez pas à m’envoyer vos retours.

L’utilisation est relativement simple. Allez faire un tour sur la doc de face.com pour comprendre le fonctionnement de leur API. Pour la suite , je vous mets un petit tuto sur la marche à suivre pour utiliser la librairie dans un namespace privé. Je ferai pareil pour l’utilisation avec facebook connect dès que j’ai un petit peu de temps, ce qui vous permettra de jouer directement avec les tags des photos du célèbre réseau social. Donc “stay tuned” si c’est quelque chose qui vous intéresse.

utilisation

Premièrement rendez-vous sur le site developpeur de face.com et créez un compte. Sur la page de votre compte, ajoutez une nouvelle application et spécifiez au besoin l’url du site. Notez ensuite l’API Key ainsi que l’API Secret, pour le reste laissé tout décoché. De retour sur votre compte ajouté un namespace, que vous réglerez en privé pour l’instant. Un namespace sur face.com est un comme son nom l’indique un espace de nom, dans lequel vous ajouterez les personnes à détecter/reconnaître sous la forme id@namespace, pour plus d’infos allez ici.

Du côté actionscript enfin. On va procéder en 3 étapes:

  1. Détecter un visage dans une image et récupérer son id temporaire( tid )
  2. Enregister le tid dans notre private namespace
  3. Effectuer une reconnaissance sur une autre image pour la comparer avec l’id stocké

Etape 1, la détection. On va donc détecter un visage sur la photo suivante. spacer Tout rapport avec l’actualité d’aujourd’hui est involontaire…

spacer

Franck Ribery content...

package
{
	import flash.display.Sprite;
 
	import net.metafor.faceapi.FaceApi;
	import net.metafor.faceapi.events.FaceEvent;
 
	public class Main extends Sprite
	{
		private var faceApi:FaceApi;
 
		public function Main()
		{
			//Créez une insatnce de FaceApi
			faceApi = new FaceApi();
 
			//Définissez votre apiKey et votre secret
			faceApi.apiKey = "your_api_key";
			faceApi.apiSecret = "your_api_secret";
 
			// Enregistrez un écouteur et appelez la méthode detect() sur recognitionService,
			// avec un Array contenant les urls des images à analyser en paramètre.( ici une seul pour l'exemple )
			// Vous pouvez aussi utiliser uploadAndDetect pour passer directement un Bitmap
			faceApi.recognitionService.addEventListener( FaceEvent.SUCCESS , onDetectSuccess );
			faceApi.recognitionService.detect( ["static1.purepeople.com/articles/0/24/40/0/@/168118-franck-ribery-637x0-2.jpg"] );
 
		}
 
		private function onDetectSuccess( evt : FaceEvent ) : void
		{
			faceApi.recognitionService.removeEventListener( FaceEvent.SUCCESS , onDetectSuccess );
 
			//Récupérer l'id temporaire
			var tid:String = evt.data.photos[0].tags[0].tid;
		}
	}
}

Etape 2, sauvegarder l’id temporaire dans votre private namespace:

// Sauvegarder ensuite votre tid , en l'associant au uid de votre choix.
// Respecter bien le syntaxe suivante :  id_de_votre_choix@nom_du_namespace
faceApi.tagsService.save( tid , "franck_ribery@nstuto" );

Etape 3, et voilà maintenant vous pouvez comparer une nouvelle photo avec le contenu de votre namespace. Celle-ci par exemple:

spacer

Franck Ribery toujours content...

// Vous pouvez maintenant appeler recognize() sur recognitionService.
// Vous comparez ainsi une nouvelle image, dans ce cas-là avec l'ensemble des tags enregistrer dans le namespace( all@namespace ).
// Vous pouvez aussi le comparer seuleument, avec un tag( ex: franck_ribery@nstuto ).
faceApi.recognitionService.addEventListener( FaceEvent.SUCCESS , onRecoSuccess );
faceApi.recognitionService.recognize( ["www.elawords.com/wp-content/uploads/2010/03/Franck-Ribery.jpg"], ["all@nstuto"] );

Et voilà!!! Si vous faites un trace() de la propriété rawResult de l’événement vous devriez voir quelque chose comme ça.

{
    "photos": [
        {
            "url": "http:\/\/www.elawords.com\/wp-content\/uploads\/2010\/03\/Franck-Ribery.jpg",
            "pid": "F@f39c380996d11b054183916d919c3046_7b6b64e18d6b4e64070dcc7d0f91fd76",
            "width": 338,
            "height": 450,
            "tags": [
                {
                    "tid": "TEMP_F@f39c380996d11b054183916d919c3046_7b6b64e18d6b4e64070dcc7d0f91fd76_53.70_48.11_1",
                    "threshold": 65,
                    "uids": [
                        {
                            "uid": "franck_ribery@nstuto",
                            "confidence": 85
                        }
                    ],
                    "gid": null,
                    "label": "",
                    "confirmed": false,
                    "manual": false,
                    "tagger_id": null,
                    "width": 66.57,
                    "height": 50,
                    "center": {
                        "x": 53.7,
                        "y": 48.11
                    },
                    "eye_left": {
                        "x": 36.67,
                        "y": 41.85
                    },
                    "eye_right": {
                        "x": 63.16,
                        "y": 44.67
                    },
                    "mouth_left": {
                        "x": 34.67,
                        "y": 65.64
                    },
                    "mouth_center": {
                        "x": 45.74,
                        "y": 68.54
                    },
                    "mouth_right": {
                        "x": 58.32,
                        "y": 67.66
                    },
                    "nose": {
                        "x": 46.99,
                        "y": 57.22
                    },
                    "ear_left": null,
                    "ear_right": null,
                    "chin": null,
                    "yaw": -1.72,
                    "roll": 8.07,
                    "pitch": 1.91,
                    "attributes": {
                        "face": {
                            "value": "true",
                            "confidence": 1.5809
                        },
                        "gender": {
                            "value": "male",
                            "confidence": 94
                        },
                        "glasses": {
                            "value": "false",
                            "confidence": 53
                        },
                        "smiling": {
                            "value": "true",
                            "confidence": 15
                        }
                    }
                }
            ]
        }
    ],
    "status": "success",
    "usage": {
        "used": 1,
        "remaining": 199,
        "limit": 200,
        "reset_time_text": "Tue, 20 Jul 2010 16:46:25 +0000",
        "reset_time": 1279644385
    }
}

Vous trouvez donc une partie uids qui stocke les ids qui ont matché avec votre comparaison. On s’aperçoit que la photo à bien été reconnue comme franck_ribery@nstuto avec une probabilité de 85%.
Voilou, c’était un exemple tout simple, à vous de faire joujoux avec maintenant. Essayez avec la photo de Zaia et vous ne devriez pas avoir le même résultat.

release note

  • La libraire ne supporte actuellement que les résultats en JSON, mais l’XML va suivre au plus vite.
  • L’authentification facebook est presque entièrement implémentée, je ferai suivre un tuto.
  • L’authentification avec Twitter est partiellement implémenter, notamment avec OAuth, vous trouverez une classe dans le package auth vous aidant à l’implémenter.
  • Pour passer un bitmap à la place d’une url, utiliser uploadAndDetect(), uploadAndRecognize, …
  • Les méthodes suivantes ne sont pas encore disponibles: tags.add(), tags.get() et tags.remove() . Elles suivront dès que j’ai un peu de temps.

download

Vous trouverez les sources sur mon github.
Pour les autres je vous mets aussi les sources en direct download.
Et pour la doc, c’est ici.( pas encore très fournie, mais ça vient).
N’oubliez pas de télécharger l’excellente lib as3crypto si vous utiliser OAuth.

Tags: Actionscript3, api, detection, face, library, recognition

addCallback() et doctype

Posted mai 20th, 2010 by admin

Voilà une petite découverte qui m’a fait chercher un bon ptit moment l’autre jour. Voici un exemple:

ExternalInterface.addCallback("callAs", cb);
btn.addEventListener( MouseEvent.CLICK , clickHandler );
 
private function clickHandler( evt : MouseEvent ) : void
{
    if( ExternalInterface.available )
    {
        ExternalInterface.call( "callJS" );
    }
}
 
private function cb() : void
{
    trace("As called");
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <script type="text/javascript" src="swfobject.js"></script>
        <script type="text/javascript">
            var flashvars = {};
            var params = {};
            params.wmode = "transparent";
            params.allowscriptaccess = "always";
            var attributes = {};
            attributes.id = "flashcontent";
            attributes.name = "myFlashContent";
            swfobject.embedSWF("Main.swf", "myAlternativeContent", "800", "600", "10.0.0", false, flashvars, params, attributes);
 
            function callJS()
            {
                window.alert("callJS");
                flashcontent.callAs();
            }
        </script>
    </head>
    <body>
        <div id="myAlternativeContent">
            <a href="www.adobe.com/go/getflashplayer">
                <img src="www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
            </a>
        </div>
    </body>
</html>

Vous noterez que j’appelle le callback sur “flashcontent” qui est l’id du Flash. Et bien sous cette configuration callJS() est bien appelé, mais pas le callback. Mais étonnement tout s’exécute correctement si je supprime la première ligne du code html, le doctype. J’ai le même résultat sur Firefox 3.6 et Safari sur Mac. J’imagine que le fait d’effacer le doctype désactive le mode strict de rendu html.
La solution consiste, et c’est la bonne pratique à utiliser de toute manière, à utiliser document de cette manière :

document["flashcontent"].callAs();

Voilou, voilou

Tags: Actionscript3, browser, Bug, html, js

Le Flash Builder et son SDK sont là!!!

Posted mars 26th, 2010 by admin

Oyé Oyé,

après quelques mois de beta, la 4ème mouture de Flex Builder sobrement renommée Flash Builder vient de pointer le bout de son nez en version final. On précisera, et c’est une bonne nouvelle, qu’il reste gratuit pour les étudiants et les dev en recherche d’emplois.
Le SDK est dispo à cette adresse.
Pour finir, un petit mot sur la CS5, qui suscite une énorme attente de la part de la communauté, surtout pour la refonte du panneau Actionscript de l’IDE(… mais bien sûr spacer ). Bref, on a maintenant une date, le bébé sera là le 12 avril.

Tags: flash cs5 release sdk iphone flex

Première app Android

Posted février 28th, 2010 by admin

Un petit ticket pour annoncer la sortie de ma première application Android :

Swiss Hockey Widget

spacer

Android App Screen

Si vous êtes fan du championnat suisse de hockey, ce widget est fait pour vous… Vous pourrez grâce à lui suivre votre équipe favorite et être notifié à chaque goal de celle-ci.

Alors go sur le Market… et n’oubliez pas de me laisser vos remarques et commentaires.

Tags: mobile app application android

Flash at the lake report

Posted juillet 5th, 2009 by admin

Et voilà le 1er festival Flash at the lake à Zürich est terminé. Pleins de conférences bien sympas, certaines un peu « déjà-vu » , aussi quelques petits « couacs », mais dans l’ensemble une belle réussite pour une première. Revue sur ces 2 jours qui ont rassemblé pour une fois une bonne partie de la planète Flash suisse. ( dédolé pour la qualité des images, je suis pas encore passé au 3Gs,^^).

spacer

Zürich

Aral Balkan – Remember the magic

Arrivé comme à son habitude avec quelques minutes de retard, votre humble serviteur découvre une salle chantant en cœur le doux nom de « Microsoft » ( si..si..). Après que l’envie de partir en courant fut passée, je vais m’asseoir afin d’écouter Aral Balkan. Alors lui, c’est un sacré numéro… Il nous rappelle tout d’abord aux bons souvenirs des Amigas et autres Comodores avant de décrire l’(énorme) évolution de l’informatique et des outils mis à disposition de nous autres, et d’insister sur le fait que ceux-ci doivent élargir la créativité et que tout ceci doit apporter une plus value à l’expérience utilisateur, le nerf de la guerre…

spacer

Aral Balkan

Et comme il le dit lui-même : «  le design pattern c’est le mal !!! Ne restez pas dans les carcans, EXPERIMENTEZ !!! »

Petet Eist – Air and Sqlite

Une petite conférence sur l’utilisation de base de données embarquées dans une application Air. Démo pratique de son utilisation, code à l’appui et explication des différentes manières de procéder. Sinon je ne m’attarde pas trop sur le sujet mais conseille vivement d’aller matter les slides de la pres à tous ceux qui seraient intéressés par le sujet.

James Ward – Pixel Bender

On commence par une petite présentation du Pixel Bender Toolkit, ce nouvel outil apparu avec la player 10 et qui permet de créer et d’éditer des filtres ensuite exploitables dans le code AS. Les différences entre .pbj et .pbk , ainsi qu’un petit tour par Alchemy.
Il termine ensuite par la présentation de son incroyable librairie PbjAS, permettant d’utiliser les possibilités de pixel bender et notamment le calcul multi-thread directement au runtime…Rien que ça… Je ne vous donne pas les explications techniques de comment il a réussi ce tour de force, c’était pas très clair pour moi aussi^^

Paul Burnett

Platform Evangelist chez Adobe, Paul Burnett vient présenter les nouveautés de la CS4. Il commence par une petite explication de la vision des futurs WorkFlow( Flash CS4, Catalyst, Flash Builder)comme Adobe l’imagine.
On part ensuite sur les nouveautés de Photoshop CS4, streching d’images sans déformations, et de Flash CS4, bones et api 3d notamment… Bref si vous voulez voir l’entier de la conférence regardez la vidéo de la keynote de la dernière Max c’est exactement pareil…

Marcel Vogt / Tiago Dias – WiiFun/Bend My 3d

Et 2 conférences pour le prix d’une !!!… On commence par une présentation de la librairie de Thibault Imbert WiiFlash. Bon rien se spécial de ce côté là, il a présenter les divers devices prix en charge par la librairie, Wiimote, Balance, Nunchuk, etc… Et fait une petite demo d’un jeu qu’il a réalisé prenant en charge le Wheel. Sympa, mais faut dire que le server est pas super stable sur sa machine, il a bien dû s’y reprendre à quelques fois sur chaque demo… Mais faut avouer que c’est toujours sympa de voir les gens s’émerveiller devant le fait qu’il est possible d’utiliser la Wiimote dans Flash, d’ailleurs, je dois avouer que ça m’a donné envie de ressortir la mienne…( euh ma Wiimote biensûr… )

spacer

Marcel Vogt entrain de faire une démo de son jeu

En seconde partie Tiago Dias nous a rapidement présenté AS3dMod cette bibliothèque de class permettant d’appliquer des déformations sur des objets 3d avec la majorité des moteurs 3d actuels en Flash.

Rafael Beck - Augmented Reality

Bon là comme je m’y attendais grandement, une bonne partie de déjà-vu sur les démos de FlarToolkit qu’il a présentées. Par contre, je dois avouer que je ne connaissais pas du tout le framework FLARManager et je vais m’empresser de le tester car ça à l’air vraiment bien foutu.

spacer

Rafel Beck

Un petit détour ensuite sur Marilena une petite bibliothèque de détection de mouvements.
Sinon, il a aussi présenté d’autres projets qui sortent du cadre du Flash notamment un en provenance directe du MIT, et faut bien dire que ça en jette… Minority Report vous avez dit ?

Les slides de la présentation

Michael Plank - Simultaneous Web and Desktop Development

Super conférence avec un des gars de FDT qui nous donne en gros ses best practices pour le développement d’applications destinées autant pour le Web que pour le bureau. Ça commence par une bonne petite explication des différences à appréhender entre les 2 plateformes, notamment entre le playerglobal.swc et le airglobal.swc.
Il explique ensuite les différentes manières de procéder et notamment une qui retient mon attention, la compilation conditionnelle. Je vous en dis pas plus pour l’instant car je prépare un post la dessus pour l’expliquer plus en détail.
Et on finit sur un petite explication de la compilation groupée avec Ant, chose qui m’a bien servie.

Serge Jespers – RIA’s with Flash Catalyst

Petite de démo de Catalyst avec Serge Jespers. En fait, la création du widget qu’Adobe utilise en interne pour faire des recherches sur les employés. Faut dire que chaque fois que je vois une démonstration de Catalyst je vois ce même tuto, j’espère qu’on peut faire autre chose avec ☺. Vous pouvez donc revoir tout ça en allant regarder cette vidéo de Thibaut Imbert, c’était la même chose.

Ralph Hauwert – Pushing Pixels in Flash 10

Excellente conférence, sans doute une des meilleurs à mon goût de Ralph Hauwert ( unitZeroOne ) sur la manipulation de pixels et les nouveautés apportées par le player 10 dans ce domaine.
Particulièrement porté sur l’expérimentation également au niveau musicale qui est une de ses passions, il commence en présentant son émulateur de sons c64. Grand moment à la diffusion du thème de AirWulf…
On poursuit ensuite par une démo très impressionnante sur la façon de simuler de la 3d, sans librairie telle que pv3d ni même les nouvelles fonctionnalités de Flash 10. Tout ceci en utilisant des superpositions de textures et des déformations de bitmap… very cool.
Quelques best practices sur Alchemy ensuite et je ne saurais que trop vous conseiller son blog à ce sujet.
Et pour terminer une petite démo de PapervisionX, la prochaine mouture du moteur de rendu 3d pour le nouveau player dont Ralph fait parti de l’équipe de développement. Et que dire d’autre à part que je suis très impatient de pouvoir utiliser tout ça. L’adaptation du célèbre jeu Quake montre le formidable potentiel de cette version en terme de performances et de qualité des shaders… Si vous voulez en savoir plus, vous pouvez toujours allez lire cet article.

The Thinker’s box – Mario Klingemann

Et pour finir en beauté Quasimodo nous gratifie d’une « pres » totalement orientée expérimentation. Ça passe par la génération de dessin , les voxels, la géométrie, la couleurs…de l’art numérique.
Et on termine par une description par étapes de la réalisation de son Tweet de la Mona Lisa encodé en base64… Bref du grand art, et même si je n’ai pas tout compris, la passion avec laquelle il raconte tout ça est tout bonnement génial.

Bref, voilà un week-end fort sympathique et pour une fois qu’il y a quelque chose en Suisse, j’ai qu’une chose à dire : « Bravo à tous les organisateurs et à tous les speakers… See you next year !!! »

Tags: Actionscript3, adobe, Air, alchemy, Conférence, Experimentation, fdt, Flash, flex, pixl bender, player, quasimodo, sqlite, suisse, switzerland, tweet, zurich

← Previous Entries
gipoco.com is neither affiliated with the authors of this page nor responsible for its contents. This is a safe-cache copy of the original web site.