IHM Etat de l'art du développement d'applications mobiles François BONNEVILLE aricia - Laboratoire d'Informatique de lUniversité de.

Slides:



Advertisements
Présentations similaires
Un environnement de développement éducatif
Advertisements

Mathilde VINCENT - Olivier JOURDAN Paris - le 7/2/2012
Copyright ©: SAMSUNG & Samsung Hope for Youth. All rights reserved Tutorials Tablettes : Premiers pas avec votre tablette Niveau : Débutant Intermédiaire.
Réalisation d’un Framework pour la création de jeux d'arcades
Internet : serveurs Web
Le developpement web  Préparé par : ASSAL Lamiae JAMALI Zakarya
Judicaël OMBAKA EKORI Rémi GAROT - RIO
L’architecture .net et ASP.net
Le développement d’applications sous Lotus Notes
XHTML EXtensible HyperText Markup Language. HTML et XML HTML (HyperText Markup Language) et XML (eXtensible Markup Language) sont deux spécifications.
Cours Visual Basic pour Application
Développement avec Android Cours B53, enseignant Éric Labonté
Développement dun simulateur dinterface graphique à distance Présenté par Michaël Delhaye Promoteur : Jean Vanderdonckt.
Android Réaliser par: Alia Ragueme Asma Lazrag Maroua Laribi.
Développement Mobile Initiation au développement d’applications Android Rami AMRI FST 2011/2012.
Etude des Technologies du Web services
Communiquer avec ELYX.
Présenté par : Kalleli Dhouha
IHM Responsive Design François BONNEVILLE aricia - Laboratoire d'Informatique de lUniversité de Franche-Comté
JAVASERVER FACES Un framework Java pour le développement Web.
Android est une plateforme mobile open source et entièrement paramétrable. Elle a été créée afin de mettre à disposition des développeurs toutes les fonctionnalités.
Présentation de Windows Presentation Foundation Vers une nouvelle génération dinterfaces graphiques.
Développement Rapide dApplications Web avec.NET « Mon premier site »
Programmation Approche composants Ing5 SI
GWT UML Un modeleur UML en GWT
Laboratoire d'Informatique de l’Université de Franche-Comté
Présentation de NAVIGATEURS INTERNET
SITES E-COMMERCE RESPONSIVE
Microsoft .NET.
Clients riches RIA (Rich Internet Application) / RDA
Les systèmes multiplateformes
Document élaboré à Centrale Paris par Pascal Morenton LES TECHNOLOGIES DU WEB 1. LES PHASES D UN DEPLOIEMENT DE RESEAUX 2. LE LANGAGE HTML 3. LE LANGAGE.
Adaptée du cours de Richard Grin
J2EE vs .NET Réaliser par : SEIF ENNACER BADRA && CHETOUI RIM.
JEE 5 F.Pfister 2 institut eerie JEE – Une plateforme serveur  Développement et exécution d'applications réparties.
‘‘Open Data base Connectivity‘‘
LES CLIENTS WEB RICHES Tuteur : Olivier CARON LEFEBVRE Benoit
Guillaume TORRENTE Marc BOUISSOU Recherche & Développement
Le langage du Web CSS et HTML
Présentation de CORBA et de IIOP
Créez des applications Silverlight 3 David Rousset Relations Techniques avec les développeurs Microsoft France
AngularJS.
Android Kévin Giroux.
Internet : serveurs Web  Clients et serveurs : le navigateur  Sites Web et urls  Fichier source d’une page  Langage HTML 1.
« Le plaisir du chercheur : retrousser les jupes de la nature » Jean Rostand Proposer une « Interface Homme Machine » en utilisant une technologie Client.
Le web service
Introduction à Visual Studio C++ (VC++)
SLAM 1 Exploitation d’un schéma de données
S'initier au HTML et aux feuilles de style CSS Cours 5.
Les systèmes d’exploitation
S'initier au HTML et aux feuilles de style CSS Cours 5.
Iup MIAGe 3° année Projet MIAGe Toulouse – Groupe 21 Charte graphique.
Outils développement d'application Mobile
EPREUVE E6 : PARCOURS DE PROFESSIONNALISATION
OS & Logiciels.
Séance /10/2005 CSS et Dreamweaver. CSS : principes Cascading Style Sheet = feuille de style en cascade Norme du W3C :
Introduction General Chapitre 1 : Cadre général
Soutenance de Projet – BTS IG
Soutenance de Projet – BTS IG
Programmation mobile: Android
Présentation de Qt Iris 1
Création d’applications distribuées.NET Ziriad Saibi Relation technique éditeurs de logiciels Microsoft France.
Bloc 1 - UE 5 - Technologies de l’information et de la communication TIC Bachelier en immobilier T. SOUMAGNE.
Interface Utilisateur pour synchroniser son iPod ou iPad
Installation du PGI – CEGID
Cloud et Petites entreprises. Stockage de données.
Introduction O.Legrand G. Seront. Open Handset Alliance Project Regroupement d'entreprises : –de télécommunications, –de constructeurs d’appareils mobiles,
1 Interne Orange Accédez à votre système d'information depuis votre terminal mobile Nomalys.
Transcription de la présentation:

