Vous êtes sur la page 1sur 54

République Tunisienne Institut Supérieur des Etudes

Ministère de l’Enseignement Supérieur de la Technologiques de Mahdia


----***----Scientifique
Recherche Département Technologie de l’Informatique

PROJET
PRESENTEE POUR OBTENIR LE TITRE :

DIPLÔME NATIONAL DE LICENCE APPLIQUEE

En Technologies de l’Informatique (TI)


Spécialité : Développement des Systèmes d’Information (DSI)

Création d’une application mobile pour le


tourisme dans la région de Mahdia

Réalisé par : Mohamed Amine MAHMOUDI

SOUTENU LE 14/06/2016 DEVANT LE JURY D’EXAMEN :

Mme. Raoudha TRIMECH Président


M. Khairallah KHOUJA Rapporteur
Mme. Olfa BELAZEREG Examinateur
M. Mohamed HAMMOUDA Encadreur-ISET
M. Maher BELHADJ Encadreur-Entreprise

A.U. : 2015-2016

ISET Mahdia Adr : Av. Mourouj 5111 Hiboun Mahdia Tél : 73683407 / 73683410 Fax : 73683399
Dédicaces

Je dédie ce projet à :

Mes chers parents, que nulle dédicace ne puisse exprimer

mes sincères sentiments,

Pour leurs patience illimitée, leur encouragement contenu,

leur aide, en témoignage de

Mon profond amour et respect pour leurs grands sacrifices.

Mes chers grands parents, pour me assistant.

Mes chers frères pour leur grand amour et leur soutien qu'ils

trouvent ici l'expression de ma haute gratitude.

Mes chers amis

Qui sans leur encouragement ce travail n'aura jamais vu le

jour.

Et à toute ma famille et à tous ceux que j'aime.

Mahmoudi Mohamed Amine


Remerciements
Au terme de ce projet fin d’études je tien a exprimer mes respects mais
connaissances et mes sincère remerciement au personnels du E-Pirana, le
directeur de la société M. BELHADJ Maher, qui ont contribués à l’élaboration
de ce rapport modeste.

J’exprime mes profonds remerciements les plus sincères à M. HAMMOUDA


Mohamed, mon superviseur à l’institut, pour son assistance, ses directives et ses
conseils précieux.

Ainsi ceux qui mon aidées durant cette période pour effectuer mon projet dans
les meilleurs conditions, et je tiens également à remercier virement tous ceux qui
m’ont fait preuve d’un grand esprit de collaboration et d’initiative tous les
personnels de l’équipe technique et qui m’apportent une aide précieuse par leurs
suggestion et leurs conseils.

Que tous ceux qui ont contribué de près ou de loin à la réalisation de ce travail
trouvent ici l’expression de nos sincères gratitudes.

En résumé, j’adresse mes sincère sentiments de vivre reconnaissance à tous ceux


qui ont contribué du près ou de loin à fin que ce modeste projet voie le jour.
Table des matières
Introduction générale ............................................................................................................... 1

Chapitre 1 : Analyses et Spécifications des Besoins .............................................................. 2

I. Introduction ....................................................................................................................... 3

II. Cadre du projet .................................................................................................................. 3

III. Présentation de la société .................................................................................................. 3

IV. Étude de l’existant ............................................................................................................ 3

1. Description de l’existant .......................................................................................... 3

2. Critique de l’existant ............................................................................................... 4

3. Solution proposée .................................................................................................... 5

V. Spécifications des besoins ................................................................................................ 5

1. Besoins fonctionnels ................................................................................................ 6

a. Besoin fonctionnels pour la partie mobile ..................................................... 6

b. Besoin fonctionnels pour la partie web .......................................................... 6

2. Besoins non fonctionnels ......................................................................................... 6

VI. Conclusion ........................................................................................................................ 7

Chapitre 2 : Conception ........................................................................................................... 8

I. Introduction ....................................................................................................................... 9

II. Langage de conception ..................................................................................................... 9

1. Langage UML ......................................................................................................... 9

2. Utilisation de l’UML ............................................................................................. 10

III. Diagramme de cas d’utilisation ...................................................................................... 10

1. Les Acteurs ............................................................................................................ 10

2. Diagramme de cas d’utilisation ............................................................................. 11

a. Diagramme de cas d’utilisation global pour l’application mobile ............... 12

b. Diagramme de cas d’utilisation global pour l’application web ................... 13

3. Raffinement de cas d’utilisation pour l’application mobile .................................. 14


a. Cas d’utilisation raffiné « Visualiser les cafés » .......................................... 14

b. Cas d’utilisation raffiné « Visualiser les événements » ............................... 15

c. Cas d’utilisation raffiné « gérer parcours ».................................................. 16

IV. Diagramme de séquence ................................................................................................. 17

1. Diagramme de séquence « Synchronisation des données » .................................. 17

2. Diagramme de séquence « Authentification » pour la partie web......................... 18

3. Diagramme de séquence « gérer endroit » pour l’application mobile................... 19

4. Diagramme de séquence « gérer parcours » pour l’application mobile ................ 20

5. Diagramme de séquence « gérer événement » pour l’application mobile............. 21

V. Diagramme de classe ...................................................................................................... 21

1. Diagramme de classe global .................................................................................. 22

2. Modèle logique de données liée au diagramme de classe ..................................... 23

VI. Diagramme de composants ............................................................................................. 23

VII. Conclusion ...................................................................................................................... 24

Chapitre 3 : Réalisation ......................................................................................................... 25

I. Introduction ..................................................................................................................... 26

II. Environnement de travail ................................................................................................ 26

1. Environnement matériel ........................................................................................ 26

2. Environnement logiciel ......................................................................................... 27

3. Langage de programmation et technologies utilisés ............................................. 28

III. Plateforme Android ......................................................................................................... 30

1. Historique .............................................................................................................. 30

2. Architecture Android ............................................................................................. 30

a. Application ................................................................................................... 30

b. Le Framework (Application Framework) .................................................... 31

c. Les bibliothèques (Libraires) ....................................................................... 31

d. Moteur d’exécution Android (Android Runtime) ........................................ 31


e. Noyau Linux (Linux Karnel) ....................................................................... 31

IV. Présentation des interfaces de l’application .................................................................... 31

1. Les interfaces de l’application web ....................................................................... 31

a. Interface d’authentification .......................................................................... 32

b. Interface d’accueil ........................................................................................ 32

c. Interfaces gérer endroit ................................................................................ 33

d. Interfaces gérer parcours .............................................................................. 34

