Conférence présentée par DUPUIS Laurie, EMO Kévin et WATTRELOT Gaëtan
Parlons du développement d’application mobile multiplateforme en montrant les différentes solutions existantes permettant de mutualiser un développement pour les différents supports, à travers une étude de cas avec Apache Cordova. L’objectif étant de développer une application unique et d’en permettre la portabilité sur différents systèmes (Android, iOs, Windows Phone, Bada, …). Ce sera l’occasion de parler des différentes solutions du cross-platforming et de mettre en avant les avantages et limites de Cordova.
Applications multi plateformes avec Cordova, HTML5 et JavascriptMicrosoft
A travers Microsoft Open Technologies, Microsoft participe à de nombreux projets open source comme par exemple Apache Cordova. Nous vous présenterons comme tirer le meilleurs parti des outils Microsoft pour développer une application sur iOS, Android et Windows en utilisant HTML, Javascript et Cordova. Au menu : les outils en ligne de commandes, Visual Studio, un émulateur Android qui booste et du débug à distance sur un Mac !
Este documento discute el uso de tecnologías en el deporte de alto rendimiento. Las nuevas tecnologías son útiles para entrenadores en el fútbol sala para corregir acciones, planificar tareas específicas y analizar rivales. En la Fórmula 1, la tecnología es crucial pero también lo son los aspectos comerciales y deportivos. Finalmente, la tecnología podría mejorar el arbitraje mediante sistemas de video infalibles para decidir goles válidos e invalidos.
Más de 2,3 millones de personas mueren cada año debido a accidentes o enfermedades relacionadas con el trabajo, y las condiciones de seguridad y salud en el trabajo varían enormemente entre países y sectores. La Organización Internacional del Trabajo se encarga de prevenir daños a la salud causados por el trabajo mediante convenios y directrices destinadas a promover condiciones de trabajo justas y seguras en todo el mundo.
Le renoncement n'est pas forcément synonyme de manque de courage. Ce peut être aussi une grande sagesse. Savoir faire la part des choses, distinguer ce qui vaut la peine d'être conquis, de ce qui ne le vaut pas, accepter sans regret ce qui est…
Insertar texto con diferentes propiedadeslacatorce
El documento proporciona instrucciones para crear un sitio web básico en 6 pasos: 1) Abrir el archivo HTML, 2) Insertar una línea en blanco debajo de la etiqueta <Body>, 3) Insertar texto entre etiquetas <basefont>, 4) Corregir la etiqueta <basefont>, 5) Enmarcar el texto con etiquetas de encabezado <H1>, y 6) Agregar una línea horizontal <hr>. El ejercicio 2 describe cómo agregar un encabezado con <h1>, texto en una columna dentro de <blockquote>, y una lista
Applications multi plateformes avec Cordova, HTML5 et JavascriptMicrosoft
A travers Microsoft Open Technologies, Microsoft participe à de nombreux projets open source comme par exemple Apache Cordova. Nous vous présenterons comme tirer le meilleurs parti des outils Microsoft pour développer une application sur iOS, Android et Windows en utilisant HTML, Javascript et Cordova. Au menu : les outils en ligne de commandes, Visual Studio, un émulateur Android qui booste et du débug à distance sur un Mac !
Este documento discute el uso de tecnologías en el deporte de alto rendimiento. Las nuevas tecnologías son útiles para entrenadores en el fútbol sala para corregir acciones, planificar tareas específicas y analizar rivales. En la Fórmula 1, la tecnología es crucial pero también lo son los aspectos comerciales y deportivos. Finalmente, la tecnología podría mejorar el arbitraje mediante sistemas de video infalibles para decidir goles válidos e invalidos.
Más de 2,3 millones de personas mueren cada año debido a accidentes o enfermedades relacionadas con el trabajo, y las condiciones de seguridad y salud en el trabajo varían enormemente entre países y sectores. La Organización Internacional del Trabajo se encarga de prevenir daños a la salud causados por el trabajo mediante convenios y directrices destinadas a promover condiciones de trabajo justas y seguras en todo el mundo.
Le renoncement n'est pas forcément synonyme de manque de courage. Ce peut être aussi une grande sagesse. Savoir faire la part des choses, distinguer ce qui vaut la peine d'être conquis, de ce qui ne le vaut pas, accepter sans regret ce qui est…
Insertar texto con diferentes propiedadeslacatorce
El documento proporciona instrucciones para crear un sitio web básico en 6 pasos: 1) Abrir el archivo HTML, 2) Insertar una línea en blanco debajo de la etiqueta <Body>, 3) Insertar texto entre etiquetas <basefont>, 4) Corregir la etiqueta <basefont>, 5) Enmarcar el texto con etiquetas de encabezado <H1>, y 6) Agregar una línea horizontal <hr>. El ejercicio 2 describe cómo agregar un encabezado con <h1>, texto en una columna dentro de <blockquote>, y una lista
Una casilla de verificación es un objeto gráfico que puede estar activado o desactivado, y devuelve un valor verdadero si está activado o falso si está desactivado. El documento describe cómo obtener una casilla de verificación y cómo obtener su valor para determinar si está activada o desactivada.
Este documento describe cómo instalar extensiones de bloqueo de anuncios como Adblock Plus en los navegadores Mozilla Firefox y Google Chrome para eliminar anuncios molestos y acelerar la reproducción de videos en línea de manera gratuita e efectiva.
El documento describe diferentes instrumentos y políticas de comunicación de una empresa, incluyendo publicidad, relaciones públicas, relaciones con los medios, patrocinio, promoción de ventas a través de cupones, regalos y concursos, venta personal, merchandising y publicidad visual en el punto de venta. El objetivo es dar a conocer los productos y persuadir a los clientes.
La empresa GXI Ingeniería y Servicios SC ofrece servicios de ingeniería para proyectos privados y públicos. Fue establecida en 2009 para desarrollar un proyecto de vivienda de 3300 viviendas. Desde entonces, ha brindado servicios a diferentes entidades a través de una red de especialistas en diferentes ramas de ingeniería. Los servicios incluyen elaboración de anteproyectos, optimización de proyectos para reducir costos, y elaboración de proyectos de ingeniería para gestión de recursos públicos.
Este documento describe los elementos clave de una comunidad de aprendizaje, incluyendo que es una comunidad humana organizada que se educa a sí misma y a otros de manera cooperativa y solidaria. También discute los procesos de aprendizaje que fomenta una comunidad de aprendizaje a través de la gestión del proceso de aprendizaje y la facilitación de las interacciones entre estudiantes. Finalmente, destaca que el experto facilitador se centra más en guiar las interacciones que en ser un experto en contenido.
Formas de ingresos productos y como generan ingresos los juegos Free to PlayKike Fuentes
Este documento discute diferentes modelos de monetización para juegos móviles, incluyendo freemium, free-to-play y paymium. Explica cómo estudios como Supercell generan millones de dólares diarios con solo dos juegos usando el modelo free-to-play, a pesar de que los juegos son gratuitos para descargar. Los juegos free-to-play típicamente venden "tiempo" para que los jugadores puedan progresar más rápido mediante compras dentro de la aplicación. También enfatiza que la calidad
Este documento describe el programa Movie Maker. Explica que Movie Maker es un software de edición de video creado por Microsoft que incluye características como efectos, transiciones, títulos y pistas de audio. Además, detalla que la finalidad de Movie Maker es la edición doméstica de videos y la creación de pequeñas películas usando fotografías y sonido.
Este documento describe un proyecto de huerta escolar en dos escuelas rurales en El Playón, Colombia. El proyecto buscó promover el trabajo en equipo y la formación integral de los estudiantes a través del cuidado de una huerta escolar con la ayuda de tecnologías de la información y comunicación. Se realizaron varias actividades como siembra, riego y cosecha que contribuyeron a resultados como una huerta ordenada y una mejor alimentación de la comunidad educativa.
This document discusses the development of a new type of battery that could revolutionize energy storage. It describes how the battery uses a solid electrolyte material that conducts ions quickly and prevents short circuits. This new solid-state battery design could lead to batteries with higher energy density that charge faster and have better safety than current lithium-ion batteries. The document concludes by stating that further research is still needed but that this new battery technology shows significant promise.
Este documento presenta estadísticas e información sobre quemaduras. Resume la anatomía y fisiología de la piel, así como la fisiopatología de las quemaduras. Explica la clasificación de las quemaduras según profundidad y extensión, incluyendo definiciones y características de quemaduras de primer, segundo y tercer grado. Finalmente, describe los factores que agravan el pronóstico y la severidad de las quemaduras según la Asociación Americana de Quemaduras.
El documento describe la importancia de tener una estrategia clara para los emprendimientos sociales, ya que esta establece una dirección y guía a largo plazo. También discute cómo la cultura organizacional es fundamental para comprender el desempeño de cualquier organización y cómo se manifiesta en los patrones de conducta y relaciones. Gestionar los patrones culturales positivos puede fortalecer el desempeño de la organización.
Este documento presenta el planteamiento de un proyecto llamado "Menos Discriminación Deportiva hacia la Mujer" (DDM) cuyo objetivo es disminuir los índices de discriminación deportiva hacia las niñas del ciclo 3 del colegio Venecia en Bogotá. Se justifica el problema señalando que históricamente la mujer ha sido discriminada en el deporte y que en el colegio Venecia algunas niñas no se sienten cómodas practicando deportes debido a la discriminación. El proyecto busca lograr que las mujeres
Una casilla de verificación es un objeto gráfico que puede estar activado o desactivado, y devuelve un valor verdadero si está activado o falso si está desactivado. El documento describe cómo obtener una casilla de verificación y cómo obtener su valor para determinar si está activada o desactivada.
Este documento describe cómo instalar extensiones de bloqueo de anuncios como Adblock Plus en los navegadores Mozilla Firefox y Google Chrome para eliminar anuncios molestos y acelerar la reproducción de videos en línea de manera gratuita e efectiva.
El documento describe diferentes instrumentos y políticas de comunicación de una empresa, incluyendo publicidad, relaciones públicas, relaciones con los medios, patrocinio, promoción de ventas a través de cupones, regalos y concursos, venta personal, merchandising y publicidad visual en el punto de venta. El objetivo es dar a conocer los productos y persuadir a los clientes.
La empresa GXI Ingeniería y Servicios SC ofrece servicios de ingeniería para proyectos privados y públicos. Fue establecida en 2009 para desarrollar un proyecto de vivienda de 3300 viviendas. Desde entonces, ha brindado servicios a diferentes entidades a través de una red de especialistas en diferentes ramas de ingeniería. Los servicios incluyen elaboración de anteproyectos, optimización de proyectos para reducir costos, y elaboración de proyectos de ingeniería para gestión de recursos públicos.
Este documento describe los elementos clave de una comunidad de aprendizaje, incluyendo que es una comunidad humana organizada que se educa a sí misma y a otros de manera cooperativa y solidaria. También discute los procesos de aprendizaje que fomenta una comunidad de aprendizaje a través de la gestión del proceso de aprendizaje y la facilitación de las interacciones entre estudiantes. Finalmente, destaca que el experto facilitador se centra más en guiar las interacciones que en ser un experto en contenido.
Formas de ingresos productos y como generan ingresos los juegos Free to PlayKike Fuentes
Este documento discute diferentes modelos de monetización para juegos móviles, incluyendo freemium, free-to-play y paymium. Explica cómo estudios como Supercell generan millones de dólares diarios con solo dos juegos usando el modelo free-to-play, a pesar de que los juegos son gratuitos para descargar. Los juegos free-to-play típicamente venden "tiempo" para que los jugadores puedan progresar más rápido mediante compras dentro de la aplicación. También enfatiza que la calidad
Este documento describe el programa Movie Maker. Explica que Movie Maker es un software de edición de video creado por Microsoft que incluye características como efectos, transiciones, títulos y pistas de audio. Además, detalla que la finalidad de Movie Maker es la edición doméstica de videos y la creación de pequeñas películas usando fotografías y sonido.
Este documento describe un proyecto de huerta escolar en dos escuelas rurales en El Playón, Colombia. El proyecto buscó promover el trabajo en equipo y la formación integral de los estudiantes a través del cuidado de una huerta escolar con la ayuda de tecnologías de la información y comunicación. Se realizaron varias actividades como siembra, riego y cosecha que contribuyeron a resultados como una huerta ordenada y una mejor alimentación de la comunidad educativa.
This document discusses the development of a new type of battery that could revolutionize energy storage. It describes how the battery uses a solid electrolyte material that conducts ions quickly and prevents short circuits. This new solid-state battery design could lead to batteries with higher energy density that charge faster and have better safety than current lithium-ion batteries. The document concludes by stating that further research is still needed but that this new battery technology shows significant promise.
Este documento presenta estadísticas e información sobre quemaduras. Resume la anatomía y fisiología de la piel, así como la fisiopatología de las quemaduras. Explica la clasificación de las quemaduras según profundidad y extensión, incluyendo definiciones y características de quemaduras de primer, segundo y tercer grado. Finalmente, describe los factores que agravan el pronóstico y la severidad de las quemaduras según la Asociación Americana de Quemaduras.
El documento describe la importancia de tener una estrategia clara para los emprendimientos sociales, ya que esta establece una dirección y guía a largo plazo. También discute cómo la cultura organizacional es fundamental para comprender el desempeño de cualquier organización y cómo se manifiesta en los patrones de conducta y relaciones. Gestionar los patrones culturales positivos puede fortalecer el desempeño de la organización.
Este documento presenta el planteamiento de un proyecto llamado "Menos Discriminación Deportiva hacia la Mujer" (DDM) cuyo objetivo es disminuir los índices de discriminación deportiva hacia las niñas del ciclo 3 del colegio Venecia en Bogotá. Se justifica el problema señalando que históricamente la mujer ha sido discriminada en el deporte y que en el colegio Venecia algunas niñas no se sienten cómodas practicando deportes debido a la discriminación. El proyecto busca lograr que las mujeres
2. Introduction
Tour d’horizon
Je ne crois que ce que je vois !
Observations
2
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin –WATTRELOT Gaëtan
3. Le développement d'application mobile multiplateforme
Introduction
3
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin –WATTRELOT Gaëtan
5. Concept du multiplateforme
5
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin –WATTRELOT Gaëtan
Différents supports,
différentes plateformes logicielles,
un seul langage.
Développeurs
(C# ou langages web)
Framework
iOS
Android
Windows
Phone
Blackberry
…
6. Tour d’horizon du développement mobile
6
Introduction > Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
7. Tour d’horizon du développement mobile
7
Introduction > Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Android
71%
iOS
15%
Windows Phone
11%
BlackBerry
1%
Autres
2%
VENTES DE SMARTPHONES EN FRANCE (JUIN 2014)
8. Tour d’horizon du développement mobile
8
Introduction > Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Android iOS Windows Phone BlackBerry
Langage Java Objective-C VB / C# Java
Nombre
d’applications
1 500 000 1 000 000 300 000 100 000
Open source
Développement
sousWindows
Développement
sous Mac OS
Développement
sous Linux
10. Solutions multiplateformes
10
Introduction > Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Apache Cordova Appcelerator
Titanium
Xamarin
Langage HTML / CSS / JS HTML / CSS / JS C#
Compilation sur le
Cloud
Open source
Développement
sousWindows
Développement
sous Mac OS
Développement
sous Linux
11. Notre choix : Cordova
11
Introduction > Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Couche
présentation
Couche
métier
Couche
accès aux
données
12. Notre choix : Cordova
12
Introduction > Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Couche accès aux données
Framework
Couche métier
JS API
Couche présentation
HTML CSS JS
Plateforme
Application native (WebView)
13. Notre choix : Cordova
13
Introduction > Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Couche
présentation
• Affichage
• Interactivité
Couche
métier
• Traitements
Couche accès
aux données
• Gestion des
données
14. Je ne crois que ce que je vois !
Graphisme
Performances
Capteurs
Fonctions & services
Code
14
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
15. Graphisme :
15
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
17. Performances :
17
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Connexion BDD et
récupération de 10 000 lignes
de données
2 393 1 127
Tri des 10 000 lignes des
données
7 386 7 523
Connexion BDD et
récupération de 30 000 lignes
de données
4 432 3 014
18. Fonctions & services :
18
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
19. Parlons un peu de code :
19
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Quelques grands principes de Cordova :
• La gestion par ligne de commandes
• Les plugins
• L’évènement « device ready » et la variable « navigator »
• cordova create [nom du répertoire] [nom du package] [nom de l’application]
• cordova platform add [nom de la plateforme]
• cordova build [nom de la plateforme]
• cordova emulate [nom de la plateforme]
• cordova run [nom de la plateforme]
• cordova plugin add [nom du plugin]
Les plugins :
• Statut de la batterie
• Caméra
• Console
• Contacts
• Informations de l’appareil mobile
• Accéléromètre et gyroscope
• Orientation
• Notification
• Vibration
• Système de fichier
• Transfert de fichier
• Géolocalisation
• Multi langage
• Gestion des médias
• Capture des médias
• Informations du réseau
• Splashcreen
• Gestion de la barre de statut
20. Parlons un peu de code :
20
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
21. Avantages
21
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Efficacité
Maintenabilité
Évolutivité
Facilité
Rapidité
Entraide
Outils
22. Avantages et limites
22
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
Avantages :
• Maintenabilité
• Évolutivité
• Facilité
• Rapidité
• Communauté
• Outils
Limites :
• Technologie jeune
• Support incomplet
des fonctionnalités et
capteurs spécifiques
• Bandeau système
23. Inconvénients
Poids des applications
Performances amoindries
Peur du changement
23
Introduction >Tour d’horizon > Je ne crois que ce que je vois > Observations
DUPUIS Laurie – EMO Kévin – WATTRELOT Gaëtan
->groupe, projet, sujet, contexte, enjeux, concept
->dev mobile, natif, solutions multiplateformes
->démo technique, comparatif entre natif et multiplateforme
->avantages, inconvénients et limites
Qui sommes nous ? Dev web
Pourquoi ? Exia, fin d’études
Que va-t-on présenter ?
Type de public ?
Contexte : nouveaux services, nouvelles demandes clients, nouvelle tendance
Supports types : smartphones et tablettes : quotidien des consomateurs
S’adapte au support, plus performant, sans internet
Avantages matériels
Plus large choix d’utilisation et d’innovation
Grands acteurs
Enjeux :
Tps de dev
Compétences multiples
Maintenance (dev supp, perte de temps, coût supp)
Enjeux financiers
Concept :
1 langage de dev > framework qui crée un code executable > fonctionne sur plusieurs plateformes
Gain de temps, domaine de compétence réduit
App mobile hybride : pas native, pas uniquement web non plus
Langages natifs des plateformes
4 acteurs principaux
Android : presque ¾ personnes
iOS : clientèle aisée
Windows Phone : téléphones peu onéreux (positionnement de marché, offre de Noël)
BlackBerry : clientèle professionnelle
Sondage
Android :
Plateforme ouverte (développement accessible : langage portable + open source + toute plateforme)
Grand nombre d’applications
Prix des licences de dev
iOS :
Plateforme fermée (langage propriétaire, nécessité d’un Mac)
Pourtant grand nombre d’applications
Windows Phone :
Plateforme fermée (nécessité d’une plateforme Windows)
Peu d’applications : plateforme encore jeune : 2010 (iOS : 2007, Android : 2008)
BlackBerry :
Plateforme fermée et clientèle professionnelle
Comparatif Android et Cordova
Mis à la place d’un néophyte
Pour répondre aux questions qu’il se pose
Explication de chaque point
Explication que nous réalisons une app afin de faire des comparaisons entre natif et multiplateforme
Ecran basique mais démontrant que le multiplateforme ne bride pas le design
Sensiblement identique
Responsive obligatoire !
Bandeau système non visible sur cordova car webview étendue
Présentation de l’écran : fonctionnement & objectifs
Conditions de tests identiques pour ne pas fausser les résultats
Bon fonctionnement (tableau bdd et valeur triées)
« On remarque que l’écart entre les deux versions n’évolu pas pour la récupération des données. Ce
qui tend à confirmer que cette différence s’explique par ….
« Apres avoir abordé le graphisme, les perf et les capteurs nous allons nous intéresser aux fonctions
et services des appareils »
Fonctions mis en place et pourquoi (photo, contact et sms => basique)
Fonctionnement similaire sur l’une et l’autre des versions
MMS non pris en charge et SMS plugin non officiel
Service explication pourquoi le GPS ?
Bon fonctionnement et précision identique sur les deux versions
Pas besoin du plugin et des librairies sur Cordova
Gestion simple et rapide de l’architecture votre projet par ligne de commande
Globalement, un plugin correspond à une fonctionnalité de l’appareil
Enormément de plugins pris en charges
Manque : SMS et MMS vu précédent ou encore les capteurs spécifiques des marques ou plus poussés
Device ready -> évènement permettant de détecter la bonne initialisation du matériel et de
l’environnement web dans lequel il est exécuté
Navigator -> variable injectée par Apache Cordova qui permet d’interagir très simplement avec les
différents plugins du projet
Graphisme
Performance
Les capteurs
Géolocalisation
Fonctions du smartphone
code
Avantages et limites
Inconvénients
Avantages et limites
Inconvénients
Avantages et limites
Inconvénients
Android : 3 Mo
Cordova : 9 Mo
Scalabilité : nouveaux smartpones moins chers que les révisons
Sujet très vaste, conf non exhaustive
Peur du changement
Initiation simple, courbe d’apprentissage faible (communauté)
API et Framework web (bootstrap, angular js)
Dev moins long, maintenance plus rapide
Contraintes : responsive, tests
2016 : les app multiplateformes mobiles représentent plus de 50% du total des app mobiles
Merci de votre attention, si vous avez des questions, nous sommes là pour y répondre!