Vous êtes sur la page 1sur 114

Université Abdelmalek Essaâdi

Ecole Nationale des Sciences


Appliquées Al Hoceima Filière :
Génie Informatique

N° d’ordre :

MÉMOIRE DE PROJET DE FIN D’ÉTUDES


Présenté à

L’ÉCOLE NATIONALE DES SCIENCES APPLIQÉES AL HOCEIMA

En vue de l’obtention

Du Diplôme d’Ingénieur d’État


Spécialité : Génie Informatique
Option : Génie Logiciel

Réalisé au sein de : VirtuoCode

Développement d'un module de gestion des campagnes


publicitaires organiques et payantes dans la plateforme
MyMobilosoft

Réalisé par :

IKHARMEJ Abderrazaq

Encadré par :
Pr. MOUSSAID Ahmed (ENSA Al-Hoceima)
M. AZOUAGH Noureddine (VirtuoCode)

Soutenu le : 01 juillet 2021, devant le Jury :

Prof. KOULALI SARA (ENSA Al-Hoceima)


Prof. KANNOUF NABIL (ENSA Al-Hoceima)
Prof.MOUSSAID AHMED (ENSA Al-Hoceima)

Année Universitaire : 2020/2021


Dédicaces
A Allah le Tout Miséricordieux

À ma très chère mère, en témoignage de ma profonde gratitude et de mon incontestable


reconnaissance, pour son soutien tout au long de mon cursus, toute la confiance qu’elle
m’accorde et tout l’amour dont elle m’entoure, ses prières et ses bénédictions m’ont été
d’un grand secours pour mener à bien mes études.

À mon très cher père, celui qui m’a toujours indiqué la bonne voie, en signe d’amour, de
gratitude pour tous les soutiens et les sacrifices dont il a fait preuve à mon égard,

Nul mot ne saurait exprimer à sa juste valeur le dévouement et le profond respect que je
porte envers vous. Que DIEU vous préserve et vous accorde, santé, bonheur et prospérité

À mon cher frère, qui est toujours là pour moi et à mes côtés, disposés à me tendre la
main et à me soutenir dans tout ce que j’entreprendrai.

À toute ma famille,

À mes amis, et à tous mes proches,

À tous ceux qui m’aiment, je dédie cet humble travail.

Abderrazaq IKHARMEJ

Abderrazaq Ikharmej II 2020-2021


Remerciements
Je remercie piètrement Allah le tout puissant de m’avoir donné le courage

et la volonté de mener à terme ce présent travail.

Ma gratitude, plus que sincère et profonde, à Monsieur le Professeur

MOUSSAID Ahmed qui m’a encadré, soutenu, accompagné durant cette période

de stage de projet de fin d’études.

Je tiens à adresser mes vifs remerciements à Mr AZOUAGH Noureddine

pour son accompagnement quotidien, ses remarques toujours affûtées et ses

encouragements, ainsi que pour le temps qu’il m’a consacré tout au long de cette

période de stage.

Mes sincères remerciements pour tous les collaborateurs de VirtuoCode

pour leur accueil, leurs aides et pour leurs conseils.

Mes remerciements vont également aux membres du jury. Merci à eux

d’avoir accepté l’évaluation de ce travail et les implications afférentes.

Enfin, je tiens également à adresser mes affectueux remerciements à

l’ensemble du corps professoral et administratif de l'ENSAH, de m’avoir donné

toutes les connaissances nécessaires durant mes cinq années d’études, et ce dans

un cadre agréable de complicité et de respect.

Abderrazaq Ikharmej III 2020-2021


Résumé
Le présent document constitue le fruit d’un travail accompli dans le cadre du projet de
fin d’études qui m’a été confié durant mon stage au sein de l’entreprise VirtuoCode.
L’objectif du stage était de participer activement à la conception et la mise en œuvre du
nouveau hub« Campagne Beta » qui est un nouveau hub qui va être ajouter au hubs déjà existant
dans la plateforme MyMobilosoft , ce dernier a comme objectif de publier les campagnes
organique sur trois canaux ( Facebook , store Locator, les fiches Google My Business) et
payante sur google AdWords . Campagne Beta est composée de deux parties : Le premier est
dédié aux campagnes organiques, et le second dédié aux campagnes payantes.

La mise en œuvre de ce projet a eu lieu avec des nouvelles technologies principalement


Spring Boot, Javascript, Template engine Thymeleaf et en se basant sur plusieurs APIs parmi
eux Google AdWords API, Google My Business API, Facebook Graph API, YouTube API,
Cloudinary.

Le présent document représente une synthèse complète de l’élaboration de travail, en


détaillant tous les processus mis en place pour que ce projet voie le jour.

Abderrazaq Ikharmej IV 2020-2021


Abstract
This document is the result of a work achieved within the framework of the end of
studies project which was entrusted to me during my internship at the company VirtuoCode.

The objective of the internship was to actively participate in the design and
implementation of the new hub "Campaign Beta" which is a new hub that will be added to the
existing hubs in the platform MyMobilosoft, it has as objective to publish organic campaigns
on three channels (Facebook, store Locator, Google My Business cards) and paid on google
AdWords . Campaign Beta is composed of two parts: The first is dedicated to organic
campaigns, and the second dedicated to paid campaigns.

The implementation of this project took place with new technologies mainly Spring
Boot, Javascript, Template engine thymeleaf and relying on several APIs including Google
AdWords API, Google My Business API, Facebook Graph API, YouTube API, Cloudinary.

This document represents a complete synthesis of the work development, detailing all
the processes put in place to make this project happen.

Abderrazaq Ikharmej V 2020-2021


Liste des tableaux
Table 1:Les acteux de platfome MyMobilosoft ....................................................................... 27
Table 2:Description du cas d’utilisation « bibliothèque d’images » ........................................ 32
Table 3:Description du cas d’utilisation « Gestion des templates » ........................................ 34
Table 4:Description du cas d’utilisation « Gestion des campagnes » ...................................... 37
Table 5:Les caractéristique des images accepter pour le boost ................................................ 89

Abderrazaq Ikharmej VI 2020-2021


Liste des figures
Figure 1:L’écosystème du groupe Virtuology International ...................................................... 4
Figure 2:Logo de l’entreprise VirtuoCode ................................................................................. 6
Figure 3:Structure de l’entreprise ............................................................................................... 6
Figure 4:Structure de l'équipe Build........................................................................................... 6
Figure 5:Fiche Google d'un magasin Carrefour ......................................................................... 8
Figure 6:Le processus Scrum ................................................................................................... 12
Figure 7:Fonctionnement de Scrum ......................................................................................... 13
Figure 8:Aperçu d’Asana ......................................................................................................... 15
Figure 9:Aperçu de Skype ........................................................................................................ 17
Figure 10:Aperçu de Google Meet ........................................................................................... 17
Figure 11:Liste des activités du diagramme de Gantt .............................................................. 19
Figure 12:partie 1 de diagramme de GANTT de déroulement de stage .................................. 20
Figure 13:partie 2 de diagramme de GANTT de déroulement de stage .................................. 20
Figure 15:partie 4 de diagramme de GANTT de déroulemnt de stage .................................... 21
Figure 14:partie 2 de diagramme de GANTT de déroulement de stage .................................. 21
Figure 16:Diagramme de cas d’utilisation ............................................................................... 28
Figure 17:Diagramme de cas d’utilisation de Gestion de Bibliothèque des images ................ 29
Figure 18:Diagramme de case d’utilisation Gestion des templates ......................................... 29
Figure 19:Diagramme de case d’utilisation de gestion des campagnes ................................... 30
Figure 20:Diagramme de séquence pour l’authentification ..................................................... 38
Figure 21:Diagramme de séquence d’ajout d’images .............................................................. 39
Figure 22:Diagramme de séquence de suppression d’images .................................................. 40
Figure 23:Diagramme de séquence de la création d’une template ........................................... 41
Figure 24:Diagramme de séquence de la modification d’une template ................................... 42
Figure 25:Diagramme de séquence de la création d’une campagne ........................................ 43
Figure 26:Diagramme de séquence de la modification d’une campagne ................................. 44
Figure 27:Diagramme de séquence pour supprimer une campagne organique ....................... 45
Figure 28:Diagramme de séquence pour accéder à l'aperçu des campagnes ........................... 46
Figure 29:Diagramme de séquence pour accéder au statistique des campagnes ..................... 46
Figure 30:Diagramme de séquence pour booster une campagne ............................................. 47
Figure 31:Diagramme de l’activité S’authentifier ................................................................... 48
Figure 32:Diagramme de l’activité Créer une campagne ......................................................... 49

Abderrazaq Ikharmej VII 2020-2021


Figure 33:Diagramme de l’activité Booster une campagne dans Google Ads ....................... 50
Figure 34:Diagramme de classes.............................................................................................. 51
Figure 35:Architecture globale du projet ................................................................................. 54
Figure 36:Architecture globale multi-tiers ............................................................................... 55
Figure 37:Architecture Multi-modulaires de la plateforme MyMobilosoft ............................ 56
Figure 38:Logo Intellij IDEA .................................................................................................. 57
Figure 39:Logo Spring ............................................................................................................. 57
Figure 40:Logo Maven ............................................................................................................ 58
Figure 41:Logo Spring boot ..................................................................................................... 59
Figure 42: Logo Spring Data .................................................................................................... 59
Figure 43:Logo Hibernate ........................................................................................................ 60
Figure 44:Logo MyBatis .......................................................................................................... 60
Figure 45:Logo Google My Business ...................................................................................... 61
Figure 46:Logo Facebook Graph API ...................................................................................... 61
Figure 47:Logo google Ads...................................................................................................... 62
Figure 48:Logo Cloudinary ...................................................................................................... 64
Figure 49:Youtube Api............................................................................................................. 65
Figure 50:Logo stripe ............................................................................................................... 65
Figure 51:Logo Google Cloud SQL ......................................................................................... 66
Figure 52:Logo Git ................................................................................................................... 66
Figure 53:Logo Lucid............................................................................................................... 67
Figure 54:Logo ganttproject ..................................................................................................... 67
Figure 55:Aperçu des campagnes organiques et payantes ....................................................... 70
Figure 56:Aperçu Bibliothèque des images ............................................................................. 71
Figure 57:Etape 2 de création d’image .................................................................................... 72
Figure 58:Etape 1 de création d’image .................................................................................... 72
Figure 59:Etape 3 de création d’image .................................................................................... 73
Figure 60:Etape 4 de création d’image .................................................................................... 73
Figure 61:création d’image avec succès................................................................................... 74
Figure 62:Action possible sur image ........................................................................................ 74
Figure 63:La listes des thèmes ................................................................................................. 75
Figure 64:Bouton de création des thèmes ................................................................................ 75
Figure 65:Pop-up de création d'un nouveau thème .................................................................. 76
Figure 66:Bouton Editer un thème ........................................................................................... 77

Abderrazaq Ikharmej VIII 2020-2021


Figure 67:Pop-up de modification d'un thème ......................................................................... 77
Figure 70:Aperçu des templates ............................................................................................... 78
Figure 71:Etape 1 de création template .................................................................................... 79
Figure 72:Étape 2 de création template .................................................................................... 80
Figure 73:Etape 3 de création template .................................................................................... 81
Figure 74:Etape 4 de création template .................................................................................... 81
Figure 75:Création Template avec succès ................................................................................ 82
Figure 76:Action possible sur la Template .............................................................................. 82
Figure 77:Action pour faire l’ajout d’une campagne ............................................................... 83
Figure 78:Étape 1 de la création d’une campagne ................................................................... 83
Figure 79:Etape 2 de la création d’une campagne ................................................................... 84
Figure 80:Etape 3 de la création d’une campagne ................................................................... 85
Figure 81:Étape 4 de la création d’une campagne ................................................................... 86
Figure 82:etape 5 de la création d’une campagne .................................................................... 86
Figure 83:Action Booster campagnes ...................................................................................... 87
Figure 84:Action Booster campagnes ...................................................................................... 87
Figure 85:Etape 1 de booster un campagne ............................................................................. 88
Figure 86:Etape après remplissage de la formulaire ................................................................ 90
Figure 87:Etape 3 de booster un campagne(Mode Expert) ...................................................... 91
Figure 88:Étape 3 de booster un campagne(Mode simple) ...................................................... 92
Figure 89:la liste des magasins proposée ................................................................................. 93
Figure 90:Étape 4 de la boost d’une campagne........................................................................ 94
Figure 91:Boost de campagne avec succès .............................................................................. 95
Figure 92:Etape 5 de la boost d’une campagne........................................................................ 95
Figure 93:Porte-monnaie .......................................................................................................... 96
Figure 94:Facture de paiement ................................................................................................. 96
Figure 95:L’aperçu des statistiques des campagnes partie 2.................................................... 97
Figure 96:L’aperçu des statistiques des campagnes partie 1.................................................... 97

Abderrazaq Ikharmej IX 2020-2021


Liste des acronymes
Acronyme Désignation

ADN Acide Désoxyribo-Nucléique

API Application Programming Interface

JEE Java Enterprise Edition

REST Representational state transfer

JPA Java Persistance API

GMB Google My Business

HQ headquarters

MVC Modèle-vue-contrôleur

SQL Structured Query Language

UML Unified Modeling Language

ORM Object Relational Mapping

Abderrazaq Ikharmej X 2020-2021


Table des matières
RÉSUMÉ ................................................................................................................................. IV

ABSTRACT ............................................................................................................................. V

LISTE DES TABLEAUX ...................................................................................................... VI

LISTE DES FIGURES......................................................................................................... VII

LISTE DES ACRONYMES ................................................................................................... X

INTRODUCTION GÉNÉRALE ............................................................................................ 1

CHAPITRE 1 : ......................................................................................................................... 3

CONTEXTE GÉNÉRAL DU PROJET ................................................................................. 3

