Mobile Application Development

Page 1 sur 50Lecteur de document UniversityLib

Mobile Application Development

Software Development and Mobile Computing · notes

S

é

a

n

c

e

5

Informatique mobile

NADIA BEL HADJ AISSA

2

Développement

d’applications

mobiles

CONTEXTE

Une multitude de plateformes…

3

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Windows

7

Fragmentation

4

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Concrètement…

 Différences physiques

 Taille de l’écran

 Saisie

 Scrolling

 Différences de styles

 Boutons “Back” et “Cancel”

 Placement de la barre de navigation

 Couleurs

Une multitude d’équipes de

dev/produits…

Windows

7

Plusieurs

Equipes/Produits

N

.

B

e

l

H

a

d

j

A

i

s

s

a

5

Uniform User Experience

Windows

7

Uniform User Experience

N

.

B

e

l

H

a

d

j

A

i

s

s

a

6

Chaque plateforme a ses

spécificités…

N

.

B

e

l

H

a

d

j

A

i

s

s

a

7

Différentes

fonctionnalités

Nouveaux navigateurs internet

 Les nouveaux smartphones sont équipés avec des navigateurs internes modernes avec

un meilleur support des spécifications HTML5/CSS3.

8

N

.

B

e

l

H

a

d

j

A

i

s

s

a

OS

Android

iPhone

BlackBerry 6.0 +

Window Phone 7

WebOS

Nokia

Navigateur

Webkit based

Webkit based

Webkit based

IE 7 based *

Webkit based

Webkit based

3 types d’applications mobiles

9

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Applications natives

Applications Web

Applications hybrides

10

Applications

natives

Applications natives (1)

 L’exécutable (fichier binaire) est stocké sur le smartphone;

 Peut accéder à tous les APIs rendus disponibles par le vendeur de l’OS;

 Les SDK sont spécifiques à la plateforme;

 Chaque OS mobile offre ses propres outils et toolkits pour la conception

de l’IHM.

11

N

.

B

e

l

H

a

d

j

A

i

s

s

a

  • IBM, Native, web or hybrid mobile app development, 2012. IBM Software Thought Leadership White Paper

Applications natives

12

N

.

B

e

l

H

a

d

j

A

i

s

s

a

File System

(on Mobile

Device)

Native App

