SlideShare une entreprise Scribd logo
Année Universitaire 2018-2019
Ministère de l’Enseignement Supérieur de la Recherche Scientifique
Université de Carthage
Institut des Hautes Études Commerciales de
Carthage
Rapport de Projet de Fin d’Études présenté en vue de l’obtention du
Diplôme de la Licence Appliquée en Technologies de l’Information.
Intitulé du Projet : Réalisation d’une application de mise en relation B2C des
professions libérales
Réalisé Par :
Ghribi Fatma Ezzahra Ouedherfi Oumaima
Organisme d’accueil :
CosaVostra
Encadrant Académique : Encadrant Professionnel:
Mme. Ben Ishak Mouna (IHEC) Mr. Asli AmenAllah (CosaVostra)
Remerciements
Au terme de ce travail nous tenons à remercier tous ceux qui ont participé de près ou de loin
à la réalisation de ce travail.
La première personne que nous tenons à remercier est notre chère encadrante académique Mme
Ben Ishak Mouna, nous tenons également à remercier notre encadrant professionnel Mr Asli
AmenAllah, pour l’orientation, la confiance, la patience qui ont constitué un apport
considérable sans lequel ce travail n’aurait pas pu être mené au bon port.
Qu’ils trouvent dans ce travail un hommage vivant à sa haute personnalité.
Un grand Merci aussi à Mr Bahri Mouhamed le directeur de tanitlab chez CosaVostra pour son
soutien et ses conseils
D’une autre part nous exprimons nos vifs sentiments et remerciements à tous nos enseignants
pour la formation qu’ils ont eu le soin de nous apporter tout au long de notre cursus
universitaire.
Nous tenons aussi à adresser nos remerciements pour les membres du jury pour l’honneur qu’ils
nous ont fait pour évaluer ce travail.
Enfin, nous adressons nos plus sincères remerciements à tous nos proches et amis, qui nous
ont toujours soutenu et encouragé au cours de la réalisation de ce projet.
i
Sommaire
Introduction Générale......................................................................................................................1
Chapitre 1 : Contexte Général.....................................................................................................2
I. Introduction...............................................................................................................3
II. Cadre du stage ...........................................................................................................3
1. Présentation de l'organisme d'accueil..........................................................................3
2. Etude de l’existant .......................................................................................................3
3. Problématique et présentation du sujet........................................................................3
III. Méthodologie de travail ............................................................................................4
1. La méthode agile .........................................................................................................4
2. La méthode Scrum.......................................................................................................4
IV. Conclusion.................................................................................................................7
Chapitre 2 : Spécification et analyse de besoins .........................................................................8
I. Introduction...............................................................................................................9
II. Les rôles Scrum.........................................................................................................9
III. Spécification des besoins ........................................................................................11
1. Identification des acteurs...........................................................................................11
2. Identification des besoins fonctionnels .....................................................................12
3. Identification des besoins non fonctionnels : ............................................................13
IV. Modélisation et analyse des besoins........................................................................14
V. Le Backlog du produit.............................................................................................14
VI. Le planning des sprints............................................................................................23
VII. Prototypages des interfaces .....................................................................................23
VIII. Conclusion...............................................................................................................27
Chapitre 3 : Conception et réalisation .......................................................................................28
I. Introduction.............................................................................................................29
II. Les Exigences techniques........................................................................................29
1. Environnement matériel ............................................................................................29
2. Environnement logiciel et langages utilisés ..............................................................29
III. Réalisation des sprints.............................................................................................33
ii
1. Étude et réalisation du sprint 0 ..................................................................................33
A. Installation et configuration de l’environnement de travail ..................................33
B. Formation et développement des sites web ...........................................................33
C. Réalisation.............................................................................................................34
2. Étude et réalisation du sprint 1 ..................................................................................36
A. Diagramme des cas d'utilisation ............................................................................37
B. Analyse et raffinement de cas d’utilisation ...........................................................38
a. Raffinement de cas d’utilisation « s’inscrire ».................................................38
b. Raffinement de cas d’utilisation « S’authentifier »..........................................39
C. Conception.............................................................................................................40
a. “S’inscrire”.......................................................................................................40
b. “Authentification”............................................................................................41
D. Réalisation.............................................................................................................42
E. Burndown..............................................................................................................44
F. Rétrospective .........................................................................................................44
3. Etude et la réalisation du sprint 2 ..............................................................................44
A. Diagramme des cas d'utilisation ............................................................................45
B. Analyse et raffinement de cas d’utilisation ...........................................................46
a. Raffinement de cas d’utilisation « Consulter les offres » ................................46
b. Raffinement de cas d’utilisation « Gérer ses offres » ......................................48
C. Conception.............................................................................................................51
a. “Consulter ses offres”.......................................................................................51
b. “Consulter détail d'une offre ”..........................................................................51
c. “Rechercher une offre”.....................................................................................52
d. “Choisir Catégorie ”.........................................................................................52
e. “Consulter ses offres”.......................................................................................53
f. “Ajouter une offre”...........................................................................................53
g. “Supprimer une offre”......................................................................................54
h. “Modifier une offre ”........................................................................................54
D. Réalisation.............................................................................................................55
E. Burndown..............................................................................................................57
F. Rétrospective .........................................................................................................58
4. Étude et réalisation du sprint 3 ..................................................................................58
A. Diagramme des cas d'utilisation ............................................................................58
iii
B. Analyse et raffinement de cas d’utilisation ...........................................................59
a. Raffinement de cas d’utilisation « Assistance Artificielle »............................59
b. Raffinement de cas d’utilisation « Consulter profil prestataire ».....................60
c. Raffinement de cas d’utilisation « Devenir prestataire » .................................60
d. Raffinement de cas d’utilisation « Consulter son profil »................................61
e. Raffinement de cas d’utilisation « Consulter liste des Comptes »...................61
C. Conception.............................................................................................................63
a. Assistance Artificielle ......................................................................................63
b. Consulter profil prestataire...............................................................................64
c. “Devenir prestataire”........................................................................................64
d. “Consulter liste des comptes” ..........................................................................65
e. “Modifier un compte” ......................................................................................65
D. Réalisation.............................................................................................................66
E. Burndown..............................................................................................................67
F. Rétrospective .........................................................................................................68
IV. Diagramme de classe général..................................................................................68
V. Conclusion...............................................................................................................69
Conclusion et perspectives ............................................................................................................70
iv
Liste des figures
Figure 1: Cycle de vie de la méthode SCRUM ...............................................................................6
Figure 2 : Les rôles du Scrum..........................................................................................................9
Figure 3 : La détermination des rôles Scrum.................................................................................11
Figure 4 : Diagramme de cas d’utilisation globale........................................................................14
Figure 5 : Prototype de l’interface « inscription ».........................................................................24
Figure 6 : Prototype de l’interface « authentification ».................................................................24
Figure 7 : Prototype de l’interface « page d'accueil » ...................................................................25
Figure 8 : Prototype de l’interface « page offres liste » ................................................................25
Figure 9 : Prototype de l’interface « page offre cards » ................................................................26
Figure 10 : Prototype de l’interface « page détails ».....................................................................26
Figure 11 : Prototype de l’interface « profil d’un particulier ».....................................................27
Figure 12 : Interface Site Web « tk1 » ..........................................................................................34
Figure 13 : Interface site web « Ben Youssef »...........................................................................34
Figure 14 : Interface Landing Page « Accueil »..........................................................................35
Figure 15 : Interface Landing Page « A propos » ......................................................................35
Figure 16 : Interface Landing Page « Service ».........................................................................36
Figure 17: Interface Landing Page « Employee of the month »..................................................36
Figure 18 : Diagramme de cas d’utilisation de sprint 1.................................................................37
Figure 19 : Raffinement de cas d’utilisation “s’inscrire”..............................................................38
Figure 20 : Raffinement de cas d’utilisation “s’authentifier” .......................................................39
Figure 21 : Diagramme de séquence « s’inscrire » .......................................................................41
Figure 22 : Diagramme de séquence« s’authentifier »..................................................................42
Figure 23 : Interface « Inscription »..............................................................................................43
Figure 24 : Interface « Authentification ».....................................................................................43
Figure 25 : Burndown du sprint 1..................................................................................................44
Figure 26 : Diagramme de cas d’utilisation de sprint 2.................................................................45
Figure 27 : Raffinement de diagramme de cas d’utilisation “consulter offre”..............................46
Figure 28 : Raffinement diagramme de cas d’utilisation “Gérer ses offres” ................................48
Figure 29 : Diagramme de séquence « Consulter les offres ».......................................................51
Figure 30 : Diagramme de séquence « Consulter détails d'une offre ».........................................51
Figure 31 : Diagramme de séquence « Rechercher une offre » ....................................................52
Figure 32 : Diagramme de séquence « Choisir catégorie »...........................................................52
Figure 33 : Diagramme de séquence « Consulter ses offres » ......................................................53
Figure 34 : Diagramme de séquence « Ajouter une offre » ..........................................................53
Figure 35 : Diagramme de séquence « Supprimer une offre »......................................................54
Figure 36 : Diagramme de séquence « Modifier une offre » ........................................................55
Figure 37 : Interface « Ajouter une offre »....................................................................................55
Figure 38 : Interface « Modifier une offre »..................................................................................56
v
Figure 39 : Interface « Détails d’une offre ».................................................................................56
Figure 40 : Interface « Liste de mes offres ».................................................................................56
Figure 41 : Interface « liste des offres »........................................................................................57
Figure 42 : Burndown du sprint 2..................................................................................................57
Figure 43 : Diagramme de cas d’utilisation de sprint 3.................................................................59
Figure 44 : Raffinement de diagramme de cas d’utilisation “Devenir prestataire” ......................60
Figure 45 : Raffinement de diagramme de cas d’utilisation “Consulter liste des comptes” .........61
Figure 46 : Diagramme de séquence « Consulter mon profil ».....................................................63
Figure 47 : Diagramme de séquence « Consulter mon profil ».....................................................64
Figure 48 : Diagramme de séquence « Devenir Prestataire » .......................................................64
Figure 49 : Diagramme de séquence « Consulter liste des comptes » ..........................................65
Figure 50 : Diagramme de séquence « Modifier un compte » ......................................................65
Figure 51 : Interface « Mon Profil»...............................................................................................66
Figure 52 : Interface « liste des comptes »....................................................................................66
Figure 53: Interface « Profil d’un prestataire ».............................................................................67
Figure 54 : Burndown du sprint 3..................................................................................................67
Figure 55 : Diagramme de classe général......................................................................................68
vi
Liste des tableaux
Tableau 1: Tableau Les rôles en scrum...........................................................................................5
Tableau 2 : Tableau Les rôles en Scrum .......................................................................................10
Tableau 3 : Les acteurs et leurs rôles.............................................................................................12
Tableau 4 : Le Backlog du produit ................................................................................................23
Tableau 5 : Tableau de planning de travail ...................................................................................23
Tableau 6 : Tableau d’environnement matériel.............................................................................29
Tableau 7 : Environnement logiciel et langage utilisés .................................................................32
Tableau 8: Backlog sprint 1...........................................................................................................37
Tableau 9 : Description textuelle de cas d'utilisation « s’inscrire » ..............................................39
Tableau 10 : Description textuelle de cas d'utilisation « s’authentifier».......................................40
Tableau 11 : Backlog sprint 2........................................................................................................45
Tableau 12 : Description textuelle de cas d'utilisation « Consulter les offres »............................46
Tableau 13 : Description textuelle de sous cas d'utilisation «Consulter détails des offre»...........47
Tableau 14 : Description textuelle de sous cas d'utilisation «Rechercher une offre » ..................47
Tableau 15 : Description textuelle de sous cas d'utilisation « Choisir catégorie » .......................48
Tableau 16 : Description textuelle de cas d'utilisation « Gérer ses offres »..................................49
Tableau 17 : Description textuelle de sous cas d'utilisation « Ajouter une offre ».......................49
Tableau 18 : Description textuelle de sous cas d'utilisation « Consulter ses offres » ...................49
Tableau 19 : Description textuelle de sous cas d'utilisation « Modifier une offre » .....................50
Tableau 20 : Description textuelle de sous cas d'utilisation « Supprimer une offre » ..................50
Tableau 21: Backlog sprint 3.........................................................................................................58
Tableau 22 : Description textuelle de sous cas d'utilisation « Assistance Artificielle» ................59
Tableau 23 : Description textuelle de sous cas d'utilisation « Consulter profil d’un prestataire »60
Tableau24: Description textuelle de sous cas d'utilisation « Devenir Prestataire »......................61
Tableau 25 : Description textuelle du cas d'utilisation « Consulter son profil »...........................61
Tableau 26 : Description textuelle de cas d'utilisation « Consulter liste des Comptes » ..............62
Tableau 27 : Description textuelle de sous cas d'utilisation « Modifier un compte »...................62
Tableau 28 : Description textuelle de sous cas d'utilisation « Supprimer un compte » ................63
Introduction Générale
Page | 1
Introduction Générale
Depuis la fin du siècle dernier, le développement de l’informatique et le développement continu
des équipements associés ont permis de traiter de grandes quantités d’informations afin de
pouvoir en tirer parti pour la quasi-totalité des activités humaines. Aucune activité de production,
de services ou autres n’ont connu de progrès sans avoir eu recours aux technologies de
l’information et de la communication TIC, En effet les TIC sont devenues des alliés privilégiés
pour les internautes puisqu'elles permettent de détenir une information plus fiable et pertinente.
Littéralement, toute personne peut construire des pages web pour proposer des biens et des
services.
Soucieuse de se mettre en phase avec la nouvelle technologie du développement web une
application web en ligne, la société « Cosa Vostra » a choisi de se tourner vers un site web qui
propose des services en peinture, bâtiment, peinture décorative, électricité, plomberie...etc.
Dans le cadre de l’élaboration de notre projet de fin d’étude, « Cosa Vostra », l’entreprise
d’accueil, nous a confié l’implémentation d’une application web en ligne qui permet à leurs
utilisateurs d'exprimer leur besoin afin de trouver un service approprié et aux prestataires de
trouver des opportunités de travail.
Ce rapport décrit les différentes étapes de réalisation de notre projet de fin d'études et s'articule
sur trois chapitres.
Dans le premier chapitre intitulé « Contexte général », nous présenterons l’organisme d’accueil,
l’étude et critique de l’existant, les Solution proposée, et enfin la méthodologie de travail.
Dans le deuxième chapitre « Spécification et analyse de besoins », nous procéderons les rôles
scrum, La spécification des besoins, La modélisation et analyse des besoins ainsi que le Backlog
du produit et Le planning des sprints, et enfin nous présenterons le prototypage des interfaces.
Dans le troisième chapitre « Conception et réalisation », nous allons essayer d'éclaircir le choix
de l'architecture, Les exigences techniques rencontrés et la réalisation des sprints ainsi que le
diagramme de classe général, Et enfin Installation et test de l’application.
Finalement nous clôturons par une conclusion à travers laquelle nous ferons une synthèse de tout
ce qui a été fait tout au long des travaux de réalisation et présenterons les valeurs ajoutées du
projet et les perspectives futures.
Page | 2
Chapitre1: Contexte Général
Chapitre 1 : Contexte Général
Page | 3
I. Introduction
Au cours de ce chapitre, nous allons mettre le travail dans son contexte général. Nous
commençons par présenter l’organisme d’accueil. Ensuite nous présentons la problématique à
étudier tout au long de ce projet de fin d’études. Enfin, nous allons introduire la méthodologie de
travail adoptée.
II. Cadre du stage
1. Présentation de l'organisme d'accueil
CosaVostra est un cabinet de conseil en stratégie digitale basé à
Paris, Londres, Bordeaux et Tunis. Sa mission est la création de
sites professionnels sur mesure basé sur des dispositifs digitaux
agiles (site vitrine, site de services, site e-catalogue, site e-commerce, site spécifique, Application
web …) afin de satisfaire les besoins de sa clientèle.
2. Etude de l’existant
Pour résoudre un problème d'électricité un accident de plomberie, le client doit se déplacer
directement au local afin de chercher une offre qui satisfait ses besoins et son budget.
Ses déplacements peuvent être inutiles et même peuvent provoquer un gaspillage de temps.
D’ailleurs, même le vendeur n’a aucun moyen pour mettre à disposition ses annonces de vente et
services, à l’exception des supports traditionnels tels que les journaux ou les petites affiches.
Ainsi, un moyen fiable et automatisé permettant d’informer un grand nombre de clients des offres
de vente et des services nécessaires.
3. Problématique et présentation du sujet
Afin de remédier aux différents problèmes ci-dessus mentionnés, on nous a confié la réalisation
d'une application web proposant des offres de dépannages, afin de permettre aux internautes
l’opportunité non seulement de la consultation des offres de dépannages en ligne mais aussi
l'opportunité de poster des offres afin de devenir un prestataire de service.
L'idée de cette application existe déjà en France, que ce soit pour un dépannage spécifique à la
plomberie « www.plomberie-depannage.com » ou bien pour tout type de dépannages «
www.mesdepanneurs.fr ». Alors pourquoi pas un site tunisien ?
Chapitre 1 : Contexte Général
Page | 4
La conception et le développement de cette application présentent le noyau de notre projet de fin
d'études.
III. Méthodologie de travail
Cette partie, est réservée pour la représentation de la méthodologie optée pour but de mettre en
place la solution. Notre projet sera développé en utilisant Agile comme méthodologie de
développement.
Les choses peuvent être confuses, étant donné la complexité de la nomenclature. Au début, on
dirait presque que “Scrum” et “Agile” sont des mots interchangeables, mais ce sont deux notions
bien distinctes.[1]
1. La méthode agile
La méthode Agile permet de mieux maîtriser les projets informatiques sous les angles délais,
coûts et résultats.
Elle intègre aussi la notion de travail en équipe, une bonne communication entre les acteurs. Cela
permet d'augmenter la crédibilité de la conduite de projet par une plus grande prévisibilité et une
plus grande satisfaction des utilisateurs.
Le but est d'apporter le plus de valeur possible aux projets, de garantir une meilleure qualité de
communication avec l'utilisateur et un meilleur contrôle de qualité par le fait que les tests sont
effectués en continu, ce qui permet de détecter rapidement les problèmes.[w1]
2. La méthode Scrum
« La méthode Scrum (« Scrum » signifie « Mêlée » en anglais), ou plus exactement le cadre
méthodologique Scrum est de loin la méthode Agile la plus utilisée dans le monde. Expérimentée
en 1993, elle bénéficie aujourd’hui de nombreux retours d’expérience. Les conférences,
communautés, formations, blogs, outils et ouvrages à son sujet ne manquent pas. » [w2]
«Scrum» est utilisé depuis le début des années 1990 pour gérer le développement des produits
complexes. Scrum n’est pas en soi un processus ni une méthode de développement de produits,
c’est un canevas pour l’application de divers procédés et techniques de développement. Scrum
met en évidence l’efficacité relative des pratiques de gestion et de développement de produit en
place, de sorte que ces dernières puissent être améliorées. Scrum se compose de plusieurs
éléments que sont l’équipe Scrum et ses rôles associés, les événements, les artéfacts et les règles.
Chapitre 1 : Contexte Général
Page | 5
Chaque élément a une raison d’être spécifique qui le rend indispensable à la réussite de
l’application de Scrum. » [w3]
La pratique de la méthode Scrum nous donne l’opportunité d’être intégré au sein de ce processus
et de participer aux cycles de développement.
Les termes les plus utilisés sont représentés par un tableau ci-dessous :
Terme Définition
Product Backlog C’est l’ensemble des fonctionnalités du produit que l’on veut
développer sous forme de « User story ».
Burndown Chart Diagramme qui permet de suivre l’état d’avancement du projet
Daily Scrum meeting C’est une réunion organisée quotidiennement qui ne dure pas plus
que 15 minutes
Produit partiel Résultat du sprint testé et potentiellement livrable.
Sprint Backlog Liste des fonctionnalités qui devront être mises en œuvre par le
logiciel.
Tableau 1: Tableau Les rôles en scrum
La figure suivante illustre simplement la mise en œuvre de SCRUM dans le projet :
Chapitre 1 : Contexte Général
Page | 6
Figure 1: Cycle de vie de la méthode SCRUM
Le principe de la méthode agile Scrum est de concentrer l'équipe de développement sur un
ensemble de fonctionnalités à réaliser de façon itérative, dans des itérations d’une durée de deux
à quatre semaines, appelées des Sprints. Chaque Sprint est caractérisé par un but défini par le
directeur de produit (Product Owner). Ce dernier choisit les fonctionnalités à implémenter dans
chaque itération. Chaque Sprint doit aboutir à la livraison d'un produit partiel. Durant un Sprint,
le Scrum Master (le meneur et facilitateur du projet) à la charge de résoudre les problèmes non
techniques et minimiser au maximum les perturbations extérieures. Un principe de base en Scrum
consiste à la participation permanente et active des clients, afin de discuter les fonctionnalités du
logiciel et de choisir les tâches qui seront implémentées dans chaque Sprint. Le client peut, à tout
moment, modifier ou ajouter des fonctionnalités à réaliser, néanmoins, il ne peut pas interrompre
ce qui est en cours de réalisation pendant un Sprint. [w4]
•Scrum a pour objectif tout d'abord de produire un logiciel fonctionnel en mettant en avant la
rentabilité et surtout la satisfaction du client. Ce dernier doit pouvoir donc juger, sur le tas, de
l'avancement de son produit.
•Dans la méthodologie Scrum, l'équipe de développement s'organise elle-même pour déterminer
la meilleure façon de produire les exigences les plus prioritaires.
•Scrum est une approche basée sur le principe d’une équipe soudée où il y a plus de coopération
et de communication ; Des réunions se font tous les jours (Daily meeting) et chaque semaine
(Weekly meeting) pour encadrer les équipes et recaler les objectifs.
Chapitre 1 : Contexte Général
Page | 7
•Finalement, à chaque fin de sprint, tout le monde a un pouvoir de décision. L'équipe devra
décider de livrer le produit en l'état, ou de continuer à améliorer le produit sur une itération
supplémentaire. [w5]
Après avoir choisis la bonne méthodologie, qui est une étape importante durant le cycle de
développement d’un produit informatique, nous allons présenter le formalisme choisi pour la
conception du site web. [2]
IV. Conclusion
Au cours de ce chapitre, nous avons présenté l'organisme d'accueil ainsi qu'une description
abrégée de notre projet à réaliser, tout en spécifiant la problématique et en proposant la solution
envisagée pour affronter la situation actuelle. Nous avons aussi présenté le langage et la
méthodologie choisie pour suivre notre projet. Dans le chapitre suivant nous allons faire la
spécification et l'analyse des besoins ainsi que la définition de notre Backlog de produit et la
préparation du planning de travail.
Page | 8
Chapitre2: Spécification et analyse de besoins
Chapitre 2 : Spécifications et analyse de besoins
Page | 9
I. Introduction
Avant de démarrer un projet, il est nécessaire de le définir et de le planifier afin de bien le piloter
et d’atteindre les objectifs fixés.
Dans ce chapitre, nous allons aborder la première phase de la méthode SCRUM qui est
indispensable pour le reste du travail. Il sera donc question de définir et de spécifier les besoins
fonctionnels et non fonctionnels avant d’analyser et de concevoir les diagrammes de cas
d’utilisations ainsi que le prototypage des interfaces.
II. Les rôles Scrum
Dans Scrum l'équipe à un rôle important, elle est construite afin d'optimiser la productivité et la
flexibilité. Donc, pour la réalisation et le développement d'un produit une équipe doit être bien
qualifiée et compétente pour assurer le bon déroulement d'un projet. [2]
Figure 2 : Les rôles du Scrum
Scrum présente trois rôles principaux, expliqués dans ce tableau comme suit :
Chapitre 2 : Spécifications et analyse de besoins
Page | 10
Rôles Description Responsabilité
Product Owner
(Mohamed Bahri)
C'est une personne qui
représente les clients,
éclaircir leurs besoins,
détermine leurs priorités et
prend les décisions
nécessaires concernant
l'acheminement du projet.
• Doit porter la vision du produit
• Doit être disponible pour l'équipe
• Doit s'intéresser aux problèmes de
l'équipe
• Choisit la date et le contenu du
release
• Ajuster les fonctionnalités et les
priorités à chaque sprint si
nécessaire.
Scrum Master
(Amenallah Asli)
C'est une personne qui
s'assure de l'implication de
chaque membre de l'équipe
et de les aider à franchir les
obstacles rencontrés.
Autrement dit, c'est un coach
qui aide son équipe à
résoudre les problèmes.
• Protéger l'équipe des interférences
extérieures
• S'assure que toute l'équipe est
complètement fonctionnelle et
productive
• Programme des réunions et
propose des solutions
• Veille à l'amélioration de l'équipe
Développement Team
(-Oumaima Ouedherfi
-Fatma Ezzahra Ghribi)
Il n'y a pas de hiérarchie
entre les membres de
l'équipe, elle s'autogère.
l’équipe est composée de 2
à 9 personnes, constituée
d'une forte communication et
Coopération entre les
membres de l'équipe.
• Partager les responsabilités de
développement
• Les membres prennent les
décisions ensemble et s'adresse
directement au client.
Tableau 2 : Tableau Les rôles en Scrum
Dans ce contexte de ce travail, la répartition des rôles aux différents membres est représentée à
l'aide de ScrumWise comme suit :
Chapitre 2 : Spécifications et analyse de besoins
Page | 11
Figure 3 : La détermination des rôles Scrum
III. Spécification des besoins
Cette partie va servir à poser les bases du recueil des besoins du système à réaliser. Pour pouvoir
clarifier les besoins des utilisateurs, qui ne sont pas toujours des informaticiens et de bien
comprendre les fonctionnalités que le système doit fournir, nous allons déterminer les besoins
fonctionnels et les besoins non fonctionnels.
1. Identification des acteurs
Un acteur représente une abstraction d’un ensemble de rôles joués par des entités externes et
interagissant directement avec le système. Il représente une personne, un matériel ou un logiciel
qui interagit directement avec le système en question.
Ce tableau propose une description détaillée de tous les acteurs qui interagissent avec le site.
Chapitre 2 : Spécifications et analyse de besoins
Page | 12
Acteur Rôle
Administrateur Il est responsable de la gestion des offres et des profils des utilisateurs
que ce soit un prestataire de service ou bien un particulier.
Il assure aussi la maintenance de la plateforme.
Prestataire Celui qui peut publier des offres, Il possède un compte professionnel.
Client Celui qui peut consulter les offres disponibles, Il possède un compte
user.
Visiteur Il doit s'inscrire pour pouvoir accéder à l'application.
Tableau 3 : Les acteurs et leurs rôles
2. Identification des besoins fonctionnels
Les besoins fonctionnels sont les fonctionnalités qui doivent être offerts par le système et qui sont
indispensables pour les utilisateurs.
Les besoins fonctionnels nécessitent donc la mise en place d’un front office et d’un back office.
a) Le FrontOffice est la vitrine du site, c’est la partie du site internet qui est visible par les
internautes et avec laquelle il peut interagir.
Le FrontOffice propose des fonctionnalités diverses aux visiteurs.
- Les fonctionnalités destinées aux visiteurs :
S’inscrire : Les visiteurs doivent créer un compte afin de bénéficier des privilèges de
l’application, cette fonctionnalité donne accès aux visiteurs à deux choix soit s’inscrire en tant
que prestataire de service ou bien en tant que client deux formulaire d’inscription qu’ils devront
être remplis et validés, un email de validation de l’inscription sera envoyé par la suite à la
messagerie électronique.
- Les fonctionnalités destinées aux particuliers :
S’authentifier : L’authentification permet la saisie du login et du mot de passe afin de pouvoir
consulter les offres.
Chapitre 2 : Spécifications et analyse de besoins
Page | 13
Consulter les offres : Cette fonctionnalité permet aux particuliers de consulter les offres
proposées par l’application web ainsi que la description et les informations appropriées de ces
derniers.
Rechercher une offre : Cette fonctionnalité permet aux particuliers de faire une recherche rapide
et précise de l’offre désirée.
- Les fonctionnalités destinées aux prestataires des services :
S’authentifier : L’authentification permet la saisie du login et du mot de passe afin de pouvoir
ajouter une offre
Ajouter une offre : Cette fonctionnalité permet aux prestataires des services d’ajouter une offre.
Consulter les offres : Cette fonctionnalité permet aux prestataires des services de consulter les
offres proposées par l’application web ainsi que la description et les informations appropriées de
ces derniers.
Rechercher une offre : Cette fonctionnalité permet aux prestataires de faire une recherche
rapide et précise de l’offre désirée.
Gérer son profil : Chaque prestataire de service peut grâce à cette fonctionnalité modifier les
informations relatives aux champs du formulaire qu’il a précédemment rempli tel que l’adresse
électronique, son e-mail et son mot de passe.
b) Le BackOffice est la partie invisible au public, elle n’est donc accessible que par le/les
administrateur(s) du site qui permet de gérer le contenu et les fonctionnalités.
Gérer les catégories : Cette fonctionnalité permet de consulter, de modifier, d’ajouter ou de
supprimer un ou plusieurs catégories d’offres.
Gérer les offres : Cette fonctionnalité permet de consulter, de modifier, d’ajouter ou de
supprimer un ou plusieurs offres de plusieurs prestataires indépendants.
Gérer les comptes : Cette fonctionnalité permet de consulter, de modifier, d’ajouter ou de
supprimer un ou plusieurs profilent des prestataires du service ainsi que les particuliers.
3. Identification des besoins non fonctionnels :
La sécurité : l'application devra sécurisée car les informations ne devront pas être accessibles à
tout le monde.
Performance : l’application doit être performant répond à toutes les exigences d’une manière
optimale.
Chapitre 2 : Spécifications et analyse de besoins
Page | 14
La rapidité : la durée d'exécution des traitements s'approche le plus possible du temps réel.
L’ergonomie : l’application doit être facile à utiliser et garantir une meilleure expérience aux
utilisateurs.
IV. Modélisation et analyse des besoins
Dans cette partie, nous allons présenter le diagramme de cas d’utilisation global qui traduit d’une
façon semi-formelle les fonctionnalités du système.
Figure 4 : Diagramme de cas d’utilisation globale
V. Le Backlog du produit
Le Backlog Scrum est destiné à recueillir tous les besoins du client que l’équipe projet doit
réaliser. Il contient donc la liste des fonctionnalités intervenant dans la constitution d’un produit,
ainsi que tous les éléments nécessitant l’intervention de l’équipe projet. Tous les éléments inclus
dans le Backlog scrum sont classés par priorité indiquant l’ordre de leur réalisation.
Chapitre 2 : Spécifications et analyse de besoins
Page | 15
Les caractéristiques fonctionnelles sont appelées des histoires utilisateurs (user story). Chacune
de ces Stories doit avoir un but métier et, par la suite, représente un cas d’utilisation détaillé. Les
histoires utilisateur de ce projet seront traitées par les cas d’utilisation les plus prioritaires.[3]
Chaque histoire d’utilisateur contient une estimation qui est l’évaluation initiale de l’équipe sur
la quantité de travail nécessaire pour implémenter cette exigence. Ce Backlog servira à piloter
l’équipe de développement et pourra évoluer tout au long de notre projet. Pour estimer la
complexité de nos user story, nous avons utilisé :
 5 : Simple
 8 : Normal
 13 : Difficile
 21 : Très Difficile