INTRODUCTION ........................................................................................................................ 4
1. PRÉSENTATION DE L’ORGANISME D’ACCUEIL ...................................................................... 4
1.1. Présentation du groupe Virtuology International ......................................................... 4
1.1.1. L’écosystème ........................................................................................................ 4
1.1.2. Les valeurs........................................................................................................... 5
1.2. Présentation de la société VirtuoCode ......................................................................... 6
2. PRÉSENTATION DU PROJET ................................................................................................... 7
2.1. Contexte du projet ........................................................................................................ 7
3. PROBLÉMATIQUE ............................................................................................................... 10
4. PILOTAGE ET CONDUITE DE PROJET .................................................................................... 10
4.1. Choix de la méthode .................................................................................................. 11
4.1.1 Aperçu de la méthodologie SCRUM ................................................................... 11
4.1.2 Les rôles de la méthodologie SCRUM ................................................................. 12
4.1.3. Fonctionnement de SCRUM ............................................................................... 12
4.2. Communication entre les membres d’équipe ............................................................. 14
4.2.1 Outil Asana ........................................................................................................... 15
4.2.2 Outil Skype ........................................................................................................... 16
4.2.3 Google Meet ......................................................................................................... 17
4.3. Planning du projet ...................................................................................................... 17
CONCLUSION ......................................................................................................................... 22

Abderrazaq Ikharmej XI 2020-2021


CHAPITRE 2 : ....................................................................................................................... 23

SPÉCIFICATION DES EXIGENCES ................................................................................. 23

1. ETUDE FONCTIONNELLE ..................................................................................................... 24


1.1. Définitions.................................................................................................................. 24
1.2. Méthodologie utilisée................................................................................................. 25
1.2.1 Introduction .......................................................................................................... 25
1.2.2 Choix de la méthode ............................................................................................. 25
1.3. Besoins fonctionnels : ................................................................................................ 26
1.4. Besoins non fonctionnels : ......................................................................................... 26
2. ANALYSE FONCTIONNELLE ................................................................................................ 27
2.1. Identification des cas d’utilisation ............................................................................. 27
2.2. Diagramme de cas d’utilisation ................................................................................. 27
2.2.1. Cas d’utilisation « Gestion bibliothèque d’images » .......................................... 29
2.2.2. Cas d’utilisation « Gestion Template » ............................................................... 29
2.2.3. Cas d’utilisation « Gestion campagne» ............................................................... 30
3. Description des cas d’utilisations.................................................................................. 30
4. Diagramme de séquence ............................................................................................... 37
4.1. Diagramme de séquence « Authentification » ....................................................... 38
4.2. Diagramme de séquence « l’ajout d’une nouvelle image » ................................... 38
4.3. Diagramme de séquence suppression d’une image ............................................... 40
4.4. Diagramme de séquence « création template » ...................................................... 41
4.5. Diagramme de séquence « modification d’une template » .................................... 42
4.6. Diagramme de séquence « création d’une campagne organique » ........................ 43
4.7. Diagramme de séquence « la modification d’une campagne » .............................. 44
4.8 Diagramme de séquence « suppression d’une campagne organique » ................... 44
4.9 Diagramme de séquence « Statistiques des campagnes » et « Aperçu des
campagnes » .................................................................................................................. 45
5. Diagramme d'activités ................................................................................................... 48
5.1. Diagramme d’activité « Authentification » ............................................................ 48
5.2. Diagramme d’activité « création d’une campagne organique » ............................. 48
5.3. Diagramme d’activité « Booster campagne » ........................................................ 49
6. Diagramme de classe .................................................................................................... 51
CONCLUSION ......................................................................................................................... 52

Abderrazaq Ikharmej XII 2020-2021


CHAPITRE 3 : ....................................................................................................................... 53

ETUDE TECHNIQUE........................................................................................................... 53

INTRODUCTION ...................................................................................................................... 54
1. ARCHITECTURE DU PROJET ................................................................................................ 54
1.1 Architecture MVC ...................................................................................................... 54
1.2. Architecture multi-tier ............................................................................................... 55
2. LES CHOIX TECHNOLOGIQUES ET FRAMEWORKS UTILISÉS ................................................. 56
2.1. Environnements de développement ........................................................................... 57
2.1.1. IntelliJ IDEA ....................................................................................................... 57
2.1.2. Spring .................................................................................................................. 57
2.1.3. Maven .................................................................................................................. 58
2.2. Frameworks, Bibliothèques et APIs .......................................................................... 59
2.2.1. Spring Boot ......................................................................................................... 59
2.2.2. Spring Data .......................................................................................................... 59
2.2.3. Hibernate ............................................................................................................ 60
2.2.4. MyBatis ............................................................................................................... 60
2.2.5. Google My Business API ................................................................................... 61
2.2.6. Facebook graph API ........................................................................................... 61
2.2.7. Google Ads ......................................................................................................... 62
2.2.8. Google Ads API .................................................................................................. 64
2.2.9. Cloudinary API .................................................................................................. 64
2.2.10. Youtube Api ..................................................................................................... 65
2.2.11. Stripe ................................................................................................................ 65
2.2.12. AJAX/jQuery ................................................................................................... 65
2.3. Bases de données ....................................................................................................... 66
2.3.1. Google Cloud SQL pour PostgreSQL ................................................................. 66
2.4. Système de gestion de code ....................................................................................... 66
2.4.1. Git & GitHub ...................................................................................................... 66
2.5. Modélisation et gestion de projet ............................................................................... 67
2.5.1. Lucid................................................................................................................... 67
2.5.2. GanttProject ........................................................................................................ 67
CONCLUSION ......................................................................................................................... 68

CHAPITRE 4 : ....................................................................................................................... 69

Abderrazaq Ikharmej XIII 2020-2021


RÉALISATION ET MISE EN ŒUVRE ............................................................................. 69

INTRODUCTION ...................................................................................................................... 70
1. PRÉSENTATION DU MODULE CAMPAGNE............................................................................ 70
1.1. aperçu des campagnes organiques et payantes .......................................................... 70
1.2. Gestion bibliothèque d’images .................................................................................. 71
1.2.1. Aperçu ................................................................................................................. 71
1.2.2. flux de création .................................................................................................... 71
1.3. Gestion des thèmes .................................................................................................... 75
1.3.1. Aperçu ................................................................................................................. 75
1.3.2. Création d’un nouveau thème ............................................................................. 75
1.3.3. Modification d’un thème: .................................................................................... 76
1.4. Gestion des Templates ............................................................................................... 78
1.4.1. Aperçu ................................................................................................................. 78
1.5. Gestion des campagnes organiques : ......................................................................... 83
1.5.1. Processus de création : ............................................................................................ 83
1.6. Booste des campagnes ............................................................................................... 87
1.6.1. Création d’une campagne payante ...................................................................... 87
1.7. Gestion de porte-monnaie .......................................................................................... 94
1.8. statistique des campagnes .......................................................................................... 97
CONCLUSION ......................................................................................................................... 98

CONCLUSION GÉNÉRALE ET PERSPECTIVE ............................................................ 99

BIBLIOGRAPHIE ................................................................................................................... 100

Abderrazaq Ikharmej XIV 2020-2021


Introduction générale

Introduction générale
La publicité désigne l’ensemble des actions mises en œuvre par une entreprise
artisanale, commerciale ou industrielle pour se faire connaître et communiquer sur ses produits
et/ou prestations afin d’en promouvoir la vente. Le but suggéré étant d’inciter à la
consommation et d’influencer le choix du public ou des clients. L’objet consommable peut être
matériel (bien, produit), immatériel (service, événement) ou même institutionnel (la marque
elle-même). La communication est nécessaire pour les entreprises, car elle permet de maintenir
le lien avec les clients et promouvoir leurs marques. Afin de continuer dans cette tendance, et
malgré l’apparition du Covid19 qui a choqué le monde et a fait tourner les économies, puisque
La pandémie a affecté chaque partie de notre vie ; des endroits où nous pouvons aller, la façon
dont nous passons notre temps, les priorités que nous avons et à la façon dont nous dépensons
notre argent. Ce qui cause bien sûr de vastes ramifications sur le marketing, la publicité et le
commerce électronique. Les entreprises ont dû s’adapter en s’appuyant sur de nouveaux canaux
de communication.

Le marketing digital a, en effet, pris une grande place au sein de la stratégie des
annonceurs. Cette stratégie des marques a fait une croissance de demande des services et
solution qui offre et assure des canaux de publicité. Cette augmentation de demande a fait
augmenter la concurrence entre les entreprises qui offrent un tel service.
Dans un tel contexte, rester compétitif n’est pas une tâche aisée. Ce qui pousse les entreprises
à engager des processus pour faciliter et améliorer leur service et apporter de la nouveauté allant
bien au-delà des fonctionnalités liées aux nouveaux besoins.

Par ailleurs, il est essentiel que ces entreprises choisissent toute une gamme de méthodes
de traitement pour garantir ces changements et rester concurrentielles. On y retrouve les
campagnes gratuites et payantes, qui permettent aux entreprises de fournir à leurs clients
potentiels les informations dont ils ont besoin pour choisir quand et comment se rendre dans
leurs magasins.

Dans ce sens s’inscrit mon projet de fin d’étude qui porte sur le développement d’un
module de gestion des campagnes publicitaires organiques et payantes au sein de l’entreprise
VirtuoCode.

Abderrazaq Ikharmej 1 2020-2021


Ce rapport décrit donc la totalité de mon projet, en détaillant chaque phase
individuellement.

Dans un premier temps, on va définir le contexte général du projet, c’est-à-dire qu’on


va présenter l’organisme d’accueil ainsi que le cadre logique de mon projet de fin d’étude .Ainsi
que, on détaillera comment on a géré le projet, en soulignant la conduite et la planification du
projet.

Dans un deuxième temps, on fera une étude préliminaire, qui met l’accent sur les notions
de base de mon projet. Il définit et explique les besoins fonctionnels et opérationnels du projet.

Tout projet informatique doit être soumis à une phase d’analyse et modélisation avant
sa réalisation, et le chapitre deux détaille cette étape pas à pas.

L’avant dernier chapitre, soit le troisième, est une étude technique du projet, qui
explique le fonctionnement technique de mon travail, ainsi que les technologies outils qu’on a
exploitées et le traitement des campagnes gratuites et payantes. Pour ce dernier, on y retrouve
la solution choisie, et le pourquoi de ce choix.

Finalement, on clôture ce rapport avec la réalisation et la mise en œuvre du projet, qui


illustre les fonctionnalités de la solution élaborée.

Abderrazaq Ikharmej 2 2020-2021


Chapitre 1 :
Contexte général du projet

Ce chapitre introduit le contexte général du projet. Tel qu’on


présente l’organisme d’accueil tout au long de la durée du stage, sa
société mère et ses valeurs.

Par la suite, le contexte du projet, la problématique et on fait le choix


de la méthodologie agile, ainsi que les outils de communications
entre les membres de l’équipe.

Et on clôture ce chapitre par la planification du projet avec un


diagramme de Gantt.

Abderrazaq Ikharmej 3 2020-2021


Introduction
Tout projet se situe dans un cadre et un contexte bien précis, et le but de cette partie est
de situer le lecteur dans le contexte général de mon stage. Et pour ce faire, on va commencer
tout d’abord par une présentation générale de l’organisme d’accueil. On abordera par la suite la
présentation du projet où on décrira et la problématique à traiter, alors que, la fin de ce chapitre
portera sur la planification et la conduite du projet, ainsi que le planning de travail adopté.

1. Présentation de l’organisme d’accueil


1.1. Présentation du groupe Virtuology International
1.1.1. L’écosystème

Virtuology International est un groupe d’agences spécialisées dans les métiers du


Marketing Digital, fondé en 2012. Ayant l’ambition de regrouper sous une bannière commune
des spécialistes actifs dans toutes les principales disciplines du marketing digital, chaque société
du groupe est indépendante et tend à être la meilleure dans sa sphère de compétences.

Par définition modulaire et formée à la coopération, chaque société a dans son ADN une
facilité à collaborer avec des équipes externes. Le groupe met à disposition ses méthodologies
et ses outils pour rendre les projets harmonieux et efficaces lorsque plusieurs compétences
renforcent un même projet.

Figure 1:L’écosystème du groupe Virtuology International

Ce groupe englobe environ Vingt-six Startups, toutes actives dans le marketing digital.

Abderrazaq Ikharmej 4 2020-2021


1.1.2. Les valeurs

Pour le groupe Virtuology International, développer un groupe d’entreprises n’est pas


une finalité en soi. La manière dont cette croissance s’opère est aussi importante que le résultat
financier qui en découle. Les valeurs vécues au quotidien en sont la clé.

Ces valeurs sont le ciment qui permet de construire, progresser et traverser les moments
difficiles sans dévier de la trajectoire. Elles permettent de construire un lien qui va au-delà de
la simple collaboration, elles permettent de donner un sens à la stratégie de l’entreprise et
permettent à chacun de se l’approprier.

a) Intégrité et transparence
L’intégrité est la base de la confiance. Le management et les collaborateurs doivent être
transparents dans les décisions qu’ils prennent et respecter le cadre juridique, éthique et moral
en toutes circonstances. Ce précepte ne doit connaitre aucune exception, ni pour les petites
décisions ni pour les grandes.

b) Excellence

L’excellence ne doit pas être vécue comme une contrainte mais plutôt comme une fierté
de donner le meilleur de nous-mêmes dans toutes nos actions. Elle s’exprime tant dans le savoir-
faire métier que dans le savoir-être personnel.

c) Solidarité

La solidarité crée un cadre de soutien mutuel et permet à chacun de s’appuyer sur les
autres afin d’être plus forts ensembles. La solidarité est la capacité d’aider ceux qui nous
entourent, mais également de demander de l’aide lorsque nous en avons besoin.

d) Respect

Le respect est une valeur cardinale qui connaît plusieurs facettes : que ce soit le respect
de la parole donnée en interne, à nos clients ou à nos partenaires, le respect dans les relations
humaines, ou encore le respect de notre environnement. Nous voulons en tout point être dignes
de la confiance qui nous est faite.