IHM Etat de l'art du développement d'applications mobiles François BONNEVILLE aricia - Laboratoire d'Informatique de lUniversité de Franche-Comté

Historique Téléphone portable Norme GSM créée en 1982 Premier téléphone portable fabriqué en 1983 par Motorola 1986, 1er réseau en France : Radiocom , France Telecom lance Itineris Les assistants numériques personnels (PDA) –Années 1990 –Agenda, carnet d'adresses, bloc-notes –Système d'exploitation –Synchronisation des données avec un PC

Les smartphones SMARTPHONE = PDA+ téléphone portable Lancé en 2001 Sagem Lessor commence en 2005 avec –la sortie de l'IPhone –Le rachat de la startup Android, par Google. GPS et Wifi : téléphone + connexion Internet Nombreuses fonctionnalités Système dexploitation Se comporte comme un ordinateur portable Téléchargement d'applications

Magasins dapplications Plateformes de téléchargement (gratuit ou payant) de logiciels pour smartphones. Appstore dApple, Google Play, Windows Phone, etc. Les éditeurs dapplications sont obligés de déposer leurs logiciels sur ces plateformes, afin quelles soient disponibles Modèle économique –Application payante –Publicité –Contenu payant

Les systèmes dexploitation mobiles Ancienne génération –Symbian (Nokia) –BlackBerry OS –Windows Mobile OS « tactiles » –IOS dérivé de Mac OS X applications téléchargeables sur lAppstore –Android Basé sur un noyau Linux Open source Intègre les services Google –Windows Phone 7

Développement d'applications mobiles Les applications natives –façon classique pour implémenter une application –java pour Android, Objective C pour iOS, C# pour Windows phone 7 –Accès direct aux fonctionnalités de l'appareil : Téléphone, GPS, Camera, Carnet d'adresses, Agenda –Nécessite de réécrie le code pour chaque plateforme Les applications hybrides Implémentées en HTML, CSS et Javascript Pas de réécriture de code à chaque changement de plate-forme Plusieurs framework permettent leur création et leur déploiement Phonegap, Titanium, Sencha et JQuery mobile

Les outils de développement Xcode pour IOS dispose de deux API de programmation : –Carbon qui permet de programmer avec les langages C et C++. –Cocoa qui permet de développer avec les langages Objective-C, AppleScript et Java. Fourni avec toute une suite logicielle (graphiques, audio, etc.)..Net Compact framework pour Windows phone –framework fonctionnant avec Visual studio en programmant avec C# ou Visual Basic.Net. –sous-ensemble de la bibliothèque.NET Framework –contient également des classes spécialement conçues –hérite la totalité de l'architecture de Common Language Runtime et d'exécution de code managé du.NET Framework.

Les outils de développement Java pour Android –classes java spécifiques avec limport du paquetage android. –Une application android contient six principaux éléments Activity : couche visuelle de lapplication. Views : composants IHM de lapplication. Service : Permet lexécution de lalgorithme sur un temps indéfini et terminé en fonction de la tâche. Content Provider : fournit des données aux applications via un fournisseur de contenu capable de les partager avec dautres applications (agenda, photos, contacts). Intents : une application peut appeler un service ou une activité (explicite) ou un service du système android (implicite). Broadcast Receiver : Reçoit les messages systèmes et les Intents implicites.

Eclipse : un IDE intégré très pratique

« Hello World » en java pour Android Instanciation d'un textview (composant qui sert à afficher des alphanumériques). TextView tv = new TextView(this); On lui a donne une valeur : tv.setText("Hello, Android"); On affiche notre composant : setContentView(tv);