Ce backlog compose de 7 éléments :
Feature : Ordonner les user stories selon un sujet qui leur englobe.
ID : l’identifiant du chaque user story.
User Story : c’est une demande de fonctionnelle écrite pour mettre en avant les besoins
d’utilisateur.
Priorité : c’est la priorité de l’user story selon la valeur métier et l’ordre de réalisation
Complexité : la complexité de la réalisation de chaque user story.
Les critères d’acceptation : Représentent un ensemble de conditions que la story doit satisfaire
pour être considérée comme complète.
Feature ID User Story Priorité Complexité Les critères
d’acceptation
Sprints
#AI20 En tant que
visiteur je
veux
s’inscrire en
tant que
client.
1 13 - Remplir les
champs du
formulaire :
Prénom *,
Adresse mail*,
Mot de passe*,
Confirmer mot
Chapitre 2 : Spécifications et analyse de besoins
Page | 16
Gestion
d’authentific
ation
et
d’inscription
de passe*.
-Cliquez sur
bouton créer un
compte.
-Cliquez sur
bouton
“demande un
service”
1
#AI30 En tant que
visiteur je
veux
s’inscrire en
tant que
prestataire.
2 21 - Remplir les
champs du
formulaire :
Prénom *,
Adresse mail*,
Mot de passe*,
Confirmer mot
de passe*.
-Cliquez sur
bouton créer un
compte.
-Cliquez sur
bouton ‘Devenir
prestataire”
- Remplir les
champs du
deuxième
formulaire :
Raison sociale *,
Domaine*,
Téléphone*,
Région*,
Statut*,
Numéro fiscal,
Tarif,
Chapitre 2 : Spécifications et analyse de besoins
Page | 17
Description.
-Cliquer sur le
bouton
‘Compléter
infos’
#AI40 En tant
qu’utilisateur
je veux
s'authentifier
2 5 -Insérer des
données valides.
-bouton
(connecter)
-Vérification de
l’association
Adresse mail
/mot de passe :
Chaque
association
Correspond à un
profil
(espace réservé)
dépendant
du rôle de
l’utilisateur.
OU
-bouton
(connecter avec
Google).
OU
-bouton
(connecter avec
Facebook).
#PS10 En tant que
prestataire de
service je
veux ajouter
3 8 -Être
Authentifié en
tant que
prestataire de
Chapitre 2 : Spécifications et analyse de besoins
Page | 18
Gestion
des offres
une offre. service
- Remplir le
champ du
formulaire de
l'ajout d’une
offre.
Titre*,
Région*,
Catégorie*,
Description,
- Clique sur le
bouton “ajouter”
2
#PS20 En tant que
prestataire je
veux
modifier mes
offres.
3 8 -Être
Authentifié
-Accéder à “mes
offres”
-Sélectionner
l’offre à
modifier.
-Modifier l’offre
sélectionnée
- Clique sur le
bouton
“Valider”
#PS30 En tant que
prestataire je
veux
supprimer
une de mes
offres.
4 8 -Être
Authentifié
-Accéder à
l’offre à
supprimer
-Supprimer
l’offre
sélectionnée
- Clique sur le
Chapitre 2 : Spécifications et analyse de besoins
Page | 19
bouton
“Valider”
#PU10 En tant que
prestataire je
veux
consulter
mes offres.
5 8 -Être
Authentifié
-Accéder à la
page “mes
offres”
-Voir tous mes
offres.
#PU20 En tant que
prestataire je
veux
consulter les
détails de
mon offre.
6 13 -Être
Authentifié
-Accéder à “mes
offres”
-Sélectionner
l’offre à
consulter
- Accéder au
détail.
#PU30 En tant que
client /
prestataire je
veux
consulter les
offres
publier.
7 8 -Être
Authentifié
-Accéder aux
catégories
-Sélectionner
une catégorie
-Voir les offres.
#PU40 En tant que
client /
prestataire je
veux
rechercher
une offre.
8 13 Être Authentifié
-Accéder aux
offres
-Rechercher une
offre dans la
zone de
Chapitre 2 : Spécifications et analyse de besoins
Page | 20
recherche ’
#PU50 En tant que
client /
prestataire je
veux
consulter les
détails d’une
offre.
9 13 -Être
Authentifié
-Accéder aux
offres
-Sélectionner
une offre
- Voir les détails
de l’offre
#PU60 En tant
qu’administr
ateur je veux
consulter les
offres.
10 13 -Être
Authentifié
-Accéder au
‘Option Admin’
- Accéder à la
liste des offres.
#AD4
0
En tant
qu’administr
ateur je veux
ajouter une
offre.
11 5 -Être
Authentifié en
tant
qu’Administrate
ur
- Remplir les
champs du
formulaire.
Titre*,
Région*,
Catégorie*,
Description,
- Clique sur le
bouton “ajouter”
#AD5
0
En tant
qu’administr
12 5 --Être
Authentifié en
Chapitre 2 : Spécifications et analyse de besoins
Page | 21
ateur je veux
modifier une
offre.
tant
qu’Administrate
ur
- Accéder à une
offre
-Modifié l’offre
#AD6
0
En tant
qu’administr
ateur je veux
supprimer
une offre.
13 5 --Être
Authentifié en
tant
qu’Administrate
ur
- Accéder à
l’offre
-Supprimer
l’offre
Gestion
des comptes
#AD1
0
En tant que
client /
Prestataire
je veux
consulter
mon profil
14 8 -Être
Authentifié
-Accéder à
‘Mon profil’
3
#AD2
0
En tant que
client je veux
consulter
profil d’un
prestataire
15 13 -Être
Authentifié
-sélectionner
une offre
-Voir le profil
de prestataire
#AD3
0
En tant que
client je veux
des
informations
16 8 -Être
Authentifié en
tant que
prestataire
-Accéder à la
Chapitre 2 : Spécifications et analyse de besoins
Page | 22
‘Chatbot’
#AD4
0
En tant
qu’administr
ateur je veux
consulter la
liste des
comptes
17 8 -Être
Authentifié
-Accéder au
‘Option Admin’
- Accéder à la
liste des
utilisateurs
En tant que
client je veux
devenir un
prestataire
18 -Être
Authentifié
-Accéder au
‘Mon pr’
- cliquer sur
« Devenir
prestataire »
#AD6
0
En tant
qu’administr
ateur je veux
supprimer un
compte
utilisateur.
19 8 -Être
Authentifié
-Accéder au
‘Option Admin’
- Accéder à la
liste des
utilisateurs
- Accéder au
profil à
supprimer
-Supprimer le
profil
#AD7
0
En tant
qu’administr
ateur je veux
modifier un
compte
20 8 -Être
Authentifié
-Accéder au
‘Option Admin’
- Accéder à la
Chapitre 2 : Spécifications et analyse de besoins
Page | 23
utilisateur. liste des
utilisateurs
- Accéder au
profil à modifier
-Modifier le
profil
Tableau 4 : Le Backlog du produit
VI. Le planning des sprints
La réunion de planification des sprints est la partie la plus importante dans Scrum afin de
préparer le planning de travail et d’identifier le backlog des sprints. Il s'agit de choisir la durée
des sprints qui diffère selon la complexité du projet et le nombre de l'équipe. Ce projet sera divisé
sur 3 sprints dont les durées en jours se diffèrent d’un sprint à un autre suivant la quantité de
travail.
La figure suivante résume notre planning de travail
Sprint 1 Du 01/03/2019 au 22/03/2019
Sprint 2 Du 22/03/2019 au 17/04/2019
Sprint 3 Du 18/04/2019 au 03/05/2019
Tableau 5 : Tableau de planning de travail
VII. Prototypages des interfaces
Il s’agit de construire des prototypes d’apparence générale des interfaces utilisateurs. En effet, les
interfaces graphiques font que l’utilisateur final soit plus interactif, précis et le poussent à mieux
s’exprimer quant à ses attentes.
Chapitre 2 : Spécifications et analyse de besoins
Page | 24
Les interfaces utilisateurs relatives à l’inscription, l’authentification, page d'accueil, page des
offres et leurs détails ainsi que la page profile s’illustrent comme suit :
Figure 5 : Prototype de l’interface « inscription »
Figure 6 : Prototype de l’interface « authentification »
Chapitre 2 : Spécifications et analyse de besoins
Page | 25
Figure 7 : Prototype de l’interface « page d'accueil »
Figure 8 : Prototype de l’interface « page offres liste »
Chapitre 2 : Spécifications et analyse de besoins
Page | 26
Figure 9 : Prototype de l’interface « page offre cards »
Figure 10 : Prototype de l’interface « page détails »
Chapitre 2 : Spécifications et analyse de besoins
Page | 27
Figure 11 : Prototype de l’interface « profil d’un particulier »
VIII. Conclusion
A la fin de ce chapitre, le plan de release à suivre a été préparé à partir du Backlog de sprint déjà
défini. La définition du Backlog de produit a permis d’avoir une vision plus précise sur le sujet et
une compréhension plus profonde des tâches à réaliser. L’énuméré des besoins fonctionnels et
non fonctionnels du système ainsi que les acteurs et leurs rôles étaient à la base de l’élaboration
de cette partie.
Le prochain chapitre, sera consacré pour la phase de la réalisation de la solution.
Page | 28
Chapitre3 : Conception et réalisation
Chapitre 3 : Conception et réalisation
Page | 29
I. Introduction
Nous présentons dans ce chapitre la partie conception du projet. Nous commençons par
présenter l’environnement matériel et logiciel dans lesquels l’application a été développée.
Ensuite une description générale de notre application. Enfin nous mettons en évidence le côté
conceptuel de notre application qui constitue une étape fondamentale qui précède
l’implémentation, permet de détailler les différents diagrammes et scénarios à implémenter
dans la phase suivante. Les exigences techniques
II. Les Exigences techniques
L’environnement de travail représente l’ensemble d’outils matériels et logiciels ainsi que les
langages de programmation utilisés pour l'exécution d’une solution informatique.
1. Environnement matériel
Ce projet a été réalisé sur deux ordinateurs ayant les caractéristiques suivantes :
• Ordinateur : Asus
• Processeur : Intel Core i3
• Mémoire vive : 8Go
• Disque dur : 1To
• Système d’exploitation : Microsoft
Windows 10
• Ordinateur : Asus
• Processeur : Intel Core i7
• Mémoire vive : 8Go
• Disque dur : 1To
• Système d’exploitation : Microsoft
Windows 10
Tableau 6 : Tableau d’environnement matériel
2. Environnement logiciel et langages utilisés
Le tableau ci-dessus représente l’ensemble des différents logiciels que nous avons combinés
pour enfin avoir un résultat du travail :
Chapitre 3 : Conception et réalisation
Page | 30
Pour le développement d’Application
Angular
Avec cette technologie nous avons réalisé les interfaces pour
pouvoir profiter du directif building qui améliorent le travail en
équipe et les développements effectués en parallèle.
Nous avons choisi firebase comme base de données parce qu'il
offre des fonctionnalités telles que le Storage, la sécurité des
données, la messagerie et le hosting qui permet de faciliter le
travail du développement.
Pour le design de l'application on a choisi Matériel Design.
C’est un nouveau langage visuel et interactif de webdesign
centré sur l’expérience de l'utilisateur.
Adobe Photoshop il nous a aidés à traiter les images “web”
Nous avons choisi Visual studio comme outil de développement
parce qu'il nous permet de créer un environnement sur-mesure,
c'est aussi techniquement abouti et très flexible.
Côté fonctionnalités, VS Code se révèle bien pratique sur l'auto-
complétion du code puissant.
Dans un premier lieu, nous avons décidé de travailler avec des
Template Porto qui utilisent les langages HTML CSS3 et
bootstrap.
Afin de pouvoir afficher des images de hautes qualité et
d'utiliser des animations CSS3
Chapitre 3 : Conception et réalisation
Page | 31
En second temps, nous avons travaillé avec la template Fuse
pour les raisons qu’il est un excellent outil et une excellente
source d’apprentissage pour Angular. Mais il nécessite
également au moins un niveau minimum de connaissances en
Angular pouvoir repérer dans le code source.
Conception
Pour la conception UML s'était l’outil, Parce qu'il permet
d’obtenir une modélisation de très haut niveau et de Faire
collaborer des participants de tous horizons autour d'un même
document de synthèse.
Team work
les raisons d'utiliser SourceTree pour Git s'était:
Il permet de changer de copie de travail en un seul clic.
Il indique également dans quelle mesure vous êtes en avance
ou en retard par rapport à la version du référentiel et vous alerte
de pousser ou de tirer.
Donne une vue 'en temps réel' de vos fichiers locaux.
Chaque modification de validation et de fichier est affichée et
accessible.
fournissant un outil très puissant pour le contrôle de version.
TeamViewer est une solution rapide et sécurisée pour accéder à
distance aux ordinateurs.
Nous avons utilisé donc TeamViewer pour pouvoir accéder à
l’ordinateur du binôme en cas de bug.
Mail professionnelle sous la forme
« unnom@cosaVostra »
utiliser afin d'échanger des informations (Daily meeting, time,
membres), des documents.
Chapitre 3 : Conception et réalisation
Page | 32
Slack
Discussions sur le projet regroupe toute l'équipe de la société
«CosaVostra» et toutes les informations utiles pour pouvoir
collaborer en ligne.
ChatBot
DialogFlow c’est une interface API qui permet d’utiliser
l’intelligence de Google, Dans le cadre de créer un ChatBots
conversationnels pour mieux communiquer avec les utilisateurs
de l’application.
Maquettes
le choix de travailler des maquettes avec balsamique pour la
seule raison qu'on peut facilement créer une panoplie de dessins
d’application (wireframe) en glissant et déposant des éléments
dans l’interface.
Scrum Tools
on a pensé à Scrumwise comme solution de gestion de projet en
ligne utilisé pour la gestion de projet en type Agile.
Tableau 7 : Environnement logiciel et langage utilisés
Pourquoi Angular?
Chapitre 3 : Conception et réalisation
Page | 33
Angular est l’un des Framework les mieux réputés et les plus utilisés par les développeurs de
front-end. Il fournit donc nativement tout le nécessaire pour produire une application entière
avec une configuration standard :
Configuration de build et d'optimisation complète.
 Module d'animations.
 Module de "routing".
 Module de formulaires.
