Développement Mobile :
Caractéristiques des Applications
Mobiles
Enseignante: Naimi Eyaa
2023-2024
Plan du cours
1.Contraintes
2.Design Patterns
3.Catégories Présentation
Application Native
Présentation
ˆ Une application mobile :
ˆ est un méta-programme (composé de sous-programmes)
informatique,
ˆ lancée en général à partir de l'écran d'accueil,
ˆ fournit à l'utilisateur un ensemble de fonctionnalités spéci ques ou
variées,
ˆ interagit avec l'utilisateur à travers une interface graphique.
ˆ Le développement des applications mobiles dépend du type du
dispositif mobile cible. Les dispositifs mobiles autres que le
smartphone, comme le smartwatch, nécessitent l'importation d'
APIs spéci ques (exemple : https://developer.android.com/
training/wearables/apps/creating).
ˆ Le développement des applications mobiles doit prendre en
considération un ensemble de contraintes liées au mode mobile.
Plan du cours
1.Contraintes
2.Design Patterns
3.Catégories Présentation
Application Native
Contraintes
ˆ La batterie se décharge rapidement ⇒ éviter de lancer plusieurs
services ou de traitements lourd (accès au GPS, à la caméra...).
ˆ La faible disponibilité de la mémoire ⇒ éviter le lancement de
plusieurs services en tâche de fonds.
ˆ Possibilité de déconnexions fréquentes et inattendues avec le faible
débit ⇒ alléger la communication avec les serveurs.
ˆ La taille varie d'un dispositif à l'autre ⇒ Appliquer le Responsive
design.
ˆ La densité de l'écran (nombre de pixels par pouce) varie d'un
dispositif à l'autre ⇒ utiliser une unité de mesure indépendante
de la densité et prévoir di érentes tailles des images.
ˆ Interaction directe (sans périphériques) avec l'utilisateur via une
interface graphique ⇒ Adapter les éléments de l'interface à la taille
des doigts et aux gestes intuitifs de l'utilisateur en respectant les
conventions.
Communication avec les serveurs
• Possibilité de déconnexions fréquentes et inattendues avec le faible
débit :
- e v i t e r les appels fréquents aux serveurs,
- utiliser des formats de données léger comme JSON,
- utiliser des web services simples à consommer comme les web
services Restfull ,
- stocker les données en local (documents, images, chiers...)
Responsive Design
•le Responsive design : un ensemble de techniques de programmation
permettant à l'interface graphique de l'application de s'adapter
automatiquement à la taille variante de l'écran.
Interaction : Adaptation à la densité de l'écran
ˆ A cause de la densité, la taille physique de l'écran est di érente de
la taille d ' a c h a g e (logique virtuelle) : un pixel a c h é ne
correspond pas forcement à un pixel physique.
ˆ Exemple : L'écran d'un iPhone 4 a une largeur physique de 640px
mais la largeur d'a chage est de 320px.
ˆ Un élément de l'interface utilisateur semble physiquement plus
grand sur un écran de faible densité et inversement → utiliser une
unité de mesure indépendante de la densité et prévoir di érentes
tailles des images pour uni er l'a chage ∀ la densité.
Interaction : Adaptation du style des éléments graphiques
ˆ Modéliser les éléments d'une interface graphique d'une application
mobile différemment au style des éléments d'une interface
graphique sur un P C :
ˆ simpli er la méthode de représentation de l'information,
ˆ réduire le nombre des éléments par a c h a g e ,
ˆ espacer les éléments d'une interface graphique,
ˆ agrandir leur taille : un doigt fait environ 45 à 60 pixels de hauteur
et de largeur.
Interaction : Adaptation du style des éléments graphiques
• Exemple : un datepicker :
Interaction : Réduction des types d'informations
•Alléger le contenu des applications mobiles : il vaut mieux avoir une
application extrêmement e c a c e avec peu de fonctionnalités (capacités
limités des dispositifs mobiles) ⇒ Créer des applications spéci ques tel
est l'exemple de la société française de transport publique SNCF qui a
créé une multitude d'applications concises.
Conventions : Manipulation des éléments graphiques
J u l i en R o c h e , " W e b M obi l e & P h o n e G a p " , O b j e t D i r e c t , 2 0 1 4
Plan du cours
1.Contraintes
2.Design Patterns
3.Catégories Présentation
Application Native
Conventions : Patrons de Conception Mobile
• Patrons de Navigation Principaux :
Patrons de Conception Mobile
Patrons de Conception Mobile
Patrons de Conception Mobile
Conventions : Patrons de Conception Mobile
Patrons de Conception Mobile
Patrons de Conception Mobile
ˆPatrons de Navigation Secondaires : deuxième niveau de navigation
à l'intérieur d'un patron principal.
ˆLes patrons de navigation secondaires prennent en général les mêmes
formes des patrons de navigation principaux.
⇒ combinaisons de patrons principaux.
Patrons de Conception Mobile
Anti-Patterns
•Les anti-patterns sont des modèles de conception graphiques
non-standards qu'il faut éviter :
1 . C on t r a i n t es 2 . D es i g n P a t t e r n s 3 . C a t ég or i es
Anti-Patterns
D r . Lilia S F A X I , " C h p 2 : D e s i g n d ' A p p l i c a t i on s M obi l e s " , I N S A T , 2 0 1 5 .
Plan du cours
1.Contraintes
2.Design Patterns
3.Catégories, Présentation
Application Native
Catégories
Catégories
Applications Mobiles Natives
Langages de Programmation :
iOS (Apple) : Objective-C ou Swift.
Android (Google) : Java ou Kotlin.
Performance : Les applications natives sont généralement plus rapides et réactives
en raison de leur compilation directe en code machine spécifique à la plateforme.
Cela signifie que les animations, les transitions et les interactions sont plus fluides.
Accès Complet aux Fonctionnalités du Périphérique : Les applications natives
peuvent exploiter toutes les fonctionnalités du périphérique, telles que l'appareil
photo, le GPS, les capteurs, l'accès au système de fichiers, etc., à leur plein
potentiel.
Expérience Utilisateur : Les applications natives offrent une expérience utilisateur
cohérente et fluide, car elles sont conçues conformément aux directives de
conception spécifiques à chaque plateforme (Material Design pour Android,
Human Interface Guidelines pour iOS).
Distribution : Les applications natives sont
généralement distribuées via les magasins d'applications
officiels (App Store pour iOS, Google Play Store pour
Android), ce qui facilite la découverte par les utilisateurs.
Mises à Jour : Les mises à jour sont déployées
séparément pour chaque plateforme, ce qui peut
nécessiter plus de temps et de ressources pour maintenir
l'application sur différentes plateformes.
Présentation
OS platform Android iOS Windows Mobile
Native Lan- Java, Kotlin Objective-C, C#,.net languages
guage Swift
IDE Android Stu- X-code Visual Studio
dio
App Store play store app store microsoft store
Build output .apk .ipa .xap remplacé par
Package .appx depuis win-
dows 8
• Les applications natives pour android peuvent aussi avoir l'extension
.aab qui présente un format plus compact dont les modules peuvent être
téléchargés à la demande. Ce format est compatible avec le SEM Android
à partir de la version 11 (API level 30). Sa composition reste similaire à
celle du paquetage .apk, et sa génération se fait à travers Android Studio .
Présentation
Caractéristique principale : accès riche direct et rapide aux
périphériques de l'appareil mobile ce qui induit à :
ˆ une meilleur qualité du rendu audiovisuel au niveau de l'interface
graphique essentiellement pour les jeux vidéo et au niveau de
l'émission et la réception du son
ˆ une meilleur qualité du rendu fonctionnel au niveau de la détection
des données du GPS et de l'accéléromètre, au niveau de la détection
des mouvements des doigts de l'utilisateur sur l'écran...
Accès d'une application native aux périphériques de
l'appareil mobile (Run)
Construction d'une application native (Build)
Construction d'une application native (Build) pour Android
Construction d'une application native (Build) iOS
Construction d'une application native (Build) pour Windows
Applications Mobiles
Hybrides
Technologies : Les applications hybrides sont
généralement développées en utilisant des technologies web
telles que HTML, CSS et JavaScript, puis encapsulées dans un
conteneur natif (comme Cordova/PhoneGap, Ionic, React
Native, etc.).
Performance : Les applications hybrides peuvent être
moins performantes que les applications natives en raison de
l'interprétation des éléments d'interface utilisateur via un
navigateur intégré et du pont entre le code JavaScript et les
fonctionnalités natives du périphérique.
Accès aux Fonctionnalités : Les technologies hybrides ont
évolué pour permettre un certain degré d'accès aux
fonctionnalités natives, mais cet accès peut ne pas être aussi
complet et fluide que dans le cas des applications natives.
Coût et Développement Rapide : Le développement
d'applications hybrides peut être plus rapide et moins coûteux,
car une grande partie du code peut être réutilisée sur
différentes plateformes. Cela peut être avantageux pour les
projets avec des ressources limitées.
Maintenance : La maintenance des applications
hybrides peut être plus facile car les mises à jour peuvent
être déployées sur toutes les plateformes
simultanément, ce qui réduit les efforts de maintenance.
Distribution : Les applications hybrides peuvent
également être distribuées via les magasins
d'applications, mais elles peuvent parfois rencontrer des
problèmes de conformité ou de performance qui peuvent
affecter leur visibilité et leurs taux de conversion.