e. Interfaces gérer évènement .......................................................................... 35

2. Les interfaces de l’application mobile.................................................................. 35

a. Icône de l’application ................................................................................... 35

b. Interfaces de chargement de l’application ................................................... 36

c. Interfaces Carte géographique ..................................................................... 37

d. Interfaces de gérer les endroits .................................................................... 38

e. Interfaces gérer les parcours ........................................................................ 39

f. Interfaces gérer les événements ................................................................... 40

3. Conclusion ............................................................................................................. 41

Conclusion générale ............................................................................................................... 42

Bibliographie........................................................................................................................... 43

Netographie ............................................................................................................................. 44

Annexe ..................................................................................................................................... 45
Liste des Figures

FIGURE 1 : LOGO DE LA SOCIETE ...................................................................................................................................... 3


FIGURE 2 : PRESENTATION DE LA SOLUTION PROPOSEE ......................................................................................................... 5
FIGURE 3 : DIAGRAMME DE CAS D’UTILISATION GLOBAL POUR L’APPLICATION MOBILE ............................................................. 12
FIGURE 4 : DIAGRAMME DE CAS D'UTILISATION GLOBAL POUR L’APPLICATION WEB ................................................................. 13
FIGURE 5 : DIAGRAMME D'UN CAS D'UTILISATION RAFFINEE « VISUALISER LES CAFES » ............................................................ 14
FIGURE 6 : DIAGRAMME CAS D'UTILISATION RAFFINEE « VISUALISER EVENEMENTS » ............................................................... 15
FIGURE 7 : DIAGRAMME CAS D'UTILISATION RAFFINEE « GERER PARCOURS » ......................................................................... 16
FIGURE 8 : DIAGRAMME DE SEQUENCE « SYNCHRONISATION DES DONNEES » ....................................................................... 17
FIGURE 9 : DIAGRAMME DE SEQUENCE « AUTHENTIFICATION » POUR L’APPLICATION WEB....................................................... 18
FIGURE 10 : DIAGRAMME DE SEQUENCE « GERER ENDROIT » POUR L’APPLICATION MOBILE ...................................................... 19
FIGURE 11 : DIAGRAMME DE SEQUENCE « GERER PARCOURS » POUR L’APPLICATION MOBILE ................................................... 20
FIGURE 12 : DIAGRAMME DE SEQUENCE « GERER EVENEMENT » POUR L’APPLICATION MOBILE ................................................. 21
FIGURE 13 : DIGRAMME DE CLASSE GLOBAL .................................................................................................................... 22
FIGURE 14 : DIAGRAMME DE COMPOSANTS .................................................................................................................... 23
FIGURE 15 : ARCHITECTURE GENERALE ANDROID ............................................................................................................. 30
FIGURE 16 : INTERFACE D'AUTHENTIFICATION.................................................................................................................. 32
FIGURE 17 : INTERFACE D'ACCUEIL ................................................................................................................................ 32
FIGURE 18 : INTERFACE AJOUTER ENDROIT ...................................................................................................................... 33
FIGURE 19 : INTERFACE LISTER LES ENDROITS .................................................................................................................. 33
FIGURE 20 : INTERFACE AJOUTER PARCOURS ................................................................................................................... 34
FIGURE 21 : LISTER LES PARCOURS................................................................................................................................. 34
FIGURE 22 : INTERFACE AJOUTER EVENEMENT ................................................................................................................. 35
FIGURE 23 : INTERFACE LISTER DES EVENEMENTS ............................................................................................................. 35
FIGURE 24 : ICONE PRINCIPALE DE L'APPLICATION............................................................................................................. 36
FIGURE 25 : INTERFACES DE CHARGEMENT DE L'APPLICATION ............................................................................................. 36
FIGURE 26 : INTERFACES DE LA CARTE GEOGRAPHIQUE ...................................................................................................... 37
FIGURE 27 : INTERFACES GERER LES ENDROITS ................................................................................................................. 38
FIGURE 28 : INTERFACES GERER LES PARCOURS ................................................................................................................ 39
FIGURE 29 : INTERFACES GERER LES EVENEMENTS............................................................................................................. 40
Liste des Tableaux

TABLEAU 1 : DESCRIPTIONS LES ACTEURS ........................................................................................................................ 11


TABLEAU 2 : DETAILS DU DIAGRAMME DE CAS D’UTILISATION GLOBAL POUR L’APPLICATION MOBILE ........................................... 13
TABLEAU 3 : DETAILS DU DIAGRAMME DE CAS D’UTILISATION GLOBAL POUR L’APPLICATION WEB ............................................... 14
TABLEAU 4 : DETAILS DU RAFFINEMENT DE CAS D’UTILISATION « VISUALISER LES CAFES » ......................................................... 15
TABLEAU 5 : DETAILS DU RAFFINEMENT D’UN CAS D’UTILISATION « VISUALISER LES EVENEMENTS » ........................................... 16
TABLEAU 6 : DETAILS DE RAFFINEMENT D'UN CAS D'UTILISATION « GERER PARCOURS » ........................................................... 17
TABLEAU 7 : ENVIRONNEMENT MATERIEL 1..................................................................................................................... 26
TABLEAU 8 : ENVIRONNEMENT MATERIEL 2..................................................................................................................... 26
Projet Fin d’Études Introduction générale

Introduction générale
Dans un monde actif et continuellement évolutif, la motivation d'avoir des moyens
performants et efficaces de communication et d'échange d'informations devient de plus en
plus fondamentale. Cette motivation donne naissance à une révolution favorisant le travail à
distance et l'accès aux besoins en temps réduit à l’aide d’internet qui a bouleversée les
habitudes de travail dans de nombreux métiers.

D’après beaucoup d’analyses et statistiques effectuées, il s’avère que de plus en plus


d’internautes se connectent désormais à internet via leurs téléphones portables. Nous
remarquons ces dernières années un développement exponentiel des appareils mobiles qui
sont répandus comme une traînée de poudre dans le monde en développement et
révolutionnant le domaine des communications notamment dans les zones rurales.

C’est dans ce cadre qu’entre le sujet de notre PFE. Il s’agit en fait, de concevoir et de
développer une solution informatique assurant l’exposition des informations des monuments
et des endroits les plus connus de la ville de Mahdia sur un rayon de 100 km.

Pour une meilleure accessibilité à ces informations, nous avons décidé de développer une
application mobile capable de gérer et d’exposer toutes ses informations et de les synchroniser
à travers la communication avec une application web dédiée.