Les modules d’Angular permettent d'ajouter des fonctionnalités «bootstrap/Material Design»
aux Framework de base afin de pouvoir l’enrichir. De plus Angular offre de nombreuses
solutions et conceptions prêtes à l’emploi, Et il offre une documentation qui permet de trouver
toutes les informations nécessaires rapidement.
III. Réalisation des sprints
1. Étude et réalisation du sprint 0
A. Installation et configuration de l’environnement de travail
L'environnement de travail désigne l’ensemble des logiciels sur lesquels sont exécutés les
programmes de l'application web, Pour cela on a préparé :
 Ide : Visual studio code https://code.visualstudio.com/
 logiciel : Node js https://nodejs.org/en/download/ et Git https://git-scm.com/
Parce-que Angular nécessite un environnement de développement inclut Node.js et un
système de contrôle de version.
 Framework : Angular 7 https://angular.io/guide/quickstart/
 Logiciel : Sourcetree (git) https://www.sourcetreeapp.com/
 Base de données : Firebase https://firebase.google.com/docs/hosting/deploying
B. Formation et développement des sites web
Chapitre 3 : Conception et réalisation
Page | 34
Une formation HTML CSS Angular était prise en charge par la société, Dans le cadre de notre
formation et pour pratiquer les connaissances acquises auprès des tutoriels de la formation on
a créé deux sites web développé en HTML CSS et Bootstrap en utilisant des Template Porto,
Bootstrap est un Framework destiné à faciliter la création d’applications Web on peut
l’intégrer avec HTML et avec Angular.
Site TK-1 qui est la première ligue de kickboxing Tunisienne, Il est en ligne.
Figure 12 : Interface Site Web « tk1 »
Le deuxième site pour le Bijoutier ben Youssef.
Figure 13 : Interface site web « Ben Youssef »
C. Réalisation
Chapitre 3 : Conception et réalisation
Page | 35
Après une certaine maitrise de ces langages en a développé une Landing Page pour notre
application «Oui Mr» elle se distingue des autres pages du site par le fait qu'elle est censée de
représenter aux visiteurs, le site sur lequel il se trouve de manière claire et forte.
Afin de montrer les résultats de ce sprint, nous allons présenter quelques captures d'écran :
Figure 14 : Interface Landing Page « Accueil »
Figure 15 : Interface Landing Page « A propos »
Chapitre 3 : Conception et réalisation
Page | 36
Figure 16 : Interface Landing Page « Service »
Figure 17: Interface Landing Page « Employee of the month »
2. Étude et réalisation du sprint 1
L'équipe Scrum doit tout d'abord définir le but de ce sprint avant de s'y lancer. Le but doit être
définie en terme métier et non pas en terme technique pour qu'il soit compréhensible par les
membres en dehors de l'équipe.
Ce sprint a pour but de développer la première partie de notre projet qui est la gestion
d’authentification et inscription.
Chapitre 3 : Conception et réalisation
Page | 37
Le tableau suivant résume le Backlog du sprint 1 :
Tableau 8: Backlog sprint 1
Cette partie comporte la conception du sprint 1 qui définit les composants sous forme de
diagramme de cas d’utilisation et diagramme de séquence système détaillé.
A. Diagramme des cas d'utilisation
La figure ci-dessus nous présente le diagramme des cas d'utilisations globaux pour ce premier
sprint.
Figure 18 : Diagramme de cas d’utilisation de sprint 1
Chapitre 3 : Conception et réalisation
Page | 38
B. Analyse et raffinement de cas d’utilisation
Le raffinement de cas d’utilisation consiste à recenser toutes les interactions entre le système
et les acteurs de façon textuelle. Le cas d’utilisation doit avoir un début et une fin clairement
identifiés. Il doit préciser quand ont lieu les interactions entre acteurs et système, et quels sont
les messages échangés. Il faut également préciser les variantes possibles sous forme de cas
nominaux, les cas alternatifs, les cas d’erreurs, tout en essayant d’ordonner séquentiellement
les descriptions, afin d’améliorer leur lisibilité. Chaque unité de description de séquences
d’actions est appelée enchaînement. Un scénario représente une succession particulière
d’enchaînements, qui s’exécute du début à la fin du cas d’utilisation.
Dans cette partie nous avons raffiné les cas d’utilisations de sprint 1.
a. Raffinement de cas d’utilisation « s’inscrire »
Figure 19 : Raffinement de cas d’utilisation “s’inscrire”
 Description textuelle du cas d'utilisation « s’inscrire »
Titre : S’inscrire
Acteur : Visiteur
Pré-condition : Accéder à la page inscription.
Post-condition : Visiteur inscrit
Scénario Nominal (1) : inscription de simple utilisateur : Ce cas d’utilisation commence
lorsque le visiteur demande au système de s’inscrire en tant que simple utilisateur.
1) L’utilisateur remplit le formulaire d’inscription.
2) L’utilisateur clique sur le bouton S’inscrire.
3) Le système envoie les données à la base de données.
4) le système affiche un mail de confirmation de l'inscription.
Scénario Nominal (2) : inscription de prestataire de service : Ce cas d’utilisation
commence lorsque l’utilisateur demande au système de s’inscrire en tant que prestataire de
service, ce scénario ressemble au scénario (1) sauf que le formulaire est différent.
Chapitre 3 : Conception et réalisation
Page | 39
Scénario alternatif :
1 : l’email saisi est déjà utilisé.
2 : Les données obligatoires ne sont pas saisies.
3 : le format de l’email est incorrect.
Le système affiche un message d’erreur.
Tableau 9 : Description textuelle de cas d'utilisation « s’inscrire »
b. Raffinement de cas d’utilisation « S’authentifier »
Figure 20 : Raffinement de cas d’utilisation “s’authentifier”
 Description textuelle de cas d'utilisation « s’authentifier »
Titre : S’authentifier
Acteur : Prestataire
Pré-condition : Accéder à la page d’authentification
Post-condition : Prestataire s’authentifier
Scénario Nominal (1) : s’authentifier avec mail : Ce cas d’utilisation commence
lorsque le prestataire demande au système de s’authentifier avec mail.
1) L’utilisateur saisit son mail et son mot de passe.
2) L’utilisateur clique sur le bouton login.
3) Le système vérifier les données à la base de données.
4) le système ouvre la page d’accueil.
Scénario Nominal (2) : s’authentifier avec Facebook : Ce cas d’utilisation commence
lorsque l’utilisateur demande au système de s’authentifier avec Facebook.
Chapitre 3 : Conception et réalisation
Page | 40
1) L’utilisateur clique sur le bouton “Se connecter avec Google”.
2) Le système vérifier les données à la base de données.
3) le système ouvre la page d’accueil.
Scénario Nominal (3) : s’authentifier avec Gmail : Ce cas d’utilisation commence
Lorsque l’utilisateur demande au système de s’authentifier avec Gmail ; ce scénario
ressemble au scénario(2) sauf que le bouton change.
Scénario alternatif :
1 : l’email saisi est incorrect.
2 : le mot de passe saisi est incorrect.
3 : le format de l’email est incorrect.
Le système affiche un message d’erreur.
Tableau 10 : Description textuelle de cas d'utilisation « s’authentifier»
C. Conception
Au niveau de la conception. Diagramme de séquence assure une représentation des
collaborations entre des objets pour la réalisation d’un cas d’utilisation, selon un point de vue
temporel et une représentation de la chronologie des envois de messages entre les objets.
a. “S’inscrire”
 Diagramme de séquence « s’inscrire »
Chapitre 3 : Conception et réalisation
Page | 41
Figure 21 : Diagramme de séquence « s’inscrire »
b. “Authentification”
 Diagramme de séquence « s’authentifier »
Chapitre 3 : Conception et réalisation
Page | 42
Figure 22 : Diagramme de séquence« s’authentifier »
D. Réalisation
Afin de montrer les résultats de ce sprint, nous allons présenter quelques captures d'écran. La
figure ci-dessous représente la page d’inscription.
Chapitre 3 : Conception et réalisation
Page | 43
Figure 23 : Interface « Inscription »
L’interface suivant permet à l’utilisateur d’accéder au système après une validation de son
mail et son mot de passe.
Figure 24 : Interface « Authentification »
Chapitre 3 : Conception et réalisation
Page | 44
E. Burndown
Burndown chart est un graphe, mis à jour à la fin de chaque sprint, montrant la tendance de
l’avancement dans la réalisation des éléments du backlog. [1]
Figure 25 : Burndown du sprint 1
F. Rétrospective
Au cours de la réalisation de ce sprint ce qui bien marché s’authentifier et inscription, aussi
nous avons rencontré quelques problèmes, à savoir :
-l’inscription pour le prestataire.
3. Etude et la réalisation du sprint 2
Ce sprint a pour but de développer la deuxième partie de notre projet qui est la gestion des
offres.
Le tableau suivant résume le backlog du sprint 2 :
Chapitre 3 : Conception et réalisation
Page | 45
Tableau 11 : Backlog sprint 2
La partie suivante comporte Dans notre cas, la spécification fonctionnelle s'introduit par le
diagramme de cas d'utilisation d'UML, la description textuelle et les diagrammes de séquences
de ces derniers.
A. Diagramme des cas d'utilisation
La figure ci-dessus nous présente le diagramme de cas d'utilisations de sprint 2:
Figure 26 : Diagramme de cas d’utilisation de sprint 2
Chapitre 3 : Conception et réalisation
Page | 46
B. Analyse et raffinement de cas d’utilisation
a. Raffinement de cas d’utilisation « Consulter les offres »
Figure 27 : Raffinement de diagramme de cas d’utilisation “consulter offre”
 Description textuelle de cas d'utilisation « Consulter les offres »
Titre : Consulter les offres
Acteur : Client
Pré-Condition : Être authentifié
Post-Condition : Choisir Catégorie, Recherche une offre, Consulter détail des offres
Scénario Nominal (1) : Consulter les offres : Ce cas d’utilisation commence lorsque
le client demande à la plateforme de consulter les offres.
1) Le client accède à la page d’accueil du site.
2) Le client clique sur la page offres.
Tableau 12 : Description textuelle de cas d'utilisation « Consulter les offres »
 Description textuelle de sous cas d'utilisation « Consulter détail d’une offre»
Titre : Consulter détail d’une offre
Acteur : Client
Pré-Condition : Consulter les offres
Post-Condition : Consulter détail d’offre
Scénario Nominal (1) : Consulter détail une offre : Ce cas d’utilisation commence
Chapitre 3 : Conception et réalisation
Page | 47
lorsque
le client demande à la plateforme de consulter une offre.
1) Le client accède à la page d’accueil du site.
2) Le client se redirige vers la page des catégories.
3) Le client choisit catégorie à consulter ces offres.
4) Le client clique sur une offre.
5) Page de détail s’ouvre.
Tableau 13 : Description textuelle de sous cas d'utilisation «Consulter détails des offre»
 Description textuelle de sous cas d'utilisation « Recherche une offre»
Titre : Recherche une offre
Acteur : Client
Pré-Condition: Consulter les offres
Post-Condition: Recherche une offre
Scénario Nominal (1) : Recherche une offre : Ce cas d’utilisation commence lorsque
le client demande à la plateforme de recherche une offre.
1) Le client accède à la page d’accueil.
2) Le client se redirige vers la page des catégories.
3) Le client choisit catégorie à consulter ces offres.
4) Le client écrit dans la zone de recherche.
5) résultat de recherche affiche.
Scénario alternatif :
1 : aucune offre trouvée :
Le système n’affiche aucun résultat.
Tableau 14 : Description textuelle de sous cas d'utilisation «Rechercher une offre »
 Description textuelle de sous cas d'utilisation « Choisir catégorie»
Titre : Choisir catégorie
Acteur : Client
Pré-Condition : Consulter les offres
Chapitre 3 : Conception et réalisation
Page | 48
Post-Condition : Choix d’une catégorie
Scénario Nominal (1) : Choisir catégorie : Ce cas d’utilisation commence lorsque
le client demande à la plateforme de choisir catégorie.
1) Le client accède à la page d’accueil.
2) Le client se redirige vers la page des catégories.
3) Le client choisit catégorie à consulter.
Tableau 15 : Description textuelle de sous cas d'utilisation « Choisir catégorie »
b. Raffinement de cas d’utilisation « Gérer ses offres »
Figure 28 : Raffinement diagramme de cas d’utilisation “Gérer ses offres”
 Description textuelle de sous cas d'utilisation « Gérer ses offres »
Titre : Gérer ses offres
Acteur : Prestataire
Pré-Condition : Être authentifié
Post-Condition : Gérer ses offres
Scénario Nominal (1) : Gérer ses offres : Ce cas d’utilisation commence lorsque le
prestataire demande à la plateforme de Gérer ses offres.
1) Le prestataire accède à la page d’accueil.
2) Le prestataire se redirige vers la page « mes offres ».
Chapitre 3 : Conception et réalisation
Page | 49
Tableau 16 : Description textuelle de cas d'utilisation « Gérer ses offres »
 Description textuelle de sous cas d'utilisation « Ajouter une offre »
Titre : Ajouter une offre
Acteur : Prestataire
Pré-Condition : Consulter ses offres
Post-Condition : Offre Ajoutée
Scénario Nominal (1) : Ajouter offre : Ce cas d’utilisation commence lorsque
le prestataire demande à la plateforme d’ajouter une offre.
1) Le prestataire accède à la page d’accueil du site.
2) Le prestataire clique sur le lien ajouter une offre.
3) Le prestataire remplit le formulaire d’ajout.
4) Le prestataire cliquez sur le bouton ajouter.
Tableau 17 : Description textuelle de sous cas d'utilisation « Ajouter une offre »
 Description textuelle de sous cas d'utilisation « Consulter ses offres »
Titre : Consulter ses offres
Acteur : Prestataire
Pré-Condition : Gérer ses offres
Post-Condition : Consulter ses offres
Scénario Nominal (1) : Consulter ses offres : Ce cas d’utilisation commence lorsque le
prestataire demande à la plateforme de consulter ses offres.
1) Le prestataire accède à la page d’accueil.
2) Le prestataire se redirige vers la page « mes offres ».
3) Le prestataire consulte sa liste des offres.
Tableau 18 : Description textuelle de sous cas d'utilisation « Consulter ses offres »
Chapitre 3 : Conception et réalisation
Page | 50
 Description textuelle de sous cas d'utilisation « Modifier une offre»
Titre : Modifier une offre
Acteur : Prestataire
Pré-Condition : Consulter ses offres
Post-Condition : Offre modifiée
Scénario Nominal (1) : Modifier offre : Ce cas d’utilisation commence lorsque
le prestataire demande à la plateforme de modifier une offre.
1) Le prestataire accède à la page d’accueil du site.
2) Le prestataire se redirige vers la page mes offres.
3) Le prestataire choisit l’offre à modifier.
4) Le prestataire valide la modification de l’offre.
Tableau 19 : Description textuelle de sous cas d'utilisation « Modifier une offre »
 Description textuelle de sous cas d'utilisation « Supprimer une offre »
Titre : Supprimer une offre
Acteur : Prestataire
Pré-Condition : Consulter ses offres
Post-Condition : offre supprimée
Scénario Nominal (1) : Supprimer offre : Ce cas d’utilisation commence lorsque
le prestataire demande à la plateforme de supprimer une offre.
1) Le prestataire accède à la page d’accueil du site.
2) Le prestataire se redirige vers la page mes offres.
3) Le prestataire choisit l’offre à supprimer.
4) Le prestataire cliquez sur le bouton Supprimer.
Tableau 20 : Description textuelle de sous cas d'utilisation « Supprimer une offre »
Chapitre 3 : Conception et réalisation
Page | 51
C. Conception
a. “Consulter ses offres”
 Diagramme de séquence « Ajouter une offre »
Figure 29 : Diagramme de séquence « Consulter les offres »
b. “Consulter détail d'une offre ”
 Diagramme de séquence système «Consulter détail d’une offre»
Figure 30 : Diagramme de séquence « Consulter détails d'une offre »
Chapitre 3 : Conception et réalisation
Page | 52
c. “Rechercher une offre”
 Diagramme de séquence « Rechercher une offre »
Figure 31 : Diagramme de séquence « Rechercher une offre »
d. “Choisir Catégorie ”
 Diagramme de séquence « Choisir catégorie »
Figure 32 : Diagramme de séquence « Choisir catégorie »
Chapitre 3 : Conception et réalisation
Page | 53
e. “Consulter ses offres”
 Diagramme de séquence « Consulter ses offres »
Figure 33 : Diagramme de séquence « Consulter ses offres »
f. “Ajouter une offre”
 Diagramme de séquence « Ajouter une offre »
Figure 34 : Diagramme de séquence « Ajouter une offre »
Chapitre 3 : Conception et réalisation
Page | 54
g. “Supprimer une offre”
 Diagramme de séquence « Supprimer une offre »
Figure 35 : Diagramme de séquence « Supprimer une offre »
h. “Modifier une offre ”
 Diagramme de séquence « Modifier une offre »
Chapitre 3 : Conception et réalisation
Page | 55
Figure 36 : Diagramme de séquence « Modifier une offre »
D. Réalisation
Afin de montrer les résultats de ce sprint, nous allons présenter quelques captures d'écran.
La figure ci-dessous représente la page d’ajout.
Figure 37 : Interface « Ajouter une offre »
La figure ci-dessous représente la page de modifier en affichant l’interface de modifier et le
bouton de suppression.
Chapitre 3 : Conception et réalisation
Page | 56
Figure 38 : Interface « Modifier une offre »
La figure ci-dessous permet d'afficher les détails d’une offre:
Figure 39 : Interface « Détails d’une offre »
La figure représente la page des offres d’un prestataire, Ici le prestataire peut supprimer et
modifier ces offres :
Figure 40 : Interface « Liste de mes offres »
Chapitre 3 : Conception et réalisation
Page | 57
La figure représente la page des offres de tous les prestataires :
Figure 41 : Interface « liste des offres »
E. Burndown
Figure 42 : Burndown du sprint 2
Chapitre 3 : Conception et réalisation
Page | 58
F. Rétrospective
Au cours de la réalisation de ce sprint ce qui bien marché l’ajout, suppression et la
modification, aussi nous avons rencontré quelques problèmes, à savoir :
-la recherche qui en peut l’améliore pour être plus précise
4. Étude et réalisation du sprint 3
Nous allons entamer le dernier Sprint. Pour cela, Nous commençons par présenter le Backlog
du ce sprint, ensuite nous passons à la conception et nous clôturons par la partie la réalisation.
Le tableau suivant résume le backlog du sprint 3 :
Tableau 21: Backlog sprint 3
Cette partie comporte la conception du sprint 3 qui définit les composants sous forme de
diagramme de cas d’utilisation et diagramme de séquence système détaillé.
A. Diagramme des cas d'utilisation
La figure ci-dessus nous présente le diagramme de cas d'utilisations de sprint 3 :
Chapitre 3 : Conception et réalisation
Page | 59
Figure 43 : Diagramme de cas d’utilisation de sprint 3
B. Analyse et raffinement de cas d’utilisation
a. Raffinement de cas d’utilisation « Assistance Artificielle »
 Description textuelle de sous cas d'utilisation « Assistance Artificielle »