e) Joie

La joie est une condition indispensable à l’épanouissement professionnel. Pour créer un


cadre de travail inspirant, nous défendons des relations harmonieuses entre collaborateurs et
une décontraction dans le travail quotidien.

Abderrazaq Ikharmej 5 2020-2021


1.2. Présentation de la société VirtuoCode

Figure 2:Logo de l’entreprise VirtuoCode

VirtuoCode est une société de services et d'ingénierie en informatique, fondée en 2020


filiale de l’entreprise Virtuology international.

La société est experte dans le domaine des nouvelles technologies et de l'informatique.


Elle englobe plusieurs métiers (conseil, conception et réalisation d'outils, maintenance ou
encore formation) et a pour objectif principal d'accompagner ses clients dans la réalisation des
projets informatiques.

Structure de l’entreprise :

Figure 3:Structure de l’entreprise

Présentation de l’équipe Build :

Figure 4:Structure de l'équipe Build

Abderrazaq Ikharmej 6 2020-2021


L'équipe Build est composée du Product Owner qui a pour mission de mener à bien un
projet suivant la méthodologie Agile, en collaboration avec le Scrum master, le chef de projet
en méthode Scrum ou agile. Ensuite, les développeurs en Backend, frontend, et un expert
technique. Et un ingénieur de test et qualité pour garantir un niveau de qualité optimale de
l’application.

2. Présentation du projet
Mon projet s’inscrit dans le cadre des projets réalisés pour la société Mobilosoft,
notamment le projet « MyMobilosoft » afin de développer un module de gestion des campagnes
publicitaires organiques et payantes

Avant d’entamer la partie contexte du projet, il faut tout d’abord en avoir un aperçu sur
MyMobilosoft, qui est une société spécialisée dans le marketing digital. Elle offre des solutions
web-to-store qui sont un pont du marketing digital dont l’objectif est de répondre à des
nouveaux modes de consommation en offrant aux entreprises des outils leur permettant
d’utiliser Internet pour générer du trafic en point de vente physique (restaurants, magasins,
bureaux). Grâce à ses produits, Mobilosoft aide ses clients à gérer leurs données afin qu'elles
puissent proposer des informations vérifiées dans les résultats de recherche.

2.1. Contexte du projet


Comme on l’a cité auparavant, Mobilosoft offre des solutions web-to-store. Ceci
consiste à proposer une liste de produits et services permettant à ses clients de générer du trafic
dans leurs magasins. Parmi ces produits, on se limite à présenter :

• Location

Le premier produit est dédié à la gestion de la localisation des points de vente, ce produit
s’occupe de la création et de la gestion du contenu des pages locales optimisées pour la
recherche.

Ce produit consiste à gérer le contenu et les informations des magasins des clients sur Google,
Facebook et sur les sites internet des magasins.

Ci-dessous un exemple d’une fiche Google gérée par la plateforme MyMobilosoft pour un
magasin Carrefour :

Abderrazaq Ikharmej 7 2020-2021


Figure 5:Fiche Google d'un magasin Carrefour

Les principales informations gérées par la plateforme sont :

- L’adresse des points de vente.

- Les horaires d’ouverture et de fermeture.

- Les évènements à venir.

- Les informations générales : le nom du magasin, le numéro de téléphone, le lien du site web
du magasin…

- Les services.

- Les champs supplémentaires (Extra Fields).

La gestion du contenu des pages locales des magasins a deux finalités :

1- Informer les visiteurs des sites web des magasins.

2- Optimiser le référencement naturel des pages web des magasins sur les
moteurs de recherche web.

• Campaign

Abderrazaq Ikharmej 8 2020-2021


Le deuxième produit est dédié à la gestion de campagnes. Ce produit a pour objectif de
permettre aux entreprises organisées en réseau de distribution de pouvoir publier, sur chacune
de leurs pages points de ventes, du contenu (promotionnel, événementiel.). Ce contenu pouvant
être lié à l’actualité nationale de la chaîne ou aux événements de la vie locale des points de
vente (braderies, fêtes de quartier, produits exclusifs, etc.).

Ces contenus vont être diffusés sous la forme de « Posts » (publications) gratuites sur
les pages magasins (Store Locator, Google et Facebook). Ils prennent le format de publication
d’images, de textes et/ou de vidéos.

• Inbox

Le troisième permet la gestion des avis clients. Ce produit permet aux clients de récupérer
les avis déposés par les consommateurs sur les pages points de ventes dans Google et Facebook,
de les présenter dans une interface web et d’y répondre en toute simplicité. Le bénéfice de cette
gestion est l’amélioration de la réputation des magasins en ligne. Une bonne gestion des avis
d’un magasin est en effet prise en compte par les moteurs de recherche web pour le
référencement des pages de ces magasins. Cette gestion aide aussi les magasins à fidéliser la
clientèle et ainsi à améliorer l’expérience de ses clients dans ces magasins par le biais de
rapports mis à disposition des magasins.

• Customer

Le dernier produit est connu communément dans Mobilosoft sous le nom « Customer »
ou des projets des clients à la demande, ce produit englobe tous les services et les prestations
que Mobilosoft offre à ses clients et qui ne font pas partie des produits cités précédemment.

Ces prestations concernent principalement :

- Des adaptations particulières des trois premiers produits cités précédemment pour les
clients qui désirent sortir du standard des produits de Mobilosoft.

- Support et accompagnement des clients dans des projets de mise en place des stratégies
de marketing.

Parmi les canaux de diffusion des produits Mobilosoft, on trouve :

● Google : la gestion des fiches Google sur « Google My Business ».

Abderrazaq Ikharmej 9 2020-2021


● Facebook : à travers ce média les produits de Mobilosoft permettent de gérer le contenu
des pages Facebook des magasins.

● GPS : pour la géo-positionnement des points de vente.

● Store Locator : pour localiser géographiquement un point de vente physique.

3. Problématique
Acquérir de nouveaux clients demeure indispensable. L’entreprise doit donc offrir des
solutions pour leurs besoins avec une expérience utilisateur optimale et de nouvelles
fonctionnalités pour regrouper leurs attentes dans le côté marketing digital.

Alors le projet myMobilosoft contient plusieurs Hub comme on vient de le voir, mais le
Hub le plus demandé dans cette période et surtout après les changements causés par Covid 19
est le Hub campagne qui offre seulement une solution pour les campagnes organiques, alors
que les clients cherchent à augmenter leurs présences par des campagnes payantes.

Sans omettre, l’expérience utilisateur qui connait une faible satisfaction d’après les
commentaires des clients potentiels de Mymobilosoft qui trouvent des difficultés sur le flux
existant, ainsi que les droits d’utilisateurs qui sont inclus dans cette version et qui génèrent
beaucoup de problèmes au niveau de publication des campagnes.

Tout cela prend place dans notre problématique ; qui va être fragmentée en deux parties,
la première est de chercher à faire une nouvelle version au Hub campagne organique quant à la
deuxième partie va être consacrée aux campagnes payantes pour répondre bien aux attentes de
ses nombreux clients.

Le but est d’offrir des solutions aux clients pour qu’ils minimisent leur temps et
augmentent leurs présences, à titre d’exemple Carrefour Belgique a plus de 800 magasins alors
par une seule clique il peut faire une action en groupe pour publier une campagne que ça soit
organique ou payante.

4. Pilotage et conduite de projet


La conduite du projet est une démarche qui vise à structurer, assurer et optimiser le bon
déroulement d’un projet complexe. Dans ce sens, il faudra tout d’abord choisir une méthode de
développement et ensuite réaliser un planning à suivre respectant cette méthode.

Abderrazaq Ikharmej 10 2020-2021


4.1. Choix de la méthode
Pour ce projet nous avons choisis de travailler en mode agile, avec une approche de la
méthodologie SCRUM pour bénéficier du grand degré d’agilité offert par cette méthode et aussi
pour son aspect incrémental et rapide avec des sprints courts et concentrés. « Scrum » nous
paraît la solution idéale pour produire des applications, puisque dans les méthodologies
traditionnelles, le développeur répond aux besoins exprimés par le chef de projet qui « détient
le savoir » et la prise de décision. Il se considère comme un exécutant, ce qui n’est nullement
le cas dans notre projet. En effet, si le cahier de charge reçu était incomplet et regroupait un
ensemble d’incohérences, ceci imposerait une communication continuelle avec le product
owner et une validation fréquente des incréments.

Ainsi, au lieu de fixer les objectifs lointains, le mieux serait de procéder par étapes,
c’est-à-dire fixer des objectifs à court terme et de commencer le développement sans perdre de
temps. Chaque fois que cet objectif est atteint, nous passons au suivant et ainsi de suite jusqu’à
ce que le but ultime soit atteint.

Ceci nous a permis de construire une certaine agilité au niveau de notre projet, et aussi
la mise en place de certaines valeurs agiles comme :

● Favoriser les individus et les interactions plutôt que les processus et les outils.

● Avoir un produit qui fonctionne plutôt qu’une documentation exhaustive.

● Accepter le changement plutôt que la conformité aux plans.

Pour toutes les raisons citées précédemment « Scrum » y répond et nous a permis aussi
d’avoir une bonne réactivité et une flexibilité aux changements des exigences.

4.1.1 Aperçu de la méthodologie SCRUM

La méthode agile Scrum consiste à focaliser les efforts d'une équipe sur des
fonctionnalités définies. Ceci afin de livrer un logiciel partiellement fonctionnel et enrichi au
fur et à mesure.

Le point fort de cette méthode est que le client est impliqué dans toutes les phases du
développement pour que le produit soit en final ce qu'il espérait. Chaque fonctionnalité est
divisée en plusieurs tâches, tout en prenant soin de bien s'assurer que la même fonctionnalité
ne devra pas être modifiée après suite à l'ajout d'une autre.

Abderrazaq Ikharmej 11 2020-2021


Le processus Scrum est décrit dans la figure suivante :

Figure 6:Le processus Scrum

4.1.2 Les rôles de la méthodologie SCRUM

Les trois rôles définis par Scrum sont :

- Product Owner : Il représente généralement le client, qui porte la vision du produit à réaliser,
dans notre cas c’est M. AZOUAGH Noureddine.

- Scrum Master : Sa mission est de tout mettre en œuvre pour que l'équipe travaille dans de
bonnes conditions et se concentre sur l'objectif du projet, dans le cadre de notre projet c’est M.
Amine Hamri

- L’équipe SCRUM : Une équipe regroupant tous les rôles traditionnels : développeur, testeur,
administrateur, etc. Cette équipe est responsable de développer le produit.

Dans le contexte de notre projet, cela représente l’équipe Build.

4.1.3. Fonctionnement de SCRUM

L’utilisation des méthodes agiles est une solution efficace pour modifier les pratiques de travail
et apporter de la souplesse et de la réactivité dans les organisations. Scrum, l’une des méthodes
les plus populaires, s’adapte parfaitement à la gestion de projet.

Abderrazaq Ikharmej 12 2020-2021


Figure 7:Fonctionnement de Scrum

Toutes les activités (Sprint, réunion de planning, revues, rétrospective et mêlée) décrites dans
la méthode Scrum sont effectuées lors des boîtes de temps.

● Le sprint : Le sprint est une période d'un mois au maximum, au bout de laquelle l'équipe
délivre un incrément du produit, potentiellement livrable. La durée du sprint reste constante
pendant toute la durée du développement. Un nouveau sprint démarre dès la fin du précédent.
Chaque sprint possède un but et on lui associe une liste d'éléments et de fonctionnalités à
réaliser.

1. Le but du sprint ne peut être modifié.

2. La composition de l'équipe reste constante.

3. La qualité n'est pas négociable.

4. La liste d'items est sujette à négociations entre le propriétaire du produit et l'équipe


de développement.

● Réunion quotidienne : Chaque journée de travail commence par une réunion de 15 minutes
maximum appelée Daily Scrum ou StandUp.

Dans ce type de réunion le Scrum Master pose 3 questions à chaque équipier, à tour de rôle :

1. Qu'est-ce que tu as fait hier ?

Abderrazaq Ikharmej 13 2020-2021


2. Qu'est-ce que tu vas faire aujourd’hui ?

3. Quelles difficultés as-tu rencontrées ?

Ce qui nous a permis de ne pas laisser traîner ni un gros souci, ni un point de blocage, mais de
le résoudre assez rapidement, car en répondant à ces questions, on identifie les obstacles qui
freinent notre avancement au projet.

● Réunion de planification d'itération : Toute l'équipe Scrum est présente à cette


réunion, qui ne doit pas durer plus de 8 heures pour un sprint d'un mois. Pour un sprint
plus court, la durée est réduite proportionnellement. À l'issue de cette réunion, l'équipe
décide des éléments du carnet du produit qu'elle décide de traiter pendant la prochaine
itération et comment elle s'organisera pour y parvenir.

● Revue de sprint : À la fin du sprint, l'équipe Scrum et les parties-prenantes invitées se


réunissent pour effectuer la revue de sprint, qui dure au maximum 4 heures appelée
(Sprint Review). L'objectif de la revue de sprint est de valider avec l'ensemble des
parties prenantes l'incrément de la solution qui a été produite pendant le sprint et
connaître l'état du projet, afin de décider des actions à mettre en œuvre pour sa poursuite.

On planifie la réunion de planification d’itération et la revue de sprint à la fin de chaque sprint


pour une durée de 2 heures.

● Rétrospective du sprint : La rétrospective du sprint est faite en interne à l'équipe Scrum


(équipe de réalisation, propriétaire du produit et Scrum Master). Elle dure 3 heures pour
un sprint d'un mois, et réduit selon la durée du sprint. Elle a pour but l'adaptation aux
changements qui surviennent au cours du projet et l'amélioration continue du processus
de réalisation. L'objectif est d’inspecter l'itération précédente, afin de déterminer quels
sont les éléments du processus de développement qui ont bien fonctionné et ceux qui
sont à améliorer. L'équipe de développement déduit un plan d'actions d'amélioration
qu'elle mettra en place lors de l'itération suivante.