En effet, les applications mobiles ne cessent d’enregistrer une croissance de plus en plus
importante, qui sont facilitent la vie des internautes. Par conséquent, il doit y avoir une
montée rapide en compétences afin de s’adapter aux nouveaux besoins, et développer des
solutions intégrantes plusieurs composantes mobiles, pour des applications mobile sur divers
plateforme comme : IOS, Windows Phone, Bada, Android etc.

Ce rapport détaillera les différentes phases dont nous sommes passées par afin d’aboutir à une
application fiable et satisfaisante. Pour cela le rapport définit le travail qui nous avons
effectué, il est composée par trois grands chapitre. Le premier chapitre aura pour présente
l’entreprise et l’analyse et spécification des besoins, le deuxième chapitre est consacré aux
conceptions. Le dernier chapitre comporte les détails de réalisation de notre application.

1 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 1 : Analyses et Spécifications des Besoins

Chapitre 1 : Analyses et Spécifications


des Besoins

2 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 1 : Analyses et Spécifications des Besoins

Chapitre 1 : Analyses et Spécifications des Besoins

I. Introduction
Dans ce chapitre, nous allons présenter en premier lieu la société dans laquelle nous avons
effectué notre stage de fin d’étude. Ensuite, nous allons faire une étude de l’existant sur les
modalités des travaux actuelles. Enfin nous allons spécifier l'ensemble des besoins
fonctionnels et non fonctionnels liés à notre application.

II. Cadre du projet


Le projet entre dans le cadre de préparation de stage de fin d'études pour l'obtention de la
licence appliquée en Développement des Systèmes d’Information (DSI) de l'Institut Supérieur
d’Études Technologiques de Mahdia. Ce projet a été effectué au sein de la société e-Pirana
durant la période du 4 mois.

III. Présentation de la société


e-Pirana est une startup situe à Mahdia, spécialisée dans le développement web pour les
différents médias (desktops, tablettes et smartphones) ainsi qu’à la conception et la réalisation
des applications mobile. Elle propose aussi des services d’audits, de conseils et de
référencements à ses clients.

Figure 1 : Logo de la société

IV. Étude de l’existant

1. Description de l’existant

L’application que nous voulons développer est dédiée aux utilisateurs ayant visité le
gouvernement de Mahdia ou bien qui souhaite la visiter dans la future.

3 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 1 : Analyses et Spécifications des Besoins

Le tourisme mobile propose aux utilisateurs de téléphone portable de se situer sur une carte
dans la ville où ils se trouvent. Le service comprend non seulement la géo localisation en
temps réel, mais également, des informations sur la ville et ses centres d’intérêts (musées,
parcs, monuments, événements culturels ou artistiques du moment, etc…) : un vrai guide
touristique. L’originalité est qu’il permet à l’utilisateur de personnaliser son guide selon sa
localisation.
Conscients que nous vivons actuellement le passage d’E-tourisme au M-tourisme, nous avons
décidé de saisir cette opportunité en lançant une application mobile touristique. Notre
particularité est que notre application porte dans son spectre le tourisme durable et solidaire.
Nous avons opté pour ce choix parce que nous avons l’intime conviction que le tourisme de
masse n’a plus sa place privilégiée en Tunisie et que l’avenir du secteur touristique est dans le
tourisme alternatif.

2. Critique de l’existant

Selon une étude réalisé par d’Orange, « aujourd'hui, plus d'un tiers de la population mondiale
surfe sur Internet depuis son téléphone mobile. En un an, leurs ventes ont progressé de 74%.
Plus d'un quart de la population mondiale est équipée et on estime que les smartphones
couvriront la totalité du parc de la téléphonie mobile d'ici 2020. Le mobile est en passe de
devenir le principal canal de avant, pendant et après le voyage. Smartphones et tablettes, les
nouveaux outils du voyageur pour s'informer, le voyageur utilise de moins en moins
l'ordinateur mais de plus en plus son mobile (+ 31 % par rapport à 2011) et aussi sa tablette
(+17 % par rapport à 2011). 44 % des voyageurs en 2012 ont téléchargé une application
mobile en lien avec leur voyage. La clientèle de loisirs réserve davantage sur un site mobile:
dans 40 % des cas pour un hébergement, dans 38 % des cas pour le vol et dans 33 % des cas
pour la location de voiture. L'usage de la vidéo : 66 % consultent des vidéos pour avoir des
idées de voyage et 64 % consultent les vidéos d'une destination avant le voyage. Les touristes
européens qui partent en vacances l'été passent quotidiennement 2 heures et 25minutes à
visiter et faire des activités culturelles sur leur Smartphone ou tablette. »

Ces données, confortent notre conviction que les applications mobiles représentent une
nouvelle alternative très attrayante qui permet à la fois de promouvoir la destination Tunisie
en général et le tourisme culturel en particulier.

4 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 1 : Analyses et Spécifications des Besoins

3. Solution proposée

Le marché des applications a littéralement explosé à la faveur du succès fulgurant des


Smartphones. L’entreprise nous à demander de réaliser une application m-tourisme pour
valoriser le tourisme de la ville de Mahdia. Cette application aide à trouver la liste des hôtels,
affiche les centres d’intérêts touristiques et informe les utilisateurs des évènements culturels.

Notre solution vise à s’imposer en offrant une bonne qualité de services, une fluidité dans la
navigation et une bonne performance en temps de réponse.

Notre solution consiste à développer un système informatique composée de :

 Application mobile permettent à des revenant ou bien des touristes potentiel d’accéder
à un ensemble des données relatif aux diffèrent endroits la visite de Mahdia.
 Application web concernent la gestion centralisée de toutes les données du système à
développer.

Figure 2 : présentation de la solution proposée

V. Spécifications des besoins


La spécification de besoins constitue la phase de départ de toute application à développer.
Dans cette partie nous allons identifier les besoins de notre application. Nous allons mette

5 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 1 : Analyses et Spécifications des Besoins

l’accent sur les besoins fonctionnels ainsi que les besoins non fonctionnels pour éviter le
développement d’une application non satisfaisante.

1. Besoins fonctionnels

Un acteur joue le rôle d’une entité externe (utilisateur humain, dispositif matériel ou autre
système) qui interagit directement avec le système étudié. L’acteur représenté dans notre
application peut être soit un administrateur, soit un visiteur.

a. Besoin fonctionnels pour la partie mobile

 Présenter les informations sur les endroits de ville Mahdia


 Spécifier les localisations qu’on veut priser en compte
 Savoir la localisation des lieux les plus proches
 Consulter la liste des endroits favoris
 Poser des nouveaux circuits du tourisme alternatif
 Consacrer un espace pour la publicité
 Tracer des chemins selon l’emplacement et les besoins du touriste