Titre : Assistance Artificielle
Acteur : Client
Pré-Condition : Être authentifié
Post-Condition : Avoir une information
Scénario Nominal (1) : Recherche une offre : Ce cas d’utilisation commence lorsque
le client demande à la plateforme d’avoir une information.
1) Le client accède à la page d’accueil.
2) Le client clique sur icone “chatbot”.
3) Le client tape sa question dans la zone “écrire un message”.
Tableau 22 : Description textuelle de sous cas d'utilisation « Assistance Artificielle»
Chapitre 3 : Conception et réalisation
Page | 60
b. Raffinement de cas d’utilisation « Consulter profil prestataire »
 Description textuelle de sous cas d'utilisation « Consulter profil prestataire »
Titre : Consulter profil d’un prestataire
Acteur : Client
Pré-Condition: Être authentifié
Post-Condition: Consulter profil d’un prestataire
Scénario Nominal (1): Recherche une offre : Ce cas d’utilisation commence lorsque
le client demande à la plateforme de consulter profil d’un prestataire.
1) Le client accède à la page d’accueil.
2) Le client se redirige vers la page des catégories.
3) Le client choisit catégorie à consulter ces offres.
4) Le client choisit l’offre à consulter.
5) le client clique sur onglet “Profil de prestataire”.
Tableau 23 : Description textuelle de sous cas d'utilisation « Consulter profil d’un
prestataire »
c. Raffinement de cas d’utilisation « Devenir prestataire »
Figure 44 : Raffinement de diagramme de cas d’utilisation “Devenir prestataire”
 Description textuelle de sous cas d'utilisation « Devenir prestataire »
Titre : Devenir Prestataire
Acteur : Client
Pré-Condition: Être authentifié
Post-Condition: passée au profil prestataire
Scénario Nominal (1) : Consulter mon profil : Ce cas d’utilisation commence lorsque
Chapitre 3 : Conception et réalisation
Page | 61
Le client demande à la plateforme de devenir prestataire
1) Le client accède à la page d’accueil du site.
2) Le client se redirige vers la page ‘mon profil’.
3) Le client clique sur le bouton “devenir prestataire”
4) Le client remplie le formulaire de prestataire.
Tableau24: Description textuelle de sous cas d'utilisation « Devenir Prestataire »
d. Raffinement de cas d’utilisation « Consulter son profil »
 Description textuelle de sous cas d'utilisation « Consulter son profil »
Titre : Consulter son profil
Acteur : Prestataire ou client
Pré-Condition: Être authentifié
Post-Condition: profil consultée
Scénario Nominal (1) : Consulter mon profil : Ce cas d’utilisation commence lorsque
le prestataire ou client demande à la plateforme de consulter son profil.
1) Le Prestataire ou client accède à la page d’accueil du site.
2) Le prestataire ou client se redirige vers la page ‘mon profil’.
3) Page de profil s’ouvre.
Tableau 25 : Description textuelle du cas d'utilisation « Consulter son profil »
e. Raffinement de cas d’utilisation « Consulter liste des Comptes »
Figure 45 : Raffinement de diagramme de cas d’utilisation “Consulter liste des comptes”
Chapitre 3 : Conception et réalisation
Page | 62
 Description textuelle de cas d'utilisation « Consulter liste des Comptes »
Titre : Consulter liste des comptes
Acteur : Administrateur
Pré-Condition : Être authentifié
Post-Condition : Consulter liste des comptes
Scénario Nominal (1) : Consulter liste des comptes : Ce cas d’utilisation commence
lorsque l’administrateur demande à la plateforme de consulter liste des comptes.
1) L’administrateur accède à la page d’accueil.
2) Le client se redirige vers la page “Option Admin”.
3) Le client choisit “la liste des comptes”
Tableau 26 : Description textuelle de cas d'utilisation « Consulter liste des Comptes »
 Description textuelle de sous cas d'utilisation « Modifier un compte »
Titre : Modifier un compte
Acteur : Administrateur
Pré-Condition : Consulter liste des comptes
Post-Condition: Compte modifiée
Scénario Nominal (1) : Modifier compte : Ce cas d’utilisation commence lorsque
le prestataire demande à la plateforme de modifier un compte.
1) L’administrateur accède à la page d’accueil du site.
2) L’administrateur se redirige vers la page option admin.
3) L’administrateur choisit la liste des comptes.
4) L’administrateur choisit le compte à modifier.
5) L’administrateur valide la modification du compte.
Tableau 27 : Description textuelle de sous cas d'utilisation « Modifier un compte »
Chapitre 3 : Conception et réalisation
Page | 63
 Description textuelle de cas d'utilisation « Supprimer un compte »
Titre : Supprimer un compte
Acteur : Administrateur
Pré-Condition : Consulter liste des comptes
Post-Condition : Compte supprimée
Scénario Nominal (1) : Supprimer compte : Ce cas d’utilisation commence lorsque
le prestataire demande à la plateforme de supprimer un compte.
1) L’administrateur accède à la page d’accueil du site.
2) L’administrateur se redirige vers la page option admin.
3) L’administrateur choisit la liste des comptes.
4) L’administrateur choisit le compte à supprimer.
5) L’administrateur valide la suppression du compte.
Tableau 28 : Description textuelle de sous cas d'utilisation « Supprimer un compte »
C. Conception
a. Assistance Artificielle
 Diagramme de séquence « Assistance Artificielle »
Figure 46 : Diagramme de séquence « Consulter mon profil »
Chapitre 3 : Conception et réalisation
Page | 64
b. Consulter profil prestataire
 Diagramme de séquence « Consulter mon profil »
Figure 47 : Diagramme de séquence « Consulter mon profil »
c. “Devenir prestataire”
 Diagramme de séquence système « Devenir prestataire »
Figure 48 : Diagramme de séquence « Devenir Prestataire »
Chapitre 3 : Conception et réalisation
Page | 65
d. “Consulter liste des comptes”
 Diagramme de séquence « Consulter liste des comptes »
Figure 49 : Diagramme de séquence « Consulter liste des comptes »
e. “Modifier un compte”
 Diagramme de séquence « Modifier un compte »
Figure 50 : Diagramme de séquence « Modifier un compte »
Chapitre 3 : Conception et réalisation
Page | 66
D. Réalisation
Afin de montrer les résultats de ce sprint, nous allons présenter quelques captures d'écran.
La figure ci-dessous représente la page Consulter mon profil.
Figure 51 : Interface « Mon Profil»
La figure représente la page de consulter la liste des comptes, aussi des boutons pour
supprimer et modifier les comptes, disponible pour les administrateurs uniquement :
Figure 52 : Interface « liste des comptes »
Chapitre 3 : Conception et réalisation
Page | 67
La figure ci-dessous permet d'afficher le profil du prestataire de service, la personne qui a
ajouté l'offre :
Figure 53: Interface « Profil d’un prestataire »
E. Burndown
Figure 54 : Burndown du sprint 3
Chapitre 3 : Conception et réalisation
Page | 68
F. Rétrospective
Au cours de la réalisation de ce sprint ce qui bien marché consulter son profil et la liste de son
profil, aussi nous avons rencontré quelques problèmes, à savoir :
-devenir un prestataire et comment on passe de profil prestataire au profil client
IV. Diagramme de classe général
Pour le stockage de données nous avons utilisé la nouvelle génération de bases de données qui
ne suivent pas le modèle relationnel des bases de données classiques firebase, C’est une base
de données No SQL construite pour les applications en général.
Une base de données entièrement gérée et native au cloud qui facilite le stockage, la
synchronisation et l'interrogation des données pour les applications Web, mobiles.
Notre base de données contient uniquement deux collections users et offres, la première
contient toutes les informations concernant les utilisateurs et la deuxième contient toutes les
informations concernant les offres.
Figure 55 : Diagramme de classe général
Chapitre 3 : Conception et réalisation
Page | 69
V. Conclusion
Au cours de ce tout dernier chapitre, nous avons présenté l'environnement logiciel et matériel.
Ainsi le langage que nous avons utilisé pour développer notre application.
Par la suite une présentation détaillée de chacun des 3 sprints a été faite selon la méthodologie
de gestion de projet SCRUM, en présentant la conception de chaque sprint, la réalisation des
interfaces les plus importantes pour chaque sprint, Burndown et enfin les rétrospective de
chaque sprint.
Conclusion général et perspectives
Page | 70
Conclusion et perspectives
Nous avons essayé tout au long de notre travail de construire notre application en ligne
incrément par incrément en utilisant la méthodologie Scrum. Le présent rapport détaille toutes
les étapes par lesquelles nous sommes passés pour arriver au résultat attendu.
C’était une expérience à la fois enrichissante et passionnante. Elle nous a permis de faire un
premier pas vers le milieu professionnel, d’interagir avec ce nouveau monde et de se sentir un
acteur actif et agissant dans cette dynamique entrepreneuriale. Notre expérience au sein de la
société « Cosa Vostra » nous a offert l’occasion de nous prendre en charge, et de pousser
toutes nos limites pour nous surpasser et présenter un projet fini à l’image de la réputation de
notre prestigieux institut.
Sur le plan humain, ce stage nous a offert la possibilité d’améliorer nos capacités d’adaptation,
de communication et d’acquérir des facultés de collaboration avec l’environnement
professionnel.
Ce projet nous a aussi offert l’opportunité d’acquérir une expérience pour gérer le travail au
sein d’une hiérarchie du point de vue amélioration de notre aptitude en communication,
collaboration, adaptation avec l’environnement professionnel et respect des échéances.
En conclusion, ce stage a été une expérience extrêmement enrichissante tant sur le plan
personnel que professionnel. Il nous a non seulement permis de découvrir l’univers du travail
mais encore d’avoir une vision plus claire sur notre avenir.
En plus des fonctionnalités déjà développées, l’application peut être améliorée par l’ajout des
nouvelles fonctionnalités telles que l’ajout d’une interface de chat entre le particulier et le
prestataire de service. En plus, nous comptons améliorer notre solution en se basant sur les
points faibles dégagés au cours de son utilisation.
Bibliographie & Webographie
Page | 71
Bibliographie
[1] B.E & M.S Bachtobji, «Rapport PFE,» 2016.
[2] «SCRUM le guide pratique de la méthode agile la plus populaire » Dunod,2010.
[3] le backlog de produit-Scrum, Agilité et Rock’nroll book
Webographie
[w1] L’agiliste. Guide de démarrage Scrum. Juin 2013. Disponible sur :
http://www.agiliste.fr/fiches/guide-demarrage-scrum/ (Consulté le 26/03/2019)
[w2]SARFATI, P. (2015, 02 19).Formations Scrum. Récupéré sur scrum.fr:
http://www.scrum.fr/formation-scrum/ (Consulté le 02/04/2019)
[w3] L’agiliste. Guide de démarrage Scrum. Juin 2013. Disponible sur :
http://www.agiliste.fr/fiches/guide-demarrage-scrum/ (Consulté le 05/04/2019)
[w4]http://www.icescrum.org/ (Consulté le 10/05/2019)
[w5]http://support.objecteering.com/objecteering6.1/help/fr/objecteering_uml_modeler/diagra
ms/ class_diagrams.htm (Consulté le 13/05/2019)
[w6] https://www.scrumwise.com/ (Consulté le 12/05/2019)
Rapport de stage IHEC, Carthage 2019
RESUME
Ce projet de fin d’étude est réalisé dans le cadre de projet de fin d’études en vue de
L’obtention du diplôme de la licence appliquée en technologie de l’information appliqué à la
gestion. Il a été développé au sein de la société CosaVostra, en collaboration avec
Institut des hautes études Commerciales de Carthage . Ce projet s’intitule «Réalisation d’une
application de mise en relation B2C de professions libérales », consiste à concevoir et
développer une plateforme dont laquelle nous avons utilisée UML comme langage de
modélisation, FireBase comme système de gestion de base de données et les technologies
Web : Angular, HTML5, CSS3, Bootstrap.
Mots clés: Angular, UML, HTML5, CSS3, Bootstrap, firebase.
SUMMARY
This project of end of studies is carried out as part of a graduation project aimed at obtaining a
degree in applied information technologie applied to management. It has been developed
within the company CosaVostra, in collaboration with the Institute of Higher Commercial
Studies of Carthage. This project is titled " Realization of a B2C linking application for liberal
professions
", consists in designing and developing a platform of which we used
UML as a modeling language, FireBase as a database management system and web
Technologies : Angular, HTML5, CSS3, Bootstrap.
Key words: Angular, UML, HTML5, CSS3, Bootstrap, firebase.

Contenu connexe

Tendances

Rapport pfe-ayoub mkharbach
Rapport pfe-ayoub mkharbachRapport pfe-ayoub mkharbach
Rapport pfe-ayoub mkharbach
Ayoub Mkharbach
 
Rapport restaurant le-roi
Rapport restaurant le-roiRapport restaurant le-roi
Rapport restaurant le-roi
Marwa Bhouri
 
Rapport de stage du fin d'étude
Rapport de stage du fin d'étudeRapport de stage du fin d'étude
Rapport de stage du fin d'étude
Yahyaoui Mohamed Yosri
 
Projet Fin D'étude Application Mobile
Projet Fin D'étude Application MobileProjet Fin D'étude Application Mobile
Projet Fin D'étude Application Mobile
Rim ENNOUR
 
Rapport Projet de fin d'etude sur le parc informatique
Rapport Projet  de fin d'etude sur le parc informatiqueRapport Projet  de fin d'etude sur le parc informatique
Rapport Projet de fin d'etude sur le parc informatique
Hicham Ben
 
Rapport final pfe_systeme_de_gestion _de_cabinet_de_formation_mobile_web
Rapport final pfe_systeme_de_gestion _de_cabinet_de_formation_mobile_webRapport final pfe_systeme_de_gestion _de_cabinet_de_formation_mobile_web
Rapport final pfe_systeme_de_gestion _de_cabinet_de_formation_mobile_web
Salma Gouia
 
467720159-rapport-final-bouguerra-khadijaesseghaier-lina-pdf.pdf
467720159-rapport-final-bouguerra-khadijaesseghaier-lina-pdf.pdf467720159-rapport-final-bouguerra-khadijaesseghaier-lina-pdf.pdf
467720159-rapport-final-bouguerra-khadijaesseghaier-lina-pdf.pdf
Bader Nassiri
 
rapport PFE ingénieur génie logiciel INSAT
rapport PFE ingénieur génie logiciel INSATrapport PFE ingénieur génie logiciel INSAT
rapport PFE ingénieur génie logiciel INSATSiwar GUEMRI
 
Rapport Projet de Fin d'Etudes
Rapport Projet de Fin d'EtudesRapport Projet de Fin d'Etudes
Rapport Projet de Fin d'Etudes
Hosni Mansour
 
Site web d'une agence de voyage
Site web d'une agence de voyage Site web d'une agence de voyage
Site web d'une agence de voyage
WissalWahsousse
 
Conception et developpement d'un site web pour la suggestion et notification ...
Conception et developpement d'un site web pour la suggestion et notification ...Conception et developpement d'un site web pour la suggestion et notification ...
Conception et developpement d'un site web pour la suggestion et notification ...
Mohamed Boubaya
 
Conception et réalisation d’un Système d’information des étudiants du départe...
Conception et réalisation d’un Système d’information des étudiants du départe...Conception et réalisation d’un Système d’information des étudiants du départe...
Conception et réalisation d’un Système d’information des étudiants du départe...
Ilyas CHAOUA
 
Rapport de stage de perfectionnement - Mahmoudi Mohamed Amine
Rapport de stage de perfectionnement - Mahmoudi Mohamed AmineRapport de stage de perfectionnement - Mahmoudi Mohamed Amine
Rapport de stage de perfectionnement - Mahmoudi Mohamed Amine
Mohamed Amine Mahmoudi
 
Rapport Pfe Application Web e-commerce Symfony2
Rapport Pfe Application Web e-commerce Symfony2Rapport Pfe Application Web e-commerce Symfony2
Rapport Pfe Application Web e-commerce Symfony2
Ben Abdelwahed Slim
 
Conception et développement d’une plateforme d'import-export avec paiement en...
Conception et développement d’une plateforme d'import-export avec paiement en...Conception et développement d’une plateforme d'import-export avec paiement en...
Conception et développement d’une plateforme d'import-export avec paiement en...
Karim Ben Alaya
 
Rapport de stage Application web Gestion RH ASP.NET MVC5
Rapport de stage Application web Gestion RH ASP.NET MVC5Rapport de stage Application web Gestion RH ASP.NET MVC5
Rapport de stage Application web Gestion RH ASP.NET MVC5
YounessLaaouane
 
Application mobile bancaire sous la plateforme Android
Application mobile bancaire sous la plateforme AndroidApplication mobile bancaire sous la plateforme Android
Application mobile bancaire sous la plateforme Android
Khaled Fayala
 
Rapport Projet ERP - Plateforme Odoo 12 (PFE Licence)
Rapport Projet ERP - Plateforme Odoo 12 (PFE Licence)Rapport Projet ERP - Plateforme Odoo 12 (PFE Licence)
Rapport Projet ERP - Plateforme Odoo 12 (PFE Licence)
Yasmine Tounsi
 
Rapport- Conception et réalisation d'une plateforme social learning
Rapport- Conception et réalisation d'une plateforme social learningRapport- Conception et réalisation d'une plateforme social learning
Rapport- Conception et réalisation d'une plateforme social learning
Rouâa Ben Hammouda
 
Mémoire : Cloud iaas Slim Hannachi
Mémoire :  Cloud iaas Slim HannachiMémoire :  Cloud iaas Slim Hannachi
Mémoire : Cloud iaas Slim Hannachi
slim Hannachi
 

Tendances (20)

Rapport pfe-ayoub mkharbach
Rapport pfe-ayoub mkharbachRapport pfe-ayoub mkharbach
Rapport pfe-ayoub mkharbach
 
Rapport restaurant le-roi
Rapport restaurant le-roiRapport restaurant le-roi
Rapport restaurant le-roi
 
Rapport de stage du fin d'étude
Rapport de stage du fin d'étudeRapport de stage du fin d'étude
Rapport de stage du fin d'étude
 
Projet Fin D'étude Application Mobile
Projet Fin D'étude Application MobileProjet Fin D'étude Application Mobile
Projet Fin D'étude Application Mobile
 
Rapport Projet de fin d'etude sur le parc informatique
Rapport Projet  de fin d'etude sur le parc informatiqueRapport Projet  de fin d'etude sur le parc informatique
Rapport Projet de fin d'etude sur le parc informatique
 
Rapport final pfe_systeme_de_gestion _de_cabinet_de_formation_mobile_web
Rapport final pfe_systeme_de_gestion _de_cabinet_de_formation_mobile_webRapport final pfe_systeme_de_gestion _de_cabinet_de_formation_mobile_web
Rapport final pfe_systeme_de_gestion _de_cabinet_de_formation_mobile_web
 
467720159-rapport-final-bouguerra-khadijaesseghaier-lina-pdf.pdf
467720159-rapport-final-bouguerra-khadijaesseghaier-lina-pdf.pdf467720159-rapport-final-bouguerra-khadijaesseghaier-lina-pdf.pdf
467720159-rapport-final-bouguerra-khadijaesseghaier-lina-pdf.pdf
 
rapport PFE ingénieur génie logiciel INSAT
rapport PFE ingénieur génie logiciel INSATrapport PFE ingénieur génie logiciel INSAT
rapport PFE ingénieur génie logiciel INSAT
 
Rapport Projet de Fin d'Etudes
Rapport Projet de Fin d'EtudesRapport Projet de Fin d'Etudes
Rapport Projet de Fin d'Etudes
 
Site web d'une agence de voyage
Site web d'une agence de voyage Site web d'une agence de voyage
Site web d'une agence de voyage
 
Conception et developpement d'un site web pour la suggestion et notification ...
Conception et developpement d'un site web pour la suggestion et notification ...Conception et developpement d'un site web pour la suggestion et notification ...
Conception et developpement d'un site web pour la suggestion et notification ...
 
Conception et réalisation d’un Système d’information des étudiants du départe...
Conception et réalisation d’un Système d’information des étudiants du départe...Conception et réalisation d’un Système d’information des étudiants du départe...
Conception et réalisation d’un Système d’information des étudiants du départe...
 
Rapport de stage de perfectionnement - Mahmoudi Mohamed Amine
Rapport de stage de perfectionnement - Mahmoudi Mohamed AmineRapport de stage de perfectionnement - Mahmoudi Mohamed Amine
Rapport de stage de perfectionnement - Mahmoudi Mohamed Amine
 
Rapport Pfe Application Web e-commerce Symfony2
Rapport Pfe Application Web e-commerce Symfony2Rapport Pfe Application Web e-commerce Symfony2
Rapport Pfe Application Web e-commerce Symfony2
 
Conception et développement d’une plateforme d'import-export avec paiement en...
Conception et développement d’une plateforme d'import-export avec paiement en...Conception et développement d’une plateforme d'import-export avec paiement en...
Conception et développement d’une plateforme d'import-export avec paiement en...
 