4.2. Communication entre les membres d’équipe


Dans cette section on va évoquer l’un des piliers essentiels de la bonne conduite de
projet, qui est la communication. Cette dernière représente l'ensemble des interactions et des
échanges verbaux ou écrits avec les membres d’équipe afin de transmettre l’information, et de
s’assurer qu’on suit la bonne voie lors la réalisation du projet.

Parmi les outils qu’on a utilisés pour bien établir cette communication, on note:

Abderrazaq Ikharmej 14 2020-2021


4.2.1 Outil Asana

Asana est un gestionnaire de communication d'équipe. Le produit prend en charge de


nombreuses fonctionnalités, notamment les espaces de travail, des projets, des tâches, des
étiquettes, des notes, des commentaires et une boîte de réception qui organise les mises à jour
des informations en temps réel. Il est conçu pour permettre aux individus et aux équipes de

planifier et gérer leurs projets et les tâches sans email. Chaque équipe reçoit un espace
de travail. Les espaces de travail contiennent des projets, et les projets contiennent des tâches.

Figure 8:Aperçu d’Asana

Parmi les fonctionnalités offertes par l’outil Asana, on peut citer :

● Gestion du travail, des tâches et des projets

Projets : organiser le travail en projets partagés sous forme de listes ou de tableaux Kanban
pour toutes initiatives, réunions et programmes.

Tâches : décomposer le travail en tâches faciles à gérer par les membres de l’équipe.

Sous-tâches : diviser les tâches en plusieurs éléments plus petits ou indiquer les étapes
nécessaires pour les terminer.

Abderrazaq Ikharmej 15 2020-2021


Responsables de tâches : attribuer chaque tâche pour en désigner la personne responsable.
Sections et colonnes : regrouper les tâches en sections ou colonnes dans les projets en vue Liste
ou Tableau (respectivement) pour garder les tâches organisées.

Échéances : les échéances permettent de veiller à ce que chaque tâche soit achevée à temps.
On peut afficher les tâches dans un calendrier Asana ou même dans un calendrier professionnel.

Pièces jointes : ajouter des fichiers à tout type de tâche ou discussion depuis l'ordinateur,
Google Drive, OneDrive, Dropbox ou Box.

Dépendances : les dépendances de tâches indiquent clairement quelles tâches sont prêtes à être
commencées et lesquelles sont en attente d’autres tâches.

● Communication :

Commentaires sur les tâches : commenter directement une tâche pour préciser le travail à
faire et mentionnez des collègues ou d’autres tâches et projets pour tout connecter.

Révision : laisser des commentaires précis directement sur les images et fichiers PDF. Ils se
transforment en taches pour un suivi efficace.

Révision d’image : laisser des commentaires précis sur des images pour que les créatifs
comprennent exactement le travail à effectuer.

● Gestion d’équipe

Équipes : créer des équipes pour organiser les projets, et les relier aux collègues les uns aux
autres grâce à un calendrier et des discussions partagés.

Collaborateurs : ajouter des collègues en tant que collaborateurs pour qu’ils puissent suivre
l’avancement de la tâche et reçoivent des notifications en cas de mise à jour.

Permissions : limiter l’accès aux projets, créer des équipes masquées pour les informations
sensibles ou rendre publics les équipes et projets auxquels toute l’organisation doit accéder.

4.2.2 Outil Skype

Skype est un moyen simple, rapide et populaire pour les équipes distantes de rester en
contact et de collaborer. Il permet de passer des appels audio ou vidéo via Internet, ainsi que le
partage d'écran. La messagerie instantanée, le transfert de fichiers et la visioconférence sont des
fonctionnalités que Skype offre pour tous les utilisateurs.

Abderrazaq Ikharmej 16 2020-2021


Ce qui est utile pour organiser des réunions, et de joindre tous les membres de l’équipe, là où
ils se trouvent dans le monde.

Figure 9:Aperçu de Skype

4.2.3 Google Meet

Google Meet est un service de vidéocommunication développé par Google. Il est l’une
des deux applications qui constituent la nouvelle version de Google Hangouts, Google Meet été
un produit premium, mais maintenant il peut être utilisé gratuitement par des groupes, des
équipes, des entreprises, des organisations, des écoles et des établissements d’enseignement
supérieur.

Figure 10:Aperçu de Google Meet

4.3. Planning du projet


Avant de se lancer dans la réalisation du projet, il est nécessaire de prendre le temps de
découper celui-ci en tâches, afin de planifier leur exécution et le temps à allouer pour chacune
d’elles.

Abderrazaq Ikharmej 17 2020-2021


Et pour se faire, on a utilisé le diagramme de Gantt qui est l’un des moyens les plus
populaires et les plus utiles d’afficher les activités (tâches ou événements) en fonction du temps.
À gauche du tableau, on trouve une liste des activités et, à droite, une échelle de temps
appropriée. Chaque activité est représentée par une barre ; la position et la longueur de la barre
reflètent la date de début, la durée et la date de fin de l'activité.

Ceci permet donc de voir en un coup d'oeil :

- Quelles sont les différentes activités.

- Quand chaque activité commence et se termine.

- Combien de temps chaque activité est prévue pour durer.

- Lorsque les activités se chevauchent avec d'autres activités et dans quelle mesure.

- La date de début et de fin de l'ensemble du projet.

Abderrazaq Ikharmej 18 2020-2021


Figure 11:Liste des activités du diagramme de Gantt

Abderrazaq Ikharmej 19 2020-2021


Figure 12:partie 1 de diagramme de GANTT de déroulement de stage

Figure 13:partie 2 de diagramme de GANTT de déroulement de stage

Abderrazaq Ikharmej 20 2020-2021


Figure 15:partie 2 de diagramme de GANTT de déroulement de stage

Figure 14:partie 4 de diagramme de GANTT de déroulemnt de stage

Abderrazaq Ikharmej 21 2020-2021


Conclusion

Dans ce premier chapitre, on a présenté l’organisme d’accueil, VirtuoCode, et sa société


mère, Virtuology International. Puis, on a retrouvé une présentation du projet, qui inclut le
contexte général et la problématique à traiter. Ainsi que la méthodologie adoptée pour atteindre
la bonne conduite du projet.

Abderrazaq Ikharmej 22 2020-2021


Chapitre 2 :
Spécification des exigences

Le présent chapitre présentera la phase d’analyse et de


spécification des besoins. Nous allons commencer tout d'abord par l’étude
préliminaire dans laquelle nous allons identifier les besoins fonctionnels et non
fonctionnels de notre projet. Ensuite, nous procéderons à l’étude fonctionnelle
de notre projet, en présentant les diagrammes UML les plus utilisés, ainsi que
les fonctionnalités offertes par l’application.

Abderrazaq Ikharmej 23 2020-2021


1. Etude fonctionnelle
L’étude fonctionnelle est une démarche qui consiste à rechercher et à caractériser les
fonctions offertes par un produit pour satisfaire les besoins de son utilisateur. Cette démarche
est généralement conduite en mode projet et peut être utilisée pour créer (concevoir) ou
améliorer un produit.

1.1. Définitions
Avant de commencer à détailler les grandes lignes du projet, une définition de quelques termes
utilisés dans ce qui suit s’avère nécessaire.

● Store Locator : localisateur de magasins en français, est un outil de recherche de points


de vente placé sur le site des enseignes.
Il a Trois fonctions principales :

▪ Améliorer le référencement local de réseau d’établissements c'est-à-dire va


booster le SEO : les pages locales remontent dans la recherche Google.
▪ Accès rapide aux infos relatives au magasin le plus proche : heures et jours
d’ouverture, adresse, numéro, promotions en cours, etc.
▪ Générer rapidement le plan d’accès au point de vente, le plus souvent via
Google Maps, et ainsi tracer l’itinéraire en 1 ou 2 clics.

● Campagnes organiques : est un contenu diffusé sous forme de “Post” (publication) gratuit
sur les pages magasins (Store Locator, Google et Facebook).

● Campagnes Locales :
▪ Les campagnes locales permettent aux store managers d'utiliser MyMobilosoft pour
publier des campagnes publicitaires au niveau local sur les points de vente liés aux pages
Facebook, Google My Business ou Store Locator. Ils pourront par exemple publier des
informations à propos de nouveaux produits, de promotions disponibles ou encore
d'événements organisés dans leurs points de vente.
▪ Les médias disponibles peuvent varier en fonction des enseignes, de l'existence de ces
pages locales sur chacun des médias et d'un lien de ces pages à Mobilosoft.

● Campagnes Nationale :
Les campagnes nationales permettent aux HQ managers (Responsable de siège)

Abderrazaq Ikharmej 24 2020-2021


d’utiliser MyMobilosoft pour publier des campagnes publicitaires au niveau national sur
les points de vente liés aux pages Facebook, Google My Business ou Store Locator. Ils
pourront par exemple publier des informations à propos de nouveaux produits, de
promotions disponibles ou encore d'événements organisés dans leur point de vente.

● Template : est un modèle de campagne créé par le siège et partagé sur des magasins. Il peut
être utilisé par les utilisateurs ayant les mêmes magasins que ce dernier.

1.2. Méthodologie utilisée


1.2.1 Introduction

La complexité des systèmes informatiques conduit de plus en plus à l'utilisation d'outils


standards d'aide à la spécification, à la conception et au développement. Ces outils sont basés,
si possible, sur des méthodes et des langages standard.

Une méthode d'analyse et de conception a pour objectif de permettre de formaliser les


étapes préliminaires du développement d'un système afin de rendre ce développement plus
fidèle aux besoins du client.

La phase d'analyse permet de lister les résultats attendus, en termes de fonctionnalités,


de performance, de robustesse, de maintenance, de sécurité, d'extensibilité, etc.

La phase de conception permet de décrire de manière non ambiguë, le plus souvent en


utilisant un langage de modélisation, le fonctionnement futur du système, afin d'en faciliter la
réalisation.

1.2.2 Choix de la méthode

Notre choix a été le langage UML comme langage de modélisation, car la notation UML
est la plus appropriée pour des projets orientés objet. Ce choix peut être justifié également par
plusieurs raisons :

● Le processus de développement adopté se base sur les diagrammes UML

● La notation UML facilite la compréhension et la communication d’une modélisation objet

● UML est aujourd’hui un standard, adopté par les grands constructeurs de logiciels du
marché, etc.

Abderrazaq Ikharmej 25 2020-2021


1.3. Besoins fonctionnels :
En effet, le Hub « Campaign » doit satisfaire les besoins fonctionnels suivant :

● Gestion bibliothèque d’images ;

● Gestion des thèmes ;

● Gestion des Templates ;

● Gestion des campagnes organiques ;

● Booster une campagne sur google ADS ;

● Voir un aperçue des campagnes organiques/payantes ;

● Graphes et statistiques des campagnes.

1.4. Besoins non fonctionnels :


Les besoins non fonctionnels sont importants car ils agissent de façon indirecte sur le
résultat et sur le rendement de l’utilisateur, ce qui fait qu’ils ne doivent pas être négligés, pour
cela il faut répondre aux exigences suivantes :

● L’ergonomie des interfaces :

Les interfaces doivent être faciles à utiliser. Ceci permettra à une personne lambda n’ayant pas
un background informatique de pouvoir exploiter notre solution aisément.

● Aptitude à la maintenance et réutilisation :

Le système doit être conforme à une architecture standard et claire permettant sa maintenance
et sa réutilisation.

● Scalabilité :

Le travail doit être extensible, c’est-à-dire qu’il maintient ses fonctionnalités et ses
performances en cas de changement, aussi bien qu’il pourra y avoir une possibilité d’ajouter ou
de modifier de nouvelles fonctionnalités à tout moment.

● Sécurité :

Notre solution doit respecter la confidentialité des données personnelles des clients.

Abderrazaq Ikharmej 26 2020-2021


2. Analyse fonctionnelle
Après la phase d’analyse des besoins des projets, nous sommes prêts pour aborder la
conception plus en plus technique en utilisant quelques diagrammes du langage UML.

2.1. Identification des cas d’utilisation


Identification des Acteurs Parmi les étapes importantes de la conception de n’importe
quelle application, c’est l’identification des différents acteurs qui peuvent interagir avec le
système qu’on veut développer.

Acteurs Rôles et description

HQ HQ (Headquarters) ou Responsable siège peut gérer la bibliothèque


d’image, Gestion des thèmes, templates, campagnes ainsi il peut
consulter l'aperçu des campagnes nationales tel qu’il peut faire des
actions sur ces dernières et consulter leurs statistiques.

Franchisé Store managers peut gérer seulement les campagnes et consulter


l'aperçu des campagnes nationales et locales tel qu’il peut faire des
actions sur les campagnes locales et consulter les statistiques de ces
dernières.

Table 1:Les acteux de plateforme MyMobilosoft

2.2. Diagramme de cas d’utilisation


Après avoir identifié les acteurs ainsi que les différents modules de notre application, il
est nécessaire de déterminer pour chaque module les cas d’utilisation qui lui sont dédiés.

Les cas d’utilisation permettent de représenter le fonctionnement du système vis-à-vis


de l’utilisateur : c’est donc une vue du système dans son environnement extérieur.

Abderrazaq Ikharmej 27 2020-2021


Nous commençons par présenter le diagramme de cas d’utilisation global du système.
Puis, nous allons décortiquer chaque module et ses cas d’utilisation dans ce qui suit.

Figure 16:Diagramme de cas d’utilisation

Abderrazaq Ikharmej 28 2020-2021


2.2.1. Cas d’utilisation « Gestion bibliothèque d’images »

Figure 17:Diagramme de cas d’utilisation de Gestion de Bibliothèque des images

2.2.2. Cas d’utilisation « Gestion Template »

Figure 18:Diagramme de case d’utilisation Gestion des templates