(Java/Obj-C/C#)

Mobile OS

13

N

.

B

e

l

H

a

d

j

A

i

Publicité

s

s

a

Applications natives (2)

 Développées pour un OS spécifique (seulement sur celui-ci);

 Doivent être installés en accédant à un store (Google Play, App Store) ou

à travers un installeur externe;

 Ont un accès total aux ressources matérielles (Géolocalisation, Système

de Fichiers, Accéléromètre, etc);

 L’utilisateur doit confirmer l’accès aux APIs du smartphone (au moment

de l’installation de l’application)

 Sont développés sur une plateforme et sont difficilement portables sur

d’autres plateformes;

Doivent être utilisées:

• Des jeux (utilisation du GPU)

• Des applications avec des calculs complexes

• Des applications à haute performance (ne tolérant pas 10ms de latence)

Exemples

14

N

.

B

e

l

H

a

d

j

A

i

s

s

a

VoIP

Access Camera

Audio Processing

Video Processing

App-Store Presence

16

Applications

Web

17

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Applications Web

Web Server

Mobile Browser

Web App

(HTML, CSS, JS)

Mobile OS

Questions que se pose un

développeur d’applications natives…

18

N

.

B

e

l

H

a

d

j

A

i

s

s

a

 Quelle plateforme choisir ?

 Combien de temps ca va prendre de récrire

l’application pour N plateformes?

 Qu’est ce qui arrivera si

je prend une mauvaise

décision concernant le choix de la plateforme?

19

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Avantages

 Multiplateforme

 Pas besoin d’installation

 Pas de mise à jour à gérer

 Sauvegarde centralisée sur le serveur

 Partage d’information plus simple et plus rapide…

Conclusion

20

N

.

B

e

l

H

a

d

j

A

i

s

s

a

21

Applications

hybrides

Applications hybrides

22

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Native Container

HTML, CSS, JS

File System

(on Mobile

Device)

Mobile OS

Un ensemble de framework

23

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Différences…

24

N

.

B

e

l

H

a

d

j

A

i

s

s

a

25

N

.

B

e

l

H

a

d

j

A

i

s

s

a

2 stratégies…

Common Source

Cross Platform Source Code

Common Platform

Mapping to Native

WEB APPLICATION

UI

Platform APIs

JavaScript – Java Bridge

OS – Android / iPhone

PhoneGap/ Apache

Cordova

Bridge - JavaScript – Java – Objective C

OS – Android / iPhone

Mapping to Native

Titanium Mobile

26

PhoneGap

/Apache

Cordova

27

N

.

B

e

l

H

a

d

j

A

i

Publicité

s

s

a

PhoneGap

 PhoneGap est un framework open source qui permet de créer des

applications mobiles en utilisant des APIs Web standardisés pour plusieurs

plateformes mobiles (actuellement 11);

 Un outil qui permet de développer des applications mobiles cross-

platform avec HTML5, CSS et Javasript;

 A l’origine créé par Nitobi Software puis acheté par Adobe Systems, Il

s’appelait alors PhoneGap;

 En 2011, Adobe donne le projet à la Fondation Apache, qui le renomme

Apache Callback puis Apache Cordova qui en est actuellement à sa

version 4.0.0.

PhoneGap

28

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Une application PhoneGap

29

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Votre code

Vue Web Native

APIs Natives

App Native- ,apk, .xap, etc

30

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Pre-requis

• Avoir des connaissances de base des plateformes Android, IOS, BlackBerry, WebOS

•

Etre un expert de HTML/Javascript ou de frameworks comme GWT

• Avoir des connaissances de base des bibliothèques JavaScript comme

•

•

Jquery

script.aculo.us

• Prototype

•

Etc

• Ou de framework Ajax comme GWT

•

•

Un projet différent pour chaque platform, puis injection de code PhoneGap dans

chaque projet

PhoneGap n’a pas d’IDE, utiliser Eclipse pour Android et Xcode pour IPhone

32

Appcelerator

Titanium

Généralités

 Un framework open source pour

le développement d’applications

mobiles natives (ou desktop) utilisant les technologies ouvertes du Web

(JavaScript - HTML et CSS)

 Une application Titanium est un programme JavaScript interprété au

moment de son exécution par le smartphone

33

N

.

B

e

l

H

a

d

j

A

i

s

s

a

34

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Appcelerator Titanium

 Un SDK open source avec plus de 5,000 smartphone

et OS mobile pris en charge

 Une IDE Eclipse

 Un MVC framework Alloy

 Des Services Cloud pour tester les applications.

Titanium

35

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

Publicité

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Titanium Demo

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Architecture

46

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Compare Screens (IPhone)

PhoneGap

Titanium Mobile

N

.

B

e

l

H

a

d

j

A

i

s

s

a

47

Compare Screens (Android)

PhoneGap

Titanium Mobile

N

.

B

e

l

H

a

d

j

A

i

s

s

a

48

49

Synthèse

50

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Comparaison

Accès

au

matériel

Vitesse

Cout de dév

App Store

Processus

d’approbation

Native

Total

Très rapide

Cher

Disponible

Obligatoire

Hybrid

Total

Aussi rapide

que natif si

nécessaire

Raisonnable

Disponible

Surcout

limité

Web

Partiel

Rapide

Raisonnable

Pas

disponible

Aucun

51

N

.

B

e

l

H

a

d

j

A

i

s

s

a

Comparaison

Native

Native

rapide

Graphique

performance

UI

Look and feel

Native

Web

HTML, Canvas,

SVG

lent

Emulé

Swipe, pinch

Yes

Not pinch

Connectivité

Peut s’exécuter

offline

Doit être online

Required skills

Specific to OS

Web technologies

Comparaison

52

N

.

B

e

l

H

a

d

j

A

i

s

s

a