Rapport de stage Application web Gestion RH ASP.NET MVC5
Rapport de stage Application web Gestion RH ASP.NET MVC5Rapport de stage Application web Gestion RH ASP.NET MVC5
Rapport de stage Application web Gestion RH ASP.NET MVC5
 
Application mobile bancaire sous la plateforme Android
Application mobile bancaire sous la plateforme AndroidApplication mobile bancaire sous la plateforme Android
Application mobile bancaire sous la plateforme Android
 
Rapport Projet ERP - Plateforme Odoo 12 (PFE Licence)
Rapport Projet ERP - Plateforme Odoo 12 (PFE Licence)Rapport Projet ERP - Plateforme Odoo 12 (PFE Licence)
Rapport Projet ERP - Plateforme Odoo 12 (PFE Licence)
 
Rapport- Conception et réalisation d'une plateforme social learning
Rapport- Conception et réalisation d'une plateforme social learningRapport- Conception et réalisation d'une plateforme social learning
Rapport- Conception et réalisation d'une plateforme social learning
 
Mémoire : Cloud iaas Slim Hannachi
Mémoire :  Cloud iaas Slim HannachiMémoire :  Cloud iaas Slim Hannachi
Mémoire : Cloud iaas Slim Hannachi
 

Similaire à Rapport de projet de fin d’étude

Rapport Projet Fin d'Études PFE
Rapport Projet Fin d'Études PFERapport Projet Fin d'Études PFE
Rapport Projet Fin d'Études PFE
Mohamed Amine Mahmoudi
 
Rapport finiale
Rapport finialeRapport finiale
Rapport finiale
marwenbencheikhali
 
GEmploi : Smart school timetable management software using RFID technology
GEmploi : Smart school timetable management software using RFID technologyGEmploi : Smart school timetable management software using RFID technology
GEmploi : Smart school timetable management software using RFID technology
Slimane Akaliâ , سليمان أقليع
 
eQ Services PFE
eQ Services PFEeQ Services PFE
eQ Services PFE
fayway
 
Rapport_deStage
Rapport_deStageRapport_deStage
Rapport_deStageOmar TRAI
 
Rapport PFE réalisation d’un Framework Kinect
Rapport PFE réalisation d’un Framework KinectRapport PFE réalisation d’un Framework Kinect
Rapport PFE réalisation d’un Framework Kinect
Amine MEGDICHE
 
Étude et mise en place d'un serveur messengerie
Étude et mise en place d'un serveur messengerie Étude et mise en place d'un serveur messengerie
Étude et mise en place d'un serveur messengerie
iferis
 
Rapport PFE BIAT Conception et mise en place d’une plate-forme de gestion des...
Rapport PFE BIAT Conception et mise en place d’une plate-forme de gestion des...Rapport PFE BIAT Conception et mise en place d’une plate-forme de gestion des...
Rapport PFE BIAT Conception et mise en place d’une plate-forme de gestion des...
Yasmine Lachheb
 
Étude et mise en place de ftp sécurisé
Étude et mise en place de ftp sécurisé Étude et mise en place de ftp sécurisé
Étude et mise en place de ftp sécurisé
iferis
 
Comment conduire un projet web entre planification ?
Comment conduire un projet web entre planification ?Comment conduire un projet web entre planification ?
Comment conduire un projet web entre planification ?
MarineS6
 
Optimisation d'une stratégie web éditoriale
Optimisation d'une stratégie web éditorialeOptimisation d'une stratégie web éditoriale
Optimisation d'une stratégie web éditoriale
Damien Mady
 
Rapport pfe 2017 Système de gestion des rendez-vous médicaux
Rapport pfe 2017 Système de gestion des rendez-vous médicaux Rapport pfe 2017 Système de gestion des rendez-vous médicaux
Rapport pfe 2017 Système de gestion des rendez-vous médicaux
fehmi arbi
 
rapport-170608045227 (1).pdf
rapport-170608045227 (1).pdfrapport-170608045227 (1).pdf
rapport-170608045227 (1).pdf
MahmoudiOussama
 
rapport-170608045227 (1).pdf
rapport-170608045227 (1).pdfrapport-170608045227 (1).pdf
rapport-170608045227 (1).pdf
MahmoudiOussama
 
Stage de Perfectonnement Génie Electrique (1) mm 24
Stage de Perfectonnement Génie Electrique (1) mm 24Stage de Perfectonnement Génie Electrique (1) mm 24
Stage de Perfectonnement Génie Electrique (1) mm 24
DhaouiMastour
 
Mise en place de la solution d’authentification Radius sous réseau LAN câblé
Mise en place de la solution d’authentification Radius sous réseau LAN câbléMise en place de la solution d’authentification Radius sous réseau LAN câblé
Mise en place de la solution d’authentification Radius sous réseau LAN câblé
Charif Khrichfa
 
Rapport_PFE_Securite (1).pdf
Rapport_PFE_Securite (1).pdfRapport_PFE_Securite (1).pdf
Rapport_PFE_Securite (1).pdf
AhmedDhib6
 
Crowdsourcing - Partenaire de l'innovation
Crowdsourcing - Partenaire de l'innovationCrowdsourcing - Partenaire de l'innovation
Crowdsourcing - Partenaire de l'innovationBilel Kouider
 
Rapport PFE: PIM (Product Information Management) - A graduation project repo...
Rapport PFE: PIM (Product Information Management) - A graduation project repo...Rapport PFE: PIM (Product Information Management) - A graduation project repo...
Rapport PFE: PIM (Product Information Management) - A graduation project repo...
younes elmorabit
 
Rapport de stage de fin d'etudes du DUT
Rapport de stage de fin d'etudes du DUTRapport de stage de fin d'etudes du DUT
Rapport de stage de fin d'etudes du DUT
Karim Souabni
 

Similaire à Rapport de projet de fin d’étude (20)

Rapport Projet Fin d'Études PFE
Rapport Projet Fin d'Études PFERapport Projet Fin d'Études PFE
Rapport Projet Fin d'Études PFE
 
Rapport finiale
Rapport finialeRapport finiale
Rapport finiale
 
GEmploi : Smart school timetable management software using RFID technology
GEmploi : Smart school timetable management software using RFID technologyGEmploi : Smart school timetable management software using RFID technology
GEmploi : Smart school timetable management software using RFID technology
 
eQ Services PFE
eQ Services PFEeQ Services PFE
eQ Services PFE
 
Rapport_deStage
Rapport_deStageRapport_deStage
Rapport_deStage
 
Rapport PFE réalisation d’un Framework Kinect
Rapport PFE réalisation d’un Framework KinectRapport PFE réalisation d’un Framework Kinect
Rapport PFE réalisation d’un Framework Kinect
 
Étude et mise en place d'un serveur messengerie
Étude et mise en place d'un serveur messengerie Étude et mise en place d'un serveur messengerie
Étude et mise en place d'un serveur messengerie
 
Rapport PFE BIAT Conception et mise en place d’une plate-forme de gestion des...
Rapport PFE BIAT Conception et mise en place d’une plate-forme de gestion des...Rapport PFE BIAT Conception et mise en place d’une plate-forme de gestion des...
Rapport PFE BIAT Conception et mise en place d’une plate-forme de gestion des...
 
Étude et mise en place de ftp sécurisé
Étude et mise en place de ftp sécurisé Étude et mise en place de ftp sécurisé
Étude et mise en place de ftp sécurisé
 
Comment conduire un projet web entre planification ?
Comment conduire un projet web entre planification ?Comment conduire un projet web entre planification ?
Comment conduire un projet web entre planification ?
 
Optimisation d'une stratégie web éditoriale
Optimisation d'une stratégie web éditorialeOptimisation d'une stratégie web éditoriale
Optimisation d'une stratégie web éditoriale
 
Rapport pfe 2017 Système de gestion des rendez-vous médicaux
Rapport pfe 2017 Système de gestion des rendez-vous médicaux Rapport pfe 2017 Système de gestion des rendez-vous médicaux
Rapport pfe 2017 Système de gestion des rendez-vous médicaux
 
rapport-170608045227 (1).pdf
rapport-170608045227 (1).pdfrapport-170608045227 (1).pdf
rapport-170608045227 (1).pdf
 
rapport-170608045227 (1).pdf
rapport-170608045227 (1).pdfrapport-170608045227 (1).pdf
rapport-170608045227 (1).pdf
 
Stage de Perfectonnement Génie Electrique (1) mm 24
Stage de Perfectonnement Génie Electrique (1) mm 24Stage de Perfectonnement Génie Electrique (1) mm 24
Stage de Perfectonnement Génie Electrique (1) mm 24
 
Mise en place de la solution d’authentification Radius sous réseau LAN câblé
Mise en place de la solution d’authentification Radius sous réseau LAN câbléMise en place de la solution d’authentification Radius sous réseau LAN câblé
Mise en place de la solution d’authentification Radius sous réseau LAN câblé
 
Rapport_PFE_Securite (1).pdf
Rapport_PFE_Securite (1).pdfRapport_PFE_Securite (1).pdf
Rapport_PFE_Securite (1).pdf
 
Crowdsourcing - Partenaire de l'innovation
Crowdsourcing - Partenaire de l'innovationCrowdsourcing - Partenaire de l'innovation
Crowdsourcing - Partenaire de l'innovation
 
Rapport PFE: PIM (Product Information Management) - A graduation project repo...
Rapport PFE: PIM (Product Information Management) - A graduation project repo...Rapport PFE: PIM (Product Information Management) - A graduation project repo...
Rapport PFE: PIM (Product Information Management) - A graduation project repo...
 
Rapport de stage de fin d'etudes du DUT
Rapport de stage de fin d'etudes du DUTRapport de stage de fin d'etudes du DUT
Rapport de stage de fin d'etudes du DUT
 

Dernier

De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'universitéDe l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
Université de Franche-Comté
 
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Laurent Speyser
 
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
OCTO Technology
 
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
Horgix
 
Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024
UNITECBordeaux
 
Les écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptxLes écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptx
abderrahimbourimi
 

Dernier (6)

De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'universitéDe l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
De l'IA comme plagiat à la rédaction d'une « charte IA » à l'université
 
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)
 
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...
 
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
MongoDB in a scale-up: how to get away from a monolithic hell — MongoDB Paris...
 
Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024Le support de présentation des Signaux 2024
Le support de présentation des Signaux 2024
 
Les écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptxLes écrans informatiques au fil du temps.pptx
Les écrans informatiques au fil du temps.pptx
 