Abderrazaq Ikharmej 29 2020-2021


2.2.3. Cas d’utilisation « Gestion campagne»

Figure 19:Diagramme de case d’utilisation de gestion des campagnes

3. Description des cas d’utilisations


L’élaboration d’un dossier des spécifications fonctionnelles est l’étape qui suit
l’identification des cas d’utilisations, ce dossier permet de décrire les processus fonctionnels du
système à travers une description détaillée des scénarios d’exécution de chaque cas
d’utilisation, cette description est réalisée suivant cette fiche qui contient les informations
suivantes :
• Use case : Le titre du cas d’utilisation.

• Objectif : L’objectif du cas d’utilisation élaboré.

• Acteur principal : L’acteur principal interagissant lors de l’exécution du cas d’utilisation.

• Scénario nominal : C’est le scénario qui est censé être observé lors de l’exécution du cas
d’utilisation.

• Scénario alternatif : C’est le scénario observé lors de l’exécution du cas d’utilisation


provoquant d’une manière un comportement différent de la part du système.

Abderrazaq Ikharmej 30 2020-2021


Ci-dessous (tableaux) une description détaillée des cas d’utilisations :

● Gestion bibliothèque d’images :

Titre Gérer la bibliothèque d’images

Objectif Permet à l’Utilisateur de gérer les images (ajouter, modifier,


partager, supprimer)

Acteurs HQ

Enchaînement

Précondition L’acteur est bien identifié et son rôle soit HQ

Scénario nominale

● Scénario « ajouter une image » se passe en trois étapes

▪ L’acteur clique sur ajouter image

▪ Le système affiche la première étape pour les insérer

▪ L’acteur fait glisser une ou plusieurs images pour les télécharger ou les sélectionner
directement depuis son ordinateur

▪ le système affiche la deuxième étape pour donner la possibilité à l’acteur de Modifier les
métadonnées des images

▪L’acteur change les métadonnées s’il veut.

▪Le système affiche la troisième étape où l’acteur peut partager ces images avec les points de
ventes qu’ils gèrent.

Abderrazaq Ikharmej 31 2020-2021


▪ L’acteur associer l’image aux magasins

▪ Le système enregistrer les données

● Scénario « partager une image » le partage avec les magasins que l’acteur gère

▪ L’acteur choisit l’image à partager

▪ Le système affiche la liste des magasins que l’acteur gère avec les données du rappel

(Les magasins déjà choisi sont coché par défaut)

▪ L’acteur fait les modifications

▪ L’acteur modifier les modifications par cliquer sur partager

▪ Le système enregistre les modifications et retourne message de réussite

● Scénario « modifier les données d’une image »


▪ L’acteur choisit l’image à modifier
▪ L’acteur clique sur l’action modifier
▪ Le système lui fait passer à l'étape 2 du processus de création avec les données déjà
choisies.
▪ L’acteur fait les modifications
▪ Le système enregistre les modifications

● Scénario « supprimer une image »


▪ L’acteur choisit l’image à supprimer
▪ L’acteur clique sur l’action supprimer
▪ Le système affiche boîte de confirmation
▪ L’acteur valider son choix de supprimer
▪ Le système supprime l’image s’il est non utilisé, sinon il l’archive.

Scénario Alternatif

Champs obligatoires vides ou non sélectionné :

▪ Le système signale les champs obligatoires

Table 2:Description du cas d’utilisation « bibliothèque d’images »

● Gestion des templates :

Abderrazaq Ikharmej 32 2020-2021


Titre Gestion templates

Objectif Permet à l’Utilisateur de gérer templates (ajouter, modifier,


partager, supprimer)

Acteurs HQ

Enchaînement

Précondition L’acteur est bien identifié et son rôle soit HQ

Scénario nominale

● Scénario « ajouter un template » se passe en trois étapes

▪ L’acteur clique sur ajouter template

▪ Le système affiche la première étape de création template

▪ L’acteur saisie les informations générales dans le formulaire

▪ Le système affiche la deuxième étape pour que l’acteur saisit la disponibilité du template

▪ L’acteur remplie la disponibilité

▪ Le système affiche la troisième étape où l’acteur peut partager template avec les points de
ventes qu’ils gèrent.

▪ L’acteur associer template aux magasins

▪ Le système enregistrer les données

● Scénario « partager un template » le partage avec les magasins que l’acteur gère

▪ L’acteur choisit template à partager

▪ Le système affiche la liste des magasins que l’acteur gère avec les données du rappel

Abderrazaq Ikharmej 33 2020-2021


( les magasins déjà choisi sont coché par défaut)

▪ L’acteur fait les modifications

▪ L’acteur modifier les modifications par cliquer sur partager

▪ Le système enregistre les modifications et retourne message de réussite

● Scénario « modifier un template »


▪ L’acteur choisit template à modifier
▪ L’acteur clique sur l’action modifier
▪ Le système lui fait passer à l'étape 2 du processus de création avec les données déjà
choisies.
▪ L’acteur fait les modifications
▪ Le système enregistre les modifications

● Scénario « supprimer un template »


▪ L’acteur choisit template à supprimer
▪ L’acteur clique sur l’action supprimer
▪ Le système affiche boîte de confirmation
▪ L’acteur valider son choix de supprimer
▪ Le système supprime le template sélectionné s’il n’est pas déjà utilisé, sinon il
l’archive.

Scénario Alternatif

Champs obligatoires vides ou non sélectionné :

▪ Le système signale les champs obligatoires

Table 3:Description du cas d’utilisation « Gestion des templates »

● Gestion Campagne :

Titre Gestion Campagne

Abderrazaq Ikharmej 34 2020-2021


Objectif Permet à l’Utilisateur de gérer templates (ajouter, modifier,
Booster, supprimer)

Acteurs HQ ou Franchisé

Enchaînement

Précondition L’acteur est bien identifié et son rôle soit HQ ou Franchisé

Scénario nominale

● Scénario « créer une campagne organique » se passe en quatre étapes

▪ L’acteur clique sur créer une nouvelle campagne

▪ Le système affiche la première étape de configuration de campagne

▪ L’acteur saisie les informations de configuration

▪ Le système affiche la deuxième étape pour que l’acteur choisit la forme de la campagne

(Soit il va créer une campagne à zéro ou il va se baser sur une template)

▪ L’acteur fait son choix

▪ Le système affiche la troisième étape ; formulaire d’informations de campagne

▪ L’acteur saisie les informations générales dans le formulaire

▪ Le système affiche la quatrième étape où l’acteur peut partager campagne avec les points de
ventes qu’ils gèrent.

▪ L’acteur associer campagne aux magasins

▪ Le système enregistrer les données et donne la possibilité soit de revenir à la page d'accueil
ou de booster cette campagne
▪ L’acteur fait son choix

● Scénario « modifier campagne »


▪ L’acteur choisit campagne à modifier

Abderrazaq Ikharmej 35 2020-2021


▪ L’acteur clique sur l’action modifier
▪ Le système afficher le formulaire contenant les informations de la campagne sélectionné
▪ L’acteur fait les modifications
▪ Le système enregistre les modifications et affiche d'une notification (Succès)

● Scénario « supprimer campagne »


▪ L’acteur choisit campagne à supprimer
▪ L’acteur clique sur l’action supprimer
▪ Le système affiche une boîte pour que l’acteur choisit sur quel média il veut la supprimer
▪ L’acteur fait son choix de médias
▪ Le système affiche boîte de confirmation
▪ L’acteur valider son choix de supprimer
▪ Le système supprime campagne sélectionnée

● Scénario « Booster campagne »

Dans ce scénario on deux possibilités soit l’acteur va faire booster la campagne juste après la
création car on lui propose de la booster, sinon il peut la booster en choisissant une campagne
de puis la liste des campagnes organiques ; dans les deux cas il va passer par le même
processus qui passe en 5 étapes. Donc prenant par exemple ce cas :
▪ L’acteur choisit campagne à booster

▪le système affiche la première étape

Dans cette étape, l’utilisateur doit choisir sur quelle channel il veut booster la campagne. Les
channels proposées sont de type payant (Google Ads, Facebook Boost).

Pour l’instant, seul Google Ads est disponible.


▪ L’acteur choisit Google Ads

▪Le système affiche la deuxième étape, cette étape est dédiée pour remplir les éléments
publicitaires (Assets). Elle propose un formulaire prérempli par les données de la campagne
organique.

▪L’acteur remplit le formulaire des éléments publicitaires

▪Le système affiche la troisième étape qui a comme objectif de définir le budget / le montant
prêt à être dépensé chaque jour, pour chaque magasin

▪L’acteur remplit ses choix pour le montant qu'il veut dépenser sur cette campagne.

Abderrazaq Ikharmej 36 2020-2021


▪Le système affiche la quatrième étape, dont cette étape utilisateur remplit les informations de
son entreprise, cette étape va nous aider pour la génération de facture.
▪L’acteur remplit le formulaire

▪Le système affiche la cinquième étape qui concerne le paiement

▪L’acteur remplit le formulaire par les informations de sa carte bancaire pour faire le paiement

▪Le système enregistre les données possibles et si tout se passe bien, on retrouve la campagne
Google Ads dans le tableau de bord et on peut vérifier dans l’interface de google ADs on
trouve toutes les données saisies par utilisateur. En plus, le système envoie un mail à
l'utilisateur contenant la facture.

Scénarios d’erreur :

▪si on a une erreur lors du boost de campagne le système fait toujours enregistré les
mouvements afin d’avoir une historique des paiements et même si on a une erreur et le boost
soit erroné le montant dépensé va être dans une porte-monnaie avec cet monnaie utilisateur
peut booster encore une fois sans avoir l’obligation de payer du coup l’utilisateur va jamais
perdu son argent à cause d’une erreur quel que soit sa source .

Scénario Alternatif

Champs obligatoires vides ou non sélectionné :

▪ Le système signale les champs obligatoires

Table 4:Description du cas d’utilisation « Gestion des campagnes »

4. Diagramme de séquence
La description textuelle seule ne suffit pas puisqu’il est difficile d’y montrer comment les
enchaînements se succèdent. De plus, la maintenance des évolutions s’avère souvent
fastidieuse. C’est pour cette raison qu’il est recommandé de compléter les diagrammes des cas
d’utilisation par des diagrammes de séquences. Ces derniers représentent les échanges de
messages entre objets, dans le cadre d’un fonctionnement particulier du système.

Abderrazaq Ikharmej 37 2020-2021


4.1. Diagramme de séquence « Authentification »

Dans le diagramme suivant, nous présentons le scénario relatif au cas d’utilisation


« Authentification ». HQ et le franchisé doivent saisir le login et mot de passe pour accéder à
la plateforme .

Figure 20:Diagramme de séquence pour l’authentification

4.2. Diagramme de séquence « l’ajout d’une nouvelle image »

Dans le diagramme suivant, nous présentons le scénario relatif au cas d’utilisation «


l’ajout d’une nouvelle image ». L'utilisateur HQ peut ajouter des nouvelles images dans la
bibliothèque d'image.

Abderrazaq Ikharmej 38 2020-2021


Figure 21:Diagramme de séquence d’ajout d’images

Abderrazaq Ikharmej 39 2020-2021


4.3. Diagramme de séquence suppression d’une image

Dans le diagramme suivant, nous présentons le scénario relatif au cas d’utilisation «


Suppression d’une image ». L'utilisateur HQ peut supprimer une ou plusieurs images tel que
si l’image est déjà utilisée le système le passe en mode archivé.

Figure 22:Diagramme de séquence de suppression d’images

Abderrazaq Ikharmej 40 2020-2021


4.4. Diagramme de séquence « création template »

Dans le diagramme suivant, nous présentons le scénario relatif au cas d’utilisation «


création template ».

Figure 23:Diagramme de séquence de la création d’une template

Abderrazaq Ikharmej 41 2020-2021


4.5. Diagramme de séquence « modification d’une template »

Dans le diagramme suivant, nous présentons le scénario relatif au cas d’utilisation


«modification d’une template».

Figure 24:Diagramme de séquence de la modification d’une template

Abderrazaq Ikharmej 42 2020-2021


4.6. Diagramme de séquence « création d’une campagne organique »

La figure suivante présente le diagramme de séquence du scénario relatif au cas


d’utilisation « création d’une campagne organique ». Mettant en évidence l’ensemble des
interactions entre l’utilisateur HQ/Franchisé d’une part et l’ensemble des composants du
système d’autre part.

Figure 25:Diagramme de séquence de la création d’une campagne

Abderrazaq Ikharmej 43 2020-2021


4.7. Diagramme de séquence « la modification d’une campagne »

La figure suivante présente le diagramme de séquence du scénario relatif au cas


d’utilisation «la modification d’une campagne ». Mettant en évidence l’ensemble des
interactions entre l’utilisateur HQ/Franchisé d’une part et l’ensemble des composants du
système d’autre part.

Figure 26:Diagramme de séquence de la modification d’une campagne

4.8 Diagramme de séquence « suppression d’une campagne organique »

Dans les deux diagrammes suivants, nous présentons le scénario relatif au cas
d’utilisation « suppression d’une campagne organique ».

Abderrazaq Ikharmej 44 2020-2021


Figure 27:Diagramme de séquence pour supprimer une campagne organique

4.9 Diagramme de séquence « Statistiques des campagnes » et « Aperçu des


campagnes »

Dans les deux diagrammes suivants, nous présentons le scénario relatif au cas
d’utilisation « Statistiques des campagnes » et « Aperçu des campagnes ».

Abderrazaq Ikharmej 45 2020-2021


Figure 28:Diagramme de séquence pour accéder à l'aperçu des campagnes

Figure 29:Diagramme de séquence pour accéder au statistique des campagnes

Abderrazaq Ikharmej 46 2020-2021


4.10 Diagramme de séquence « Booster campagne »

La figure suivante présente le diagramme de séquence du scénario relatif au cas d’utilisation


« booster campagne ».