b. Besoin fonctionnels pour la partie web

 Gérer les endroits (ajouter, supprimer, modifier, Lister).


 Gérer les parcours (ajouter, supprimer, modifier, Lister).
 Gérer les événements (ajouter, supprimer, modifier, Lister).

2. Besoins non fonctionnels

Les besoins non fonctionnels décrivent les objectifs liés aux performances du système et aux
contraintes de son environnement. Ses exigences techniques sont souvent exprimées sous
forme d’objectifs spécifiques que doit atteindre le système.

Les besoins non fonctionnels de cette application sont les suivants :

 Assurer une cohérence et une crédibilité aux informations stockées dans la base de
données.
 L’ergonomie des interfaces de l’application mobile et web.
 Sécurité : à développer d’avantage
6 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016
Projet Fin d’Études Chapitre 1 : Analyses et Spécifications des Besoins

 Qualité
 Accessibilité et performance
 Renouvellement
 Fiabilité

VI. Conclusion
À travers ce chapitre, nous avons présenté l’entreprise et le cadre du projet. En outre nous
avons analysé et étudié les différentes applications de tourisme afin d’enrichir nos
fonctionnalités et augmenter la performance de l’application pour répondre à nos besoins.

Ainsi, nous nous sommes positionnés dans le contexte de notre projet, ceci va nous permettre
d’entamer la prochaine étape qui consiste à présenter la phase de conception.

7 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

Chapitre 2 : Conception

8 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

Chapitre 2 : conception

I. Introduction
Le Modèle conceptuel de données est une représentation statique du système d’information. Il
a comme objectif de constituer une représentation claire et cohérente des données manipulées
dans le système d’information.

Cette section sera présentée comme suit : nous commençons par le choix de la méthodologie
de conception et justification. Ensuite nous identifions les acteurs et les diagrammes des cas
d’utilisation, puis nous présentons les diagrammes de séquence, enfin le diagramme de classe.

II. Langage de conception


Pour élaborer cet application on doit établir une conception modeste pour attentera le but de
notre projet pour cela on doit choisira un langage de conception adaptable avec notre besoins.

1. Langage UML

« UML » (en anglais Unified Modeling Language ou langage de modélisation unifié) est un
langage de modélisation graphique à base de pictogrammes. Il est apparu dans le monde du
génie logiciel, dans le cadre de la « conception orientée objet ».

Couramment utilisé dans les projets logiciels, il peut être appliqué à toutes sortes de systèmes
ne se limitant pas au domaine informatique.

Les 14 diagrammes UML sont dépendants hiérarchiquement et se complètent, de façon à


permettre la modélisation d'un projet tout au long de son cycle de vie. Ces diagrammes sont :

 Diagrammes structurels ou statiques:

o Diagramme de classes

o Diagramme d'objets

o Diagramme de composants

o Diagramme de déploiement

o Diagramme des paquetages

9 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

o Diagramme de structure composite

o Diagramme de profils

 Diagrammes comportementaux :

o Diagramme des cas d'utilisation

o Diagramme états-transitions

o Diagramme d'activité

 Diagrammes d'interaction ou dynamiques :

o Diagramme de séquence

o Diagramme de communication

o Diagramme global d'interaction

o Diagramme de temps

2. Utilisation de l’UML

L’UML est un langage formel et normalisé en termes de modélisation objet. Son


indépendance par rapport aux langages de programmation, son caractère polyvalent et sa
souplesse ont fait de lui un langage universel. En plus UML est essentiellement un support de
communication, qui facilite la représentation et la compréhension de solution objet. Sa
notation graphique permet d’exprimer visuellement une solution objet, ce qui facilite la
comparaison et l’évaluation des solutions. L’aspect de sa notation, limite l’ambigüité et les
incompréhensions.

III. Diagramme de cas d’utilisation

1. Les Acteurs

Un acteur représente l'abstraction d'un rôle joué par des entités externes (utilisateur, dispositif
matériel ou autre système) qui interagissent directement avec le système (réception
d’information, etc.). Pour notre application, il y aura qu'un seul acteur. Nous allons nommer
cet acteur tout simplement : « Utilisateur ».

10 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

Acteur Type Acteur Descriptions


Utilisateur  Découvrir les endroits
 Suivi les parcours
 Participer aux événements
Acteur
 Consulte la carte géographie
Principale
Administrateur  Gérer les endroits
 Gérer les parcours
 Gérer les événements
Système  Garde les actions de l’utilisateur
 Calcule la distance
 Import les données
 Lance les mises à jour
 Envoyer les notifications
Serveur Google Map  Définir la position de l’utilisateur
Acteur
 Traçage du l’itinéraire
Secondaire
 Définir la position de l’endroit,
événement
 Rechercher sur les endroits
Serveur Web  Téléchargement les images
 Sauvegarde les données
 Gérer les mises à jour
Tableau 1 : Descriptions les acteurs

2. Diagramme de cas d’utilisation

Chaque usage que les acteurs font du système est représenté par un cas d’utilisation. Chaque
cas d’utilisation représente une fonctionnalité qui leur est offerte afin de produire le résultat
attendu. Ainsi, le diagramme de cas d’utilisation décrit l’interaction entre le système et
l’acteur en déterminant les besoins de l’utilisateur et tout ce que doit faire le système pour
l’acteur.

Dans ce sens nous avons fait deux applications, d’une part une application web pour la
gestion des données et d’autre parte une application mobile.

11 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

a. Diagramme de cas d’utilisation global pour l’application mobile

Description Endroit Visualiser dans la carte

<<extend>>

<<extend>>
<<extend>> Contacter les responsables
gérer endroit

<<extend>>

<<extend>>
<<extend>>
Lister Favoris <<Acteur>>
:Serveur Google Map

Ajouter favoris gérer note

Visualiser Carte

Utilisateur <<include>>

<<extend>> <<extend>> Tracer itinéraire


detaille parcours
gérer Parcours

<<Acteur>>
:Serveur web

<<extend>>
Participer au événement
gérer événement

gérer les notifications

Synchroniser les données

Figure 3 : Diagramme de cas d’utilisation global pour l’application mobile

N.B : Dans l’application mobile l’utilisation de l’authentification n’est pas utilisée dans notre
cas. Les utilisateurs sont passé en tant que anonyme.

12 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

Titre :  Diagramme de cas d’utilisation globale


