Conception, Synthèse et Application d'une Nouvelle Commande ...
Les secrets du développement d'une application mobile
-
Upload
eutech-ssii -
Category
Technology
-
view
922 -
download
6
description
Transcript of Les secrets du développement d'une application mobile
![Page 1: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/1.jpg)
Les secrets du développementd’une application mobile
Eutech SSII – 25 septembre 2012 – JB. Boisseau – A. Pagnier
![Page 2: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/2.jpg)
Présentation et sommaireArnaud Pagnier
![Page 3: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/3.jpg)
Sommaire
Appli mobile ou web mobile ?
1 Maquettage 2 Conception 3 Implémentation 4 Suivi de projet 5 Tests 6 Déploiement 7 Référencement et marketing
![Page 4: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/4.jpg)
IntroductionJean-Baptiste Boisseau
Le Mobile en 2012
![Page 5: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/5.jpg)
SmartPhone : définition
Le marché n'est pas 100% smartphone
1,6 milliard de mobiles vendus en 2011 dans le monde
Dont 390 millions de smartphones En France, 40% des utilisateurs de
mobile ont un smartphone
![Page 6: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/6.jpg)
SmartPhone : définition
Caractéristiques du smartphone en 2012 :
Interface tactile GPS / boussole Appareil photo / Caméra Accéléromètre Système proposant navigateur web
avancé et gestion de fichiers Réseau 3G+ minimum, wifi
![Page 7: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/7.jpg)
Les principaux terminaux
Apple : Iphone 4, Iphone 4S, iPhone 5
Samsung : Galaxy/Galaxy S, Nexus, Wave
Nokia : N9, C6, LumiaRIM : Torch, BoldHTC : Gamme Android, gamme
Windows Sony Ericsson : XperiaLes autres : LG, Huawei, Motorola,
Acer...
![Page 8: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/8.jpg)
Les systèmes d’exploitation
Statistiques françaises (données d'utilisation sur le web obtenues via webanalyse, 12/11) :
IOS : 56% Android : 32% Symbian : 4% Bada : 2,5% Blackberry OS : 1,5% Windows Phone : 1% Les autres : MeeGo (Tizen), WebOS...
![Page 9: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/9.jpg)
Premier jalonArnaud Pagnier
Maquetter « Mobile »
![Page 10: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/10.jpg)
La problématique
L’ergonomie est le Graal du maquettage
Penser mobile / penser tactile
Penser iOS / penser Android : une solution simple et familière
![Page 11: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/11.jpg)
La problématique
La personnalisation graphique d’une application ?
Un graphisme pour iOS, un graphisme pour Android…
Le « look & feel » natif des systèmes
![Page 12: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/12.jpg)
Balsamiq, MockApp, Powerpoint ?
![Page 13: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/13.jpg)
Les documents techniques…
L’API
CanalBlog
dans le
moindre détail
![Page 14: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/14.jpg)
Un cas concret : FormaPoste
![Page 15: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/15.jpg)
Un cas concret : FormaPoste
![Page 16: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/16.jpg)
Un cas concret : FormaPoste
Transcription d’une procédure papier…
Beaucoup d’inspiration…
Et quelques « proof of concept ».
![Page 17: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/17.jpg)
Une étape crucialeJean-Baptiste Boisseau
Concevoir « Mobile »
![Page 18: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/18.jpg)
Concevoir
Un véritable travail d’ingénierie logicielle Un code robuste, des designs patterns… Les guides de conception et
d’architecture des éditeurs ?
De la méthode
![Page 19: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/19.jpg)
Serveur d’applicatio
n web
Une architecture « classique »
Logique « métier »
Interface d’admin
Terminal
Données
distantes
Données
locales
Logique « métier »
Synchronisation
JSON
![Page 20: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/20.jpg)
Une architecture « classique » L’application et son
« écosystème d’informations »
L’application comme « frontend » Quel « backend » ?
Communication par services web.
Gestion de la sécurité
Le mode asynchrone…
![Page 21: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/21.jpg)
Un cas concret : EnigmApp
![Page 22: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/22.jpg)
Le cœur du projetArnaud Pagnier
Coder « Mobile »
![Page 23: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/23.jpg)
Coup d’œil sur les EDI
Eclipse VS XCode Editeur de code (autocomplétion,
template de code, …), gestion des sources
Concepteur visuel d’interface Compilateur, debugger pas à pas Simulateurs Gestion des terminaux physiques Intégration continue…
![Page 24: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/24.jpg)
Eclipse
![Page 25: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/25.jpg)
XCode
![Page 26: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/26.jpg)
Les solutions « multiplateformes »
Un seul développement pour toutes les plateformes ?
PhoneGap : une solution pertinente.
Un développement « web » avec HTML5, CSS3, et…
Une API JavaScript
![Page 27: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/27.jpg)
Les solutions « multiplateformes »
HTML 5 et CSS3
JavaScript
API PhoneGap
API natives
des terminau
x
Compilation
![Page 28: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/28.jpg)
Quelles solutions choisir ?
Développement « natif » ?
Développement « PhoneGap » ?
Développement « full web » ?
![Page 29: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/29.jpg)
Profil du développeur idéal
Rigueur de travail et soin permanent de l’optimisation
Connaissance approfondie des SDK iOS ou Android
Connaissance de l’architecture web Forte faculté d’adaptation et
d’apprentissage
![Page 30: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/30.jpg)
Un cas concret : CanalBlog
En général : architecture classique, ergonomie et usage bien établis, pas de fonctionnalités « complexes », …
iOS : 15 j.h.
Android : 20 j.h. !
![Page 31: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/31.jpg)
La boussole et le timonierArnaud Pagnier
Piloter « mobile »
![Page 32: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/32.jpg)
Conduite de projet
Une méthodologie classique… ingénierie logicielle. Développements agiles : Xtrem
Programming, SCRUM…
![Page 33: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/33.jpg)
Redmine et le suivi des tâches
![Page 34: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/34.jpg)
L’épreuve du feuJean-Baptiste Boisseau
Tester « Mobile »
![Page 35: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/35.jpg)
Les documents
Cahiers de recette
PV de recette
Mode itératif
![Page 36: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/36.jpg)
Du simulateur au device
Les simulateurs et les SDK
Les terminaux de référence : faire un choix.
![Page 37: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/37.jpg)
Un cahier de recette
![Page 38: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/38.jpg)
Les derniers kilomètresArnaud Pagnier
La publication d’une appli « Mobile »
![Page 39: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/39.jpg)
Plusieurs modes de distribution
Sur les stores
En mode « entreprise »
![Page 40: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/40.jpg)
L’AppStore, n’y rentre pas qui veut !
S’enrôler, devenir développeur Devenir éditeur d’applications
Choisir son public, mettre en avant son application, choisir un modèle économique
La sentence de l’App Store…
![Page 41: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/41.jpg)
Marketing et applis mobiles Pas beaucoup de possibilités sur les stores
Mots-clés Commentaires Nbr de téléchargements Mise en avant
Un moyen efficace : le marketing web « classique ». Référencement, Pubs, Réseaux sociaux…
![Page 42: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/42.jpg)
Un cas concret : Le Diable Vauvert
Application trop lourde pour être obtenue en 3G
Utilisation inappropriée de la connectivité 3G
Contenus manquants Fonctionnalités « privées » Utilisation détournée d’une icône Illustration inadaptée au public ciblé Illustration vraiment inadaptée
![Page 43: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/43.jpg)
Le Cas « Diable Vauvert »
http://www.audiable.com
![Page 44: Les secrets du développement d'une application mobile](https://reader035.fdocument.pub/reader035/viewer/2022062405/558690c2d8b42a4a7f8b45c1/html5/thumbnails/44.jpg)
CONCLUSIONArnaud Pagnier
Questions ? et réponses !