Rapport de projet de fin d’étude

  • 1. Année Universitaire 2018-2019 Ministère de l’Enseignement Supérieur de la Recherche Scientifique Université de Carthage Institut des Hautes Études Commerciales de Carthage Rapport de Projet de Fin d’Études présenté en vue de l’obtention du Diplôme de la Licence Appliquée en Technologies de l’Information. Intitulé du Projet : Réalisation d’une application de mise en relation B2C des professions libérales Réalisé Par : Ghribi Fatma Ezzahra Ouedherfi Oumaima Organisme d’accueil : CosaVostra Encadrant Académique : Encadrant Professionnel: Mme. Ben Ishak Mouna (IHEC) Mr. Asli AmenAllah (CosaVostra)
  • 2. Remerciements Au terme de ce travail nous tenons à remercier tous ceux qui ont participé de près ou de loin à la réalisation de ce travail. La première personne que nous tenons à remercier est notre chère encadrante académique Mme Ben Ishak Mouna, nous tenons également à remercier notre encadrant professionnel Mr Asli AmenAllah, pour l’orientation, la confiance, la patience qui ont constitué un apport considérable sans lequel ce travail n’aurait pas pu être mené au bon port. Qu’ils trouvent dans ce travail un hommage vivant à sa haute personnalité. Un grand Merci aussi à Mr Bahri Mouhamed le directeur de tanitlab chez CosaVostra pour son soutien et ses conseils D’une autre part nous exprimons nos vifs sentiments et remerciements à tous nos enseignants pour la formation qu’ils ont eu le soin de nous apporter tout au long de notre cursus universitaire. Nous tenons aussi à adresser nos remerciements pour les membres du jury pour l’honneur qu’ils nous ont fait pour évaluer ce travail. Enfin, nous adressons nos plus sincères remerciements à tous nos proches et amis, qui nous ont toujours soutenu et encouragé au cours de la réalisation de ce projet.
  • 3.
  • 4. i Sommaire Introduction Générale......................................................................................................................1 Chapitre 1 : Contexte Général.....................................................................................................2 I. Introduction...............................................................................................................3 II. Cadre du stage ...........................................................................................................3 1. Présentation de l'organisme d'accueil..........................................................................3 2. Etude de l’existant .......................................................................................................3 3. Problématique et présentation du sujet........................................................................3 III. Méthodologie de travail ............................................................................................4 1. La méthode agile .........................................................................................................4 2. La méthode Scrum.......................................................................................................4 IV. Conclusion.................................................................................................................7 Chapitre 2 : Spécification et analyse de besoins .........................................................................8 I. Introduction...............................................................................................................9 II. Les rôles Scrum.........................................................................................................9 III. Spécification des besoins ........................................................................................11 1. Identification des acteurs...........................................................................................11 2. Identification des besoins fonctionnels .....................................................................12 3. Identification des besoins non fonctionnels : ............................................................13 IV. Modélisation et analyse des besoins........................................................................14 V. Le Backlog du produit.............................................................................................14 VI. Le planning des sprints............................................................................................23 VII. Prototypages des interfaces .....................................................................................23 VIII. Conclusion...............................................................................................................27 Chapitre 3 : Conception et réalisation .......................................................................................28 I. Introduction.............................................................................................................29 II. Les Exigences techniques........................................................................................29 1. Environnement matériel ............................................................................................29 2. Environnement logiciel et langages utilisés ..............................................................29 III. Réalisation des sprints.............................................................................................33
  • 5. ii 1. Étude et réalisation du sprint 0 ..................................................................................33 A. Installation et configuration de l’environnement de travail ..................................33 B. Formation et développement des sites web ...........................................................33 C. Réalisation.............................................................................................................34 2. Étude et réalisation du sprint 1 ..................................................................................36 A. Diagramme des cas d'utilisation ............................................................................37 B. Analyse et raffinement de cas d’utilisation ...........................................................38 a. Raffinement de cas d’utilisation « s’inscrire ».................................................38 b. Raffinement de cas d’utilisation « S’authentifier »..........................................39 C. Conception.............................................................................................................40 a. “S’inscrire”.......................................................................................................40 b. “Authentification”............................................................................................41 D. Réalisation.............................................................................................................42 E. Burndown..............................................................................................................44 F. Rétrospective .........................................................................................................44 3. Etude et la réalisation du sprint 2 ..............................................................................44 A. Diagramme des cas d'utilisation ............................................................................45 B. Analyse et raffinement de cas d’utilisation ...........................................................46 a. Raffinement de cas d’utilisation « Consulter les offres » ................................46 b. Raffinement de cas d’utilisation « Gérer ses offres » ......................................48 C. Conception.............................................................................................................51 a. “Consulter ses offres”.......................................................................................51 b. “Consulter détail d'une offre ”..........................................................................51 c. “Rechercher une offre”.....................................................................................52 d. “Choisir Catégorie ”.........................................................................................52 e. “Consulter ses offres”.......................................................................................53 f. “Ajouter une offre”...........................................................................................53 g. “Supprimer une offre”......................................................................................54 h. “Modifier une offre ”........................................................................................54 D. Réalisation.............................................................................................................55 E. Burndown..............................................................................................................57 F. Rétrospective .........................................................................................................58 4. Étude et réalisation du sprint 3 ..................................................................................58 A. Diagramme des cas d'utilisation ............................................................................58
  • 6. iii B. Analyse et raffinement de cas d’utilisation ...........................................................59 a. Raffinement de cas d’utilisation « Assistance Artificielle »............................59 b. Raffinement de cas d’utilisation « Consulter profil prestataire ».....................60 c. Raffinement de cas d’utilisation « Devenir prestataire » .................................60 d. Raffinement de cas d’utilisation « Consulter son profil »................................61 e. Raffinement de cas d’utilisation « Consulter liste des Comptes »...................61 C. Conception.............................................................................................................63 a. Assistance Artificielle ......................................................................................63 b. Consulter profil prestataire...............................................................................64 c. “Devenir prestataire”........................................................................................64 d. “Consulter liste des comptes” ..........................................................................65 e. “Modifier un compte” ......................................................................................65 D. Réalisation.............................................................................................................66 E. Burndown..............................................................................................................67 F. Rétrospective .........................................................................................................68 IV. Diagramme de classe général..................................................................................68 V. Conclusion...............................................................................................................69 Conclusion et perspectives ............................................................................................................70
  • 7. iv Liste des figures Figure 1: Cycle de vie de la méthode SCRUM ...............................................................................6 Figure 2 : Les rôles du Scrum..........................................................................................................9 Figure 3 : La détermination des rôles Scrum.................................................................................11 Figure 4 : Diagramme de cas d’utilisation globale........................................................................14 Figure 5 : Prototype de l’interface « inscription ».........................................................................24 Figure 6 : Prototype de l’interface « authentification ».................................................................24 Figure 7 : Prototype de l’interface « page d'accueil » ...................................................................25 Figure 8 : Prototype de l’interface « page offres liste » ................................................................25 Figure 9 : Prototype de l’interface « page offre cards » ................................................................26 Figure 10 : Prototype de l’interface « page détails ».....................................................................26 Figure 11 : Prototype de l’interface « profil d’un particulier ».....................................................27 Figure 12 : Interface Site Web « tk1 » ..........................................................................................34 Figure 13 : Interface site web « Ben Youssef »...........................................................................34 Figure 14 : Interface Landing Page « Accueil »..........................................................................35 Figure 15 : Interface Landing Page « A propos » ......................................................................35 Figure 16 : Interface Landing Page « Service ».........................................................................36 Figure 17: Interface Landing Page « Employee of the month »..................................................36 Figure 18 : Diagramme de cas d’utilisation de sprint 1.................................................................37 Figure 19 : Raffinement de cas d’utilisation “s’inscrire”..............................................................38 Figure 20 : Raffinement de cas d’utilisation “s’authentifier” .......................................................39 Figure 21 : Diagramme de séquence « s’inscrire » .......................................................................41 Figure 22 : Diagramme de séquence« s’authentifier »..................................................................42 Figure 23 : Interface « Inscription »..............................................................................................43 Figure 24 : Interface « Authentification ».....................................................................................43 Figure 25 : Burndown du sprint 1..................................................................................................44 Figure 26 : Diagramme de cas d’utilisation de sprint 2.................................................................45 Figure 27 : Raffinement de diagramme de cas d’utilisation “consulter offre”..............................46 Figure 28 : Raffinement diagramme de cas d’utilisation “Gérer ses offres” ................................48 Figure 29 : Diagramme de séquence « Consulter les offres ».......................................................51 Figure 30 : Diagramme de séquence « Consulter détails d'une offre ».........................................51 Figure 31 : Diagramme de séquence « Rechercher une offre » ....................................................52 Figure 32 : Diagramme de séquence « Choisir catégorie »...........................................................52 Figure 33 : Diagramme de séquence « Consulter ses offres » ......................................................53 Figure 34 : Diagramme de séquence « Ajouter une offre » ..........................................................53 Figure 35 : Diagramme de séquence « Supprimer une offre »......................................................54 Figure 36 : Diagramme de séquence « Modifier une offre » ........................................................55 Figure 37 : Interface « Ajouter une offre »....................................................................................55 Figure 38 : Interface « Modifier une offre »..................................................................................56
  • 8. v Figure 39 : Interface « Détails d’une offre ».................................................................................56 Figure 40 : Interface « Liste de mes offres ».................................................................................56 Figure 41 : Interface « liste des offres »........................................................................................57 Figure 42 : Burndown du sprint 2..................................................................................................57 Figure 43 : Diagramme de cas d’utilisation de sprint 3.................................................................59 Figure 44 : Raffinement de diagramme de cas d’utilisation “Devenir prestataire” ......................60 Figure 45 : Raffinement de diagramme de cas d’utilisation “Consulter liste des comptes” .........61 Figure 46 : Diagramme de séquence « Consulter mon profil ».....................................................63 Figure 47 : Diagramme de séquence « Consulter mon profil ».....................................................64 Figure 48 : Diagramme de séquence « Devenir Prestataire » .......................................................64 Figure 49 : Diagramme de séquence « Consulter liste des comptes » ..........................................65 Figure 50 : Diagramme de séquence « Modifier un compte » ......................................................65 Figure 51 : Interface « Mon Profil»...............................................................................................66 Figure 52 : Interface « liste des comptes »....................................................................................66 Figure 53: Interface « Profil d’un prestataire ».............................................................................67 Figure 54 : Burndown du sprint 3..................................................................................................67 Figure 55 : Diagramme de classe général......................................................................................68
  • 9. vi Liste des tableaux Tableau 1: Tableau Les rôles en scrum...........................................................................................5 Tableau 2 : Tableau Les rôles en Scrum .......................................................................................10 Tableau 3 : Les acteurs et leurs rôles.............................................................................................12 Tableau 4 : Le Backlog du produit ................................................................................................23 Tableau 5 : Tableau de planning de travail ...................................................................................23 Tableau 6 : Tableau d’environnement matériel.............................................................................29 Tableau 7 : Environnement logiciel et langage utilisés .................................................................32 Tableau 8: Backlog sprint 1...........................................................................................................37 Tableau 9 : Description textuelle de cas d'utilisation « s’inscrire » ..............................................39 Tableau 10 : Description textuelle de cas d'utilisation « s’authentifier».......................................40 Tableau 11 : Backlog sprint 2........................................................................................................45 Tableau 12 : Description textuelle de cas d'utilisation « Consulter les offres »............................46 Tableau 13 : Description textuelle de sous cas d'utilisation «Consulter détails des offre»...........47 Tableau 14 : Description textuelle de sous cas d'utilisation «Rechercher une offre » ..................47 Tableau 15 : Description textuelle de sous cas d'utilisation « Choisir catégorie » .......................48 Tableau 16 : Description textuelle de cas d'utilisation « Gérer ses offres »..................................49 Tableau 17 : Description textuelle de sous cas d'utilisation « Ajouter une offre ».......................49 Tableau 18 : Description textuelle de sous cas d'utilisation « Consulter ses offres » ...................49 Tableau 19 : Description textuelle de sous cas d'utilisation « Modifier une offre » .....................50 Tableau 20 : Description textuelle de sous cas d'utilisation « Supprimer une offre » ..................50 Tableau 21: Backlog sprint 3.........................................................................................................58 Tableau 22 : Description textuelle de sous cas d'utilisation « Assistance Artificielle» ................59 Tableau 23 : Description textuelle de sous cas d'utilisation « Consulter profil d’un prestataire »60 Tableau24: Description textuelle de sous cas d'utilisation « Devenir Prestataire »......................61 Tableau 25 : Description textuelle du cas d'utilisation « Consulter son profil »...........................61 Tableau 26 : Description textuelle de cas d'utilisation « Consulter liste des Comptes » ..............62 Tableau 27 : Description textuelle de sous cas d'utilisation « Modifier un compte »...................62 Tableau 28 : Description textuelle de sous cas d'utilisation « Supprimer un compte » ................63
  • 10. Introduction Générale Page | 1 Introduction Générale Depuis la fin du siècle dernier, le développement de l’informatique et le développement continu des équipements associés ont permis de traiter de grandes quantités d’informations afin de pouvoir en tirer parti pour la quasi-totalité des activités humaines. Aucune activité de production, de services ou autres n’ont connu de progrès sans avoir eu recours aux technologies de l’information et de la communication TIC, En effet les TIC sont devenues des alliés privilégiés pour les internautes puisqu'elles permettent de détenir une information plus fiable et pertinente. Littéralement, toute personne peut construire des pages web pour proposer des biens et des services. Soucieuse de se mettre en phase avec la nouvelle technologie du développement web une application web en ligne, la société « Cosa Vostra » a choisi de se tourner vers un site web qui propose des services en peinture, bâtiment, peinture décorative, électricité, plomberie...etc. Dans le cadre de l’élaboration de notre projet de fin d’étude, « Cosa Vostra », l’entreprise d’accueil, nous a confié l’implémentation d’une application web en ligne qui permet à leurs utilisateurs d'exprimer leur besoin afin de trouver un service approprié et aux prestataires de trouver des opportunités de travail. Ce rapport décrit les différentes étapes de réalisation de notre projet de fin d'études et s'articule sur trois chapitres. Dans le premier chapitre intitulé « Contexte général », nous présenterons l’organisme d’accueil, l’étude et critique de l’existant, les Solution proposée, et enfin la méthodologie de travail. Dans le deuxième chapitre « Spécification et analyse de besoins », nous procéderons les rôles scrum, La spécification des besoins, La modélisation et analyse des besoins ainsi que le Backlog du produit et Le planning des sprints, et enfin nous présenterons le prototypage des interfaces. Dans le troisième chapitre « Conception et réalisation », nous allons essayer d'éclaircir le choix de l'architecture, Les exigences techniques rencontrés et la réalisation des sprints ainsi que le diagramme de classe général, Et enfin Installation et test de l’application. Finalement nous clôturons par une conclusion à travers laquelle nous ferons une synthèse de tout ce qui a été fait tout au long des travaux de réalisation et présenterons les valeurs ajoutées du projet et les perspectives futures.
  • 11. Page | 2 Chapitre1: Contexte Général
  • 12. Chapitre 1 : Contexte Général Page | 3 I. Introduction Au cours de ce chapitre, nous allons mettre le travail dans son contexte général. Nous commençons par présenter l’organisme d’accueil. Ensuite nous présentons la problématique à étudier tout au long de ce projet de fin d’études. Enfin, nous allons introduire la méthodologie de travail adoptée. II. Cadre du stage 1. Présentation de l'organisme d'accueil CosaVostra est un cabinet de conseil en stratégie digitale basé à Paris, Londres, Bordeaux et Tunis. Sa mission est la création de sites professionnels sur mesure basé sur des dispositifs digitaux agiles (site vitrine, site de services, site e-catalogue, site e-commerce, site spécifique, Application web …) afin de satisfaire les besoins de sa clientèle. 2. Etude de l’existant Pour résoudre un problème d'électricité un accident de plomberie, le client doit se déplacer directement au local afin de chercher une offre qui satisfait ses besoins et son budget. Ses déplacements peuvent être inutiles et même peuvent provoquer un gaspillage de temps. D’ailleurs, même le vendeur n’a aucun moyen pour mettre à disposition ses annonces de vente et services, à l’exception des supports traditionnels tels que les journaux ou les petites affiches. Ainsi, un moyen fiable et automatisé permettant d’informer un grand nombre de clients des offres de vente et des services nécessaires. 3. Problématique et présentation du sujet Afin de remédier aux différents problèmes ci-dessus mentionnés, on nous a confié la réalisation d'une application web proposant des offres de dépannages, afin de permettre aux internautes l’opportunité non seulement de la consultation des offres de dépannages en ligne mais aussi l'opportunité de poster des offres afin de devenir un prestataire de service. L'idée de cette application existe déjà en France, que ce soit pour un dépannage spécifique à la plomberie « www.plomberie-depannage.com » ou bien pour tout type de dépannages « www.mesdepanneurs.fr ». Alors pourquoi pas un site tunisien ?
  • 13. Chapitre 1 : Contexte Général Page | 4 La conception et le développement de cette application présentent le noyau de notre projet de fin d'études. III. Méthodologie de travail Cette partie, est réservée pour la représentation de la méthodologie optée pour but de mettre en place la solution. Notre projet sera développé en utilisant Agile comme méthodologie de développement. Les choses peuvent être confuses, étant donné la complexité de la nomenclature. Au début, on dirait presque que “Scrum” et “Agile” sont des mots interchangeables, mais ce sont deux notions bien distinctes.[1] 1. La méthode agile La méthode Agile permet de mieux maîtriser les projets informatiques sous les angles délais, coûts et résultats. Elle intègre aussi la notion de travail en équipe, une bonne communication entre les acteurs. Cela permet d'augmenter la crédibilité de la conduite de projet par une plus grande prévisibilité et une plus grande satisfaction des utilisateurs. Le but est d'apporter le plus de valeur possible aux projets, de garantir une meilleure qualité de communication avec l'utilisateur et un meilleur contrôle de qualité par le fait que les tests sont effectués en continu, ce qui permet de détecter rapidement les problèmes.[w1] 2. La méthode Scrum « La méthode Scrum (« Scrum » signifie « Mêlée » en anglais), ou plus exactement le cadre méthodologique Scrum est de loin la méthode Agile la plus utilisée dans le monde. Expérimentée en 1993, elle bénéficie aujourd’hui de nombreux retours d’expérience. Les conférences, communautés, formations, blogs, outils et ouvrages à son sujet ne manquent pas. » [w2] «Scrum» est utilisé depuis le début des années 1990 pour gérer le développement des produits complexes. Scrum n’est pas en soi un processus ni une méthode de développement de produits, c’est un canevas pour l’application de divers procédés et techniques de développement. Scrum met en évidence l’efficacité relative des pratiques de gestion et de développement de produit en place, de sorte que ces dernières puissent être améliorées. Scrum se compose de plusieurs éléments que sont l’équipe Scrum et ses rôles associés, les événements, les artéfacts et les règles.
  • 14. Chapitre 1 : Contexte Général Page | 5 Chaque élément a une raison d’être spécifique qui le rend indispensable à la réussite de l’application de Scrum. » [w3] La pratique de la méthode Scrum nous donne l’opportunité d’être intégré au sein de ce processus et de participer aux cycles de développement. Les termes les plus utilisés sont représentés par un tableau ci-dessous : Terme Définition Product Backlog C’est l’ensemble des fonctionnalités du produit que l’on veut développer sous forme de « User story ». Burndown Chart Diagramme qui permet de suivre l’état d’avancement du projet Daily Scrum meeting C’est une réunion organisée quotidiennement qui ne dure pas plus que 15 minutes Produit partiel Résultat du sprint testé et potentiellement livrable. Sprint Backlog Liste des fonctionnalités qui devront être mises en œuvre par le logiciel. Tableau 1: Tableau Les rôles en scrum La figure suivante illustre simplement la mise en œuvre de SCRUM dans le projet :
  • 15. Chapitre 1 : Contexte Général Page | 6 Figure 1: Cycle de vie de la méthode SCRUM Le principe de la méthode agile Scrum est de concentrer l'équipe de développement sur un ensemble de fonctionnalités à réaliser de façon itérative, dans des itérations d’une durée de deux à quatre semaines, appelées des Sprints. Chaque Sprint est caractérisé par un but défini par le directeur de produit (Product Owner). Ce dernier choisit les fonctionnalités à implémenter dans chaque itération. Chaque Sprint doit aboutir à la livraison d'un produit partiel. Durant un Sprint, le Scrum Master (le meneur et facilitateur du projet) à la charge de résoudre les problèmes non techniques et minimiser au maximum les perturbations extérieures. Un principe de base en Scrum consiste à la participation permanente et active des clients, afin de discuter les fonctionnalités du logiciel et de choisir les tâches qui seront implémentées dans chaque Sprint. Le client peut, à tout moment, modifier ou ajouter des fonctionnalités à réaliser, néanmoins, il ne peut pas interrompre ce qui est en cours de réalisation pendant un Sprint. [w4] •Scrum a pour objectif tout d'abord de produire un logiciel fonctionnel en mettant en avant la rentabilité et surtout la satisfaction du client. Ce dernier doit pouvoir donc juger, sur le tas, de l'avancement de son produit. •Dans la méthodologie Scrum, l'équipe de développement s'organise elle-même pour déterminer la meilleure façon de produire les exigences les plus prioritaires. •Scrum est une approche basée sur le principe d’une équipe soudée où il y a plus de coopération et de communication ; Des réunions se font tous les jours (Daily meeting) et chaque semaine (Weekly meeting) pour encadrer les équipes et recaler les objectifs.
  • 16. Chapitre 1 : Contexte Général Page | 7 •Finalement, à chaque fin de sprint, tout le monde a un pouvoir de décision. L'équipe devra décider de livrer le produit en l'état, ou de continuer à améliorer le produit sur une itération supplémentaire. [w5] Après avoir choisis la bonne méthodologie, qui est une étape importante durant le cycle de développement d’un produit informatique, nous allons présenter le formalisme choisi pour la conception du site web. [2] IV. Conclusion Au cours de ce chapitre, nous avons présenté l'organisme d'accueil ainsi qu'une description abrégée de notre projet à réaliser, tout en spécifiant la problématique et en proposant la solution envisagée pour affronter la situation actuelle. Nous avons aussi présenté le langage et la méthodologie choisie pour suivre notre projet. Dans le chapitre suivant nous allons faire la spécification et l'analyse des besoins ainsi que la définition de notre Backlog de produit et la préparation du planning de travail.
  • 17. Page | 8 Chapitre2: Spécification et analyse de besoins
  • 18. Chapitre 2 : Spécifications et analyse de besoins Page | 9 I. Introduction Avant de démarrer un projet, il est nécessaire de le définir et de le planifier afin de bien le piloter et d’atteindre les objectifs fixés. Dans ce chapitre, nous allons aborder la première phase de la méthode SCRUM qui est indispensable pour le reste du travail. Il sera donc question de définir et de spécifier les besoins fonctionnels et non fonctionnels avant d’analyser et de concevoir les diagrammes de cas d’utilisations ainsi que le prototypage des interfaces. II. Les rôles Scrum Dans Scrum l'équipe à un rôle important, elle est construite afin d'optimiser la productivité et la flexibilité. Donc, pour la réalisation et le développement d'un produit une équipe doit être bien qualifiée et compétente pour assurer le bon déroulement d'un projet. [2] Figure 2 : Les rôles du Scrum Scrum présente trois rôles principaux, expliqués dans ce tableau comme suit :
  • 19. Chapitre 2 : Spécifications et analyse de besoins Page | 10 Rôles Description Responsabilité Product Owner (Mohamed Bahri) C'est une personne qui représente les clients, éclaircir leurs besoins, détermine leurs priorités et prend les décisions nécessaires concernant l'acheminement du projet. • Doit porter la vision du produit • Doit être disponible pour l'équipe • Doit s'intéresser aux problèmes de l'équipe • Choisit la date et le contenu du release • Ajuster les fonctionnalités et les priorités à chaque sprint si nécessaire. Scrum Master (Amenallah Asli) C'est une personne qui s'assure de l'implication de chaque membre de l'équipe et de les aider à franchir les obstacles rencontrés. Autrement dit, c'est un coach qui aide son équipe à résoudre les problèmes. • Protéger l'équipe des interférences extérieures • S'assure que toute l'équipe est complètement fonctionnelle et productive • Programme des réunions et propose des solutions • Veille à l'amélioration de l'équipe Développement Team (-Oumaima Ouedherfi -Fatma Ezzahra Ghribi) Il n'y a pas de hiérarchie entre les membres de l'équipe, elle s'autogère. l’équipe est composée de 2 à 9 personnes, constituée d'une forte communication et Coopération entre les membres de l'équipe. • Partager les responsabilités de développement • Les membres prennent les décisions ensemble et s'adresse directement au client. Tableau 2 : Tableau Les rôles en Scrum Dans ce contexte de ce travail, la répartition des rôles aux différents membres est représentée à l'aide de ScrumWise comme suit :
  • 20. Chapitre 2 : Spécifications et analyse de besoins Page | 11 Figure 3 : La détermination des rôles Scrum III. Spécification des besoins Cette partie va servir à poser les bases du recueil des besoins du système à réaliser. Pour pouvoir clarifier les besoins des utilisateurs, qui ne sont pas toujours des informaticiens et de bien comprendre les fonctionnalités que le système doit fournir, nous allons déterminer les besoins fonctionnels et les besoins non fonctionnels. 1. Identification des acteurs Un acteur représente une abstraction d’un ensemble de rôles joués par des entités externes et interagissant directement avec le système. Il représente une personne, un matériel ou un logiciel qui interagit directement avec le système en question. Ce tableau propose une description détaillée de tous les acteurs qui interagissent avec le site.
  • 21. Chapitre 2 : Spécifications et analyse de besoins Page | 12 Acteur Rôle Administrateur Il est responsable de la gestion des offres et des profils des utilisateurs que ce soit un prestataire de service ou bien un particulier. Il assure aussi la maintenance de la plateforme. Prestataire Celui qui peut publier des offres, Il possède un compte professionnel. Client Celui qui peut consulter les offres disponibles, Il possède un compte user. Visiteur Il doit s'inscrire pour pouvoir accéder à l'application. Tableau 3 : Les acteurs et leurs rôles 2. Identification des besoins fonctionnels Les besoins fonctionnels sont les fonctionnalités qui doivent être offerts par le système et qui sont indispensables pour les utilisateurs. Les besoins fonctionnels nécessitent donc la mise en place d’un front office et d’un back office. a) Le FrontOffice est la vitrine du site, c’est la partie du site internet qui est visible par les internautes et avec laquelle il peut interagir. Le FrontOffice propose des fonctionnalités diverses aux visiteurs. - Les fonctionnalités destinées aux visiteurs : S’inscrire : Les visiteurs doivent créer un compte afin de bénéficier des privilèges de l’application, cette fonctionnalité donne accès aux visiteurs à deux choix soit s’inscrire en tant que prestataire de service ou bien en tant que client deux formulaire d’inscription qu’ils devront être remplis et validés, un email de validation de l’inscription sera envoyé par la suite à la messagerie électronique. - Les fonctionnalités destinées aux particuliers : S’authentifier : L’authentification permet la saisie du login et du mot de passe afin de pouvoir consulter les offres.
  • 22. Chapitre 2 : Spécifications et analyse de besoins Page | 13 Consulter les offres : Cette fonctionnalité permet aux particuliers de consulter les offres proposées par l’application web ainsi que la description et les informations appropriées de ces derniers. Rechercher une offre : Cette fonctionnalité permet aux particuliers de faire une recherche rapide et précise de l’offre désirée. - Les fonctionnalités destinées aux prestataires des services : S’authentifier : L’authentification permet la saisie du login et du mot de passe afin de pouvoir ajouter une offre Ajouter une offre : Cette fonctionnalité permet aux prestataires des services d’ajouter une offre. Consulter les offres : Cette fonctionnalité permet aux prestataires des services de consulter les offres proposées par l’application web ainsi que la description et les informations appropriées de ces derniers. Rechercher une offre : Cette fonctionnalité permet aux prestataires de faire une recherche rapide et précise de l’offre désirée. Gérer son profil : Chaque prestataire de service peut grâce à cette fonctionnalité modifier les informations relatives aux champs du formulaire qu’il a précédemment rempli tel que l’adresse électronique, son e-mail et son mot de passe. b) Le BackOffice est la partie invisible au public, elle n’est donc accessible que par le/les administrateur(s) du site qui permet de gérer le contenu et les fonctionnalités. Gérer les catégories : Cette fonctionnalité permet de consulter, de modifier, d’ajouter ou de supprimer un ou plusieurs catégories d’offres. Gérer les offres : Cette fonctionnalité permet de consulter, de modifier, d’ajouter ou de supprimer un ou plusieurs offres de plusieurs prestataires indépendants. Gérer les comptes : Cette fonctionnalité permet de consulter, de modifier, d’ajouter ou de supprimer un ou plusieurs profilent des prestataires du service ainsi que les particuliers. 3. Identification des besoins non fonctionnels : La sécurité : l'application devra sécurisée car les informations ne devront pas être accessibles à tout le monde. Performance : l’application doit être performant répond à toutes les exigences d’une manière optimale.
  • 23. Chapitre 2 : Spécifications et analyse de besoins Page | 14 La rapidité : la durée d'exécution des traitements s'approche le plus possible du temps réel. L’ergonomie : l’application doit être facile à utiliser et garantir une meilleure expérience aux utilisateurs. IV. Modélisation et analyse des besoins Dans cette partie, nous allons présenter le diagramme de cas d’utilisation global qui traduit d’une façon semi-formelle les fonctionnalités du système. Figure 4 : Diagramme de cas d’utilisation globale V. Le Backlog du produit Le Backlog Scrum est destiné à recueillir tous les besoins du client que l’équipe projet doit réaliser. Il contient donc la liste des fonctionnalités intervenant dans la constitution d’un produit, ainsi que tous les éléments nécessitant l’intervention de l’équipe projet. Tous les éléments inclus dans le Backlog scrum sont classés par priorité indiquant l’ordre de leur réalisation.
  • 24. Chapitre 2 : Spécifications et analyse de besoins Page | 15 Les caractéristiques fonctionnelles sont appelées des histoires utilisateurs (user story). Chacune de ces Stories doit avoir un but métier et, par la suite, représente un cas d’utilisation détaillé. Les histoires utilisateur de ce projet seront traitées par les cas d’utilisation les plus prioritaires.[3] Chaque histoire d’utilisateur contient une estimation qui est l’évaluation initiale de l’équipe sur la quantité de travail nécessaire pour implémenter cette exigence. Ce Backlog servira à piloter l’équipe de développement et pourra évoluer tout au long de notre projet. Pour estimer la complexité de nos user story, nous avons utilisé :  5 : Simple  8 : Normal  13 : Difficile  21 : Très Difficile Ce backlog compose de 7 éléments : Feature : Ordonner les user stories selon un sujet qui leur englobe. ID : l’identifiant du chaque user story. User Story : c’est une demande de fonctionnelle écrite pour mettre en avant les besoins d’utilisateur. Priorité : c’est la priorité de l’user story selon la valeur métier et l’ordre de réalisation Complexité : la complexité de la réalisation de chaque user story. Les critères d’acceptation : Représentent un ensemble de conditions que la story doit satisfaire pour être considérée comme complète. Feature ID User Story Priorité Complexité Les critères d’acceptation Sprints #AI20 En tant que visiteur je veux s’inscrire en tant que client. 1 13 - Remplir les champs du formulaire : Prénom *, Adresse mail*, Mot de passe*, Confirmer mot
  • 25. Chapitre 2 : Spécifications et analyse de besoins Page | 16 Gestion d’authentific ation et d’inscription de passe*. -Cliquez sur bouton créer un compte. -Cliquez sur bouton “demande un service” 1 #AI30 En tant que visiteur je veux s’inscrire en tant que prestataire. 2 21 - Remplir les champs du formulaire : Prénom *, Adresse mail*, Mot de passe*, Confirmer mot de passe*. -Cliquez sur bouton créer un compte. -Cliquez sur bouton ‘Devenir prestataire” - Remplir les champs du deuxième formulaire : Raison sociale *, Domaine*, Téléphone*, Région*, Statut*, Numéro fiscal, Tarif,
  • 26. Chapitre 2 : Spécifications et analyse de besoins Page | 17 Description. -Cliquer sur le bouton ‘Compléter infos’ #AI40 En tant qu’utilisateur je veux s'authentifier 2 5 -Insérer des données valides. -bouton (connecter) -Vérification de l’association Adresse mail /mot de passe : Chaque association Correspond à un profil (espace réservé) dépendant du rôle de l’utilisateur. OU -bouton (connecter avec Google). OU -bouton (connecter avec Facebook). #PS10 En tant que prestataire de service je veux ajouter 3 8 -Être Authentifié en tant que prestataire de
  • 27. Chapitre 2 : Spécifications et analyse de besoins Page | 18 Gestion des offres une offre. service - Remplir le champ du formulaire de l'ajout d’une offre. Titre*, Région*, Catégorie*, Description, - Clique sur le bouton “ajouter” 2 #PS20 En tant que prestataire je veux modifier mes offres. 3 8 -Être Authentifié -Accéder à “mes offres” -Sélectionner l’offre à modifier. -Modifier l’offre sélectionnée - Clique sur le bouton “Valider” #PS30 En tant que prestataire je veux supprimer une de mes offres. 4 8 -Être Authentifié -Accéder à l’offre à supprimer -Supprimer l’offre sélectionnée - Clique sur le
  • 28. Chapitre 2 : Spécifications et analyse de besoins Page | 19 bouton “Valider” #PU10 En tant que prestataire je veux consulter mes offres. 5 8 -Être Authentifié -Accéder à la page “mes offres” -Voir tous mes offres. #PU20 En tant que prestataire je veux consulter les détails de mon offre. 6 13 -Être Authentifié -Accéder à “mes offres” -Sélectionner l’offre à consulter - Accéder au détail. #PU30 En tant que client / prestataire je veux consulter les offres publier. 7 8 -Être Authentifié -Accéder aux catégories -Sélectionner une catégorie -Voir les offres. #PU40 En tant que client / prestataire je veux rechercher une offre. 8 13 Être Authentifié -Accéder aux offres -Rechercher une offre dans la zone de
  • 29. Chapitre 2 : Spécifications et analyse de besoins Page | 20 recherche ’ #PU50 En tant que client / prestataire je veux consulter les détails d’une offre. 9 13 -Être Authentifié -Accéder aux offres -Sélectionner une offre - Voir les détails de l’offre #PU60 En tant qu’administr ateur je veux consulter les offres. 10 13 -Être Authentifié -Accéder au ‘Option Admin’ - Accéder à la liste des offres. #AD4 0 En tant qu’administr ateur je veux ajouter une offre. 11 5 -Être Authentifié en tant qu’Administrate ur - Remplir les champs du formulaire. Titre*, Région*, Catégorie*, Description, - Clique sur le bouton “ajouter” #AD5 0 En tant qu’administr 12 5 --Être Authentifié en
  • 30. Chapitre 2 : Spécifications et analyse de besoins Page | 21 ateur je veux modifier une offre. tant qu’Administrate ur - Accéder à une offre -Modifié l’offre #AD6 0 En tant qu’administr ateur je veux supprimer une offre. 13 5 --Être Authentifié en tant qu’Administrate ur - Accéder à l’offre -Supprimer l’offre Gestion des comptes #AD1 0 En tant que client / Prestataire je veux consulter mon profil 14 8 -Être Authentifié -Accéder à ‘Mon profil’ 3 #AD2 0 En tant que client je veux consulter profil d’un prestataire 15 13 -Être Authentifié -sélectionner une offre -Voir le profil de prestataire #AD3 0 En tant que client je veux des informations 16 8 -Être Authentifié en tant que prestataire -Accéder à la
  • 31. Chapitre 2 : Spécifications et analyse de besoins Page | 22 ‘Chatbot’ #AD4 0 En tant qu’administr ateur je veux consulter la liste des comptes 17 8 -Être Authentifié -Accéder au ‘Option Admin’ - Accéder à la liste des utilisateurs En tant que client je veux devenir un prestataire 18 -Être Authentifié -Accéder au ‘Mon pr’ - cliquer sur « Devenir prestataire » #AD6 0 En tant qu’administr ateur je veux supprimer un compte utilisateur. 19 8 -Être Authentifié -Accéder au ‘Option Admin’ - Accéder à la liste des utilisateurs - Accéder au profil à supprimer -Supprimer le profil #AD7 0 En tant qu’administr ateur je veux modifier un compte 20 8 -Être Authentifié -Accéder au ‘Option Admin’ - Accéder à la
  • 32. Chapitre 2 : Spécifications et analyse de besoins Page | 23 utilisateur. liste des utilisateurs - Accéder au profil à modifier -Modifier le profil Tableau 4 : Le Backlog du produit VI. Le planning des sprints La réunion de planification des sprints est la partie la plus importante dans Scrum afin de préparer le planning de travail et d’identifier le backlog des sprints. Il s'agit de choisir la durée des sprints qui diffère selon la complexité du projet et le nombre de l'équipe. Ce projet sera divisé sur 3 sprints dont les durées en jours se diffèrent d’un sprint à un autre suivant la quantité de travail. La figure suivante résume notre planning de travail Sprint 1 Du 01/03/2019 au 22/03/2019 Sprint 2 Du 22/03/2019 au 17/04/2019 Sprint 3 Du 18/04/2019 au 03/05/2019 Tableau 5 : Tableau de planning de travail VII. Prototypages des interfaces Il s’agit de construire des prototypes d’apparence générale des interfaces utilisateurs. En effet, les interfaces graphiques font que l’utilisateur final soit plus interactif, précis et le poussent à mieux s’exprimer quant à ses attentes.
  • 33. Chapitre 2 : Spécifications et analyse de besoins Page | 24 Les interfaces utilisateurs relatives à l’inscription, l’authentification, page d'accueil, page des offres et leurs détails ainsi que la page profile s’illustrent comme suit : Figure 5 : Prototype de l’interface « inscription » Figure 6 : Prototype de l’interface « authentification »
  • 34. Chapitre 2 : Spécifications et analyse de besoins Page | 25 Figure 7 : Prototype de l’interface « page d'accueil » Figure 8 : Prototype de l’interface « page offres liste »
  • 35. Chapitre 2 : Spécifications et analyse de besoins Page | 26 Figure 9 : Prototype de l’interface « page offre cards » Figure 10 : Prototype de l’interface « page détails »
  • 36. Chapitre 2 : Spécifications et analyse de besoins Page | 27 Figure 11 : Prototype de l’interface « profil d’un particulier » VIII. Conclusion A la fin de ce chapitre, le plan de release à suivre a été préparé à partir du Backlog de sprint déjà défini. La définition du Backlog de produit a permis d’avoir une vision plus précise sur le sujet et une compréhension plus profonde des tâches à réaliser. L’énuméré des besoins fonctionnels et non fonctionnels du système ainsi que les acteurs et leurs rôles étaient à la base de l’élaboration de cette partie. Le prochain chapitre, sera consacré pour la phase de la réalisation de la solution.
  • 37. Page | 28 Chapitre3 : Conception et réalisation
  • 38. Chapitre 3 : Conception et réalisation Page | 29 I. Introduction Nous présentons dans ce chapitre la partie conception du projet. Nous commençons par présenter l’environnement matériel et logiciel dans lesquels l’application a été développée. Ensuite une description générale de notre application. Enfin nous mettons en évidence le côté conceptuel de notre application qui constitue une étape fondamentale qui précède l’implémentation, permet de détailler les différents diagrammes et scénarios à implémenter dans la phase suivante. Les exigences techniques II. Les Exigences techniques L’environnement de travail représente l’ensemble d’outils matériels et logiciels ainsi que les langages de programmation utilisés pour l'exécution d’une solution informatique. 1. Environnement matériel Ce projet a été réalisé sur deux ordinateurs ayant les caractéristiques suivantes : • Ordinateur : Asus • Processeur : Intel Core i3 • Mémoire vive : 8Go • Disque dur : 1To • Système d’exploitation : Microsoft Windows 10 • Ordinateur : Asus • Processeur : Intel Core i7 • Mémoire vive : 8Go • Disque dur : 1To • Système d’exploitation : Microsoft Windows 10 Tableau 6 : Tableau d’environnement matériel 2. Environnement logiciel et langages utilisés Le tableau ci-dessus représente l’ensemble des différents logiciels que nous avons combinés pour enfin avoir un résultat du travail :
  • 39. Chapitre 3 : Conception et réalisation Page | 30 Pour le développement d’Application Angular Avec cette technologie nous avons réalisé les interfaces pour pouvoir profiter du directif building qui améliorent le travail en équipe et les développements effectués en parallèle. Nous avons choisi firebase comme base de données parce qu'il offre des fonctionnalités telles que le Storage, la sécurité des données, la messagerie et le hosting qui permet de faciliter le travail du développement. Pour le design de l'application on a choisi Matériel Design. C’est un nouveau langage visuel et interactif de webdesign centré sur l’expérience de l'utilisateur. Adobe Photoshop il nous a aidés à traiter les images “web” Nous avons choisi Visual studio comme outil de développement parce qu'il nous permet de créer un environnement sur-mesure, c'est aussi techniquement abouti et très flexible. Côté fonctionnalités, VS Code se révèle bien pratique sur l'auto- complétion du code puissant. Dans un premier lieu, nous avons décidé de travailler avec des Template Porto qui utilisent les langages HTML CSS3 et bootstrap. Afin de pouvoir afficher des images de hautes qualité et d'utiliser des animations CSS3
  • 40. Chapitre 3 : Conception et réalisation Page | 31 En second temps, nous avons travaillé avec la template Fuse pour les raisons qu’il est un excellent outil et une excellente source d’apprentissage pour Angular. Mais il nécessite également au moins un niveau minimum de connaissances en Angular pouvoir repérer dans le code source. Conception Pour la conception UML s'était l’outil, Parce qu'il permet d’obtenir une modélisation de très haut niveau et de Faire collaborer des participants de tous horizons autour d'un même document de synthèse. Team work les raisons d'utiliser SourceTree pour Git s'était: Il permet de changer de copie de travail en un seul clic. Il indique également dans quelle mesure vous êtes en avance ou en retard par rapport à la version du référentiel et vous alerte de pousser ou de tirer. Donne une vue 'en temps réel' de vos fichiers locaux. Chaque modification de validation et de fichier est affichée et accessible. fournissant un outil très puissant pour le contrôle de version. TeamViewer est une solution rapide et sécurisée pour accéder à distance aux ordinateurs. Nous avons utilisé donc TeamViewer pour pouvoir accéder à l’ordinateur du binôme en cas de bug. Mail professionnelle sous la forme « unnom@cosaVostra » utiliser afin d'échanger des informations (Daily meeting, time, membres), des documents.
  • 41. Chapitre 3 : Conception et réalisation Page | 32 Slack Discussions sur le projet regroupe toute l'équipe de la société «CosaVostra» et toutes les informations utiles pour pouvoir collaborer en ligne. ChatBot DialogFlow c’est une interface API qui permet d’utiliser l’intelligence de Google, Dans le cadre de créer un ChatBots conversationnels pour mieux communiquer avec les utilisateurs de l’application. Maquettes le choix de travailler des maquettes avec balsamique pour la seule raison qu'on peut facilement créer une panoplie de dessins d’application (wireframe) en glissant et déposant des éléments dans l’interface. Scrum Tools on a pensé à Scrumwise comme solution de gestion de projet en ligne utilisé pour la gestion de projet en type Agile. Tableau 7 : Environnement logiciel et langage utilisés Pourquoi Angular?
  • 42. Chapitre 3 : Conception et réalisation Page | 33 Angular est l’un des Framework les mieux réputés et les plus utilisés par les développeurs de front-end. Il fournit donc nativement tout le nécessaire pour produire une application entière avec une configuration standard : Configuration de build et d'optimisation complète.  Module d'animations.  Module de "routing".  Module de formulaires. Les modules d’Angular permettent d'ajouter des fonctionnalités «bootstrap/Material Design» aux Framework de base afin de pouvoir l’enrichir. De plus Angular offre de nombreuses solutions et conceptions prêtes à l’emploi, Et il offre une documentation qui permet de trouver toutes les informations nécessaires rapidement. III. Réalisation des sprints 1. Étude et réalisation du sprint 0 A. Installation et configuration de l’environnement de travail L'environnement de travail désigne l’ensemble des logiciels sur lesquels sont exécutés les programmes de l'application web, Pour cela on a préparé :  Ide : Visual studio code https://code.visualstudio.com/  logiciel : Node js https://nodejs.org/en/download/ et Git https://git-scm.com/ Parce-que Angular nécessite un environnement de développement inclut Node.js et un système de contrôle de version.  Framework : Angular 7 https://angular.io/guide/quickstart/  Logiciel : Sourcetree (git) https://www.sourcetreeapp.com/  Base de données : Firebase https://firebase.google.com/docs/hosting/deploying B. Formation et développement des sites web
  • 43. Chapitre 3 : Conception et réalisation Page | 34 Une formation HTML CSS Angular était prise en charge par la société, Dans le cadre de notre formation et pour pratiquer les connaissances acquises auprès des tutoriels de la formation on a créé deux sites web développé en HTML CSS et Bootstrap en utilisant des Template Porto, Bootstrap est un Framework destiné à faciliter la création d’applications Web on peut l’intégrer avec HTML et avec Angular. Site TK-1 qui est la première ligue de kickboxing Tunisienne, Il est en ligne. Figure 12 : Interface Site Web « tk1 » Le deuxième site pour le Bijoutier ben Youssef. Figure 13 : Interface site web « Ben Youssef » C. Réalisation
  • 44. Chapitre 3 : Conception et réalisation Page | 35 Après une certaine maitrise de ces langages en a développé une Landing Page pour notre application «Oui Mr» elle se distingue des autres pages du site par le fait qu'elle est censée de représenter aux visiteurs, le site sur lequel il se trouve de manière claire et forte. Afin de montrer les résultats de ce sprint, nous allons présenter quelques captures d'écran : Figure 14 : Interface Landing Page « Accueil » Figure 15 : Interface Landing Page « A propos »
  • 45. Chapitre 3 : Conception et réalisation Page | 36 Figure 16 : Interface Landing Page « Service » Figure 17: Interface Landing Page « Employee of the month » 2. Étude et réalisation du sprint 1 L'équipe Scrum doit tout d'abord définir le but de ce sprint avant de s'y lancer. Le but doit être définie en terme métier et non pas en terme technique pour qu'il soit compréhensible par les membres en dehors de l'équipe. Ce sprint a pour but de développer la première partie de notre projet qui est la gestion d’authentification et inscription.
  • 46. Chapitre 3 : Conception et réalisation Page | 37 Le tableau suivant résume le Backlog du sprint 1 : Tableau 8: Backlog sprint 1 Cette partie comporte la conception du sprint 1 qui définit les composants sous forme de diagramme de cas d’utilisation et diagramme de séquence système détaillé. A. Diagramme des cas d'utilisation La figure ci-dessus nous présente le diagramme des cas d'utilisations globaux pour ce premier sprint. Figure 18 : Diagramme de cas d’utilisation de sprint 1
  • 47. Chapitre 3 : Conception et réalisation Page | 38 B. Analyse et raffinement de cas d’utilisation Le raffinement de cas d’utilisation consiste à recenser toutes les interactions entre le système et les acteurs de façon textuelle. Le cas d’utilisation doit avoir un début et une fin clairement identifiés. Il doit préciser quand ont lieu les interactions entre acteurs et système, et quels sont les messages échangés. Il faut également préciser les variantes possibles sous forme de cas nominaux, les cas alternatifs, les cas d’erreurs, tout en essayant d’ordonner séquentiellement les descriptions, afin d’améliorer leur lisibilité. Chaque unité de description de séquences d’actions est appelée enchaînement. Un scénario représente une succession particulière d’enchaînements, qui s’exécute du début à la fin du cas d’utilisation. Dans cette partie nous avons raffiné les cas d’utilisations de sprint 1. a. Raffinement de cas d’utilisation « s’inscrire » Figure 19 : Raffinement de cas d’utilisation “s’inscrire”  Description textuelle du cas d'utilisation « s’inscrire » Titre : S’inscrire Acteur : Visiteur Pré-condition : Accéder à la page inscription. Post-condition : Visiteur inscrit Scénario Nominal (1) : inscription de simple utilisateur : Ce cas d’utilisation commence lorsque le visiteur demande au système de s’inscrire en tant que simple utilisateur. 1) L’utilisateur remplit le formulaire d’inscription. 2) L’utilisateur clique sur le bouton S’inscrire. 3) Le système envoie les données à la base de données. 4) le système affiche un mail de confirmation de l'inscription. Scénario Nominal (2) : inscription de prestataire de service : Ce cas d’utilisation commence lorsque l’utilisateur demande au système de s’inscrire en tant que prestataire de service, ce scénario ressemble au scénario (1) sauf que le formulaire est différent.
  • 48. Chapitre 3 : Conception et réalisation Page | 39 Scénario alternatif : 1 : l’email saisi est déjà utilisé. 2 : Les données obligatoires ne sont pas saisies. 3 : le format de l’email est incorrect. Le système affiche un message d’erreur. Tableau 9 : Description textuelle de cas d'utilisation « s’inscrire » b. Raffinement de cas d’utilisation « S’authentifier » Figure 20 : Raffinement de cas d’utilisation “s’authentifier”  Description textuelle de cas d'utilisation « s’authentifier » Titre : S’authentifier Acteur : Prestataire Pré-condition : Accéder à la page d’authentification Post-condition : Prestataire s’authentifier Scénario Nominal (1) : s’authentifier avec mail : Ce cas d’utilisation commence lorsque le prestataire demande au système de s’authentifier avec mail. 1) L’utilisateur saisit son mail et son mot de passe. 2) L’utilisateur clique sur le bouton login. 3) Le système vérifier les données à la base de données. 4) le système ouvre la page d’accueil. Scénario Nominal (2) : s’authentifier avec Facebook : Ce cas d’utilisation commence lorsque l’utilisateur demande au système de s’authentifier avec Facebook.
  • 49. Chapitre 3 : Conception et réalisation Page | 40 1) L’utilisateur clique sur le bouton “Se connecter avec Google”. 2) Le système vérifier les données à la base de données. 3) le système ouvre la page d’accueil. Scénario Nominal (3) : s’authentifier avec Gmail : Ce cas d’utilisation commence Lorsque l’utilisateur demande au système de s’authentifier avec Gmail ; ce scénario ressemble au scénario(2) sauf que le bouton change. Scénario alternatif : 1 : l’email saisi est incorrect. 2 : le mot de passe saisi est incorrect. 3 : le format de l’email est incorrect. Le système affiche un message d’erreur. Tableau 10 : Description textuelle de cas d'utilisation « s’authentifier» C. Conception Au niveau de la conception. Diagramme de séquence assure une représentation des collaborations entre des objets pour la réalisation d’un cas d’utilisation, selon un point de vue temporel et une représentation de la chronologie des envois de messages entre les objets. a. “S’inscrire”  Diagramme de séquence « s’inscrire »
  • 50. Chapitre 3 : Conception et réalisation Page | 41 Figure 21 : Diagramme de séquence « s’inscrire » b. “Authentification”  Diagramme de séquence « s’authentifier »
  • 51. Chapitre 3 : Conception et réalisation Page | 42 Figure 22 : Diagramme de séquence« s’authentifier » D. Réalisation Afin de montrer les résultats de ce sprint, nous allons présenter quelques captures d'écran. La figure ci-dessous représente la page d’inscription.
  • 52. Chapitre 3 : Conception et réalisation Page | 43 Figure 23 : Interface « Inscription » L’interface suivant permet à l’utilisateur d’accéder au système après une validation de son mail et son mot de passe. Figure 24 : Interface « Authentification »
  • 53. Chapitre 3 : Conception et réalisation Page | 44 E. Burndown Burndown chart est un graphe, mis à jour à la fin de chaque sprint, montrant la tendance de l’avancement dans la réalisation des éléments du backlog. [1] Figure 25 : Burndown du sprint 1 F. Rétrospective Au cours de la réalisation de ce sprint ce qui bien marché s’authentifier et inscription, aussi nous avons rencontré quelques problèmes, à savoir : -l’inscription pour le prestataire. 3. Etude et la réalisation du sprint 2 Ce sprint a pour but de développer la deuxième partie de notre projet qui est la gestion des offres. Le tableau suivant résume le backlog du sprint 2 :
  • 54. Chapitre 3 : Conception et réalisation Page | 45 Tableau 11 : Backlog sprint 2 La partie suivante comporte Dans notre cas, la spécification fonctionnelle s'introduit par le diagramme de cas d'utilisation d'UML, la description textuelle et les diagrammes de séquences de ces derniers. A. Diagramme des cas d'utilisation La figure ci-dessus nous présente le diagramme de cas d'utilisations de sprint 2: Figure 26 : Diagramme de cas d’utilisation de sprint 2
  • 55. Chapitre 3 : Conception et réalisation Page | 46 B. Analyse et raffinement de cas d’utilisation a. Raffinement de cas d’utilisation « Consulter les offres » Figure 27 : Raffinement de diagramme de cas d’utilisation “consulter offre”  Description textuelle de cas d'utilisation « Consulter les offres » Titre : Consulter les offres Acteur : Client Pré-Condition : Être authentifié Post-Condition : Choisir Catégorie, Recherche une offre, Consulter détail des offres Scénario Nominal (1) : Consulter les offres : Ce cas d’utilisation commence lorsque le client demande à la plateforme de consulter les offres. 1) Le client accède à la page d’accueil du site. 2) Le client clique sur la page offres. Tableau 12 : Description textuelle de cas d'utilisation « Consulter les offres »  Description textuelle de sous cas d'utilisation « Consulter détail d’une offre» Titre : Consulter détail d’une offre Acteur : Client Pré-Condition : Consulter les offres Post-Condition : Consulter détail d’offre Scénario Nominal (1) : Consulter détail une offre : Ce cas d’utilisation commence
  • 56. Chapitre 3 : Conception et réalisation Page | 47 lorsque le client demande à la plateforme de consulter une offre. 1) Le client accède à la page d’accueil du site. 2) Le client se redirige vers la page des catégories. 3) Le client choisit catégorie à consulter ces offres. 4) Le client clique sur une offre. 5) Page de détail s’ouvre. Tableau 13 : Description textuelle de sous cas d'utilisation «Consulter détails des offre»  Description textuelle de sous cas d'utilisation « Recherche une offre» Titre : Recherche une offre Acteur : Client Pré-Condition: Consulter les offres Post-Condition: Recherche une offre Scénario Nominal (1) : Recherche une offre : Ce cas d’utilisation commence lorsque le client demande à la plateforme de recherche une offre. 1) Le client accède à la page d’accueil. 2) Le client se redirige vers la page des catégories. 3) Le client choisit catégorie à consulter ces offres. 4) Le client écrit dans la zone de recherche. 5) résultat de recherche affiche. Scénario alternatif : 1 : aucune offre trouvée : Le système n’affiche aucun résultat. Tableau 14 : Description textuelle de sous cas d'utilisation «Rechercher une offre »  Description textuelle de sous cas d'utilisation « Choisir catégorie» Titre : Choisir catégorie Acteur : Client Pré-Condition : Consulter les offres
  • 57. Chapitre 3 : Conception et réalisation Page | 48 Post-Condition : Choix d’une catégorie Scénario Nominal (1) : Choisir catégorie : Ce cas d’utilisation commence lorsque le client demande à la plateforme de choisir catégorie. 1) Le client accède à la page d’accueil. 2) Le client se redirige vers la page des catégories. 3) Le client choisit catégorie à consulter. Tableau 15 : Description textuelle de sous cas d'utilisation « Choisir catégorie » b. Raffinement de cas d’utilisation « Gérer ses offres » Figure 28 : Raffinement diagramme de cas d’utilisation “Gérer ses offres”  Description textuelle de sous cas d'utilisation « Gérer ses offres » Titre : Gérer ses offres Acteur : Prestataire Pré-Condition : Être authentifié Post-Condition : Gérer ses offres Scénario Nominal (1) : Gérer ses offres : Ce cas d’utilisation commence lorsque le prestataire demande à la plateforme de Gérer ses offres. 1) Le prestataire accède à la page d’accueil. 2) Le prestataire se redirige vers la page « mes offres ».
  • 58. Chapitre 3 : Conception et réalisation Page | 49 Tableau 16 : Description textuelle de cas d'utilisation « Gérer ses offres »  Description textuelle de sous cas d'utilisation « Ajouter une offre » Titre : Ajouter une offre Acteur : Prestataire Pré-Condition : Consulter ses offres Post-Condition : Offre Ajoutée Scénario Nominal (1) : Ajouter offre : Ce cas d’utilisation commence lorsque le prestataire demande à la plateforme d’ajouter une offre. 1) Le prestataire accède à la page d’accueil du site. 2) Le prestataire clique sur le lien ajouter une offre. 3) Le prestataire remplit le formulaire d’ajout. 4) Le prestataire cliquez sur le bouton ajouter. Tableau 17 : Description textuelle de sous cas d'utilisation « Ajouter une offre »  Description textuelle de sous cas d'utilisation « Consulter ses offres » Titre : Consulter ses offres Acteur : Prestataire Pré-Condition : Gérer ses offres Post-Condition : Consulter ses offres Scénario Nominal (1) : Consulter ses offres : Ce cas d’utilisation commence lorsque le prestataire demande à la plateforme de consulter ses offres. 1) Le prestataire accède à la page d’accueil. 2) Le prestataire se redirige vers la page « mes offres ». 3) Le prestataire consulte sa liste des offres. Tableau 18 : Description textuelle de sous cas d'utilisation « Consulter ses offres »
  • 59. Chapitre 3 : Conception et réalisation Page | 50  Description textuelle de sous cas d'utilisation « Modifier une offre» Titre : Modifier une offre Acteur : Prestataire Pré-Condition : Consulter ses offres Post-Condition : Offre modifiée Scénario Nominal (1) : Modifier offre : Ce cas d’utilisation commence lorsque le prestataire demande à la plateforme de modifier une offre. 1) Le prestataire accède à la page d’accueil du site. 2) Le prestataire se redirige vers la page mes offres. 3) Le prestataire choisit l’offre à modifier. 4) Le prestataire valide la modification de l’offre. Tableau 19 : Description textuelle de sous cas d'utilisation « Modifier une offre »  Description textuelle de sous cas d'utilisation « Supprimer une offre » Titre : Supprimer une offre Acteur : Prestataire Pré-Condition : Consulter ses offres Post-Condition : offre supprimée Scénario Nominal (1) : Supprimer offre : Ce cas d’utilisation commence lorsque le prestataire demande à la plateforme de supprimer une offre. 1) Le prestataire accède à la page d’accueil du site. 2) Le prestataire se redirige vers la page mes offres. 3) Le prestataire choisit l’offre à supprimer. 4) Le prestataire cliquez sur le bouton Supprimer. Tableau 20 : Description textuelle de sous cas d'utilisation « Supprimer une offre »
  • 60. Chapitre 3 : Conception et réalisation Page | 51 C. Conception a. “Consulter ses offres”  Diagramme de séquence « Ajouter une offre » Figure 29 : Diagramme de séquence « Consulter les offres » b. “Consulter détail d'une offre ”  Diagramme de séquence système «Consulter détail d’une offre» Figure 30 : Diagramme de séquence « Consulter détails d'une offre »
  • 61. Chapitre 3 : Conception et réalisation Page | 52 c. “Rechercher une offre”  Diagramme de séquence « Rechercher une offre » Figure 31 : Diagramme de séquence « Rechercher une offre » d. “Choisir Catégorie ”  Diagramme de séquence « Choisir catégorie » Figure 32 : Diagramme de séquence « Choisir catégorie »
  • 62. Chapitre 3 : Conception et réalisation Page | 53 e. “Consulter ses offres”  Diagramme de séquence « Consulter ses offres » Figure 33 : Diagramme de séquence « Consulter ses offres » f. “Ajouter une offre”  Diagramme de séquence « Ajouter une offre » Figure 34 : Diagramme de séquence « Ajouter une offre »
  • 63. Chapitre 3 : Conception et réalisation Page | 54 g. “Supprimer une offre”  Diagramme de séquence « Supprimer une offre » Figure 35 : Diagramme de séquence « Supprimer une offre » h. “Modifier une offre ”  Diagramme de séquence « Modifier une offre »
  • 64. Chapitre 3 : Conception et réalisation Page | 55 Figure 36 : Diagramme de séquence « Modifier une offre » D. Réalisation Afin de montrer les résultats de ce sprint, nous allons présenter quelques captures d'écran. La figure ci-dessous représente la page d’ajout. Figure 37 : Interface « Ajouter une offre » La figure ci-dessous représente la page de modifier en affichant l’interface de modifier et le bouton de suppression.
  • 65. Chapitre 3 : Conception et réalisation Page | 56 Figure 38 : Interface « Modifier une offre » La figure ci-dessous permet d'afficher les détails d’une offre: Figure 39 : Interface « Détails d’une offre » La figure représente la page des offres d’un prestataire, Ici le prestataire peut supprimer et modifier ces offres : Figure 40 : Interface « Liste de mes offres »
  • 66. Chapitre 3 : Conception et réalisation Page | 57 La figure représente la page des offres de tous les prestataires : Figure 41 : Interface « liste des offres » E. Burndown Figure 42 : Burndown du sprint 2
  • 67. Chapitre 3 : Conception et réalisation Page | 58 F. Rétrospective Au cours de la réalisation de ce sprint ce qui bien marché l’ajout, suppression et la modification, aussi nous avons rencontré quelques problèmes, à savoir : -la recherche qui en peut l’améliore pour être plus précise 4. Étude et réalisation du sprint 3 Nous allons entamer le dernier Sprint. Pour cela, Nous commençons par présenter le Backlog du ce sprint, ensuite nous passons à la conception et nous clôturons par la partie la réalisation. Le tableau suivant résume le backlog du sprint 3 : Tableau 21: Backlog sprint 3 Cette partie comporte la conception du sprint 3 qui définit les composants sous forme de diagramme de cas d’utilisation et diagramme de séquence système détaillé. A. Diagramme des cas d'utilisation La figure ci-dessus nous présente le diagramme de cas d'utilisations de sprint 3 :
  • 68. Chapitre 3 : Conception et réalisation Page | 59 Figure 43 : Diagramme de cas d’utilisation de sprint 3 B. Analyse et raffinement de cas d’utilisation a. Raffinement de cas d’utilisation « Assistance Artificielle »  Description textuelle de sous cas d'utilisation « Assistance Artificielle » Titre : Assistance Artificielle Acteur : Client Pré-Condition : Être authentifié Post-Condition : Avoir une information Scénario Nominal (1) : Recherche une offre : Ce cas d’utilisation commence lorsque le client demande à la plateforme d’avoir une information. 1) Le client accède à la page d’accueil. 2) Le client clique sur icone “chatbot”. 3) Le client tape sa question dans la zone “écrire un message”. Tableau 22 : Description textuelle de sous cas d'utilisation « Assistance Artificielle»
  • 69. Chapitre 3 : Conception et réalisation Page | 60 b. Raffinement de cas d’utilisation « Consulter profil prestataire »  Description textuelle de sous cas d'utilisation « Consulter profil prestataire » Titre : Consulter profil d’un prestataire Acteur : Client Pré-Condition: Être authentifié Post-Condition: Consulter profil d’un prestataire Scénario Nominal (1): Recherche une offre : Ce cas d’utilisation commence lorsque le client demande à la plateforme de consulter profil d’un prestataire. 1) Le client accède à la page d’accueil. 2) Le client se redirige vers la page des catégories. 3) Le client choisit catégorie à consulter ces offres. 4) Le client choisit l’offre à consulter. 5) le client clique sur onglet “Profil de prestataire”. Tableau 23 : Description textuelle de sous cas d'utilisation « Consulter profil d’un prestataire » c. Raffinement de cas d’utilisation « Devenir prestataire » Figure 44 : Raffinement de diagramme de cas d’utilisation “Devenir prestataire”  Description textuelle de sous cas d'utilisation « Devenir prestataire » Titre : Devenir Prestataire Acteur : Client Pré-Condition: Être authentifié Post-Condition: passée au profil prestataire Scénario Nominal (1) : Consulter mon profil : Ce cas d’utilisation commence lorsque
  • 70. Chapitre 3 : Conception et réalisation Page | 61 Le client demande à la plateforme de devenir prestataire 1) Le client accède à la page d’accueil du site. 2) Le client se redirige vers la page ‘mon profil’. 3) Le client clique sur le bouton “devenir prestataire” 4) Le client remplie le formulaire de prestataire. Tableau24: Description textuelle de sous cas d'utilisation « Devenir Prestataire » d. Raffinement de cas d’utilisation « Consulter son profil »  Description textuelle de sous cas d'utilisation « Consulter son profil » Titre : Consulter son profil Acteur : Prestataire ou client Pré-Condition: Être authentifié Post-Condition: profil consultée Scénario Nominal (1) : Consulter mon profil : Ce cas d’utilisation commence lorsque le prestataire ou client demande à la plateforme de consulter son profil. 1) Le Prestataire ou client accède à la page d’accueil du site. 2) Le prestataire ou client se redirige vers la page ‘mon profil’. 3) Page de profil s’ouvre. Tableau 25 : Description textuelle du cas d'utilisation « Consulter son profil » e. Raffinement de cas d’utilisation « Consulter liste des Comptes » Figure 45 : Raffinement de diagramme de cas d’utilisation “Consulter liste des comptes”
  • 71. Chapitre 3 : Conception et réalisation Page | 62  Description textuelle de cas d'utilisation « Consulter liste des Comptes » Titre : Consulter liste des comptes Acteur : Administrateur Pré-Condition : Être authentifié Post-Condition : Consulter liste des comptes Scénario Nominal (1) : Consulter liste des comptes : Ce cas d’utilisation commence lorsque l’administrateur demande à la plateforme de consulter liste des comptes. 1) L’administrateur accède à la page d’accueil. 2) Le client se redirige vers la page “Option Admin”. 3) Le client choisit “la liste des comptes” Tableau 26 : Description textuelle de cas d'utilisation « Consulter liste des Comptes »  Description textuelle de sous cas d'utilisation « Modifier un compte » Titre : Modifier un compte Acteur : Administrateur Pré-Condition : Consulter liste des comptes Post-Condition: Compte modifiée Scénario Nominal (1) : Modifier compte : Ce cas d’utilisation commence lorsque le prestataire demande à la plateforme de modifier un compte. 1) L’administrateur accède à la page d’accueil du site. 2) L’administrateur se redirige vers la page option admin. 3) L’administrateur choisit la liste des comptes. 4) L’administrateur choisit le compte à modifier. 5) L’administrateur valide la modification du compte. Tableau 27 : Description textuelle de sous cas d'utilisation « Modifier un compte »
  • 72. Chapitre 3 : Conception et réalisation Page | 63  Description textuelle de cas d'utilisation « Supprimer un compte » Titre : Supprimer un compte Acteur : Administrateur Pré-Condition : Consulter liste des comptes Post-Condition : Compte supprimée Scénario Nominal (1) : Supprimer compte : Ce cas d’utilisation commence lorsque le prestataire demande à la plateforme de supprimer un compte. 1) L’administrateur accède à la page d’accueil du site. 2) L’administrateur se redirige vers la page option admin. 3) L’administrateur choisit la liste des comptes. 4) L’administrateur choisit le compte à supprimer. 5) L’administrateur valide la suppression du compte. Tableau 28 : Description textuelle de sous cas d'utilisation « Supprimer un compte » C. Conception a. Assistance Artificielle  Diagramme de séquence « Assistance Artificielle » Figure 46 : Diagramme de séquence « Consulter mon profil »
  • 73. Chapitre 3 : Conception et réalisation Page | 64 b. Consulter profil prestataire  Diagramme de séquence « Consulter mon profil » Figure 47 : Diagramme de séquence « Consulter mon profil » c. “Devenir prestataire”  Diagramme de séquence système « Devenir prestataire » Figure 48 : Diagramme de séquence « Devenir Prestataire »
  • 74. Chapitre 3 : Conception et réalisation Page | 65 d. “Consulter liste des comptes”  Diagramme de séquence « Consulter liste des comptes » Figure 49 : Diagramme de séquence « Consulter liste des comptes » e. “Modifier un compte”  Diagramme de séquence « Modifier un compte » Figure 50 : Diagramme de séquence « Modifier un compte »
  • 75. Chapitre 3 : Conception et réalisation Page | 66 D. Réalisation Afin de montrer les résultats de ce sprint, nous allons présenter quelques captures d'écran. La figure ci-dessous représente la page Consulter mon profil. Figure 51 : Interface « Mon Profil» La figure représente la page de consulter la liste des comptes, aussi des boutons pour supprimer et modifier les comptes, disponible pour les administrateurs uniquement : Figure 52 : Interface « liste des comptes »
  • 76. Chapitre 3 : Conception et réalisation Page | 67 La figure ci-dessous permet d'afficher le profil du prestataire de service, la personne qui a ajouté l'offre : Figure 53: Interface « Profil d’un prestataire » E. Burndown Figure 54 : Burndown du sprint 3
  • 77. Chapitre 3 : Conception et réalisation Page | 68 F. Rétrospective Au cours de la réalisation de ce sprint ce qui bien marché consulter son profil et la liste de son profil, aussi nous avons rencontré quelques problèmes, à savoir : -devenir un prestataire et comment on passe de profil prestataire au profil client IV. Diagramme de classe général Pour le stockage de données nous avons utilisé la nouvelle génération de bases de données qui ne suivent pas le modèle relationnel des bases de données classiques firebase, C’est une base de données No SQL construite pour les applications en général. Une base de données entièrement gérée et native au cloud qui facilite le stockage, la synchronisation et l'interrogation des données pour les applications Web, mobiles. Notre base de données contient uniquement deux collections users et offres, la première contient toutes les informations concernant les utilisateurs et la deuxième contient toutes les informations concernant les offres. Figure 55 : Diagramme de classe général
  • 78. Chapitre 3 : Conception et réalisation Page | 69 V. Conclusion Au cours de ce tout dernier chapitre, nous avons présenté l'environnement logiciel et matériel. Ainsi le langage que nous avons utilisé pour développer notre application. Par la suite une présentation détaillée de chacun des 3 sprints a été faite selon la méthodologie de gestion de projet SCRUM, en présentant la conception de chaque sprint, la réalisation des interfaces les plus importantes pour chaque sprint, Burndown et enfin les rétrospective de chaque sprint.
  • 79. Conclusion général et perspectives Page | 70 Conclusion et perspectives Nous avons essayé tout au long de notre travail de construire notre application en ligne incrément par incrément en utilisant la méthodologie Scrum. Le présent rapport détaille toutes les étapes par lesquelles nous sommes passés pour arriver au résultat attendu. C’était une expérience à la fois enrichissante et passionnante. Elle nous a permis de faire un premier pas vers le milieu professionnel, d’interagir avec ce nouveau monde et de se sentir un acteur actif et agissant dans cette dynamique entrepreneuriale. Notre expérience au sein de la société « Cosa Vostra » nous a offert l’occasion de nous prendre en charge, et de pousser toutes nos limites pour nous surpasser et présenter un projet fini à l’image de la réputation de notre prestigieux institut. Sur le plan humain, ce stage nous a offert la possibilité d’améliorer nos capacités d’adaptation, de communication et d’acquérir des facultés de collaboration avec l’environnement professionnel. Ce projet nous a aussi offert l’opportunité d’acquérir une expérience pour gérer le travail au sein d’une hiérarchie du point de vue amélioration de notre aptitude en communication, collaboration, adaptation avec l’environnement professionnel et respect des échéances. En conclusion, ce stage a été une expérience extrêmement enrichissante tant sur le plan personnel que professionnel. Il nous a non seulement permis de découvrir l’univers du travail mais encore d’avoir une vision plus claire sur notre avenir. En plus des fonctionnalités déjà développées, l’application peut être améliorée par l’ajout des nouvelles fonctionnalités telles que l’ajout d’une interface de chat entre le particulier et le prestataire de service. En plus, nous comptons améliorer notre solution en se basant sur les points faibles dégagés au cours de son utilisation.
  • 80. Bibliographie & Webographie Page | 71 Bibliographie [1] B.E & M.S Bachtobji, «Rapport PFE,» 2016. [2] «SCRUM le guide pratique de la méthode agile la plus populaire » Dunod,2010. [3] le backlog de produit-Scrum, Agilité et Rock’nroll book Webographie [w1] L’agiliste. Guide de démarrage Scrum. Juin 2013. Disponible sur : http://www.agiliste.fr/fiches/guide-demarrage-scrum/ (Consulté le 26/03/2019) [w2]SARFATI, P. (2015, 02 19).Formations Scrum. Récupéré sur scrum.fr: http://www.scrum.fr/formation-scrum/ (Consulté le 02/04/2019) [w3] L’agiliste. Guide de démarrage Scrum. Juin 2013. Disponible sur : http://www.agiliste.fr/fiches/guide-demarrage-scrum/ (Consulté le 05/04/2019) [w4]http://www.icescrum.org/ (Consulté le 10/05/2019) [w5]http://support.objecteering.com/objecteering6.1/help/fr/objecteering_uml_modeler/diagra ms/ class_diagrams.htm (Consulté le 13/05/2019) [w6] https://www.scrumwise.com/ (Consulté le 12/05/2019)
  • 81. Rapport de stage IHEC, Carthage 2019 RESUME Ce projet de fin d’étude est réalisé dans le cadre de projet de fin d’études en vue de L’obtention du diplôme de la licence appliquée en technologie de l’information appliqué à la gestion. Il a été développé au sein de la société CosaVostra, en collaboration avec Institut des hautes études Commerciales de Carthage . Ce projet s’intitule «Réalisation d’une application de mise en relation B2C de professions libérales », consiste à concevoir et développer une plateforme dont laquelle nous avons utilisée UML comme langage de modélisation, FireBase comme système de gestion de base de données et les technologies Web : Angular, HTML5, CSS3, Bootstrap. Mots clés: Angular, UML, HTML5, CSS3, Bootstrap, firebase. SUMMARY This project of end of studies is carried out as part of a graduation project aimed at obtaining a degree in applied information technologie applied to management. It has been developed within the company CosaVostra, in collaboration with the Institute of Higher Commercial Studies of Carthage. This project is titled " Realization of a B2C linking application for liberal professions ", consists in designing and developing a platform of which we used UML as a modeling language, FireBase as a database management system and web Technologies : Angular, HTML5, CSS3, Bootstrap. Key words: Angular, UML, HTML5, CSS3, Bootstrap, firebase.