Acteurs :  Utilisateurs, Système
Raffinement du  Aucun
Diagramme :
Pré conditions :  Connexion à l’internet requise
Description :  L’utilisateur peut utiliser l’application pour accéder aux
différentes informations de la ville de Mahdia
 Le système qui tourne en arrière-plan va import les
données, lance les notifications et se déclenche en cas
spécifiques
Cas dérivé :  Si la connexion internet échoue ou n’existe pas un
message sera affiche
Post Conditions :  Interfaces affichées
Tableau 2 : Détails du diagramme de cas d’utilisation global pour l’application mobile

b. Diagramme de cas d’utilisation global pour l’application web

Ajouter Endroit
<<extend>>

Gérer endroit Modifier Endroit


<<extend>>
Supprimer Endroit
<<extend>>
Lister Endroit
<<extend>>

<<include>>
Ajouter Parcours
<<extend>>
Gérer parcours <<extend>> Modifier Parcours
Authentification
Supprimer Parcours
Administrateur <<extend>>

Lister Parcours
<<extend>>

<<include>>

Ajouter événement
<<extend>>
Modifier événement
<<extend>>
Gérer événement Lister événement
<<extend>>
Supprimer événement
<<extend>>
<<include>>

Figure 4 : Diagramme de cas d'utilisation global pour l’application web

13 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

Titre :  Diagramme de cas d’utilisation globale


Acteurs :  Administrateur, Système
Raffinement du  Aucun
Diagramme :
Pré conditions :  Connexion à l’internet requise
 L’authentification requise
Description :  L’administrateur gère les endroits
 L’administrateur gère les parcours
 L’administrateur gère les événements
Cas dérivé :  Si la l’authentification échoue un message sera affiche
Post Conditions :  Interfaces affichées
Tableau 3 : Détails du diagramme de cas d’utilisation global pour l’application web

3. Raffinement de cas d’utilisation pour l’application mobile

a. Cas d’utilisation raffiné « Visualiser les cafés »

Figure 5 : Diagramme d'un cas d'utilisation raffinée « Visualiser les cafés »

14 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

Titre :  Visualiser les cafés


Acteurs :  Utilisateur, Serveur web, SGBD
Pré conditions :  Choisir la liste des cafés.
Description  L’utilisateur peut visualiser les cafés et voir son description
 Voir les cafés en carte « Map »
 Consulter le numéro téléphonique de chaque café
 Affichage l’image de couvre a partir d’un serveur web
 L’écoute de la description de voix du système
 L’utilisateur donne son note du café
Cas dérivé :  Impossible de charge l’image en l’absence de la connexion internet.
 Impossible de voir la position du café en carte en l’absence de la
connexion internet.
Post conditions :  Interfaces affiche.
Tableau 4 : Détails du raffinement de cas d’utilisation « Visualiser les cafés »

b. Cas d’utilisation raffiné « Visualiser les événements »

Figure 6 : Diagramme cas d'utilisation raffinée « visualiser événements »

15 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

Titre :  Visualiser les événements


Acteurs :  Utilisateur, SGBD
Pré conditions :  Choisir un événement
Description :  L’utilisateur peut voir la description sur l’événement.
 L’utilisateur peut participer à l’événement.
 L’utilisateur peut voir l’emplacement de l’événement sur la carte
« Map »
 L’utilisateur donnera son avis ce que concerne de l’événement.
 L’enregistrement des données dans un base des données a partir
d’une SGBD
Cas dérivé :  Besoins d’une connexion internet pour l’affichage sur la carte
Post conditions  Interfaces affiches
Tableau 5 : Détails du raffinement d’un cas d’utilisation « Visualiser les événements »

c. Cas d’utilisation raffiné « gérer parcours »

Figure 7 : Diagramme cas d'utilisation raffinée « gérer parcours »

16 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

Titre :  Gérer parcours


Acteurs :  Utilisateur, Google Map Api, Serveur Web
Pré conditions :  Choisir un parcours
Description :  L’utilisateur va voir la description sur le parcours.
 L’utilisateur peut voir l’itinéraire de le parcours sur la carte « Map »
 L’utilisateur donnera son avis ce que concerne de le parcours.
Cas dérivé :  Besoins d’une connexion internet pour l’affichage sur l’itniéraire
Post conditions  Interfaces affiches
Tableau 6 : Détails de raffinement d'un cas d'utilisation « gérer parcours »

IV. Diagramme de séquence


Le diagramme de séquence représente la succession chronologique des opérations réalisées
par un acteur. Il indique les objets que l’acteur va manipuler et les opérations qui font passer
d’un objet à l’autre.

1. Diagramme de séquence « Synchronisation des données »

Ce diagramme représente l’intersection entre deux application mobile et web pour réfléchira
les données.

Figure 8 : Diagramme de séquence « Synchronisation des données »

17 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

 Pour assurer que l’application est à jour il doit être faire des synchronisations des
données avec l’application web dans certains temps prédéfini.

2. Diagramme de séquence « Authentification » pour la partie web

Figure 9 : Diagramme de séquence « Authentification » pour l’application web

 Ce diagramme décrit le cas de l’authentification dans l’application web, l’utilisateur


doit indiquer son login et mot de passe. Une fois vérifiée le système charge l’interface
d’accueil si non un message d’erreur survenue sera affiché.

18 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

3. Diagramme de séquence « gérer endroit » pour l’application mobile

Gérer endroit

:Système :Base Des Données :Serveur Web

Utilisateur
Lister endroit requête

Traitement
Résultat
Afficher liste des endroits

opt [choisir endroit]


par requête
Selectionner endroit
Retourner résultat Traitement
Affichier détails

l'importation de l'image

Exporter l'image

opt [Ajouter aux favoris]


Demande d'ajout aux favoris requête
Traitement du requête
Retourne le résultat
Afficher le résultat

opt [Contacter]
Demande d'appelle

Extraction le numéro

établir l'appelle

opt [Visualiser Map]


Demande d'affichage Map Demande des Coordonnées

Traitement
Retourne les données
Affichage Map

opt [Description Vocale]


Demande de la description Extraction description

Retourne Résultat Traitement

Lancement description vocale

Figure 10 : diagramme de séquence « gérer endroit » pour l’application mobile

19 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

 Ce diagramme décrit la gestion des endroits dans partie mobile pour laquelle
l’utilisateur doit choisir endroit puis le système afficher les détails sur l’endroit
sélectionné par suite à partir des options ajouter aux favoris, contacter les
propriétaires, visualiser en carte « MAP » et une description vocale.

