Accélérez et optimisez vos                développements dapplications                           mobiles                  ...
Zenika en quelques mots   Un cabinet de conseil et de réalisation   Un organisme de formation agréé   Expert en Open Sourc...
Nos implantations                         Paris                         Lyon                         Rennes               ...
Zenika Paris                Nous suivre sur Twitter : @ZenikaITZenika © 2011                                         4   4
Zenika Lyon                Nous suivre sur Twitter : @ZenikaLyonZenika © 2011                                           5
Zenika Rennes & Nantes                Nous suivre sur Twitter : @ZenikaOuestZenika © 2011                                 ...
What’s Next 2011  Présentation Flex Mobile          Retour et décryptage de la présentation de Michaël Chaize          Enj...
Adobe Flex  Introduction          Objectifs des applications RIA          o Améliorer l’expérience utilisateur          o ...
Adobe Flex  ComposantsZenika © 2011   9
Adobe Flex  MXML vs ActionScript       MXML       o Syntaxe déclarative de création d’interface                <s:Applicat...
Adobe Flex  Intégration serveur          Communication via des WebServices          o JAX-WS ou JAX-RS          o Parseur ...
Flex Mobile  Introduction          Extension du framework Flex pour le développement          d’applications mobiles      ...
Flex Mobile  Objectifs          Développer une application compatible avec la plupart des          plateformes mobiles exi...
Flex Mobile  Tour de FlexZenika © 2011    14
Démonstration  Présentation          Développement dune application prototype utilisant la          technologie Flex Mobil...
DémonstrationZenika © 2011     16
Flash Builder  Introduction (1/2)          Développé par Adobe          Basé sur des plugins Eclipse          Fonctionnali...
Flash Builder  Introduction (2/2)Zenika © 2011          18
Flash Builder  OS supportés          Depuis la version 4.5.1 : Burrito          o Google Android          o Apple iOS     ...
Flash Builder  Différents types dapplication ViewNavigatorApplication    TabbedViewNavigatorApplicationZenika © 2011      ...
Flash Builder  Support multi-résolutions          Tous les appareils non pas la même densité          Configuration du DPI...
Flash Builder  Designer          Il est possible dutiliser le mode designer          o Prise en charge des différents mobi...
Flash Builder  Déploiement Android (1/2) Mode développement  1. Installer les drivers  2. Connecter lappareil     Android ...
Flash Builder  Déploiement Android (2/2) Mode Release Build  1. Exporter lapplication     finale  2. Créer / obtenir un   ...
Flash Builder  Déploiement iOS (1/2)       Même procédure pour le mode développement et le       Release Build       Deux ...
Flash Builder  Déploiement iOS (2/2)         Signer l’application avec le certificat iOS et le fichier de        provision...
Flash Builder  Déploiement : comparatif                                    iOS                Android          Développeme...
Développement  SQLite         Moteur de base de données fourni par le runtime AIR         Permet aux applications de stock...
Développement  WebService         Possibilité d’interroger des WebServices sans passer par un         serveur intermédiair...
Développement  Configuration         Un fichier XML de configuration est généré lors de la         création dun nouveau pr...
Flex Mobile  Etat des lieux (1/2)         Développements familiers si connaissance de Flex         Gestion spécifique de l...
Flex Mobile  Etat des lieux (2/2)         Composants standards non optimisés pour Flex Mobile         o Form, Combobox, .....
Flex Mobile  Adaptabilité de linterface         Prévoir une interface adaptable aux différentes variétés         d’écran  ...
Bibliothèque  Eskimo       Permet d’adapter les composants à la plateforme cible       Fournit de nouveaux composantsZenik...
What’s Next ?  Intégrations natives        Parseur JSON        Native Text Input UI        o Personnalisation du clavier (...
What’s Next ?  Captive Runtime et sécurité        Captive Runtime Support pour Android        o Même principe que pour le ...
What’s Next ?  Flex 4.6 (1/2)         Ajout de nouveaux composants mobiles optimisés         o Meilleures performances : 5...
What’s Next ?  Flex 4.6 (2/2)Zenika © 2011      38
Flex et HTML 5         Adobe investit à la fois sur les technologies Flex et         HTML 5         Flex Mobile au travers...
Ressources         Présentation de Michaël Chaize à la What’s Next 2011         http://www.whatsnextparis.com/agenda.html ...
Zenika © 2011   41
Prochain SlideShare
Chargement dans…5
×

What’s Next Replay! Lyon 2011 - F. Fornaciari

1 643 vues

Publié le

Retour et décryptage de la présentation de Michaël Chaize (Adobe) par François Fornaciari (Zenika)

0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
1 643
Sur SlideShare
0
Issues des intégrations
0
Intégrations
349
Actions
Partages
0
Téléchargements
0
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

What’s Next Replay! Lyon 2011 - F. Fornaciari

  1. 1. Accélérez et optimisez vos développements dapplications mobiles WsN Replay Lyon - Jeudi 10 novembre 2011 François Fornaciari - francois.fornaciari@zenika.comZenika © 2011 1
  2. 2. Zenika en quelques mots Un cabinet de conseil et de réalisation Un organisme de formation agréé Expert en Open Source et méthodes Agiles Spécialisé dans les technologies Java EE Créé en 2006 par 4 associés Expertise technique Partage des connaissances Notre site web : www.zenika.com Notre blog technique : http://blog.zenika.com Nos formations : http://www.zenika.com/catalogue-formation Nous suivre sur Twitter : @ZenikaITZenika © 2011 2 2
  3. 3. Nos implantations Paris Lyon Rennes Nantes Et aussi ... Londres AthènesZenika © 2011 3
  4. 4. Zenika Paris Nous suivre sur Twitter : @ZenikaITZenika © 2011 4 4
  5. 5. Zenika Lyon Nous suivre sur Twitter : @ZenikaLyonZenika © 2011 5
  6. 6. Zenika Rennes & Nantes Nous suivre sur Twitter : @ZenikaOuestZenika © 2011 6 6
  7. 7. What’s Next 2011 Présentation Flex Mobile Retour et décryptage de la présentation de Michaël Chaize Enjeux des applications RIA (Rich Internet Application) Présentation du framework Flex Développement d’une application Flex Mobile Plus quelques démos…Zenika © 2011 7
  8. 8. Adobe Flex Introduction Objectifs des applications RIA o Améliorer l’expérience utilisateur o Proposer du contenu riche et dynamique Framework produit par Adobe o Contient un ensemble de composants permettant de développer des applications RIA o Open-source et gratuit depuis 2007 Propose 3 modes de déploiement o Web : navigateur + Flash Player o Desktop : runtime AIR (Adobe Integrated Runtime) o Mobile : runtime AIRZenika © 2011 8
  9. 9. Adobe Flex ComposantsZenika © 2011 9
  10. 10. Adobe Flex MXML vs ActionScript MXML o Syntaxe déclarative de création d’interface <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <s:Panel> <s:Label text="Label" /> <s:Button label="Button" /> </s:Panel> </s:Application> ActionScript o Syntaxe familière aux développeurs JAVA package com.zenika.flex { public class MyClass interface MyInterface { public function MyClass() { } public function doSomething():String { } } }Zenika © 2011 10
  11. 11. Adobe Flex Intégration serveur Communication via des WebServices o JAX-WS ou JAX-RS o Parseur XML natif Interrogation de services Java (RPC) o Frameworks dédiés (BlazeDS, GraniteDS, …) o Sérialisation des données (format AMF) o Intégration avec la plupart des frameworks côté serveur (Spring, EJB, Seam, …) Push de données o Synchronisation des données entre les différents clients o Envoie de notificationsZenika © 2011 11
  12. 12. Flex Mobile Introduction Extension du framework Flex pour le développement d’applications mobiles o Présent depuis la version 4.5 du SDK Flex o OS supportés : iOS, Android, BlackBerry Selon Adobe, plus de 50% du contenu Web sera accédé depuis un appareil mobile d’ici 2 ans Au travers de Flex, Adobe cible le développement d’applications multimodales pour les entreprises o Travail collaboratif et mobilité o Outils de développement avancés o Intégration continueZenika © 2011 12
  13. 13. Flex Mobile Objectifs Développer une application compatible avec la plupart des plateformes mobiles existantes o Evite de développer autant d’applications qu’il y a de plateformes cibles o Bénéficier d’un rendu graphique identique Capitaliser sur l’expérience acquise lors des développements Flex Web Fournir des composants optimisés pour le mobile o List, Button,TextArea,TextInput, ... Fournir des composants dédiés aux mobiles o ViewNavigatorApplication, SlideViewTransition, MultiDPIBitmapSource, ...Zenika © 2011 13
  14. 14. Flex Mobile Tour de FlexZenika © 2011 14
  15. 15. Démonstration Présentation Développement dune application prototype utilisant la technologie Flex Mobile o Périmètre fonctionnel : recherche et rédaction de mémos rédigés lors de rencontres en clientèle Validation de la technologie Flex Mobile concernant la compatibilité de lapplication avec différents formats de tablette et de téléphone mobile Évaluation de la maturité de la technologie Flex Mobile Coût dun développeur Flex à sapproprier le framework Flex MobileZenika © 2011 15
  16. 16. DémonstrationZenika © 2011 16
  17. 17. Flash Builder Introduction (1/2) Développé par Adobe Basé sur des plugins Eclipse Fonctionnalités principales o Auto complétion o Refactoring o Développement pour mobile Emulateur Déploiement sur le device branché en USB o Debugger et profiler Version pour Windows et Mac Licence payante Alternative pour Linux : IntelliJ IDEAZenika © 2011 17
  18. 18. Flash Builder Introduction (2/2)Zenika © 2011 18
  19. 19. Flash Builder OS supportés Depuis la version 4.5.1 : Burrito o Google Android o Apple iOS o BlackBerryTablet OSZenika © 2011 19
  20. 20. Flash Builder Différents types dapplication ViewNavigatorApplication TabbedViewNavigatorApplicationZenika © 2011 20
  21. 21. Flash Builder Support multi-résolutions Tous les appareils non pas la même densité Configuration du DPI o Redimensionnement efficace des images vectorielles et du texte en fonction de la résolution Utilisation de la classe MultiDPIBitmapSource pour insérer des images non vectoriséesZenika © 2011 21
  22. 22. Flash Builder Designer Il est possible dutiliser le mode designer o Prise en charge des différents mobiles (résolutions) o Design en mode portrait au paysage o Editeur WYSIWIGZenika © 2011 22
  23. 23. Flash Builder Déploiement Android (1/2) Mode développement 1. Installer les drivers 2. Connecter lappareil Android via USB 3. Exécuter depuis Flash Builder en spécifiant le device branchéZenika © 2011 23
  24. 24. Flash Builder Déploiement Android (2/2) Mode Release Build 1. Exporter lapplication finale 2. Créer / obtenir un certificat 3. Signer lapplicationZenika © 2011 24
  25. 25. Flash Builder Déploiement iOS (1/2) Même procédure pour le mode développement et le Release Build Deux fichiers sont nécessaires pour déployer sur iOS o Génération dun certificat iOS DeveloperIdentity.p12 Obtenu, par conversion d’un certificat (.pem) avec OpenSSL en certificat iOS Developer avec iOS Dev Center o Utilisation dun fichier de provision *.mobileprovision Contient les ID des devices iOS Fourni par le iOS Dev CenterZenika © 2011 25
  26. 26. Flash Builder Déploiement iOS (2/2) Signer l’application avec le certificat iOS et le fichier de provision et déploiement sur iTunesZenika © 2011 26
  27. 27. Flash Builder Déploiement : comparatif iOS Android Développement - Certificat : Oui - Certificat : Non - Durée : 10 secondes - Durée : 6 secondes - Taille : 6 Mo - Taille : 2Mo Release - Certificat : Oui - Certificat : Oui - Durée : 10 min - Durée : 10 secondes - Taille : 8 Mo - Taille : 1MoZenika © 2011 27
  28. 28. Développement SQLite Moteur de base de données fourni par le runtime AIR Permet aux applications de stocker des données localement o Gestion du mode déconnecté Mise en œuvre o Configuration du fichier dans lequel est persistée la base de données Généralement dans l’espace de stockage propre à l’application o Interrogation via des requêtes SQL o Support des transactions o Utilisation très proche du standard JDBCZenika © 2011 28
  29. 29. Développement WebService Possibilité d’interroger des WebServices sans passer par un serveur intermédiaire Utilisation des classes HttpService ou WebService Conversion native du résultat au format XML en structure objet Flash Builder propose un outil de génération de code d’appel au WebService à partir du WSDL o Génère les classes permettant d’appeler les méthodes du WebService o Traitement du résultat asynchroneZenika © 2011 29
  30. 30. Développement Configuration Un fichier XML de configuration est généré lors de la création dun nouveau projet Flex Mobile Permet de modifier la configuration du projet o Nom et version de l’application o Mode Full screen o Icône application o Etc. Permet également dajouter de la configuration pour un OS en particulier o Ajouts de droit (internet, GPS, …) o Configuration spécifiqueZenika © 2011 30
  31. 31. Flex Mobile Etat des lieux (1/2) Développements familiers si connaissance de Flex Gestion spécifique de la navigation : empilement des vues o Facile d’utilisation o Mécanisme interne de transmission de données entre les vues Possibilité d’utiliser les bibliothèques Flex 4.5 o Attention : tous les composants graphiques Flex 4 ne sont pas optimisés pour le mobile Gestion du mode offline inhérente au développement mobile Prise en main o Prototypage et déploiement extrêmement rapide sur Android (exemple avec le Nexus S) o Simulateur de device très pratiqueZenika © 2011 31
  32. 32. Flex Mobile Etat des lieux (2/2) Composants standards non optimisés pour Flex Mobile o Form, Combobox, ... o A ne pas utiliser pour ne pas dégrader les performances o Composants très courants qui ne sont pas utilisables avec Flex Mobile Liste de composants supportés assez restreinte o Framework en pleine évolution Bonne compatibilité entre les différents devices testés Performances générales en dessous de nos espérances o Nécessité d’aborder la problématique doptimisation durant les développementsZenika © 2011 32
  33. 33. Flex Mobile Adaptabilité de linterface Prévoir une interface adaptable aux différentes variétés d’écran o Une interface pour tablette ne sera pas pensée de la même façon quune interface pour smartphone Utilisation des pourcentages o Pratique pour gérer toutes les résolutions o Moins adaptée pour la précision Difficile de trouver un compromis entre relatif et absolu Tester lUI sur tous les émulateurs et les devices est souvent fastidieux mais indispensable !Zenika © 2011 33
  34. 34. Bibliothèque Eskimo Permet d’adapter les composants à la plateforme cible Fournit de nouveaux composantsZenika © 2011 34
  35. 35. What’s Next ? Intégrations natives Parseur JSON Native Text Input UI o Personnalisation du clavier (email, number, …) Native Extensions o Intégration de fonctionnalités natives du téléphone o Ex : vibreur, lecteur de carte bleue, équipement médical, …Zenika © 2011 35
  36. 36. What’s Next ? Captive Runtime et sécurité Captive Runtime Support pour Android o Même principe que pour le déploiement iOS o Déploiement simplifié : AIR n’est plus un pré-requis o Garantie sur la version AIR utilisée : tests simplifiés Encrypted Local Storage for Mobile o Sécurisation des données utilisateur sur le mobile Et bien d’autres …Zenika © 2011 36
  37. 37. What’s Next ? Flex 4.6 (1/2) Ajout de nouveaux composants mobiles optimisés o Meilleures performances : 50 % de gain annoncé o Meilleure compatibilité avec les dernières plateformes Android et iOS Flash Builder 4.6 o Intégration des extensions natives o Captive Runtime Pre-release programZenika © 2011 37
  38. 38. What’s Next ? Flex 4.6 (2/2)Zenika © 2011 38
  39. 39. Flex et HTML 5 Adobe investit à la fois sur les technologies Flex et HTML 5 Flex Mobile au travers du runtime AIR et du framework Flex Sortie prévue tous les 3 mois d’une nouvelle version de AIR Synchronisation des nouvelles versions de Flex avec AIR (pas nécessairement avec la même fréquence) HTML 5 au travers d’outils de génération de contenu Produit Adobe EdgeZenika © 2011 39
  40. 40. Ressources Présentation de Michaël Chaize à la What’s Next 2011 http://www.whatsnextparis.com/agenda.html Flex http://flex.org/ Tour de Flex http://www.adobe.com/devnet/flex/tourdeflex.html Tour de Mobile Flex (application Android) http://flex.org/tour-de-mobile-flex/Zenika © 2011 40
  41. 41. Zenika © 2011 41

×