Figure 30:Diagramme de séquence pour booster une campagne

Abderrazaq Ikharmej 47 2020-2021


5. Diagramme d'activités
Le diagramme d'activité est un diagramme comportemental d'UML, permettant de
représenter le déclenchement d'événements en fonction des états du système et de modéliser
des comportements parallélisables (multi-threads ou multi-processus).

5.1. Diagramme d’activité « Authentification »

Figure 31:Diagramme de l’activité S’authentifier

5.2. Diagramme d’activité « création d’une campagne organique »

La figure suivante présente le diagramme d’activité du scénario "création d'une


campagne" mettant en évidence l’ensemble des interactions entre l’utilisateur d’une part et
l’ensemble des composants du système d’une autre part.

Abderrazaq Ikharmej 48 2020-2021


Figure 32:Diagramme de l’activité Créer une campagne

5.3. Diagramme d’activité « Booster campagne »

Abderrazaq Ikharmej 49 2020-2021


Figure 33:Diagramme de l’activité Booster une campagne dans Google Ads

La figure suivante présente le diagramme d’activité du scénario « Booster campagne »


mettant en évidence l’ensemble des étapes pour faire et réussir le booste d’une campagne.

Abderrazaq Ikharmej 50 2020-2021


6. Diagramme de classe
Le diagramme de classes fournit une vue globale de la structure statique du système en
présentant ses classes et les relations entre elles. Il présente également la structure interne de la
classe, en exposant ses attributs et opérations. Le diagramme de classes permet de structurer le
travail de développement de manière très efficace et correcte, c'est pour cette raison qu'il est
considéré comme le plus important par rapport aux autres diagrammes UML.

Figure 34:Diagramme de classes

Abderrazaq Ikharmej 51 2020-2021


Conclusion

Durant ce deuxième chapitre, nous avons présenté l’étude et l’analyse fonctionnelle, en


concevant les diagrammes UML qui facilitent la compréhension de la problématique, l’étude
de différents cas et la spécification des besoins de notre projet, à savoir : les besoins fonctionnels
et non fonctionnels. Finalement l’analyse fonctionnelle à savoir : le diagramme de cas
d’utilisation, les diagrammes de séquences, les diagrammes d'activités et le diagramme de
classes. L’étude technique fera l’objet du chapitre suivant.

Abderrazaq Ikharmej 52 2020-2021


Chapitre 3 :
Etude technique

Ce chapitre est une sorte d’étude technique du projet. On y retrouve


son fonctionnement global, vu du contexte technique. Aussi, on y liste toutes
les technologies et les APIs employées qui ont assuré la totalité des besoins
fonctionnels énoncés.

Abderrazaq Ikharmej 53 2020-2021


Introduction
Dans ce chapitre est consacré à la présentation de l’architecture technique du projet,
Ceci inclut la description des architectures logicielles, ainsi que la description des différentes
technologies et Frameworks utilisés lors de la partie mise en œuvre.

1. Architecture du projet
1.1 Architecture MVC
Avant d'entamer l'architecture de la plateforme, il faut passer tout d’abord par
l'architecture de base qui est le MVC qui est un motif d'architecture logicielle destiné aux
interfaces graphiques et très populaire pour les applications web. Le motif est composé de trois
types de modules ayant trois responsabilités différentes : les modèles, les vues et les contrôleurs.

● Un modèle (modèle) contient les données à afficher.


● Une vue (Présentation) contient la présentation de l'interface graphique.
● Un contrôleur (Métier) contient la logique concernant les actions effectuées par
l’utilisateur.

Figure 35:Architecture globale du projet

Lorsqu’un utilisateur interagit avec l’application : cette action est prise en charge par le
Contrôleur, qui fait alors appel au Modèle. Celui-ci va réaliser l'action fonctionnelle et
éventuellement interagir avec une base de données, après une fois le travail du Modèle terminé,
le Contrôleur met à jour la Vue qui est renvoyée à l'utilisateur.

Abderrazaq Ikharmej 54 2020-2021


1.2. Architecture multi-tier
En génie logiciel, l'architecture multi-tier (n-tier) est une architecture en couches, et
l'interaction de l'utilisateur avec l'application se fait au niveau de la couche présentation. Cette
couche va contenir le contrôleur et la vue du modèle MVC.
Une fois l'action utilisateur identifiée, la couche Présentation va faire appel à la couche Métier,
celle-ci est responsable de la logique métier de l'application, c'est-à-dire que dans cette couche,
nous allons retrouver l'implémentation des règles de gestion fonctionnelles.

Figure 36:Architecture globale multi-tiers

Si lors du traitement, il y a besoin de faire appel à des services extérieurs comme


l'interaction avec une base de données, la couche Métier va faire appel à la couche Persistance.
C’est dans cette couche que l'on retrouve le patron DAO.

Les avantages d’une architecture multi-tiers :

● Les tiers (Modules) partagent les mêmes couches métier, persistance et modèle.
● La possibilité de développer et tester les couches séparément en mettant en place des
interfaces.
● Une seule commande est nécessaire pour construire tous les projets, y compris les
sous-modules.

Dans notre cas, on arrive à matérialiser ce genre de découpage grâce à des modules Maven
sous forme des sous-projets, chacun fournissant ses livrables avec la possibilité de créer des
dépendances entre eux

Abderrazaq Ikharmej 55 2020-2021


Figure 37:Architecture Multi-modulaires de la plateforme MyMobilosoft

2. Les choix technologiques et Frameworks utilisés


De nos jours, le choix des technologies à utiliser dans un projet informatique influence
beaucoup sur la qualité et les performances du logiciel produit.

Une analyse profonde avant tout choix final d’une technologie est nécessaire car un
mauvais choix va dévaloriser mon travail. C’est la raison pour laquelle on a consacré plus de
temps et d’effort en travaillant là-dessus.

Après l’étude des fonctionnalités des différentes technologies, j’ai opté pour une liste
des technologies les plus sophistiquées qu’on va développer dans le paragraphe ci-dessous.

Abderrazaq Ikharmej 56 2020-2021


2.1. Environnements de développement
2.1.1. IntelliJ IDEA

Figure 38:Logo Intellij IDEA

IntelliJ IDEA est un IDE Java intelligent qui fournit une combinaison robuste d’outils de
développement. Ses fonctionnalités clés incluent :

● Une assistance au codage intelligent

● Une navigation et une recherche intelligentes

● De nombreuses factorisations

● Une analyse des codes

● Une assistance au développement Web et d'entreprise

● Des tests unitaires, une couverture de code et la facilitation du travail en


équipe.

Les fonctionnalités de IntelliJ IDEA sont continuellement étendues par les utilisateurs
et les tiers via des plugins. IntelliJ IDEA prend en charge Java EE, Spring / Hibernate et d’autres
piles technologiques.

2.1.2. Spring

Figure 39:Logo Spring

Spring est un Framework libre pour construire et définir l'infrastructure des applications
Java, dont il facilite le développement et les tests. Le Framework Spring a tout d’abord été écrit
par Rod Johnson et réalisé sous la licence Apache 2.0 en 2003.

Abderrazaq Ikharmej 57 2020-2021