4. Diagramme de séquence « gérer parcours » pour l’application mobile

Gérer Parcours

:Système :Base des données :Serveur web

Utililisateur Lister Parcours requête


Traitement
Résultat
Afficher liste parcours

opt [Choisir parcours]

par
Selectionner parcours requête

Retourner les parcours Extraction parcours


Afficher détails

Importer image

Export image

opt [Visualiser Map]


Selectionner Map

Traitement
Afficher Map

Figure 11 : Diagramme de séquence « gérer parcours » pour l’application mobile

 Ce diagramme décrit la gestion des parcours, lorsque l’utilisateur choisira de lister les
parcours il y a deux taches effectués simultanément c’est l’extraction les données à
partir une base des données local « Sqlite » et la deuxième c’est l’importation de
l’image de serveur web pour l’afficher dans avec les détails sur le parcours.

20 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

5. Diagramme de séquence « gérer événement » pour l’application mobile

Gérer év ènement

:Systéme requête :Serveur Web

Utilisateur
Lister événements requête

Retourner les événements Traitement

Afficher liste des événemebts

opt [Choisir événement]

par
Selectionner événement requête

Extraction les événements


Retourner les événements

Afficher les détails

importer image

Temps de repense
export l'image

opt [Visualiser Map]


Selectionner Map

Afficher Map Traitement

opt [Participer]
demande de participation envoye les données
sauvgarde les données
Résultat
Afficher le résultat

Figure 12 : Diagramme de séquence « gérer événement » pour l’application mobile

 Ce diagramme représente la gestion des événements, lorsque l’utilisateur choisi la liste


des événements, le système va communique avec la base des données pour afficher la
liste. Au même temps en arrière-plan le système exporter les images depuis un serveur
web simultanément. Avant ça l’utilisateur peut choisi deux options Visualiser Map et
la participation aux événements.

V. Diagramme de classe
Le diagramme de classe représente les classes intervenant dans le système. Le diagramme de
classe est une représentation statique des éléments qui composent un système et de leurs
relations.

21 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

1. Diagramme de classe global

Le diagramme suivant présent le diagramme de classe de l’application mobile.

Figure 13 : Digramme de classe global

22 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