Phonegap Framework open source de développement mobile Développé par la société Netiobi software, racheté par Adobe. Utilise les langages javascript, Html5 et css3. Supporte plusieurs plateformes (IOS, Android, Symbian, Windows Phone, Blackberry OS) Bonne documentation Lenteur comparée aux applications natives Très difficile à débugguer

« Hello World » en Phonegap Home Hello PhoneGap..!

Phonegap : Compilation Online

Paramétrage de son appli Phonegap

Appcelarator Titanium Framework pour développer des applis pour Android et iOS. Logiciel open source. Code écrit en javascript, puis transformé en bytecode Fournit des API pour accéder aux composants UI natifs comme les barres de navigation, les menus, les boites de dialogues et dalertes. aux fonctions natives du mobile comme le système de fichiers, le son, le réseau, laccès à une base de données locale, la géolocalisation, laccéléromètre et les cartes. Extensibilité à travers des interfaces libres et des licences autorisant les développeurs à ajouter les supports dautres langages de programmation, de codecs multimédia et des fonctions spécifiques à lappareil.

Inconvénients de Titanium Une API Titanium à apprendre. Lobligation de sadapter aux fonctionnalités de chaque mobile et à lévolution de leurs systèmes dexploitation. Le déploiement des applications se fait avec un IDE Titanium Studio basé sur Eclipse et qui permet de créer, tester, débuguer et déployer les applications pour Android et IOS.

« Hello World » avec Titanium Fichier javascript var win = Titanium.UI.createWindow({ title:'My Window', backgroundColor:'#cccccc' }); win.open(); // ouvrir la fenêtre var label = Titanium.UI.createLabel({ color:'#999', text:'Hello World', font:{fontSize:20}, textAlign:'center' }); win.add(label); // ajouter le label à la fenêtre win.open(); // ouvrir la fenêtre

Jquery Mobile Framework qui fonctionne sur toutes les plate-formes mobiles actuelles Utilise une bibliothèque javascript pour créer des sites web adaptés aux smartphones et tablettes. une page HTML5 qui référençe les fichiers du framework dans la balise head. Utilise les attributs data, à lintérieur de la balise body, permettant dajouter une donnée ou une information à lélément html. Prise de main rapide qui ne demande pas un niveau expérimenté en développement Documentation riche Communauté active dans les forums. Déploiement avec PhoneGap

Structure d'une page Jquery mobile …>/div> « look and feel » qui limite le choix dans lergonomie incapacité daccéder à des fonctionnalités natives comme par exemple un scanner de code barre ou à lappareil photo

« Hello World » avec Jquery Mobile MDS PhoneGap API Demo with jQuery Mobile Test Hello World!

Sensa Touch Framework conçu pour développer des applications mobile avec HTML5 Basé sur Javascript Compatible avec de nombreuses plate-formes comme Ios, Android et BlackBerry Contrairement à Jquery Mobile qui contente de fournir du Css, Sencha Touch sappuie exclusivement sur javascript pour fournir les composants de linterface graphique et ensuite générer les éléments du html. Utilise le design pattern MVC(Modèle-Vue-Controlleur) : Le modèle représente lensemble des données utilisées et peut être lier à dautres modèles. Le store est le cache côté client des instances des modèles. Les vues représentent composants graphiques daffichage comme les panels de tables, les boutons, les formulaires, etc. Les contrôleurs représentent le traitement de lapplication comme les événements sur les composants des vues.

Sensa Touch Les avantages framework performant orienté objet fournit des composants graphiques proches de ceux proposés par les applications natives. utilise le design pattern MVC qui assure une meilleure maintenabilité et une meilleure évolutivité de ses applications. Les inconvénients naccède pas aux fonctionnalités natives de lappareil mobile son utilisation du javascript pour générer les éléments html peut être déroutante. Le déploiement dispose dun service web appelé sencha.io pour le déploiement des applications sur les plate-formes supportées.

« Hello World » avec Sensa Touch Hello World Ext.setup({ onReady: function() { Ext.Msg.alert('Hello World!'); } });

Conclusion Nombreuses solutions pour développer des applications mobiles Bien choisir son framework en fonction du type d'application à développer des limitations techniques de certains framework de vos connaissances de développeur de la réutilisation de code existant