Spring est considéré comme un conteneur dit « léger » c’est-à-dire une infrastructure
similaire à un serveur d'applications JEE. Il prend donc en charge la création d’objets et la mise
en relation d’objets par l’intermédiaire d’un fichier de configuration qui décrit les objets à
fabriquer et les relations de dépendances entre ces objets. Le gros avantage par rapport aux
serveurs d’application est qu’avec Spring, les classes n’ont pas besoin d’implémenter une
interface quelconque pour être prises en charge par le Framework (au contraire des serveurs
d'applications J2EE et des EJBs). C’est en ce sens que Spring est qualifié de conteneur « léger
».

Spring s’appuie principalement sur l’intégration de trois concepts clés :

1. L’inversion de contrôle est assurée de deux façons différentes : la recherche et


l’injection de dépendances.

2. La programmation orienté aspect.

3. Une couche d’abstraction qui permet d’intégrer d’autres Framework et


bibliothèques avec une plus grande facilité.

2.1.3. Maven

Figure 40:Logo Maven

Maven, un mot yiddish signifiant accumulateur de connaissances, a été initialement


lancé comme une tentative de simplifier les processus de construction dans le projet Jakarta
Turbine. C’est un outil de construction de projets open source développé par la fondation
Apache. Il permet notamment :

● D’automatiser certaines tâches : compilation, tests unitaires et déploiement des


applications qui composent le projet.

● De gérer des dépendances vis-à-vis des bibliothèques nécessaires au projet.

● De générer des documentations concernant le projet.

Abderrazaq Ikharmej 58 2020-2021


2.2. Frameworks, Bibliothèques et APIs
2.2.1. Spring Boot

Figure 41:Logo Spring boot

Il est aujourd’hui difficile d’étudier une architecture de micro services en Java sans
parler de Spring Boot. Certes il existe d’autres Framework (Dropwizard, Spark Java) mais la
souplesse d’utilisation de Spring Boot et son intégration à l’écosystème Spring font de son
utilisation une évidence, ce qui justifie le fait que le choix de la société pour le développement
de la plateforme MyMobilosoft se soit porté sur Spring Boot, bien qu’il en existe des dizaines
d’autres.

Spring Boot est considéré comme une enveloppe de Spring crée pour répondre aux
besoins de redéfinir la même configuration à plusieurs endroits du code donc c’est un
Framework conçu pour simplifier le démarrage et le développement de nouvelles applications
Spring.

Spring Boot offre également un ensemble de “starter projects” permettant d’intégrer


l’ensemble des librairies nécessaires à la construction par exemple d’un connecteur vers une
technologie donnée.

2.2.2. Spring Data

Figure 42: Logo Spring Data

Spring Data est un projet supplémentaire de Spring créé pour répondre aux besoins
d’écrire plus simplement l’accès aux données. Il s’interface avec plusieurs sources de données
parmi lesquelles JPA, REST, MongoDB et quelques autres.

Abderrazaq Ikharmej 59 2020-2021


2.2.3. Hibernate

Figure 43:Logo Hibernate

Hibernate est une solution open source de type ORM qui facilite le développement de
la couche persistance de l’application.

Hibernate permet de masquer la logique relationnelle aux développeurs objets et/ou


d’interconnecter facilement des objets avec une base de données existante. Il répond au besoin
dans les langages objets ; les données étant le plus souvent stockées dans des bases de données.

Hibernate permet d’assurer la rapidité, l’évolutivité et la maintenabilité du


développement, comme étant un Framework de mapping Objet/Relationnel. Il possède une
architecture parfaitement adaptable à tout type de développements et le support de la majorité
des bases de données du marché.

2.2.4. MyBatis

Figure 44:Logo MyBatis

Le Framework de mappeur MyBatis SQL facilite l'utilisation d'une base de données


relationnelle avec des applications orientées objet. MyBatis couple des objets avec des
procédures stockées ou des instructions SQL à l'aide d'un descripteur XML ou d'annotations.
La simplicité est le plus grand avantage du mappeur de données MyBatis par rapport aux outils
de cartographie relationnelle objet.

La différence majeure entre JPA et MyBatis, c’est que le premier opère un mapping des
objets sur des tables (les entités), alors que le second ne travaille qu’avec des requêtes.
JPA crée un couplage entre la base de données et le modèle objet par le biais d’annotations (ou
en XML) là où MyBatis offre beaucoup de souplesse pour le mapping.

Il est même possible de mapper les résultats sur des classes qu’on ne peut pas modifier
(classes issues de bibliothèques tierces ou développées par une autre équipe par exemple).

Abderrazaq Ikharmej 60 2020-2021


Principales fonctionnalités :

● Création de requêtes SQL dynamiques

● Mapping avancé des résultats

● Personnalisation du mapping

● Gestion des transactions

● Mise en cache des résultats

2.2.5. Google My Business API

Figure 45:Logo Google My Business

C’est une interface de programmation d’applications pour automatiser plusieurs tâches


sur Google My Business. Cela permet de gérer plusieurs emplacements et d'utiliser des
fonctionnalités telles que les publications, les réponses aux avis, les photos à grande échelle etc.

A savoir que Google My Business est un service de référencement destiné aux propriétaires
d'entreprise et exploité par Google. GMB a pour but de donner aux propriétaires d'entreprise
davantage de contrôle sur ce qui apparaît dans les résultats de recherche. Google permet aux
propriétaires d'entreprise de vérifier les données concernant leur établissement en créant une
nouvelle fiche ou en revendiquant une fiche existante .

2.2.6. Facebook graph API

Figure 46:Logo Facebook Graph API

L’API Graph est l’interface principale par laquelle les applications peuvent lire et écrire
sur le graphe social de Facebook. Accéder aux pages, aux publications, aux groupes, aux
évènements et à d’autres sections.

Abderrazaq Ikharmej 61 2020-2021


2.2.7. Google Ads

Figure 47:Logo google Ads

Google Ads, anciennement appelé Google AdWords, est un système de publicité par
liens sponsorisés, qui appartient à Google. Il a été créé en vue d'optimiser les résultats de
recherche de ses utilisateurs. En effet, le logiciel affiche des bannières publicitaires en fonction
des mots-clefs recherchés par l'utilisateur. Cet outil joue un rôle important pour le marketing et
la publicité des sites Internet commerciaux. Les publicités réalisées à partir de Google Ads se
retrouvent en haut de la page des résultats des recherches.
Dans ce cas, elles sont reconnaissables par le terme « Annonce » indiqué en gras avant l'intitulé
du site.

La création d’une campagne publicitaire Google Ads par une entreprise permet de faire
apparaître les annonces créées dans les premiers résultats de recherche ou sur un large réseau
de sites. Grâce à ce système, Google Ads est un accélérateur de visibilité d’une entreprise sur
le web.

Google Ads propose plusieurs types de campagnes, on peut citer par exemple :

● Campagnes display : Le Réseau Display de Google permet de diffuser des annonces


display ciblées auprès des utilisateurs lorsqu'ils parcourent leurs sites Web préférés,
montrent une vidéo YouTube à un ami, consultent leur compte Gmail, ou utilisent un
appareil mobile ou une application.

● Campagnes Discovery : Permettre de toucher jusqu'à 2,9 milliards de clients dans les
flux de Google pour vous aider à atteindre vos objectifs de performances dans Google
Ads. Grâce aux signaux d'intention (audience et clients) de Google, ce type de campagne
vous permet de proposer des expériences publicitaires personnalisées visuellement
attrayantes à des internautes prêts à découvrir votre marque et à s'engager avec celle-ci,
à l'aide d'une seule campagne Google Ads.

● Campagnes locales : Permettre aux entreprises de fournir à leurs clients potentiels les
informations dont ils ont besoin pour choisir quand et comment se rendre dans leurs

Abderrazaq Ikharmej 62 2020-2021


magasins. Elles optimisent le processus en facilitant la promotion de vos magasins sur
les principales propriétés de Google, dont le Réseau de Recherche, Maps, YouTube et
le Réseau Display. Il suffit d'ajouter quelques lignes de texte, un budget et quelques
éléments, et l'outil s'occupe du reste pour aider les clients à trouver établissement.

● Campagnes Hôtel : Permettre de définir une enchère pour les annonces qui s'affichent
lorsqu'un voyageur recherche un hôtel sur Google ou sur Maps. Ces annonces
apparaissent dans un module de réservation d'hôtel qui peut afficher des photos de
l'hôtel, les services proposés, les prix et un lien permettant d'effectuer une réservation.

Donc Google Ads propose un certain nombre de stratégies publicitaires avancées, ce


qui va permettre de choisir celles qui conviennent le mieux dans notre cas.

Pour notre cas l’objectif est de générer du trafic humain vers les magasins physiques
donc la plus adapté à notre besoin est les campagnes publicitaires locales puisqu’elles
permettent d'attirer des clients dans vos magasins et établissements physiques. Les annonces
sont automatiquement optimisées pour s'afficher sur le Réseau de Recherche, le Réseau
Display, Google Maps et YouTube.

De plus, elles ont plusieurs avantages tel que le premier avantage est le coût. A l’inverse
des publicités classiques, l’établissement n’est facturé que si l’internaute le contacte, ainsi, il
paye au lead réellement apporté et non au nombre de vues ou de clics !

Ces annonces particulières confèrent de nombreux autres avantages, et les entreprises


qui en bénéficient peuvent : Apparaître en haut des résultats de recherche et gagner en visibilité
tout en boostant leur e-réputation.
Toucher des clients potentiels qui recherchent les services qu’elles proposent et faciliter la prise
de contact. D’autres fonctionnalités très intéressantes viennent compléter ces avantages. Par
exemple, les entreprises peuvent également contester les prospects non valables et se faire
rembourser des frais payés à Google.
Enfin, il est aussi possible de faire une pause dans la campagne d’annonces locales, sans pour
autant résilier l’abonnement.

Le fonctionnement des campagnes locales :

Lorsque on veut créer une campagne locale, il suffit de définir les adresses des
magasins dont on souhaite faire la promotion.
Pour ce faire, on peut associer notre compte Google My Business ou sélectionner des lieux

Abderrazaq Ikharmej 63 2020-2021


affiliés.
Les campagnes locales privilégient la simplicité et elles nous permettent avant tout
d'atteindre nos objectifs commerciaux.
Il vous suffit de fournir l'adresse de nos établissements, le budget de la campagne et les
éléments des annonces.
Grâce à ces données, la technologie de machine learning (apprentissage automatique)
de Google peut optimiser automatiquement les enchères, les emplacements d'annonces et les
combinaisons d'éléments.

L'objectif est de maximiser nos valeurs en magasin (d'après les visites en magasin, les
clics générant des appels et/ou les clics permettant d'obtenir un itinéraire), et de promouvoir nos
établissements sur les propriétés et réseaux Google.

Les campagnes locales utilisent également un ciblage par rayon pour les
établissements Google My Business et ceux associés à des extensions de lieux affiliés.
Ce rayon peut varier en fonction des zones ciblées et de la préférence de l'utilisateur
concernant la distance à parcourir. Il dépend également d'autres facteurs comme le secteur
d'activité, la densité de la population et la présence de concurrents.

2.2.8. Google Ads API

L'API Google Ads est l'interface de programmation moderne de Google Ads et la


prochaine génération de l'API AdWords. Il permet aux développeurs d'interagir directement
avec la plate-forme Google Ads, augmentant considérablement l'efficacité de la gestion de
comptes et de campagnes Google Ads volumineux ou complexes. L’API peut faire ce que fait
l'interface utilisateur de Google Ads, mais par programmation.

2.2.9. Cloudinary API

Figure 48:Logo Cloudinary

Cloudinary est un service cloud qui offre une solution à l'ensemble du pipeline de
gestion d'images d'une application Web.

Abderrazaq Ikharmej 64 2020-2021


Téléchargez facilement des images dans le cloud. Effectuez automatiquement un
redimensionnement, un recadrage et une conversion intelligents des images sans installer de
logiciel complexe. Intégrez l'extraction d'images de profil Facebook ou Twitter en un clin d'œil,
dans n'importe quelle dimension et style pour correspondre aux exigences graphiques de votre
site Web. Les images sont livrées de manière transparente via un CDN rapide, et bien plus
encore.

2.2.10. Youtube Api

Figure 49:Youtube Api

L'API de données YouTube permet d'intégrer des fonctions normalement exécutées sur
le site Web YouTube dans notre propre site Web ou application.
L'API prend en charge des méthodes pour insérer, mettre à jour ou supprimer un grand
nombre de ces ressources.il donne également la possibilité pour faire la recherche des vidéos
correspondant à des termes de recherche, des sujets, des lieux, des dates de publication et bien
plus encore.

2.2.11. Stripe

Figure 50:Logo stripe

L'API Stripe permet aux développeurs d'accéder aux fonctionnalités de Stripe.C’est un


service qui permet aux utilisateurs d'accepter des paiements en ligne, en particulier les
développeurs. Avec l'application Stripe, les utilisateurs peuvent suivre les paiements,
rechercher les paiements passés, créer des frais récurrents et suivre les clients.

2.2.12. AJAX/jQuery

Ajax est une méthode utilisant différentes technologies ajoutées aux navigateurs web
entre 1995 et 2005, et dont la particularité est de permettre d'effectuer des requêtes au serveur

Abderrazaq Ikharmej 65 2020-2021


web et en conséquence, modifier partiellement la page web affichée sur le poste client sans
avoir affiché une nouvelle page complète. Cette architecture informatique permet de construire
des applications Web et des sites web dynamiques interactifs. Ajax est l'acronyme de
l'asynchronous JavaScript and XML : JavaScript et XML asynchrones.

JQuery est une bibliothèque JavaScript open-source et cross-browser qui permet de


traverser et manipuler très facilement l'arbre DOM des pages.

2.3. Bases de données


2.3.1. Google Cloud SQL pour PostgreSQL

Figure 51:Logo Google Cloud SQL

La plateforme sur laquelle on travaille utilise Google Cloud SQL pour PostgreSQL
comme service de gestion de base de données relationnelle. Il facilite la configuration, la gestion
et l'administration des bases de données. Ce cas d'utilisation est un composant fondamental
d'une architecture de micro services reposant sur un service de stockage indépendant, ce qui
permet la décentralisation de la gestion des données et assure l'évolutivité indépendante de
chaque service.

2.4. Système de gestion de code


2.4.1. Git & GitHub

Figure 52:Logo Git

GitHub est une plateforme open source de gestion de versions et de collaboration


destinée aux développeurs de logiciels. Livrée en tant que logiciel à la demande (SaaS, Software

Abderrazaq Ikharmej 66 2020-2021


as a Service), la solution GitHub a été lancée en 2008. Elle repose sur Git, un système de gestion
de code open source a pour but d'accélérer le développement logiciel.

Git permet de stocker le code source d'un projet et de suivre l'historique complet de
toutes les modifications apportées à ce code. Grâce aux outils qu'elle fournit pour gérer les
conflits éventuels résultant des changements apportés par plusieurs développeurs, il est possible
de collaborer efficacement sur un même projet.

GitHub facilite la programmation collaborative en mettant une interface Web à


disposition du référentiel de code de Git, ainsi que des outils d'administration favorisant la
collaboration. GitHub fait penser à un site de réseau social sérieux sur lequel se retrouvent les
développeurs de logiciels. Ses membres peuvent suivre les activités et évaluer le travail de
chacun, recevoir des mises à jour pour des projets spécifiques et communiquer de manière
publique ou privée.

2.5. Modélisation et gestion de projet


2.5.1. Lucid

Figure 53:Logo Lucid

C’est un site web de modélisation UML (Unified Modeling Language) open source qui
peut remplacer dans bien des situations des logiciels commerciaux et coûteux. Étant simple
d’utilisation, supportant le travail en équipe , nécessitant peu de ressources système, et
supportant UML 2.5 .Ce site constitue une excellente option pour une familiarisation à la
modélisation.

2.5.2. GanttProject

Figure 54:Logo ganttproject

Abderrazaq Ikharmej 67 2020-2021


GanttProject est un logiciel libre de gestion de projet écrit en Java, qui permet d'éditer
un diagramme de Gantt. Parmi les fonctionnalités principales de ce projet :

- Description de la structure de découpage du projet (en anglais "Work Breakdown


Structure"). C'est une décomposition hiérarchique, axée sur les tâches, du travail que
l’équipe de projet doit exécuter pour atteindre les objectifs du projet et produire les
livrables voulus.

- Liens multiples de précédences entre les tâches (prédécesseurs/successeurs).

Conclusion
Ce chapitre avait comme finalité d’expliquer le côté technique du projet. On a donc
commencé par la schématisation du fonctionnement global, et ensuite de lister les technologies
qu’on a employées.

Abderrazaq Ikharmej 68 2020-2021


Chapitre 4 :
Réalisation et mise en œuvre

Dans ce dernier chapitre, on retrouve les différentes tâches


qu’on a intégrées pour la réalisation et la mise en œuvre de ce projet, en fonction
d’une approche itérative et incrémentale.

Abderrazaq Ikharmej 69 2020-2021


Introduction
Après avoir mené à terme la phase d’analyse et de conception, et les outils et les
Frameworks dans les chapitres précédents. On décrit dans ce présent chapitre les différentes
tâches qu’on a intégrées pour la réalisation et la mise en œuvre de ce projet, tout en suivant une
approche itérative et incrémentale..

1. Présentation du module Campagne


L’objectif de cette partie est de donner un aperçu sur les différentes interfaces du
système développé, ainsi que les fonctionnalités offertes à l’utilisateur.

1.1. aperçu des campagnes organiques et payantes


Après avoir se connecter à la plateforme et accéder hub "Campagnes" la page de l'aperçu
des campagnes organiques et payantes va s’afficher .la figure sous-dessus montre la vision
initiale de cette dernière :

Figure 55:Aperçu des campagnes organiques et payantes

Abderrazaq Ikharmej 70 2020-2021


La page d'aperçu contient plusieurs éléments comme on a déjà cité avant dans le
deuxième chapitre, et parmi ces éléments on va mentionné quelques-uns :

1. La barre de navigation va faciliter la navigation depuis l'aperçut vers Template ou


bibliothèque d’images et vers versa.

2. le graphe des statistiques qui montre l'évolution de mes campagnes tel que l'utilisateur
peut faire plusieurs filtres soit par date ,nature , channel etc ...

3. la table des dix dernières campagnes créer selon le type d’utilisateur (HQ ou Franchisé)

4. Bouton : ajouter une nouvelle campagne.

1.2. Gestion bibliothèque d’images


1.2.1. Aperçu

Figure 56:Aperçu Bibliothèque des images

Cette page présente une vue globale sur la bibliothèque d’image telle que l’utilisateur
(HQ) peut gérer les images. Par la suite on va voir le flux de création et les actions possibles.

1.2.2. flux de création

Après avoir cliqué sur ajouter une image , utilisateur va passer au flux de création qui
se constituer par les étapes suivante:

Abderrazaq Ikharmej 71 2020-2021


Figure 58:Etape 1 de création d’image
Dans cette étape utilisateur va entrer l’image souhaitée et il va passer automatiquement à l'étape
suivante .

Figure 57:Etape 2 de création d’image

Dans cette étape utilisateur peut modifier les informations de l’image(titre) et il peut les
tagger aussi. Ensuite il va cliquer sur confirmer pour continuer.

Abderrazaq Ikharmej 72 2020-2021


Figure 59:Etape 3 de création d’image

Dans cette étape utilisateur partage l’image insérer avec les locations qui gère .Ensuite
il va cliquer sur confirmer pour continuer .

Figure 60:Etape 4 de création d’image

Abderrazaq Ikharmej 73 2020-2021


La dernière étape est une page qui résume la totalité des choix d’utilisateurs donc après
sa confirmation l’image va être bien ajoutée .

Figure 61:création d’image avec succès

Maintenant puisque image est bien ajouter on peut l’avoir dans la page de la liste des
images tel que comme la figure ci dessous affiche on peut faire les actions suivantes:

Figure 62:Action possible sur image

1. Le premier choix (Show) : cette option permet de voir l’image dans un nouvel angle.
2. Le deuxième choix pour faire la modification tel que comme mentionné dans la partie
des scénarios la modification va faire passer par le flux de création avec les données
déjà inserer.
3. L’option du partage permet à l'utilisateur de partager l’image avec plus de points de
ventes qu’ils gèrent .
4. La dernière option permet de supprimer l'image.

Abderrazaq Ikharmej 74 2020-2021


1.3. Gestion des thèmes
1.3.1. Aperçu

Figure 63:La listes des thèmes

La liste des thèmes présente toutes les thèmes existantes dans le système, avec la
possibilité de Modifier et supprimer les thèmes, l’utilisateur peut aussi de visualiser la
description et le planning d’un thème .

1.3.2. Création d’un nouveau thème

Figure 64:Bouton de création des thèmes

Abderrazaq Ikharmej 75 2020-2021


Si l’utilisateur veut ajouter un nouveau thème par cliquer au bouton Ajouter (Figure 48), le
système va afficher un pop-up pour insérer les champs suivants :

Figure 65:Pop-up de création d'un nouveau thème

Libellé : l’utilisateur peut insérer un nom pour le nouveau thème .

Description : pour donner plus de détails sur le thème

Toujours : un checkbox pour garder l'état Permanent pour ce thème

Planning : Définir un calendrier de publication pour un thème

1.3.3. Modification d’un thème:

Maintenant puisque le thème est bien ajouter on peut le modifier par le clique au bouton
Éditer comme la figure ci-dessous affiche :

Abderrazaq Ikharmej 76 2020-2021


Figure 66:Bouton Editer un thème

Ce bouton affiche au utilisateur une nouvelle pop-up où il peut effectuer des


modifications sur le thème choisi .

Figure 67:Pop-up de modification d'un thème

Abderrazaq Ikharmej 77 2020-2021


1.4. Gestion des Templates
1.4.1. Aperçu

Figure 68:Aperçu des templates

Cette page présente une vue globale sur la liste des template telle que l’utilisateur (HQ)
peut gérer les template. Par la suite on va voir le flux de création et les actions possibles.

Abderrazaq Ikharmej 78 2020-2021


1.4.2. Création d’une nouvelle template
Après avoir cliqué sur ajouter une template, utilisateur va passer au flux de création
qui se constituer par les étapes suivantes :

Figure 69:Etape 1 de création template

Dans cette étape utilisateur va entrer Les champs suivant :

● A partir des channels du site proposé, sélectionner au moins une dans lequel

L’utilisateur voulait faire une publication (Google, Facebook, Store Locator).

Selon les langues du site, l’utilisateur peut saisir :

● Jusqu'à 3 titres dont la limite des caractères pour :

Abderrazaq Ikharmej 79 2020-2021


- Google : 50 caractères max.

- Facebook : 30 caractères max.

- Store Locator : 100 caractères max.

● Une description qui ne dépasse pas les 300 caractères.


● Call To Action (CTA).
● Des images :

- Depuis l’ordinateur.

- Depuis la bibliothèque des images ; A noter bien, que seules les images

partagées avec les magasins gérés par l'utilisateur sont affichées.

● Une vidéo depuis l’ordinateur.


● Ajouter des tags.

Figure 70:Étape 2 de création template

Dans cette étape, l’utilisateur choisit la période de validité de la template. Ensuite il va


cliquer sur confirmer pour continuer

Abderrazaq Ikharmej 80 2020-2021


Figure 71:Etape 3 de création template
.

Dans cette étape utilisateur partage la template avec les locations qui gère .Ensuite il va
cliquer sur confirmer pour continuer .

Figure 72:Etape 4 de création template

La dernière étape est une page qui résume la totalité des choix d’utilisateurs donc après
sa confirmation la template va être bien ajoutée .

Abderrazaq Ikharmej 81 2020-2021


Figure 73:Création Template avec succès

Maintenant puisque la Template est bien ajouter on peut l’avoir dans la page de la liste
des Template tel que comme la figure ci-dessous affiche on peut faire les actions suivantes:

Figure 74:Action possible sur la Template

1. Le premier choix pour faire la modification tel que comme mentionné dans la partie des
scénarios la modification va faire passer par le flux de création avec les données déjà
insérer.

2. Le deuxième choix est l’option du partage permettant à l'utilisateur de partager la


template avec plus de points de ventes qu’ils gèrent.

3. La dernière option est pour la suppression.

Abderrazaq Ikharmej 82 2020-2021


1.5. Gestion des campagnes organiques :

1.5.1. Processus de création :


Allant dans le hub Campagne Beta on trouve un bouton (+) pour créer une nouvelle
campagne :

Figure 75:Action pour faire l’ajout d’une campagne

Figure 76:Étape 1 de la création d’une campagne

Dans cette étape, l’utilisateur doit renseigner les informations suivantes :

- L’objectif de la campagne.

- La date début et fin de la campagne.

-Le thème de la campagne.

Abderrazaq Ikharmej 83 2020-2021


Figure 77:Etape 2 de la création d’une campagne

Dans cette étape, on affiche l’ensemble des templates créées pour le thème, et le
planning choisis auparavant. L’utilisateur peut donc créer sa campagne depuis l’une de ces
templates, ou “from scratch”.

Si l'utilisateur a choisi dans l'étape 2 de créer une campagne depuis une template, le
formulaire dans cette étape sera donc prérempli avec les données de la template (titres,

description, images ...). Ces données peuvent toujours être modifiées.

Si l'utilisateur a choisi de créer une campagne from Scratch, tous les champs du formulaire

seront vides. L’utilisateur doit le remplir à zéro. Les champs à renseigner seront comme l'étape
3 de la création des templates.

Abderrazaq Ikharmej 84 2020-2021


Figure 78:Etape 3 de la création d’une campagne

Abderrazaq Ikharmej 85 2020-2021


Figure 79:Étape 4 de la création d’une campagne

Figure 80:etape 5 de la création d’une campagne

Abderrazaq Ikharmej 86 2020-2021


Dans cette étape utilisateur partage la campagne avec les locations qui gère .Ensuite il va cliquer
sur confirmer pour continuer .

La dernière étape est une page qui résume la totalité des choix d’utilisateurs donc après
sa confirmation la template va être bien ajoutée .

1.6. Booste des campagnes


1.6.1. Création d’une campagne payante
La création d’une campagne payante se fait à base d’une campagne organique.
- Directement après la création d’une campagne organique.

Figure 81:Action Booster campagnes

-A partir des actions (voir la capture ci-dessous).

Figure 82:Action Booster campagnes

Si on boost la campagne organique préalablement créée :

Abderrazaq Ikharmej 87 2020-2021


Etape 1: Choisissez un support de promotion
Dans cette étape, l’utilisateur doit choisir sur quelle channel il veut booster la campagne.
Les channels proposées sont de type payant (Google Ads, Facebook Boost).

Pour l’instant, seul Google Ads est disponible.

Figure 83:Etape 1 de booster un campagne

Etape 2: Choisissez un support de promotion

Cette étape est dédiée pour remplir les éléments publicitaires (Assets). Elle propose un
formulaire pré-rempli par les données du campagne organique.

- Les titres : pré-remplis par les 30 premiers caractères des titres ajoutés pour la
campagne organique. Le premier titre est un champ obligatoire. Il ne doit pas être
vide. L’utilisateur peut modifier ces titres sans dépasser la limite de 30 caractères
chacun.

- La description : pré-rempli par les 60 premiers caractères de la description ajoutée


pour la campagne organique. L’utilisateur peut modifier cette description sans
dépasser la limite de 60 caractères.

- Les images : Il existe 2 types d’image qu’il faut ajouter :

- Logo : l’utilisateur doit ajouter une image LOGO au format ratio 1.1 (carré)
(voir tableau ci-dessous).

- Image : l’utilisateur a le droit d’ajouter jusqu'à 20 images IMAGE, dont au


moins une est de format ratio 1.91.1 (mode paysage) (voir tableau ci-dessous).

Abderrazaq Ikharmej 88 2020-2021


Format d'image Taille minimale Taille maximale du fichier

1.91:1 600 x 314 5 Mo

1:1 314 x 314 5 Mo

1:1 (image du logo) 116 x 116 5 Mo

Table 5:Les caractéristique des images accepter pour le boost

- Vidéo YouTube : un champ obligatoire, et la vidéo doit durer au moins 10


secondes

Abderrazaq Ikharmej 89 2020-2021


Figure 84:Etape après remplissage de la formulaire

Abderrazaq Ikharmej 90 2020-2021


Étape 3 : Définissez le budget

Pour définir le budget (le montant) prêt à être dépensé chaque jour, pour chaque magasin, on
propose 2 modes :

- Mode Expert :

Ici, l’utilisateur saisit le montant à dépenser par jour (en euro), et la durée du boost pour chaque
magasin.

Figure 85:Etape 3 de booster un campagne(Mode Expert)

Abderrazaq Ikharmej 91 2020-2021


- Mode simple

Dans ce mode, l’utilisateur précise :

- Le montant à dépenser par jour (en euro) pour promouvoir la campagne.

- La tranche de date sur laquelle on promouvoit la campagne. La date début et fin sont
prédéfinies du planning de la campagne organique.

- Si la date début de la campagne organique est antérieure à la date courante


(NOW) -> la date début du campagne Google Ads égale à la date courante.

- La liste des magasins valides pour le boost.

Figure 86:Étape 3 de booster un campagne(Mode simple)

Abderrazaq Ikharmej 92 2020-2021


Ici l'utilisateur va choisir les points de ventes sur lesquelles la campagne va être boosté
:

Figure 87:la liste des magasins proposée

Étape 4: Saisir les informations de l’entreprise

Abderrazaq Ikharmej 93 2020-2021


Figure 88:Étape 4 de la boost d’une campagne

Ici l'utilisateur va saisir les informations de l’entreprise qui a effectué l'opération de la


boost.

Étape 5 : Effectuer le paiement

Dans cette dernière étape, l’utilisateur peut consulter un récapitulatif de la campagne


payante et aussi effectuer une opération de paiement dans le cas où le solde existant dans son
propre porte-monnaie n’est pas suffisant.

1.7. Gestion de porte-monnaie

Abderrazaq Ikharmej 94 2020-2021


Figure 90:Etape 5 de la boost d’une campagne

Après la confirmation de cette étape, l’utilisateur reçoit un message de succès pour la


création et la publication de la campagne payante sur Google Ads.

Figure 89:Boost de campagne avec succès

A Travers cette interface, l’utilisateur peut consulter le solde disponible sur son propre
porte-monnaie et l’ensemble des transactions effectuées au moment de publication des
campagnes payantes et aussi de récupérer les factures de paiement.

Abderrazaq Ikharmej 95 2020-2021


Figure 91:Porte-monnaie

Figure 92:Facture de paiement

Abderrazaq Ikharmej 96 2020-2021


1.8. statistique des campagnes
Le détail du statistique des campagnes. Celui-ci reprend le trafic en magasin, le taux
de conversion, le CPC et le CPM.

Figure 94:L’aperçu des statistiques des campagnes partie 1

Figure 93:L’aperçu des statistiques des campagnes partie 2

Abderrazaq Ikharmej 97 2020-2021


Conclusion
Ce dernier chapitre avait comme finalité de présenter le fruit de mon projet c’est-à-dire
une description de la phase de réalisation du projet. Ensuite on a expliqué les fonctionnalités de
la solution réalisée avec des captures illustratives des interfaces de l’application.

Abderrazaq Ikharmej 98 2020-2021


Conclusion générale et
perspective
Notre projet de fin d’études effectué au sein de VIRTUOCODE consistait sur le
développement d’un module de gestion des campagnes publicitaires organiques et payantes.

Pour la réalisation de ce projet, nous avons commencé par une étude fonctionnelle des
besoins spécifiques, ainsi que l’environnement de déploiement tout en respectant les exigences
techniques. Ensuite nous avons abordé la phase de la conception détaillée de la plateforme que
nous avons implémentée par la suite dans le cadre de notre projet.

La phase de mise en œuvre, nous a permis de mettre en place plusieurs modules


additionnels pour assurer un fonctionnement complet de la solution. L’intégration des
équipements dans la plateforme via une configuration complète en développant de nouveaux
scripts pour les résultats souhaités. Enfin la phase de test qui a offert la validation des
spécifications tracées au début du projet.

L’expérience que nous avons vécu durant ce stage a été enrichissante. Sur le plan
technique, nous avons approfondi nos compétences en ce qui concerne les technologies et
outils. Au niveau relationnel, nous avons compris que l’esprit d’initiative, le sens de la
responsabilité et l’aptitude à communiquer sont des éléments capitaux pour la réussite de tout
projet informatique. Enfin, sur le plan personnel, nous avons développé notre aptitude
d’autonomie, de patience et persévérance. Ce stage nous a permis de consolider nos
connaissances acquises pendant notre formation.

En termes de perspectives, le projet dans sa version actuelle n’est pas encore achevé,
nous sommes actuellement dans la phase de stabilisation et traitement des retours de l'équipe
qualité et l'équipe CS qui a va présenter les nouvelles fonctionnalités aux clients ces derniers
vont donner des retours, donc cette phase serait très importante pour arriver à stabiliser la
version et gagner la satisfaction des clients.

Abderrazaq Ikharmej 99 2020-2021


Bibliographie
1 :https://spring.io/

2 : https://www.thymeleaf.org/

3 : https://cloud.google.com/sql/docs/postgres

4 : https://support.google.com/google-ads/answer/9118422?hl=fr

5 : https://support.google.com/google-ads/answer/9118358

6 : https://developers.google.com/google-ads/api/docs/reporting/example

7 : https://blog.zenika.com/2012/03/28/presentation-de-mybatis/

8 : https://support.google.com/google-ads#topic=3119122

9: https://stripe.com/fr/payments/payment-methods-guide

10 : https://developers.google.com/chart/interactive/docs/datatables_dataviews

11 : https://developers.google.com/youtube/v3/

12 :https://www.mobilosoft.com/fr/

13 :https://docs.mobilosoft.com/fr/collections/386261-support-mobilosoft

14 :https://www.virtuology.com/

15:https://openclassrooms.com/fr/courses/4503526-organisez-et-packagez-une-application-
java-avec-apache-maven/4609181-decoupez-votre-projet-en-couches-applicatives

16 :https://asana.com/fr/resources/benefits-project-management

17 : https://agiliste.fr/guide-de-demarrage-scrum/?nab=1

Abderrazaq Ikharmej 100 2020-2021

Vous aimerez peut-être aussi