2. Modèle logique de données liée au diagramme de classe

 Endroit (IdEndroit, Nom, description, Latitude, Longitude, numéro, statut, type)


 Parcours (IdParcours, Nom, description, duree, distance)
 Evenement (IdEvenement, Nom, description, date_deb, date_fin, #IdEndroit, contact)
 Order (#IdEndroit, #IdParcours, rang)
 Favoris (#IdEndroit, date_aj)
 Participe_evenement (#idEvenement, date_participation)

VI. Diagramme de composants


Le diagramme de composants décrit l'organisation du système du point de vue des éléments
logiciels comme les modules (paquetages, fichiers sources, bibliothèques, exécutables), des
données (fichiers, bases de données) ou encore d'éléments de configuration (paramètres,
scripts, fichiers de commandes). Ce diagramme permet de mettre en évidence les dépendances
entre les composants (qui utilisent quoi).

Les diagrammes de composants et les diagrammes de déploiement sont les deux derniers
types de vues statiques en UML. Les premiers décrivent le système modélisé sous forme de
composants réutilisables et mettent en évidence leurs relations de dépendance. Les seconds se
rapprochent encore plus de la réalité physique, puisqu'ils identifient les éléments matériels
(PC, Modem, Station de travail, Serveur, etc.), leur disposition physique (connexions) et la
disposition des exécutables (représentés par des composants) sur ces éléments matériels.

Figure 14 : Diagramme de composants

23 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 2 : Conception

VII. Conclusion
Ce chapitre a été consacré à différentes étapes de la conception détaillée. Du raffinement du
diagramme de cas d’utilisation, vers du diagramme de séquence de plusieurs cas d’utilisations
pour montrer les interactions entre les acteurs et le système. Finalement nous avons terminé
avec le diagramme de classe avec lequel nous avons pour présenter la structure de notre
application.

Le prochain chapitre contiendra des explications et des clarifications de plusieurs concepts en


rapport avec le contexte de notre travail.

24 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

Chapitre 3 : Réalisation

25 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

Chapitre 3 : Réalisation

I. Introduction
En détaillent ce chapitre, nous sommes déjà passé par les étapes nécessaires à fin d’entrainer
la phase de la réalisation. Le problème a été profondément analysé, nous avons défini une
conception complète à notre jugement. Une conception qui comporte et décrit tous les besoins
de l’application.

Dans ce chapitre nous commencerons par la description de l’environnement de


développement (matériel et logiciel) ainsi que les différents outils utilisées. Ensuite, nous
présenterons les différents aspects de fonctionnement de notre application.

II. Environnement de travail


Dans ce paragraphe, nous allons présenter l’environnement matériel et logiciel de
développement de l’application que nous avons utilisée.

1. Environnement matériel

Pour développer l’application, nous avons utilisé comme environnement matériel un


ordinateur portable et un téléphone portable qui possèdent les caractéristiques suivant :

Marque ACER
Processeur Intel Core i7 2.4GHz
Mémoire 8 GO
Disque Dur 1 TO
Système d’exploitation Windows 10 Professionnel
Tableau 7 : Environnement matériel 1

Marque Evertek EverVivid Q47


Processeur Quad core 1.3 GHz
Mémoire 1 GO
Disque dur 8 GO
Système d’exploitation Android 4.4
Tableau 8 : Environnement matériel 2

26 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

2. Environnement logiciel

 Android studio

Android studio est un est un environnement de développement pour développer des


applications Android. Il est basé sur IntelliJ IDEA, mis gratuitement à la disposition des
développeurs Android accompagné de sa documentation complète. Il est créé par Google pour
remplacer l’ancien IDE eclipse.

 Notepad ++

Notepad ++ est un éditeur de texte générique codé en C++. Ce logiciel, basé sur la
composante Scintilla, a pour but de fournir un éditeur léger (aussi bien au niveau de la taille
du code compilé que des ressources occupées durant l’exécution) et efficace. Il est également
une alternative au bloc-notes de Windows (d’où le nom). Le projet est sous licence GPL.

 FileZilla

FileZilla est un client FTP, FTPS et SFTP, développé sous la licence publique générale
GNU.

 Sqlite Browser

Sqlite Browser est un logiciel gratuit, domaine public, outil visuel open source utilisé
pour créer, concevoir et éditer des fichiers de base des données compatible avec Sqlite.

 Power Designer

Power Designer est un logiciel de conception créé par la société Sybase, qui permet de
modéliser les traitements informatique en utilisent les diagrammes UML.

27 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

 WampServer

WampServer est une plateforme de développement Web de type WAMP, permettant


de faire fonctionner localement (sans se connecter à un serveur externe) des scripts PHP.

 Iconion

Iconion vous permet de convertir n'importe quelle police d'icône en une superbe icône
au format png en y ajoutant couleur, ombre, arrière-plan, gradient, traits, et plusieurs autres
éléments fantaisistes.

3. Langage de programmation et technologies utilisés

 JAVA

Le langage Java est un langage de programmation informatique orienté objet créé


par James Gosling et Patrick Naughton, employés de Sun Microsystems.

 XML

L'Extensible Markup Language (XML, « langage de balisage extensible » en français)


est un métalangage informatique de balisage générique qui dérive du SGML.

 PHP

PHP: Hypertext Preprocessor, plus connu sous son sigle PHP (acronyme récursif), est
un langage de programmation libre, principalement utilisé pour produire des pages Web
dynamiques via un serveur HTTP, mais pouvant également fonctionner comme n'importe
quel langage interprété de façon locale. PHP est un langage impératif orienté objet.

 SQL

28 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

SQL (sigle de Structured Query Language, en français langage de requête structurée)


est un langage informatique normalisé servant à exploiter des bases de données relationnelles.
La partie langage de manipulation des données de SQL permet de rechercher, d'ajouter, de
modifier ou de supprimer des données dans les bases de données relationnelles.

 HTML5

L’HyperText Markup Language, généralement abrégé HTML, est le format de


données conçu pour représenter les pages web. C’est un langage de balisage permettant
d’écrire de l’hypertexte, d’où son nom.

 JavaScript & JQuery

JavaScript est un langage de programmation de scripts principalement employé dans


les pages web interactives mais aussi pour les serveurs.

JQuery est une bibliothèque JavaScript libre et multiplateforme créée pour faciliter
l'écriture de scripts côté client dans le code HTML des pages web. La première version est
lancée en janvier 2006 par John Resig.

 JSON

JSON ou JavaScript Object Notation, est un format de données textuelles dérivé de la


notation des objets du langage JavaScript.

 Bootstrap

Bootstrap est une collection d'outils utile à la création de sites et d'applications web.
C'est un ensemble qui contient des codes HTML et CSS, des formulaires, boutons, outils de
navigation et autres éléments interactifs, ainsi que des extensions JavaScript en option..

29 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

III. Plateforme Android

1. Historique

Android doit son nom à la startup éponyme spécialisée dans le développement d'applications
mobiles rachetée par Google en août 2005, nom venant lui-même d'« androïde » qui désigne
un robot construit à l'image d'un être humain.

2. Architecture Android

Android est basé sur un noyau linux 2.6, au-dessus l’architecture générale :

Figure 15 : Architecture générale Android

a. Application

Android est fourni avec un ensemble de programmes de base (également nommés


applications natives) permettant d'accéder à des fonctionnalités comme les courriels, les SMS,
le téléphone, le calendrier, les photos, les cartes géographiques, le Web, pour ne citer que
quelques exemples. Ces applications sont développées à l'aide du langage de programmation
Java. Pour l'utilisateur final, c'est la seule couche accessible et visible.

30 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

b. Le Framework (Application Framework)

En fournissant une plateforme de développement ouverte, Android offre aux développeurs la


possibilité de créer des applications extrêmement riches et innovants. Les développeurs sont
libres de profiter du matériel périphérique, les informations de localisation d'accès, exécutez
les services d'arrière-plan, définir des alarmes, ajouter des notifications de la barre d'état, et
beaucoup, beaucoup plus.

c. Les bibliothèques (Libraires)

En interne, Android inclut un ensemble de bibliothèques C et C++ utilisées par de nombreux


composants de la plateforme Android. Ces bibliothèques sont en réalité accessibles au
développeur par l'intermédiaire du Framework Android. En effet, le Framework Android
effectue, de façon interne, des appels à des fonctions C/C++ beaucoup plus rapides à exécuter
que des méthodes Java standard.

d. Moteur d’exécution Android (Android Runtime)

Android inclut un ensemble de bibliothèques qui fournit la plupart des fonctionnalités


disponibles dans les bibliothèques de base du langage de programmation Java.

e. Noyau Linux (Linux Karnel)

Android repose sur un noyau Linux (version 2.6) qui gère les services du système, comme la
sécurité, la gestion de la mémoire et des processus, la pile réseau et les pilotes. Il agit
également comme une couche d'abstraction entre le matériel et la pile logicielle.

IV. Présentation des interfaces de l’application


Cette section comporte des captures d’écran de quelques interfaces de l’application réalisée
accompagnée par une brève description.

1. Les interfaces de l’application web

Cette application permet à l’administrateur de gérer les endroits, les parcours, les évènements
(insertion, modification, suppression et l’affichage). Pour cela nous hébergons cette
application dans le web sous le nom de domaine stage.lelkol.net

31 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

a. Interface d’authentification

Figure 16 : Interface d'authentification

 L’accès à l’application web est protégé par un système d’authentification.


L’administrateur doit saisir son login et mot de passe de passe à fin d’y accéder.

b. Interface d’accueil

Figure 17 : Interface d'accueil

 Dans cette interface l’administrateur peur d’accéder aux plusieurs fonctionnalités de


l’application
 1 : Lien vers la page d’accueil
 2 : gérer les endroits
 3 : gérer les parcours
 4 : gérer les événements
 5 : gérer les notifications

32 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

 6 : fermeture la session de l’administrateur et retour vers la page


d’authentification
 7 : message de ressuie à la connexion

c. Interfaces gérer endroit

Figure 18 : Interface ajouter endroit

 Cette interface représente l’étape de l’ajoute des endroits par l’administrateur qui
contient nom, description, long, lat, numéro statues, type, et image de type png

Figure 19 : Interface Lister les endroits

33 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

 L’interface représente la liste des endroits qui contient l’image, description, latitude,
longitude, statuts et les actions (modification et suppressions). Ainsi deux actions de
modification et suppression.

d. Interfaces gérer parcours

Figure 20 : Interface ajouter parcours

 Depuis cette interface l’administrateur peut ajouter des nouveaux parcours et les
endroits qui sont formulent le parcours.

Figure 21 : Lister les parcours

 Dans cette interface en trouvent les détails les parcours. Ainsi deux bouton
modification et suppression.

34 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

e. Interfaces gérer évènement

Figure 22 : Interface ajouter événement

 Comme les autres interfaces en peut ajouter les événements.

Figure 23 : Interface Lister des événements

 Dans l’interface on représente la liste des événements.

2. Les interfaces de l’application mobile

a. Icône de l’application

35 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

Figure 24 : Icone principale de l'application

 La figure représente les différents types des icônes de l’application (hdpi, mdpi, xhdpi,
xxhdpi, xxxhdpi).

b. Interfaces de chargement de l’application

Figure 25 : Interfaces de chargement de l'application

 Cette interface représente le chargement des données de la base des données local
« Sqlite » dans l’application. Ainsi les informations supplémentaires.

36 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

c. Interfaces Carte géographique

Figure 26 : Interfaces de la carte géographique

 Depuis cette interface en peut gérer la carte de l’api Google Map, les fonctionnalités
sont :
o Localisation géographique de l’utilisateur sur la carte
o Changement le type de carte (Normale, Hybrid, Satellite, terrain).
o Recherche les endroits
o Et un bouton de retour vers la page d’accueil.

37 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

d. Interfaces de gérer les endroits

Figure 27 : Interfaces gérer les endroits

 Dans cette interface, l’utilisateur permet de gérer les endroits et profitez de ces
fonctionnalités suivante :
o Consulte la liste des endroits par son catégorie (Restaurant, cafés, etc.).
o Consulter les détails pour chaque endroit (image, description, etc.).
o Afficher ma position les endroits la plus proche de ma position.
o Gérer favoris c’est-à-dire que en peut ajouter, supprime et consulte les endroits

38 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

e. Interfaces gérer les parcours

Figure 28 : Interfaces gérer les parcours

 Ces interfaces permettent à l’utilisateur de :


o Sélectionner un parcours.
o Voir les détails du parcours (liste des endroits à passer, description).
o Tracer un itinéraire sur la carte

39 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

f. Interfaces gérer les événements

Figure 29 : Interfaces gérer les événements

 Ces interfaces permettent à l’utilisateur de :


o Visualiser la liste des événements.
o Consulter les détails pour chaque événement.
o Participation et l’annulation dans l’événement.

40 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Chapitre 3 : Réalisation

o Une notification en cas de participation que informe nous avons participent au


événement qui offre deux fonctionnalités (accéder au événement et accéder au
carte et affiche la position de l’événement).

3. Conclusion

Dans ce chapitre on a mis l’accent sur la description des caractéristiques de l’environnement


du travail et décrit les plateformes matérielles et logiciel sur lesquelles nous avons construit
notre application d’une part, d’autre part par la représentation des différents interfaces
développées tout au long de l’application. Enfin nous avons clôturé ce chapitre par la
présentation du chronogramme d’activité.

41 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Conclusion générale

Conclusion générale
Au bout de notre cursus en licence informatique, nous avons été chargés de réaliser un projet
de fin d’études. Notre travail s'est basé sur le développement d'un programme sur les
technologies mobiles (Smartphone). Ceci nous a amené à découvrir une nouvelle plateforme
de développement et à enrichir notre savoir et notre expérience.

Ce projet se dirige dans le cadre de notre licence appliques en informatique au sein de


l’Institut Supérieur d’Études Technologique de Mahdia pour le compte de la société e-pirana.

Au cours de la phase de réalisation de notre application, nous avons élaboré une étude
préalable sur les smart phones et son importance sur le plan social afin de préciser le but
principal pour la future application. Cette phase a constitué le point de départ pour l’étape
d’analyse et de spécification des besoins. Une fois nos objectifs sont fixés nous avons
enchaîné avec la conception afin de mener à bien notre projet. Nous avons procédé à la phase
de réalisation au cours de laquelle nous nous sommes familiarisés avec le langage de
programmation java.

Pour conclure, notre travail peut être sujet à des extensions. En effet, nous envisageons
d’ajouter une application «mTorism» sur Play store dans notre travail, la possibilité
développer sous d’autres plateformes.

42 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Bibliographique

Bibliographie

[1] L'art du développement Android 4eédition, 1er décembre 2012, de Grant Allen

[2] Développez pour Android, 1re édition, 1er mars 2011, de Cyril Mottier et Ludovic
Perrier.

[3] Programmation Android De la conception au déploiement avec le SDK Google


Android 2, de Damien Guignard, Julien Chable, Emmanuel Robles.

43 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Netographie

Netographie
[1] http://stackoverflow.com

[2] https://openclassrooms.com

[3] https://developers.google.com

[4] http://android.developpez.com/cours

[5] https://www.youtube.com

[6] http://www.tutorialspoint.com/android

[7] http://stage.lelkol.net

[8] http://getbootstrap.com

[9] http:// www.w3schools.com/bootstrap

[10] http://phpmyadmin.ovh.net

[11] http://www.ovh.tn

[12] https://www.wikipedia.org

44 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Projet Fin d’Études Annexe

Annexe

45 Institut Supérieur d’Études Technologiques de Mahdia 2015/2016


Annexe

 Android Studio versus Eclipse

ADT (Eclipse) Android Studio


Facilité d'installation Moyen Simple
Langue Nombreuses Anglais
Performance Peut-être lourd Rapide
Système de construction et compilation (build) Ant Gradle
Génération de variante et de multiple APK Non Oui
Complétion de code et refacturation Base Avancé
Éditeur d'interface graphique Oui Oui
Signature d'APK et gestion de Key store Oui Oui
Support NDK Oui oui

 Installer Android Studio


 Android Studio est disponible pour les systèmes Linux, Mac et Windows à partir de
cette page : https://developer.android.com/sdk/index.html
 Pour Windows, si vous ratez votre installation, l'installateur n'arrête pas de boucler en
affichant des messages d'erreur à propos de composantes manquantes, assurez-vous
d'avoir préalablement effacé les fichiers préservés en cache, par la précédente
installation, dans le répertoire Temp de votre machine.
 Quelques paramètres à respecter :
https://developer.android.com/sdk/index.html#Requirements
o Minimum 2 GB RAM, recommandé 4 GB RAM
o Espace disque: 400 Mb
o Au moins 1 Gb pour le SDK d'Android, les images pour l'émulateur et la cache
o 1280 x 800 la résolution minimale de l'écran
o Java Development Kit (JDK) 7
o Si l'on veut accélérer l'émulateur: processeur Intel avec support pour Intel VT-
x, Intel EM64T (Intel 64), et la fonctionnalité « Execute Disable (XD) Bit »

Vous aimerez peut-être aussi