1. Chp1 : Introduction
Etat de l’art et Technologies
Conception et Développement d’Applications Mobiles
GL4 (Option Mobile) - 2016
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 1
2. PLAN
1. Etat de l’Art des Applications Mobiles
2. Spécificités du Développement Mobile
1. Contraintes Matérielles
2. « User Experience »
3. Connectivité Réseau
4. Monétisation
3. Technologies Mobiles Actuelles
4. Tendances Mobiles pour 2016
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 2
Chp1: Introduction au Génie Logiciel Mobile
3. ETAT DE L’ ART DES APPLICATIONS MOBILES
Chp1: Introduction au Développement Mobile
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 3
4. Quelques Chiffres
• Utilisation des mobiles(*)
• 6,9 milliards de terminaux vendus fin 2014
• Taux de couverture atteint environ 95% de la population mondiale
• Smartphones(*)
• 1,76 milliards d’utilisateurs de smartphones
• Augmentation de 23% par rapport à 2013
• 395 millions de Go de données transférées
• Augmentation de 48% par rapport à 2013
• En Tunisie
• Plus de 12,63 millions de cartes SIM vendues (115% de taux de pénération)
(**)
• 12% des Tunisiens abonnés à la téléphonie mobile ont des smartphones (***)
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 4
Etat de l’ Art des Applications Mobiles
(*) D’ aprèsl’union mondialedestélécommunications
(**) D’ aprèsl’Instance NationaledesTélécommunications(INT)
(***) D’aprèsPew Global Attitude
5. Smartphones
• Téléphone portable (1983 par Motorola)
• Assistants numériques personnels (PDA) en 1990
• Agenda, carnet d’adresses, bloc notes
• Synchronisation des données avec un PC
• Smartphone = Téléphone portable + PDA
• En 2001 par Sagem
• Essor en 2005 avec la sortie de l’iPhone, et le rachat d’Android par Google
• Mini-ordinateur portable
• Applications téléchargeables
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 5
Etat de l’ Art des Applications Mobiles
6. Quelques Systèmes d’Exploitation Mobiles
• Ancienne génération
• Symbian de Nokia
• Blackberry OS de RIM
• Windows Mobile de Microsoft
• Bada de Samsung
• OS Tactiles
• iOS de Apple
• Android de Google
• Windows Phone 7 de Microsoft
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 6
Etat de l’ Art des Applications Mobiles
7. Systèmes d’Exploitation Mobiles : Parts de Marché
• France (de Avril 2013 à Avril 2014)
• USA (de Avril 2013 à Avril 2014)
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 7
Etat de l’ Art des Applications Mobiles
68,0%
16,9%
6,2%
3,8%
5,1%
Avril 2013
Android
iOS
Windows Phone
Blackberry
Other
66,6%
20,2%
10,1%
1,1% 2,0%
Avril 2014
Android
iOS
Windows Phone
Blackberry
Other
51,8%41,4%
5,6%
0,7%
0,6%
Avril 2013
Android
iOS
Windows Phone
Blackberry
Other
59,1%
34,6%
4,7% 1,0%
0,6%
Avril 2014
Android
iOS
Windows Phone
Blackberry
Other
8. SPÉCIFICITÉS DU DÉVELOPPEMENT MOBILE
Chp1: Introduction au Développement Mobile
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 8
9. Contraintes Matérielles
• En développant des applications pour mobiles, il faut prendre en
considération certaines contraintes des appareils cibles
• Mémoire limitée / Processeur lent
• Bien que les nouveaux modèles haut de gamme arrivent à 3Go de RAM
(même 4 prévu pour 2015), la plupart des smartphones souffrent d’un
temps de chargement long
• Bien faire attention au type de public ciblé
• Éviter les traitements complexes, gourmands en mémoire
• Capacité de stockage limitée
• Quelques smartphones très haut de gamme (iPhone6) ont une mémoire de
128Go
• Mais plusieurs modèles d’entrée de gamme n’ont que 4Go (majorité de
16G0)
• Penser à s’orienter plus vers le stockage sur le cloud, par exemple.
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 9
Spécificités du Développement Mobile
10. Contraintes Matérielles
• Autonomie
• Éviter les applications gourmandes en énergie (caméra vidéo par exemple,
nécessaire pour la réalité augmentée)
• Application doit supporter
• Taille d’écran réduite et variable
• Réduction du contexte de l’application par rapport à un écran
• Tailles varient d’un appareil à un autre (smartphone, tablette, phablette,…)
• Exploiter tout l’espace fourni de manière optimale
• S’orienter dans le développement vers le responsive-design (adaptable à la
taille de l’écran)
• Penser à des choix d’IHM qui facilitent la navigation (un header fixe,
utilisation des icônes à la place des mots…)
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 10
Spécificités du Développement Mobile
11. Contraintes Matérielles
• Problèmes de Connectivité
• Problèmes de connectivité dus à la mobilité
• Utilisation des réseaux 3G/4G, donc payants
• Penser à un mode offline pour vos applications/sites
• Attention aux mises à jour automatiques
• Téléchargement plus lent
• Connexions internet plus lentes, latence réseau et mémoire et processeur
limités
• Vitesse de téléchargement assez faible par rapport aux ordinateurs
• 80% des utilisateurs ne veulent pas utiliser leur téléphone pour surfer sur le
web
• 64% s’attendent à ce qu’une page soit disponible en 4s, alors qu’en moyenne,
un smartphone la télécharge en 9s
• Utiliser des technologies qui facilitent le chargement des pages, comme
l’exploitation de la cache, ou l’utilisation de CSS3
• Réduire la taille des images, le nombre de fichiers et les traitements côté client
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 11
Spécificités du Développement Mobile
12. Contraintes Matérielles
• Manipulation plus délicate
• Utilisation délicate du clavier tactile, sujette à beaucoup d’erreur de frappe
et désagréable pour l’utilisateur
• Minimiser le nombre de champs de texte
• Favoriser les champs préremplis
• Fonctionnalités d’auto-complete, correction d’orthographe…
• Clics invalides, à cause de l’utilisation des doigts (problème appelé du FAT
FINGER)
• Attention à la taille et proximité des éléments cliquables
• Penser à une fonctionnalité “Annuler” disponible un peu partout
• Absence de l’effet de survol (hover)
• Besoin de plus de liens et de boutons
• Utiliser des conventions de conception mobile, comme balayer l’écran (swipe)
ou secouer le téléphone (shake)
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 12
Spécificités du Développement Mobile
13. User Experience (UX)
• C’est le comportement, attitude et émotions d’un utilisateur quand il
manipule un certain produit, système ou service
• Inclut les aspects pratiques, expérimentaux, affectifs de l‘interaction
homme-machine
• Concerne
• L’ utilité
• La facilité d’utilisation
• Efficacité
• Notion subjective car dépend de la personne considérée
• Notion dynamique car en constante évolution dans le temps
• Changement des circonstances d’usage
• Changement des habitudes et systèmes
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 13
Spécificités du Développement Mobile
du produit
14. Monétisation (1)
• Possibilité pour un éditeur de vendre son application via les plateformes de
téléchargement (App Store, Google Play..)
• Mais ce n’est pas la seule manière de monétiser une application
• Application Payante
• Moyen de monétisation classique
• Applications peu chères (moins d’un euro) ont un grand succès
• En général 70% pour le développeur, 30% pour la plateforme
• Le prix varie selon l’OS (répercussion du portage)
• Mais, Certains utilisateurs sont réticents à acheter des applications (surtout
sur Android)
• Version d’Essai
• Fournir une version limitée, qui donne une idée à l’utilisateur de la qualité de
l’application
• Bien adapté pour les jeux
• Mais, problème de maintenabilité pour les développeurs
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 14
Spécificités du Développement Mobile
15. Monétisation (2)
• Publicité
• Sous forme de bandeau ou interstitiel
• Profitable pour les développeurs qui veulent se faire connaître et avoir des
revenus
• Les publicités rémunèrent en général au clic à difficile d’estimer le revenu
• La publicité peut altérer l’UX (lenteur, appui par erreur…)
• La publicité doit être bien ciblée
• Sponsoring
• Incite les utilisateurs à effectuer une action en échange d’un bien virtuel
• Bien adaptée aux jeux
• Public bien ciblé, donc chances de gagner des revenus plus grandes
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 15
Spécificités du Développement Mobile
16. Monétisation (3)
• Freemium
• Proposer du contenu virtuel contre de l’argent
• Chez Apple: in-app purchase
• Chez Google: in-app billing
• Peuvent être implémentés sur une applications payante ou gratuite
• Une application de qualité donne envie aux utilisateurs d’y revenir et
d’acheter du contenu
• Le contenu virtuel doit valoir son prix
• L’achat doit être simple et rapide (le moins de clics possibles)
• L’ expérience doit être limitée, sinon risque de frustrer l’utilisateur
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 16
Spécificités du Développement Mobile
18. Catégories d’Applications Mobiles
• Applications Natives
• Applications écrites dans un langage de programmation spécifique à une
plateforme particulière
• Exemple: Objective C pour iOS, Java pour Android
• Performance accrue et haut degré de fiabilité
• Ont accès aux fonctionnalités du téléphone (caméra, liste de contacts…)
• Utilisables sans connexion internet
• Mais, plutôt chères à développer, car associée à un OS, donc besoin de
dupliquer les versions pour d’autres plateformes
• Applications Web
• Sites web adapté pour une utilisation sur appareil mobile
• Accessibles via le navigateur web de l’appareil mobile
• Fonctionnement en ligne, sans installation
• Modification à un seul endroit, et tous les utilisateurs le voient
• Besoin de rendre votre site web « mobile-friendly » pour un meilleur usage
• Utilisation de HTML, JavaScript, CSS…
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 18
Technologies Mobiles Actuelles
19. Catégories d’Applications Mobiles
• Applications Hybrides
• Exposer le contenu de sites web existants sous forme d’application
• Enlever le navigateur de l’expérience utilisateur: installée comme toute
application native
• Publiables dans les magasins d’applications
• Ont plus accès aux fonctionnalités du téléphone que les applications
purement web, mais restent un peu limités
• Développement en HTML, JavaScript et CSS, puis enveloppées dans une
application native
• 2 majeures plateformes:
• Phone Gap et sa version open source Cordova
• Appcelerator Titanium
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 19
Technologies Mobiles Actuelles
20. Web vs. Hybride vs. Natif: L’ éternel Débat
PROS CONS
Native Performance
Bien adaptéspour la plateforme sous-jacente
Utilisation optimisée des ressources du tel
Interface cohérente avecle look-and-feelde
l’appareil
Développement coûteux
Code n’ est niréutilisable ni portable entre
plateformes
Web Création à partird’un site très rapide
Coût de développementbas
Réellement Multi-plateforme
Pas accès aux fonctionnalités du tel
UX reste purementweb
Interfaces plutôt basiques
Pas optimisée pour l’appareil
Pas distribuées via les stores, doncpeu de
visibilité
Hybride Sans navigateuret installable
Temps de développement raisonnable
A accès auxfonctionnalités du tel
Les navigateursne donnentpas toujours le
même rendu
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 20
Technologies Mobiles Actuelles
21. TENDANCES MOBILES POUR 2016
Chp1: Introduction au Développement Mobile
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 21
22. Internet Mobile
• Internet mobile: moyen de communication privilégié entre les
entreprises et leurs clients et collaborateurs
• Gartner a fait une étude sur les 10 tendances que les entreprises
devront connaitre
1. Outils de développement mutli-plateformes
• 3 OS connus (Android, iOS et WinPhone)
• 3 Architectures applicatives (natif, hybride et mobile)
• Obligation de maîtriser plusieurs outils de développement pour créer des
applications qui fonctionnent sur ces OS et ces Archi
2. Langage HTML5
• Tendance qui gagnera en importance pour les applications multiplateformes
• En évolution
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 22
Tendances Mobiles pour 2016
23. Internet Mobile
3. Expérience Utilisateur (UX)
• Il faut évaluer le niveau de satisfaction de l’internaute (simplicité, utilisation
et accessibilité)
• Vigilence à la conception d’applications mobiles, car les mobinautes sont vite
distraits. Il faut donc toujours maintenir leur attention
4. Géolocalisation
• Besoin de contenu contextualisé
• Par exemple, envoi de promotions de courte durée aux mobinautes à
proximité
• Besoin d’une grande précision pour les géolocaliser
5. Smartphones
• Va devenir le point central (hub) du réseau personnel
• Va dialoguer avec tous les gadgets
6. Nouvelles normes Wifi
• Changement du réseau wifi qui va s’améliorer considérablement (x3 ou x4)
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 23
Tendances Mobiles pour 2016
24. Internet Mobile
7. Gestion des Mobiles d’Entreprise
• La gestion des terminaux
• La gestion des applications
• La synchronisation
• Le partage de fichiers
8. Internet of Things
• En 2020, on vivra autour d’objets connectés (jouets, électroménager,
dispositifs médicaux…)
• Besoin de gérer les aspects du quotidien
• Possibilité d’interaction avec les réseaux sociaux et poster du contenu
9. Standards LTE et LTE-A (Long Time Evolution et LTE-Advanced)
• Augmenter les performances/vitesse des réseaux (débit jusqu’à 1 Gbit/s)
• Progression de la 4g vers le très haut débit
10. Outils de Monitoring
• Suivi de performances des applications
• Analyse des fonctionnalités et comportements des internautes à leur égard
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 24
Tendances Mobiles pour 2016
25. Références
• Applidium, “État de l’art sur la monétisation des apps”, url:
http://applidium.com/news/etat_de_l_art_sur_la_monetisation_des_apps ,
publié le 05/07/12, consulté le 25/02/15
• Artionet, “Les dix technologies mobiles à maîtriser pour 2016”, url:
http://www.artionet.ch/fr/Blog/Technologie/Les-10-technologies-mobiles-
a-maitriser-pour-2016.html, publié le 05/05/14, consulté le 25/02/15
• FRAndroid, “OS Mobiles: les parts de marché mondiales et nationales pour la
période de février à avril 2014”, url:
http://www.frandroid.com/marques/apple/219529_os-mobiles-les-parts-
marche-mondiale-nationales-les-mois-fevrier-avril-2014, publié le
26/05/14, consulté le 27/02/15
• Johan Johansson, "How to make your websites faster on mobile devices",
url: http://www.smashingmagazine.com/2013/04/03/build-fast-loading-
mobile-website/ publié le 03/04/13, consulté le 27/02/15
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 25
Sites Web
26. Références
• François Bonneville, “État de l’art de développement d’applications
mobiles”, ARICIA, laboratoire d’Info. de l’université de Franche Compté
Dr. Lilia SFAXI
www.liliasfaxi.wix.com/liliasfaxi
Slide 26
Cours