You are on page 1of 68

MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT SCOLAIRE

DÉDICACES
Je dédie ce travail :
À mes chers parents, Coulibaly
Mamadou et Coulibaly Magnini.
Je n’ose pas imaginer une expression qui puisse résumer ma gratitude envers votre
soutient et encouragement. Aucune dédicace ne saurait exprimer mon amour et mon
respect pour vous.
Que ce travail soit pour vous un témoignage de ma vive reconnaissance et de mon amour
filial.
À mon oncle Couliblay Sidiki et ma
Tante Ouattara Fatoumata, Mes parrain et Encadreur Samson Olanyan, Sylla Mamadou et
mes chères frères et sœurs.
Avec tout mon amour et mon affection, je vous souhaite une vie pleine de bonheur et de
réussite et je vous remercie pour votre soutien durant toutes les périodes difficiles.
À mes amis, de HETEC,
À tous ceux qui m’aiment

Ma reconnaissance à tous les professeurs de l’’Ecole d’Ingénieur HETEC Bouaké.


Sachez que vous m’êtes très chères et que je vous suis très reconnaissant pour tout
l’amour et le soutien dont vous faites preuve à mon égard.
Je vous remercie du fond du cœur.
Coulibaly Sie ALASSANE

OUATTARA MOROU YOUSSEF AMED 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT SCOLAIRE

REMERCIEMENTS
Nous tenons à exprimer nos sincères remerciements au tout clément, DIEU le plus grand pour
sa bienfaisance, miséricorde en notre faveur et nous a accordé la santé et longévité.

Nous souhaiterons adresser nos vifs remerciements aux personnes qui nous ont apporté leur
aide et qui ont contribué au bon déroulement de notre stage particulièrement au propriétaire
de l’entreprise ABOUAKE.NET et à son personnel qui nous ont réservé un accueil fraternel.

Nos sincères remerciements à M. SAMSON OLANIYAN, notre encadreur, qui grâce à ces
conseils prodigués, a toujours été à notre écoute et disponible tout au long de la réalisation de
ce projet.

La disponibilité, la gentillesse et la générosité de M. SYLLA MAMADOU dont les précieux


conseils et les orientations nous ont été d'un grand secours tout au long de ce stage. Qu'elle
trouve ici, l'expression de notre profonde gratitude et de nos sincères remerciements.

Notre sincère gratitude envers certains de nos professeurs à l’égard de M.


N’GORAN MAGLOIRE, M. KOFFI KAN GUILLAUME et M. COULIBALY ABOU.

Nos remerciements s’adressent également à tout le corps professoral de l’École d’Ingénieur


HETEC Bouaké, pour la qualité de son enseignement ainsi que sa disponibilité tout au long
de ces trois années de formation.
Que tous ceux et celles qui ont contribué de près ou de loin à l’accomplissement de ce travail
trouve l’expression de nos remerciements les plus chaleureux.

RÉSUMÉ
Notre projet de fin d’études effectué à Abouake.net consistait en l’analyse, la conception et la
réalisation des modules de gestion des étudiants, des enseignants et des établissements de
l’enseignement supérieur, technique et générale. Ces modules font parties de certains projets
à caractère national lancé par Abouaké.net pour la mise en œuvre des solutions de gestion
d’établissement scolaire au niveaux préscolaire, primaire, collégial, secondaire et supérieur.
Pour mener à bien notre travail, nous avons découpé le projet en quatre étapes. Au début,
nous avons défini le contexte général du projet, et on a adopté comme démarche de conduite

OUATTARA MOROU YOUSSEF AMED 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT SCOLAIRE
de projet, la méthode RUP (Rational Unified Process), qui est une méthode de
développement logicielle itérative basée sur le langage UML. Ensuite, on est passé à la phase
de l’analyse et la spécification des besoins. Dans l’étape suivante, nous avons abordé la
phase de conception pour bien structurer la couche métier de notre application. Enfin, la
dernière étape était la réalisation et la mise en œuvre des modules de notre système à l’aide
des Framework techniques LARAVEL, FLUTTER, VueJs sous l’environnement de
développement VS CODE. Le présent rapport synthétise le travail que nous avons réalisé
durant la période de notre stage, et se compose de quatre chapitres qui retracent les
différentes étapes de notre projet.

ABSTRACT
Our end-of-studies project carried out at Abouake.net consisted of the analysis, design, and
production of management modules for students, teachers and institutions of higher,
technical and general education. These modules are part of certain national projects launched
by Abouaké.net for the implementation of school management solutions at the preschool,
primary, college, secondary and higher levels. To carry out our work, we divided the project
into four stages. At the beginning, we defined the general context of the project, and we
adopted as a project management approach, the RUP method (Rational Unified Process),
which is an iterative software development method based on the UML language. Then, we
moved on to the phase of analysis and specification of needs. In the next step, we tackled the
design phase to properly structure the business layer of our application. Finally, the last step
was the realization and implementation of the modules of our system using the technical
frameworks LARAVEL, FLUTTER, VueJs under the VS CODE development environment.
This report summarizes the work we carried out during the period of our internship and
consists of four chapters which retrace the different stages of our project.

OUATTARA MOROU YOUSSEF AMED 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT SCOLAIRE

LISTE DES ABRÉVIATIONS


Abréviations Significations
HTML Hyper Text Mark-up Language

MVC Model View Controller

API Application Programming Interface

IDE Integrated Development environment

RUP Rational Unifed Process

UML Unified Modeling Language

DE Direction de l’Enseignement

CPDE Conseiller Principal du Directeur d’Etude

CPE Conseiller Principal d’Education

DFE Directeur Financier de l’Etablissement

SGBDR Système de Gestion de Base de Données


Relationnelle
SQL Structured Query Language

OUATTARA MOROU YOUSSEF AMED 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT SCOLAIRE

TABLE DES FIGURES


FIGURE II-1 : les acteurs du système

FIGURE II-2 : Diagramme de contexte

FIGURE II-3 : Diagramme de package des uses cases

FIGURE II-4 Cas d’utilisation « inscription élève et étudiant »

FIGURE II-5 : cas d’utilisation « gestion d’établissement »

FIGURE II-6 Cas d’utilisation « Gestion Enseignant »

FIGURE II-7 Cas d’utilisation « Gestion absents et retard »

FIGURE II-8 Diagramme de séquence « authentification »

FIGURE II-9 Diagramme de séquence « gestion établissement »

FIGURE III-1 Diagramme de classe globale du système SchoolManager

FIGURE II-9 Diagramme d’interaction « gestion établissement »

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

LISTE DES TABLEAUX

TABLEAU II-1 : description textuelle cas d’utilisation « inscription élève/étudiant »

TABLEAU II-2 : description textuelle cas d’utilisation « gestion d’établissement »

TABLEAU II-3 : description textuelle cas d’utilisation « gestion enseignant »

TABLEAU II-4 : description textuelle cas d’utilisation « gestion des absences et retard »

LISTE DES ÉCRANS


Écran 1 : Tableau de bord des Enseignants du système SchoolManager

Écran 2 : Tableau de bord de gestion du personnel administratif et pédagogique

Écran 3 : Tableau de bord de l’étudiant

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

SOMMAIRE
ABSTRACT................................................................................................................................................................3

LISTE DES TABLEAUX..........................................................................................................................................6

LISTE DES ÉCRANS................................................................................................................................................6

SOMMAIRE...............................................................................................................................................................7

INTRODUCTION GENERALE...............................................................................................................................8

PROBLEMATIQUE..................................................................................................................................................9

PARTIE I : CADRE D’ETUDE..............................................................................................................................10

I. PRESENTATION DE ABOUAKE.NET.....................................................................................................11
II. ORGANIGRAMME...................................................................................................................................12
CHAPITRE II : PRESENTATION DU PROJET..................................................................................................13
I. ONTEXTE...................................................................................................................................................13
CHAPITRE I : METHODE D’ANALYSE ET DE CONCEPTION.....................................................................16
I. NOTION DE MÉTHODE D’ANALYSE ET DE CONCEPTION..............................................................16
CHAPITRE II : ETUDE FONCTIONNELLE.......................................................................................................20
III. CONCLUSION PARTIELLE..........................................................................................................................36

CHAPITRE III : CONCEPTION DU SYSTEME D’INFORMATON...............................................................37

CHAPITRE IV : CHOIX DES OUTILS DE REALISATION..............................................................................41

PARTIE III: REALISATION DE L’APPLICATION..........................................................................................54

CHAPITRE III : CAPTURES D’ECRAN ET CODES.........................................................................................62


CONSLUSION......................................................................................................................................................65
BIBLIOGRAPHIES.....................................................................................................................................................65
WEBOGRAPHIES......................................................................................................................................................66

OUATTARA MOROU YOUSSEF 7


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

INTRODUCTION GENERALE

Dans un monde devenu digitale, les entités présentant des systèmes administratifs complexe
sont à la recherche perpétuelle de solutions informatiques performantes qui leur permettra
d’automatiser leurs différentes tâches manuelles qui restent encore très archaïques.

Ainsi pour notre mémoire de fin de cycle, notre étude c’est porté sur les établissements
d’enseignement et de formation. Comme vu plus haut, la gestion actuelle des informations dans
nos écoles demeure encore manuelle et très rébarbatives ce qui cause beaucoup de problèmes.
Sans être exhaustif, nous pouvons cités : la lenteur dans toutes les activités de traitement des
données, un manque de rapidité dans la diffusion de résultats aux différents acteurs du secteur,
mais surtout la sauvegarde de l'historique et/ou palmarès des élèves ainsi que du corps
enseignant. L'éducation est devenue l'un des principaux facteurs de notre civilisation. Son
champ d'influence n'a cessé de s'élargir et le cadre par lequel elle est offerte ou poursuivie, s'est
tout à la fois multiplié et diversifié. Il est difficile d'en donner une définition précise et d'en
fixer le contenu, à tel point que souvent le substantif ? éducation ?
est complété par un adjectif afin de préciser le contenu. Notre projet sera limité sur
l'automatisation de la gestion des informations concernant les élèves des écoles
d’enseignement secondaire et supérieur, vu la complexité et la multiplicité des opérations de
ces écoles.

OUATTARA MOROU YOUSSEF 8


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

PROBLEMATIQUE
Avec Abouake.net Après avoir passé en revue la situation des écoles secondaire et supérieur, la
question suivante a été proposée : comment le développement d'un système de gestion des
informations automatisé pourrait faciliter à ces écoles la gestion et l’automatisation quasi
complète de toutes leurs opérations administratives et d’enseignements ainsi que toutes
les possibilités offertes par ces écoles ? Comment proposer sans redéfinir les règles de gestion
des écoles avec une solution digitale innovante ? C’est ce questionnement profond et
rationnelle qui nous a mené à la mise en place de la solution digitale SchoolManager.
SchoolManager est une solution qui présente une très grande quantité de modules et pour se
faire nous avons travaillé en une équipe de trois pour la réalisation. Ainsi pour ma part j’ai
travaillé sur le module de gestion des notes, des moyennes et des parents.

OUATTARA MOROU YOUSSEF 9


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

PARTIE I: CADRE D’ETUDE

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

I. PRESENTATION DE ABOUAKE.NET

ABOUAKE.NET est une jeune entreprise dynamique et innovante de prestation de


services dans le secteur des Technologies de l’Information et de Communication (TIC)
précisément en informatique et en télécommunications. La société ABOUAKE.NET est une
équipe expérimentée et spécialisée dans les domaines de l’Informatique et des
télécommunications.
Les Technologies de l’Information et de la Communication (TIC) s’imposant de plus en
plus aux entreprises, ABOUAKE.NET se veut une solution sure auprès de ces dernières avec
son personnel jeune, dynamique, expérimenté et hautement qualifié.
Elle a en outre une représentation dans la ville de Duékoué et compte bien prolonger son champ
d’action à d’autres secteurs d’activités.

ABOUAKE.NET est une équipe expérimentée et spécialisée dans les domaines de


l’informatique et des télécommunications.
La société intervient pour le secteur informatique dans la maintenance informatique, la
conception de site web, le câblage et la configuration de réseaux informatique, la formation en
bureautique, Windows/linux, e-business et dans tous les domaines cités ci-dessus.

Pour le domaine des télécommunications, la société intervient dans l’installation


d’automatisation, de téléphones, de système de contrôle de véhicules et de motos par satellite,
dans la vente de matériels de télécommunications, de vidéophones et interphones, de cameras
de détecteur de mouvements et d’incendies dans la localisation de plateforme de surveillance
en temps réel, etc…

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

II. ORGANIGRAMME

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

CHAPITRE II : PRESENTATION DU PROJET

I. CONTEXTE
Notre projet de fin de cycle s’inscrit dans le cadre du programme de digitalisation lancé par
abouké.net. L’intérêt est de permettre à toute entité de disposer d’un système informatique
robuste, conviviale et à la pointe de la technologie pour leur offrir des systèmes de gestion
performant. En te qu’apprenant dans le domaine du génie logiciel nous avons profité de cette
opportunité pour participer à cette grande démarche de transformation digitale.

II. DOMAINE D’ACTIVITE CONCERNE

Le projet de notre étude s’inscrit très clairement dans le domaine de l’enseignement mais plus
précisément au niveau secondaire et supérieur. L’éducation est l’un des socles dans
l’avancement socio-économique de tout pays. Alors cela nous a paru extrêmement important
d’apporter notre pierre à l’édifice.

III. LES OBJECTIFS VISES

Il est important pour nous de rappeler que tout processus de digitalisation que cela soit dans le
domaine de l’éducation ou tout autre vise un certain nombre d’objectifs. Toutefois nous ne
redéfinissons pas les règles et les principes du fonctionnement dans l’ensemble du secteur de
l’éducation mais nous étudions et réglons à l’aide du digitale les problèmes qui peuvent faire
objet de solution informatique. Nous visons entre autres l’amélioration de la gestion des
apprenants, l’amélioration du suivie des apprenants par les parents et la gestion plus stricte de
l’enseignement par la traçabilité des enseignants.

1. Amélioration de la gestion des apprenants

Le management des étudiants quand il s’agit de l’enseignement supérieur ou des élèves dans
l’enseignement secondaire a toujours été critiqué et fait objet d’optimisation. Cela n’est pas
hasardeux vu les nombreux incidents, la lenteur dans les traitements des données de ces

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

apprenants en passant par l’archivage de leur passage dans un établissement. En effet il est
difficile pour bon nombre d’établissement d’enseignement aujourd’hui de produire des
statistiques pertinentes sur les apprenants, de retrouver des informations fiables, de gérer
l’obtention des diplômes avec une certaine facilité.

2. Amélioration du suivi des apprenants par les parents

Il est fort de constaté à quel point il est difficile pour les parents de faire un suivie claire, précis
et sûre de leurs enfants dans leur apprentissage. En effet les tendances actuelles et les nombreux
incidents survenues ces dernières années (exemple des élèves qui décident d’aller en congé
avant les dates prévues) montrent à quel point il est difficile un fois sortie de la maison pour un
parent de savoir si sa progéniture travaille réellement et correctement à l’école. Cela est dû
principalement à un manque de temps de la part du parent, des établissements eux-mêmes mais
aussi des apprenants qui une fois dehors ont un tout autre comportement. L’objectif pour nous
sera d’informer en temps réel et indépendamment des apprenants les parents et autres tuteurs de
leurs états de comportement, de leurs examens, de leurs notes et de toutes activités de
l’établissement les concernant. Ainsi même pour un parent n’ayant pas assez de temps pour le
suivie de son protégé saura que fait-il à l’école.

3. Gestion plus stricte de l’enseignement par la traçabilité des enseignants

Il est déplorable aujourd’hui de constater un manque criard de pédagogie mais surtout un


niveau très faible de nos enseignants. Et cela est d’autant plus vraie puisque le constat vient du
feedback des apprenants eux-mêmes. En effet le manque de rigueur dans le recrutement des
enseignants pose un véritable problème dans l’éducation des apprenants. Ainsi notre solution
vise à permettre à toute école de pouvoir faire un suivi fiable, efficient et surtout pédagogique
des enseignants qu’elles recrutent, en passant de par la vérification des cours enseignés s’ils le
sont vraiment en temps, en qualité et en conformité avec le programme officiel tout en
contrôlant leur niveau à travers des évaluations périodiques rigoureuses.

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

PARTIE II : ETUDE TECHNIQUE

CHAPITRE I : METHODE D’ANALYSE ET DE CONCEPTION

I. NOTION DE MÉTHODE D’ANALYSE ET DE CONCEPTION


L’analyse et la conception d’un projet informatique nécessitent l’utilisation d’un langage de
modélisation et d’une méthode ou démarche appropriée de développement. Ces outils sont des
outils d’aide à la conception qui permettent la description du système logiciel, une meilleure

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

compréhension de celui-ci par les acteurs, surtout une participation, une collaboration active
entre informaticiens et acteurs à travers le recueil d’informations. L’ensemble des règles de
modélisation peut être appuyé par un processus ou méthode d’analyse dont le rôle est d’assurer
l’harmonie au sein d’un ensemble d’éléments coopératifs, et d’expliquer comment il convient
de se servir du langage de modélisation

II. CHOIX DE LANGAGE DE MODÉLISATION

Pour conduire un projet d’analyse et de conception de façon à le réussir, il faut choisir un


langage de modélisation approprié. A cet effet, UML (Unifed Modeling Language) a été choisi
par le groupe de pilotage comme langage de modélisation.

III. PRÉSENTATION D’UML

UML (Unifed Modeling Language, que l’on peut traduire par « langage de modélisation unifié
») est un langage permettant de modéliser un problème de façon standard. Ce langage est né de
la fusion de plusieurs méthodes existantes auparavant (OMT, BOOCH, OOSE), et est devenu
désormais la référence en termes de modélisation objet, à tel point que sa connaissance est
nécessaire pour conduire un grand projet.

Il est basé sur les concepts orientés objets et a été conçu pour la modélisation de tous les
phénomènes de l’activité de l’entreprise indépendamment des techniques d’implémentation
mise en œuvre par la suite. Il n’est ni une méthode, ni un processus mais un langage de
modélisation. Dans le cadre de la modélisation d’une application informatique, UML n’impose
pas une démarche particulière pour l’analyse du système mais préconise d’adopter une
démarche ayant les caractéristiques suivantes :

Itérative et Incrémentale ;

Pour modéliser c’est-à-dire comprendre et représenter un système complexe, il est mieux


d’affiner son analyse en plusieurs étapes. Cette démarche s’applique aussi au cycle de
développement dans l’ensemble. Son but est de mieux maitriser la part d’inconnus et
d’incertitudes qui caractérise le système.

Guidée par le besoin des utilisateurs du système ;

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Avec UML, ce sont les utilisateurs qui guident la définition des modèles : le périmètre du
système à modéliser est défini par les besoins des utilisateurs. Le but du système à modéliser
est de répondre aux besoins de ses utilisateurs. Les besoins des utilisateurs servent tout au long
du cycle de développement qui est itératif et incrémentale. A chaque itération de la phase
d’analyse, on clarifie, affine et valide les besoins des utilisateurs. A chaque itération de la phase
de conception et de réalisation, on veille à la prise en compte des besoins des utilisateurs. A
chaque itération de la phase de test, on vérifie que les besoins des utilisateurs sont satisfaits.

Centrée sur l’architecture logicielle.

Une architecture adaptée est la clé du succès d’un développement. Elle décrit des choix
stratégiques qui déterminent en grande partie les qualités du logiciel : adaptabilité,
performance, fiabilité. Pour faciliter la vision du non-programmeur et le travail du
programmeur et afin d’obtenir une vue d’ensemble du système en un temps beaucoup plus
court, UML a initié le concept visuel fondé sur les diagrammes. UML 2.0 définit treize (13)
diagrammes repartis selon les modèles suivant :

Les modèles statiques

Ce sont des diagrammes qui permettent de visualiser, spécifier, construire et documenter


l’aspect statique ou structurel du système d’information. Ce sont :

✓ Le diagramme de classe : Il illustre les classes avec les attributs, les méthodes et les relations
entre les classes.
✓ Le diagramme d’objets : Il permet de vérifier la validité du diagramme de classe.

✓ Le diagramme de déploiement : Il illustre la disposition physique du matériel et la répartition


des composants sur ce matériel.

✓ Le diagramme de structure composite : Il décrit les relations entre les composants d’une
classe ;

✓ Le diagramme de composants : Il illustre les éléments logiciels (exécutable, librairie,) et leurs


dépendances.

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

✓ Le diagramme de paquetages : Il schématise les dépendances entre les paquetages (ensemble


d’éléments de modélisation).

✓ Les modèles fonctionnels ou comportementaux : Ils modélisent les aspects dynamiques du


système, c'est-à-dire les différents éléments qui sont susceptibles de subir des modifications.
Parmi eux, on distingue les modèles di dessous.

✓ Le diagramme de cas d’utilisation : Il montre comment chaque acteur exploite le système ;

✓ Le diagramme d'états-transitions : Il montre les différents états que peut prendre un objet
instance de la classe lors de son cycle de vie ;

✓ Le diagramme d'activités : Il décrit le comportement du système sous forme de flux ou


d’enchainement d’activités.

✓ Les modèles d’interactions ou dynamiques : Ils représentent les interactions entre le système
lui-même et les différents acteurs du système, mais aussi la façon dont les différents objets
contenus dans le système communiquent entre eux. Ce sont les diagrammes suivants :

✓ Le diagramme de séquence : Il représente de façon séquentielle la manière dont se font les


traitements et indiquent les interactions entre les éléments du système.
✓ Le diagramme de communication (collaboration) : Il représente à l’image du diagramme de
séquence les échanges de messages entre les différents objets.

✓ Le diagramme global d’interaction : Il modélise la façon dont les groupes d’objets


collaborent pour réaliser un comportement donné.

✓ Le diagramme de temps : Il décrit les interactions entre les comportements de différents


objets en indiquant la chronologie d’exécution des opérations sur ces objets.

UML n’impose pas un ordre d’utilisation des diagrammes, ces derniers sont utilisés en
fonction de la méthode d’analyse

OUATTARA MOROU YOUSSEF 1


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

IV. JUSTIFICATION DU CHOIX D’UML

Les avantages présentés par UML, nous permettent de faciliter la modélisation des différents
aspects de notre projet. En effet UML présente l’avantage d’être le standard de la modélisation
objet universellement reconnu. Il est un langage visuel. Sa notation graphique permet
d’exprimer visuellement des solutions objets facilitant ainsi la comparaison et l’évaluation de
celles-ci. C’est un langage formel et normalisé doté d’un gain de précision et d’un gage de
stabilité. Il est aussi un support de communication performant car il cadre l’analyse tout en
facilitant la compréhension des représentations abstraites complexes. En outre, UML sert à
formaliser tous les documents techniques d’un projet et permet d’affiner les détails de l’analyse
au fur et à mesure de l’avancée du projet. Il est possible d’utiliser le même atelier de génie
logiciel depuis l’expression des besoins jusqu’à la génération de tout ou d’une partie du code.
Enfin, il est indépendant des langages de programmation et des processus de développement.
Les diagrammes que nous avons utilisés dans notre analyse sont :

✓ Le diagramme de classes : qui représente les classes intervenant dans le système.

✓ Le diagramme de cas d'utilisation : qui identifie toutes les fonctionnalités que le système doit
offrir.

✓ Le diagramme d'activités : qui décrit sous forme de flux ou d'enchaînements d'activités le


comportement du système.
✓ Le diagramme de séquence : qui représente de façon séquentielle la manière dont se font les
transitions et indique les interactions entre les éléments du système

CHAPITRE II : ETUDE FONCTIONNELLE

I. SPÉCIFICATION DES BESOINS


1. Spécification des besoins fonctionnels

1.1. Étude fonctionnelle du module : Gestion des élèves et étudiants

La solution ciblée envisagée doit assurer toutes les opérations de gestion en


vigueur sur une entité élève/étudiant, notamment :

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

• La création d’un nouvel étudiant (première inscription) ;

• La réinscription d’un étudiant,

• La gestion des absences et d’assiduité,

• La gestion des différents cycles et niveaux scolaires, ainsi que la


gestion des classes,

• Le transfert d’inscription d’un établissement à un autre.

L’application doit aussi permettre de garder toutes les informations pertinentes qui contiennent
les données personnelles des étudiants (date et lieu de naissance, adresse, numéro de téléphone,
nom et prénom de l’étudiant et de ses parents ou tuteur…), aussi les données particulières à
l’école (identifiant, niveau, classe), les informations complémentaires (parcours scolaire,
situation sanitaire…).

1.2. Étude fonctionnelle du module : Gestion des établissements

La gestion des établissements de l’enseignement traditionnel doit permettre d’assurer toutes


les opérations en vigueur sur une entité établissement, notamment :

• La création d’un nouvel établissement,

• Fermeture d’un établissement,

• Les différents cycles scolaires autorisés, possibilité de


changement de cycle.

L’application cible doit aussi être en mesure de détenir et sauvegarder des informations
concernant l’établissement (nom, adresse, localisation, milieu (urbain ou rural), statut (public
ou privé), description des locaux (salles de classes, salle de bureaux, internats, réfectoire,
cuisines, bibliothèque, transport)).

Elle doit aussi permettre la définition des postes des cadres administratifs, des enseignants et
des agents, ainsi que leurs fonctions et occupations, elle doit aussi permettre de générer et
d’imprimer des rapports, générer des attestations de formation, autorisations et des statistiques.

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Elle doit aussi permettre d’envoyé automatiquement des notifications aux parents,
enseignants en cas d’absences ou retards de l’élève et de notes, composition. Précisément la
solution sera constituée d’une application web et d’une application mobile iOS et
ANDROID.

II. ANALYSE DU CONTEXTE

L’analyse du contexte a pour objectif l’identification des différents acteurs qui interagiront avec
le système. Ces acteurs seront regroupés par la suite sous forme de rôles dont chacun englobe
un ensemble d’entités. Le regroupement sera effectué en se basant sur les interactions

FIGURE II-1 : LES ACTEURS DU SYSTEMES

1. Les rôles

Un rôle réfère à une mission et à des responsabilités assumées par les acteurs du système
étudié. Un acteur (utilisateur, dispositif matériel ou autre système) interagit directement avec le
système

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

et peut consulter et/ou modifier directement l’état du système, par émission et/ou réception de
messages éventuellement porteurs de données.

L’étude de la typologie des rôles a conduit à la classification suivante :

✓ La Direction de l’Enseignement : Gestionnaires

✓ Les Établissements de l’Enseignements : Gestionnaires,


Enseignants, Étudiants.

Les acteurs que nous avons identifiés à partir de la description des fonctionnalités ci-dessus
sont les suivants :

Gestionnaires :

✓ Gestionnaire DE : les différentes opérations de gestion sur les établissements au niveau


nationale (création, modification, fermeture)

✓ Gestionnaires CPDE : gestions des enseignants, gestion des transferts d’enseignants et


étudiants, gestion des conseils et gestion des examens, gestion des attestations et certificat et
gestion vie scolaire.

✓ Gestionnaire DFE : gestion des inscriptions des élèves, gestion de la finance.

✓ Gestionnaire CPE : gestion parent, gestion étudiant, gestion de pénalité.

Utilisateurs externes :

✓ Enseignant : Consultation des listes des étudiants, éditions des notes, remplissage de cahier de
texte, génération de rapport d’absences…

✓ Étudiant : Consultation de notes, des informations personnelles, retrais de bulletin…

✓ Parents : Consultation des notes de l’étudiant, les absences et retards…

Administrateurs :

✓ Administration du système et gestion des rôles et des utilisateurs.

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Utilisateurs simples (internaute) : ils ont seulement le droit de consulter les données du système
et d’effectuer des recherches suivant des critères précis.

2. Diagramme de contexte

Le diagramme de contexte a pour but de représenter les flux d’informations entre le système et
les acteurs externes. Il permet d’isoler le système en le délimitant et ainsi définir les éléments
externes avec lesquels il interagit. C’est ainsi que l’on modélise le contexte général du projet
par le diagramme de contexte ci-dessous (Figure II-2)

FIGURE I I-2 : Diagramme de contexte


3. Diagramme de cas d’utilisation

Les cas d'utilisation permettent de recueillir, d'analyser et d'organiser les besoins, et de recenser
les grandes fonctionnalités d'un système. Il s'agit donc de la première étape UML d'analyse d'un
système.

Dans cette section nous allons présenter les cas d’utilisation concernant les modules de:

✓ Gestion des étudiants

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

✓ Gestion des établissements

✓ Gestion des enseignants, du personnel de l’administration scolaire des établissements et des


cadres pédagogiques
Les acteurs principaux de notre système sont au nombre de quatre : Administrateur,
Gestionnaires, utilisateurs externes (enseignants, parents ou étudiants) et l’utilisateur simple
(internaute).
Le diagramme ci-dessous (Figure II-3) regroupe les différents cas d’utilisations et les acteurs
de notre système sous forme de packages :

Figure II-3 : Diagramme de package des uses cases

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

3.1. Gestion des élèves et étudiants

FIGURE II-4 Cas d’utilisation « inscription élève et

3.1.1. Description du cas d’utilisation « inscrire l’élève ou étudiant »

Cas d’utilisation Inscrire l’élève


Version Version 1.0 du 03/09 :2021
Acteur principal Étudiant
Objectif - Cas d’utilisation permettant d’inscrire
un élève ou un étudiant dans un
établissement d’enseignement
moderne ou traditionnel
Pré condition - S’authentifier
- Vérification préalable des conditions
(âge, compétence…)
Post condition - Un nouvel élève ou étudiant est inscrit,
le nombre d’élève / étudiant
s’incrémente

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Scénario nominal - L’étudiant lance l’adresse du site


d’inscription
- Il recherche sur le site la spécialité
voulue
- Il lit les modalités d’inscription de
la spécialité
- Il s’inscrit ou se déconnecte de la page

Scénario secondaire - L’étudiant choisie la spécialité voulue

- Il remplit le formulaire d’inscription

- Il envoi le formulaire saisi

- Il reçoit la confirmation de l’envoi

- Il reçoit un numéro et un mot de passe


concernant le dossier d’inscription
Exigence supplémentaire - L’inscription doit être la plus rapide
possible
- Le système doit permettre de
numériser photo élève/étudiant
- Le système doit permettre à
l’élève/étudiant de s’inscrire soi-
même.

TABLEAU II-1 : description textuelle cas d’utilisation « inscription


élève/étudiant »

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

3.2. Gestion des établissements

FIGURE II-5 : cas d’utilisation « gestion


3.2.1. Description textuelle du cas utilisation « gestion établissement

Cas d’utilisation Gestion d’établissement


Version Version 1.0 du 03/09 :2021
Acteur principal Gestionnaire DE
Objectif Ce cas permet de créer un nouvel établissement et de
l’ajouter à la base de données
Pré condition - L’établissement à été autorisé à s’enregistré sur
le site.
- S’authentifier
Post condition - Un nouvel établissement est créé et ajouter à la
base donnée.
Scénario nominal Saisir les données concernant l’établissement : Le
gestionnaire DE remplit le formulaire d’ajout
établissement et envoi la saisie.
Le système envoi au DE un numéro et un mot de passe
de connexion à son tableau de bord.
Scénario secondaire - Consulter la liste du personnel -
Organisé des séances de conseil.
- Modifié l’établissement s’il s’aperçoit qu’une
information est erroné.
- Le gestionnaire DE peut le modifier.
TABLEAU II -2 : description textuelle cas d’utilisation gestion d’établissement »

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

3.3. Gestion des enseignants

FIGURE II-3 : diagramme de cas d’utilisation « gestion enseignant »

3.3.1. Description textuelle du cas d’utilisation « gestion enseignant »

Cas d’utilisation Gestion d’établissement

OUATTARA MOROU YOUSSEF 2


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Version Version 1.0 du 03/09 :2021


Acteur principal Enseignant
Objectif Ce cas permet à l’enseignant de s’inscrire et
accéder à son espace de travail
Pré condition - Se connecté au site
Post condition - Marqué les absents et retard
Scénario nominal Saisir les informations du formulaire
d’inscription
- S’authentifier
- Connexion au Dashboard

Scénario secondaire - Consulter les emplois de temps des


classes
- Gérer les notes et moyennes
- Gérer le cahier de texte

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

3.4. Gestion des absences et retards

FIGURE II-7 Cas d’utilisation « Gestion absents et retard »

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

3.4.1. Description textuelle du cas d’utilisation « gestion absent et


retard»

Cas d’utilisation Gestion des absences et retards


Version Version 1.0 du 03/09 :2021
Acteur principal Enseignant
Objectif Ce cas permet de gérer les absences des élèves et étudiant.
Pré condition - S’authentifier
Scénario nominal - Gérer absents ; l’enseignant ajouter, modifier, supprimer une
absence ou retard
- L’enseignant envoi l’absence au système.
- L’étudiant ou le parent se connecte à son compte pour consulter
ces absences.
- L’étudiant envoie une requête de justification.
- La direction CPE vérifie et valide ou refuse la justification.
- Le parent consulte la justification
- L’enseignant génère une justification au CPE en cas de
modification

TABLEAU II-4 : description textuelle cas d’utilisation « gestion des absences et


retard »

I. Diagrammes d’activités

Les diagrammes d’activités permettent de mettre l’accent sur les traitements. Ils sont donc
particulièrement adaptés à la modélisation du cheminement de flots de contrôle et de flots de
données. Ils permettent ainsi de représenter graphiquement le comportement d’une méthode ou
le déroulement d’un cas d’utilisation.
Nous allons présenter dans cette section les diagrammes d’activités concernant le processus
d’inscription d’un étudiant, et celui de la gestion d’absence au sein d’un établissement
d’enseignement.

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

1. Diagramme d’activité d’inscriptions étudiantes.

En effet après le renseignement ou demande d’inscription le système vérifie si les conditions


sont respectées pour accéder à une formation quelconque. Si les données renseignées sont
correct le système l’enregistre dans la base de données.

Par défaut la possibilité est laissée au gestionnaire DFE de vérifier les données et d’enregistré
l’étudiant.

II.

FIGURE II-8 Diagramme d’activité « inscrire l’élève »

II. Diagramme de séquence

Les diagrammes de séquence sont des diagrammes d’interactions qui permettent de modéliser
les scénarios. Ils ont pour objectif de mieux représenter les interactions entre les objets de notre
projet selon un point de vue temporel. En effet, une fois les besoins du système formalisés à
travers les diagrammes de cas d’utilisation, il faut ensuite modéliser les interactions entre le
système et les différents acteurs à travers la succession séquentielle des actions. Dans cette
section nous allons présenter des exemples de diagrammes de séquences de notre système.

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

1. Diagramme de séquence gestion d’établissement

FIGURE II-9 Diagramme de séquence « gestion établissement »

❖ Le GESTIONNAIRE DE se connecte au système et demande à


s’inscrire

❖ Le système lui envoie le formulaire d’inscription

❖ Le DE renseigne le formulaire puis s’enregistre et le système


valide l’inscription

❖ Le DE s’authentifie, le système vérifie les informations si login et


mot de passe valide, le système affiche le menu Gestionnaire DE

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

❖ Le Gestionnaire DE demande à ajouter un établissement, le


système envoie le formulaire d’ajout

❖ Le Gestionnaire DE remplit le formulaire et envoie, le


système enregistre puis envoie un accusé de création de nouvel
établissement.

2. Diagramme de séquence d’authentification

❖ Les utilisateurs se connecte au système à travers l’authentification


;

❖ Le système envoie formulaire d’authentification ;

❖ Les utilisateurs remplissent et envoient les données

❖ Le système vérifie l’intégrité des données et envoie une requête de


vérification à la base de données. Si données saisies valide, la BD
envoi information sur les utilisateurs ;

❖ Le système vérifie les droits d’accès des utilisateurs et fournit


tableau de bord.

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

FIGURE II-8 Diagramme de séquence « authentification »

III. Conclusion partielle

Dans ce chapitre nous avons capturé les besoins fonctionnels de notre système et dans la phase
d’analyse nous avons décrit les règles métiers en se basant sur des diagrammes des cas
d’utilisations et de séquences.
Le chapitre suivant sera consacré à la conception de notre système en se basant sur les résultats
obtenus dans la partie traitant de l’analyse.

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

CHAPITRE III : CONCEPTION DU SYSTEME D’INFORMATON

I. DIAGRAMME DE CLASSE GLOBALE

Le diagramme de classes exprime la structure statique du système en termes de classes et de


relations entre ces classes. L’intérêt du diagramme de classe est de modéliser les entités du
système d’information.
Le diagramme de classe permet de représenter l’ensemble des informations finalisées qui sont
gérées par le domaine. Ces informations sont structurées, c’està-dire qu’elles ont regroupées
dans des classes. Le diagramme met en évidence d’éventuelles relations entre ces classes. Le
diagramme de classes comporte 6 concepts :

• Classe
• Attribut
• Identifiant
• Relation
• Opération
• Généralisation / spécialisation

Sur la figure ci-dessous présente notre diagramme de classe globale :

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

FIGURE III-1 Diagramme de classe globale du système SchoolManager »

II. DIAGRAMME D’INTERACTION GESTION D’ÉTABLISSEMENT

Comme son nom l'indique, un diagramme d'interaction UML est un type de diagramme UML
utilisé pour représenter le comportement interactif d'un système. Les diagrammes d'interaction
se concentrent sur la description du flux de messages au sein d'un système, en fournissant du
contexte pour une ou plusieurs lignes de vie. Ils peuvent également servir à illustrer des
séquences ordonnées et permettre de visualiser des données en temps réel dans vos
modélisations de systèmes UML.

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Les diagrammes d'interaction peuvent être appliqués dans plusieurs cas de figure pour fournir
un ensemble unique d'informations. Ils peuvent ainsi être utilisés pour :

• Modéliser un système sous forme d'une séquence chronologique d'événements ;


• Concevoir un système ou processus par ingénierie inverse ou directe ;
• Organiser la structure de différents événements interactifs ;
• Communiquer de manière simple le comportement des messages et des lignes de vie au
sein d'un système ;
• Identifier les liens éventuels entre différents éléments de la ligne de vie.

FIGURE III-2: Diagramme d’interaction « Gestion établissement »

OUATTARA MOROU YOUSSEF 3


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

III. DIAGRAMME DE CLASSE ÉLÈVE

Le diagramme de classe élève présente comment notre système informatique à modéliser et


représenter un étudiant quelconque vis-à-vis des aptitudes communes à tout élève au sein d’un
établissement d’enseignement.

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

CHAPITRE IV : CHOIX DES OUTILS DE REALISATION

Les nouvelles technologies de l’information et de la communication nous offrent une large


palette d’outils pour la réalisation des différentes solutions digitales. En effet dans la
conception d’une solution digitale après les phases d’analyse et de conception vient l’une des
phases indispensables qui est le choix des outils de réalisation. Durant cette phase le chef de
projet ainsi que l’ensemble de son équipe se font une réflexion profonde sur le choix des outils
matériels et logiciels qui permettront une implémentation flexible et sûre des différentes
fonctionnalités qui doivent être livrer. Ainsi nous vous feront comprendre toutes les raisons qui
ont motivés certains de nos choix.

La complexité de cette étape du projet réside principalement dans le choix d’outils répondant
aux normes technologiques d’actualités mais surtout ceux qui respectent les règles du CQFD
(Coût Qualité Fonctionnalités Délai). En effet le système qui est fabriqué doit répondre aux
besoins des utilisateurs (correction fonctionnelle), la qualité doit correspondre au contrat de
service initial, les coûts restent dans les limites prévues au départ, les délais restent dans les
limites prévues au départ. Les outils choisis devront permettre :

✓ La correction (validité) : aptitude à répondre aux besoins et à remplir les


fonctions définies dans le cahier des charges

✓ D’assurer la robustesse (fiabilité) : aptitude à fonctionner dans des conditions


non prévues au cahier des charges, éventuellement anormales

✓ L’extensibilité : facilité avec laquelle de nouvelles fonctionnalités peuvent être


ajoutées à un logiciel

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

✓ La compatibilité : facilité avec laquelle un logiciel peut être combiné avec


d’autres

✓ L’efficacité : utilisation optimale des ressources matérielles (processeur,


mémoires, réseau, …)

✓ La convivialité : facilité d ’apprentissage et d ’utilisation, facilité de préparation


des données, facilité de correction des erreurs d ’utilisation, facilité d ’interprétation des
résultats

✓ L’intégrité (sécurité) : aptitude d ’un logiciel à protéger son code contre des
accès non autorisés. 8 Qualités du logiciel : facteurs internes

✓ La réutilisabilité : aptitude d ’un logiciel à être réutilisé, en tout ou en partie,


pour d
’autres applications

✓ La vérifiabilité : aptitude d ’un logiciel à être testé (optimisation de la


préparation et de la vérification des jeux d ’essai)

✓ La portabilité : aptitude d ’un logiciel à être transféré dans des environnements


logiciels et matériels différents

✓ La Lisibilité et la modularité.

En générale une équipe de développement informatique est divisée en deux parties qui
sont :

❖ L’équipe Back-End : Placée sous l’égide d’un directeur technique, elle intègre
les besoins de tous ses interlocuteurs, techniques et commerciaux. Ainsi, les développeurs

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Back-End travaillent collégialement avec une équipe dont chaque acteur a une vision précise du
produit : administrateur système, product manager, développeur Frontend, responsable
marketing et communication. Elle est le socle technique sur lequel repose le projet digital et
choisit les outils et les méthodes de travail les plus adaptés au développement.

❖ L’équipe Frontend : Une équipe Front-End est de développeurs spécialisés


dans le front-office, dont le nombre varie selon la taille de l'entreprise. Ce sont à eux de créer
un design novateur et adapté aux besoins du client, tout en proposant une expérience utilisateur
satisfaisante.

C’est compte tenu de toutes ces exigences de projet que nous avons fait les
choix de nos outils que nous avons regroupé en deux catégories : matériel et
logiciel

I. MATÉRIELS

Dans cette partie nous listerons tout le matériel qui rentrera dans le cadre de la réalisation de
notre solution.

1. Le réseau
En effet toute solution digitale surtout relevant du milieu du logiciel et des applications
demande un déploiement, c’est-à-dire rendre l’application accessible aux clients. Cette phase se
fait généralement dans le réseautage et pour se faire il faut définir une architecture de
déploiement, ici nous avons optés pour le modèle le plus utilisé et le plus facile à mettre en
place à savoir le modèle client/serveur avec sa variante 3-tiers. Dans cette approche
l’architecture logique du système est divisée en trois niveaux ou couches : couche de
présentation ; couche de traitement ; couche d'accès aux données.
Pour la mettre en œuvre nous avons utilisé les outils suivants :

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

 Un serveur de base de données : MySQL. MySQL signifie My Structured


Query Language. MySQL est un système de gestion de bases de données relationnelles
(SGBDR) open source. Ce SGBDR d’Oracle est basé sur le langage SQL (Structured Query
Language) et fonctionne sur pratiquement toutes les plates-forme, comme Linux, UNIX et
Windows. MySQL est basé sur un modèle client-serveur, où le serveur MySQL gère toutes les
instructions. Le but originel de ce système de gestion de base de données relationnelle est
d’administrer efficacement de grandes bases de données. De nombreux sites et applications
web connus utilisent MySQL, tel que Facebook, Twitter ou encore YouTube.

 Un serveur d’application : Apache

Apache est le serveur web le plus utilisé au monde. Son développement a commencé en 1995
alors qu’il s'agissait uniquement d'une collection de correctifs et d'additions au serveur NCSA
HTTPd 1.3. Il offre une grande souplesse de configuration et un grand nombre modules pour
une couverture fonctionnelle toujours inégalée. La version 2 a notamment apportée le support
de plusieurs plateformes (dont Windows), une nouvelle API et le support d’IPv6. En plus de
son périmètre initial, Apache est conçu pour être modulaire et permettre l’accueil de
fonctionnalités additionnelles comme l’interprétation du langage PERL, PHP, Python et Ruby,
le support des tags SSI et des CGI, etc. Il est distribué sous licence Apache.

2. Les terminaux
Les terminaux représentent l’ensemble de tous les appareils tels que ordinateurs, smartphone,
router et tous las appareils qui ont servis dans la réalisation de l’architecture matériel. Dans ce
projet nous avons utilisés :

 Ordinateur : un ordinateur HP, Processeur intel Core i7 de 8e génération avec


16Go de RAM et 1 Tera de HDD ; un ordinateur HP, Processeur Intel dual core inside avec
4Go de RAM et 500 Go de HDD ; un ordinateur HP, processeur Intel core i5 de 5e génération
Vpro , ont servi d’outils de codage et de test au cours du projet.
 Smartphones : un iphone 12 pro Max, un smasung Galaxy s20, un Huawei P40
pro et un Redmi Note 9 ont servis de terminaux de développement et de teste de la version
mobile de notre solution.

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

II. LOGICIELS

Les outils logiciels représentent l’ensemble de toute les autres solutions informatiques
existantes déjà qui nous permis de réaliser certaines étapes de notre projet tout en entier. En
effet en partant de la phase d’analyse et de conception jusqu’à la phase d’implémentation, nos
deux équipes Back-End et Front-End ont faits usage de plusieurs outils logiciels. Mais il serait
important pour notre part de revenir sur l’architecture logicielle de notre solution pour mieux
comprendre les choix de certains de nos outils. Mais qu’est-ce qu’une architecture logicielle ?
L’architecture d’un logiciel décrit la manière dont seront agencés les différents éléments
d’une application et comment ils interagissent entre eux. Il existe aujourd’hui une multitude
d’architectures logicielle mais celles qui sont en vogue en ce moment sont les architectures en
micro-services. Et c’est pour cette architecture que l’on a opté. L’avantage d’une telle
architecture impose naturellement l’utilisation de certains outils et certaines règles dans le
développement. Mais de quoi est ce qu’il s’agit quand on parle de micro-services ? et quelles
sont les avantages d’une telle approche ?

Le micro-service est une approche permettant de développer une application unique sous
la forme d'une suite logicielle intégrant plusieurs services. Ces services sont construits autour
des capacités de l'entreprise et peuvent être déployés de façon indépendante. Les micro-services
stimulent les équipes de développement et les routines grâce à un développement distribué. On
peut aussi développer plusieurs micro-services simultanément. Ainsi, davantage de
développeurs peuvent travailler en même temps, sur la même application, ce qui réduit la durée
du développement.
La mise en place d’une telle approche a nécessité entre autres les outils suivants : les
Framework, les langages de programmation, les systèmes d’exploitation, les éditeurs de textes,
les éditeurs de code, les éditeurs de créations graphiques, les API manager, les plateformes de
collaboration et de gestion de version, les logiciels de conception de Système d’Information, les
gestionnaires de dépendances et les logiciels de teste API.

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

1. Les Framework
En programmation informatique, un Framework (appelé aussi infrastructure logicielle,
infrastructure de développement, environnement de développement, socle d'applications, cadre
d'applications ou cadriciel) désigne un ensemble cohérent de composants logiciels structurels,
qui sert à créer les fondations ainsi que les grandes lignes de tout ou partie d'un logiciel
(architecture). Un Framework se distingue d'une simple bibliothèque logicielle principalement
par :

 Son caractère générique, faiblement spécialisé, contrairement à certaines


bibliothèques ; un Framework peut à ce titre être constitué de plusieurs bibliothèques, chacune
spécialisée dans un domaine. Un Framework peut néanmoins être spécialisé sur un langage
particulier, une plateforme spécifique, un domaine particulier : communication de données,
data mapping.

 le cadre de travail qu'il impose dû à sa construction même, guidant l'architecture


logicielle voire conduisant le développeur à respecter certains patrons de conception ; les
bibliothèques le constituant sont alors organisées selon le même paradigme.

Les Framework sont donc conçus et utilisés pour modeler l'architecture des logiciels
applicatifs, des applications web, des middlewares et des composants logiciels. Les Framework
sont acquis par les informaticiens, puis incorporés dans des logiciels applicatifs mis sur le
marché, ils sont par conséquent rarement achetés et installés séparément par un utilisateur final.

Pour notre solution nous avons utilisé les Framework suivant :

 Laravel qui est un Framework web open-source écrit en PHP respectant le


principe modèle-vue-contrôleur et entièrement développé en programmation orientée objet. Ce
puissant Framework nous a permis de concevoir une grande partie des micro-service et
fonctionnalités Back-End nécessaire dans le projet.

 Django rest_framework : Django REST Framework est une boite à outils


puissante et flexible qui vous facilite la création d'application web API. Il est essentiellement
développé en Python et offre une large palette de fonctionnalités.

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

 Flutter : Qui est un Framework développé par Google, le plus récent de tous. De
ce fait, les ingénieurs ont pu observer les points forts et les faiblesses de chaque outil existant
pour n’en extraire que la quintessence. En effet ce Framework est utilisé pour tout ce qui est
interface utilisateur. Mais aujourd’hui Flutter se fait surtout connaître pour sa capacité à
concevoir des applications natives multiplateforme pour Android et iOS (Windows/Mac/Linux
sont également supportés). L’équipe de Flutter provient essentiellement du Web (plus
particulièrement de Chrome) et a essayé d’adapter sa philosophie au monde du mobile. Ils se
sont appuyés pour cela sur Skia, le moteur qui fait partie intégrante de Chrome ou encore de
toute la gestion du texte d’Android.

 Vue Js : Vue.js, est un Framework JavaScript open-source utilisé pour


construire des interfaces utilisateur et des applications web monopages. C’est grâce à ce
Framework que nous avons pu concevoir nos différents Dashboard web d’administration de
notre système.

2. Les langages de programmation

Un langage de programmation est une notation conventionnelle destinée à formuler des


algorithmes et produire des programmes informatiques qui les appliquent. D'une manière
similaire à une langue naturelle, un langage de programmation est composé d'un alphabet,
d'un vocabulaire, de règles de grammaire, de significations, mais aussi d'un environnement de
traduction censé rendre sa syntaxe compréhensible par la machine. Les langages de
programmation permettent de décrire d'une part les structures des données qui seront
manipulées par l'appareil informatique, et d'autre part d'indiquer comment sont effectuées les
manipulations, selon quels algorithmes.

Ils servent de moyens de communication par lesquels le programmeur communique


avec l'ordinateur, mais aussi avec d'autres programmeurs ; les programmes étant d'ordinaire
écrits,

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

lus, compris et modifiés par une équipe de programmeurs. Les langages de programmation dont
nous nous sommes servis sont les suivants :
 PHP : HyperText Preprocessor, plus connu sous son sigle PHP, est un langage
de programmation libre, principalement utilisé pour produire des pages Web dynamiques via
un serveur HTTP, mais pouvant également fonctionner comme n'importe quel langage
interprété de façon locale. PHP est un langage impératif orienté objet. C’est grâce à lui qui nous
avons construit une très grande partie de notre Back-End.

 JavaScript : JavaScript est un langage de programmation de scripts


principalement employé dans les pages web interactives et à ce titre est une partie essentielle
des applications web. Avec les langages HTML et CSS.
JavaScript est au cœur des langages utilisés par les développeurs web. Son utilisation
c’est avéré fructueuse dans la réalisation des Dashboard d’administration avec son Framework
web VueJs.

 Python : Python est un langage de programmation interprété, multiparadigme et


multiplateformes. Il favorise la programmation impérative structurée, fonctionnelle et orientée
objet. Mais c’est surtout son Framework Django qui a été d’une très grande utilité dans le
développement de certains microservices

 Dart : Dart est un langage de programmation optimisé pour les applications sur
plusieurs plateformes. Il est développé par Google et est utilisé pour créer des applications
mobiles, de bureau, de serveur et web. Dart est un langage orienté objet à ramasse-miettes avec
une syntaxe de type C++. Il est très réputé pour sa complémentarité avec le Framework Flutter
évoqué plus dans la création d’application mobile native.

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

3. Les systèmes d’exploitation

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Un système d'exploitation, ou OS pour Operating System, définit un ensemble de


programmes chargé d'établir une relation entre les différentes ressources matérielles, les
applications et l'utilisateur.

Dans un ordinateur, le système d'exploitation a plusieurs missions. Il gère, entre autres,


le processeur et la mémoire vive, optimise l'exécution des applications en leur attribuant les
ressources nécessaires, fournit un certain nombre d'informations sur le bon fonctionnement de
l'ordinateur, etc. Il permet l'utilisation de périphériques dans les meilleures conditions et
protège l'accès aux ressources.
Un système d'exploitation se compose la plupart du temps d'un noyau (kernel en anglais), d'un
interpréteur de commande (shell en anglais) et d'un système de fichiers (file system en anglais).
Au début des années '80, Microsoft a introduit les fenêtres avec "Windows", qui veut justement
dire "fenêtres" en anglais. Parmi les systèmes d'exploitation les plus répandus aujourd'hui
dans le monde, on peut citer Mac OS d'Apple, Windows de Microsoft, ou encore Android pour
les téléphones mobiles et les smartphones. Dans notre solution nous avons travaillé
couramment avec les systèmes d’exploitation Linux et Windows.

4. Les éditeurs de textes

Un éditeur de texte est un logiciel destiné à la création et l'édition de fichiers textes.


Chaque système d'exploitation fournit un éditeur, tant son usage est courant, voire
incontournable pour certaines tâches informatiques de base comme l'administration de système
et le développement de logiciels.
Dans notre solution digitale nous avons utilisé pour nos éditions de fichiers la suite Office de
Microsoft et le célèbre Notepad++.

5. Les éditeurs de code

Un éditeur de code source est un programme d'édition de texte spécialement conçu pour
l'édition du code source d'un programme informatique. Il peut s'agir d'une application

OUATTARA MOROU YOUSSEF 4


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

autonome ou intégrée à un environnement de développement intégré ou à un navigateur Web.


Notre projet nous a fait interagir particulièrement avec Visual
Studio code, Sublime Texte, Bracket et Atom pour l’écriture de nos différents codes.

6. Les éditeurs de créations graphiques

Le design graphique, aussi appelé design de communication, désigne l’art de transmettre


des messages ou des expériences à travers un contenu visuel et textuel.
On parle dans certains cas de communication visuelle. Il s’agit d’une pratique que l’on retrouve
au quotidien, par exemple sur les panneaux publicitaires, les différentes affiches, mais aussi sur
Internet.
En infographie, un logiciel de design graphique s’appelle également logiciel de
graphisme ou logiciel de retouche d’image. Il s’agit d’un ensemble de programmes
informatiques destinés à traiter ou à développer des images. Le logiciel fonctionne
généralement sur un ordinateur ou un écran tactile. Nous avons entre autres :
 Adobe Photoshop : retouche des images des applications.
 Adobe Illustrator : retouche des images des applications.
 Figma et Adobe XD : pour la conception des maquettes des applications

7. Les API manager

Une API (Application Pogramming Interface ou « interface de programmation d'application »)


est une interface logicielle qui permet de « connecter » un logiciel ou un service à un autre
logiciel ou service afin d'échanger des données et des fonctionnalités. D’où le principe de
l’architecture en micro-service choisit par notre équipe. Ainsi une api manager quant à elle
viendra faciliter l’exploitation des API sans mettre en péril le système d'information et sans
affecter l’expérience utilisateur. WSO2 est celui que nous avons décidé d’adopter dans notre
architecture.

8. Les plateformes de collaboration et de gestion de version

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Un logiciel de gestion de versions est un logiciel qui permet de stocker un ensemble de


fichiers en conservant la chronologie de toutes les modifications qui ont été effectuées dessus.
Il permet notamment de retrouver les différentes versions d'un lot de fichiers connexes.
La plupart de ces logiciels sont intégrés à différentes plateformes offrant ces services dont
le plus célèbre Git et la plateforme GitHub, c’est avec cette dernière que nous avons collaboré
tout au long du projet pour le versionnage et la maintenance du code.

9. Les logiciels de conception de Système d’Information

Les logiciels de conception de système d’information sont des outils permettant la


modélisation et la description du fonctionnement de l’ensemble d’un système. En effet dans la
conception de toute application ou solution digital la matérialisation et la définition du
fonctionnement interne et externe du système permet de comprendre à toute personne comment
la solution se traduit depuis la couche de données jusqu’à la partie applicative. Pour notre
système de gestion d’établissement nous avons utilisé le standard le plus utilisé au monde à
savoir UML et sa variante UML2.
Grâce à UML nous avons pu, lors de la phase d’analyse concevoir notre système
d’information mais aussi de modéliser les différentes données et qui seront manipulées à l’aide
du diagramme de classe. Ensuite grâce au logiciel phpMyAdmin nous avons conçu notre base
donnée et produit un modèle conceptuel données (MCD).

10. Les logiciels de gestion de dépendances et les logiciels de teste d’API

Les logiciels de gestion de dépendances ;


Le gestionnaire de dépendances est un outil qui peut être utilisé pour gérer les
dépendances d'un projet. Le gestionnaire de dépendances est un excellent concept. C'est
principalement un outil pour installer, désinstaller et mettre à jour ces dépendances. En effet
dans la phase d’implémentation de fonctionnalités et de codage, vis-à-vis des Framework et des
langages de programmation utilisés, il s’avère nécessaire parfois d’ajouter des outils qui ne
seraient pas disponible dans initialement dans le projet et c’est en cela qu’interviennent les

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

gestionnaires de dépendances qui permettront d’installer certains composants essentiels au


projet. Comme gestionnaire de dépendances, nous avons utilisé Composer (langage PHP et
Framework Laravel), NPM.
(langage JavaScript et Framework VueJs) et PIP (langage Python et Framework
Django).

Les logiciels de teste d’API

L'efficacité de l'API peut faire ou défaire votre produit. L'API agit comme un pont entre
la base de données et l'interface utilisateur de votre application. Par conséquent, les tests API
dans le développement de produits ont à juste titre gagné en importance au cours des dernières
années.
Bien que les avantages des tests d'API soient nombreux, il est facile de se poser des
questions sur l'incorporation et la gestion des tests d'API dans le développement continu et les
environnements agiles.
Notre architecture étant du micro-service alors il nous était impératif dans notre phase
de test de recourir à de tels logiciels. Ainsi tout au long de cette phase nous avons interagit
avec le logiciel Postman. Ce logiciel permet de lancer une série de requêtes HTTP les unes
après les autres en les enregistrant dans une collection puis en exécutant cette collection.
Grâce à l'utilisations de variables, on peut créer une séquence de requête qui vont reprendre
les données des réponses pour les requêtes suivantes.

ARCHITECTURE MATERIEL ET

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

PARTIE III: REALISATION DE


L’APPLICATION

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Une application web ou mobile (aussi appelé site Internet ou page web) est un ensemble de
pages Web liées, structurées, cohérentes, sécurisées et facilement accessible, stocké sur un
ordinateur connecté en permanence à Internet et hébergeant les pages web (cet ordinateur
possède un logiciel permettant de servir les pages web, on parle évidemment d'un serveur
web). De même une application mobile présente un ensemble organisé et structuré d’écrans qui
se succèdent les uns à la suite des autres. Que ce soit dans le cas d’une application web ou
mobile dans cette partie nous présenterons points liés uniquement à l’application web car la
réalisation d’une application web et mobile ne présente pas des critères assez différents. Cette
conception se fait en deux étapes qui sont :

- La lisibilité
- La visibilité

CHAPITRE I : LA LISIBILITE DE L’APPLICATION

La lisibilité du site Web est la capacité à rendre facile la lecture du site, en structurant les textes
et en organisant de façon hiérarchique les informations.
Pour se faire, elle possède deux caractéristiques qui sont l’ergonomie et la navigation.

1. Ergonomie

L'ergonomie d'un site Internet est sa capacité à rendre facile la recherche et l'accès à
l'information, à transmettre un message, à remplir ses objectifs, à répondre aux attentes et
besoins des internautes.
Cela doit se faire de manière pratique et agréable. L'ergonomie se caractérise par :
 La sobriété ;
 La lisibilité ;
 L’utilisabilité ;
 La rapidité ;
 L’interactivité ;
 L’accessibilité.

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

1.1. La sobriété

Les caractéristiques de la sobriété sont :


 La simplicité : les informations superflues seront supprimées afin de renforcer la
crédibilité et la bonne image de la structure.
 La lourdeur : les animations seront spécialement utilisées pour afficher les messages
importants car elles attirent le regard des visiteurs.

1.2. La lisibilité

Les caractéristiques de la lisibilité sont :


 La clarté : les textes seront suffisamment aérés étant donné la difficulté de lecture sur
un écran.
 La structuration : les textes seront structurés à l'aide de paragraphes et de titres de
différents niveaux, afin d'en faciliter la lecture.
 L’organisation : Les éléments d'informations seront hiérarchisés par niveau
d'importance. Ainsi, les éléments les plus importants figureront en haut de page.

1.3. L’utilisabilité

Les caractéristiques de l’utilisabilité sont :


 Le repérage : les pages seront bâties sur le même modèle pour permettre aux utilisateurs
de savoir qu’ils sont toujours sur la même application et aussi ils mettront en exergue les titres
de leur contenu.
 La liberté de navigation : les pages interstitielles seront évitées pour utiliser les
carrousels Bootstrap et une barre de navigation sera affichée sur toutes les pages pour permettre
à l’utilisateur de se déplacer dans le contenu du site aisément.
 L’homogénéité de la structure : les éléments de navigation seront situés au
même endroit sur toutes les pages avec une présentation uniforme d'une page à une autre.

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

1.4. La rapidité

Elle est caractérisée par l’optimisation des images. Étant le principal facteur des lenteurs des
chargements des pages, les images auront leurs formats choisis selon leurs types et leur nombre
de couleurs sera le plus petit possible.

1.5. L’interactivité

Elle est caractérisée par le découpage de l’information afin de permettre à l’utilisateur de


mieux assimiler l'information et de susciter sa curiosité. Ce découpage se traduira par un texte
d’approche et un lien hypertexte conduisant à la suite de l'information.

1.6. L’accessibilité

Les caractéristiques de l’accessibilité sont :


 Le choix des couleurs : les couleurs de l’application seront choisies soigneusement afin
de laisser l’information lisible.
 La taille des polices : les tailles des polices seront fixées afin que le contenu soit
toujours lisible lorsque l’utilisateur grossira les textes.

2. Utilisation de l’application

La navigation est la manière de rendre facile les déplacements des visiteurs en utilisant
l’environnement hypertexte qui est un système dans lequel les objets (textes, images, musiques,
programmes, etc.) sont associés de manière créative. L’environnement hypertexte offre
d’énormes possibilités pour la rédaction et la structure désinformations. Dans un tel document,
on accède instantanément à des informations connexes grâce à des signaux de navigation, tels
que tables de matières, références croisées, des graphismes attrayants et aussi un jeu de liens
textuels. La navigation doit être exploitable et structurée.

2.1. Utilisation efficace

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Une utilisation efficace comprend non seulement des liens vers d’autres pages de
l’application mais aussi des éléments permettant au visiteur de se situer. Il doit pouvoir
répondre aux questions suivantes :

 Où suis-je ?
 Où puis-je aller ?
 Comment puis-je y aller ?
 Comment puis-je revenir à mon point de départ ?

Pour ce faire, le site mettra à la disposition de l’utilisateur, les actions suivantes :

 Savoir quelle est la page courante ainsi que le type de contenu qui est consulté;
 Savoir se situer par rapport au reste de l’application ;
 Disposer de liens faciles à comprendre et cohérents ;

2.2. Structuration de l’application

La chose la plus importante à considérer lorsqu'on prépare le design d'une application, c'est la
satisfaction des utilisateurs. La facilité avec laquelle ils trouveront ce qu’ils recherchent
déterminera la fréquence avec laquelle ils reviendront sur celle-ci. La structuration de
l’application consiste à bâtir l'architecture globale de celle-ci en organisant les différentes
informations. Plusieurs structures informationnelles de base (hiérarchiques, Web…) existent et
doivent être utilisées et adaptées selon le contenu de l’application. La structure Web propose
des liens entre toutes les pages de l’application. Cela permet ainsi à l’utilisateur de passer
librement d’une page à l’autre d’où l’utilité d’une barre de navigation standardisée.
Elle va servir à informer l’utilisateur sur sa position courante et sur ses possibilités de
déplacement.

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

CHAPITRE II : VISIBILITE DE L’APPLICATION

La visibilité de l’application orientée Web ou mobile fait référence au UIX design qui est
la discipline consistant à structurer les éléments graphiques d'un site Web ou d’une application
mobile afin de traduire, à travers une dimension esthétique, l'identité visuelle de la société ou
de l'organisation. Il s'agit ainsi d'une étape de conception visuelle, par opposition à la
conception fonctionnelle (ergonomie, navigation) et aux éléments contenus dans le site. Dans
cette partie nous présenteront la conception du site web.

1. Web design et User Interface (UI/UX)

En français comme en anglais, design signifie « conception ». L’objet du Web design est
de valoriser l'image de l'entreprise ou de l'organisation par le biais d'éléments graphiques afin
de renforcer son identité visuelle et de procurer un sentiment de confiance à l'utilisateur.
Néanmoins, en vertu des critères d'ergonomie, une application orientée Web doit avant tout
répondre aux attentes des utilisateurs et leur permettre de trouver facilement l'information qu'il
cherche. Pour se faire, le Web design met l’accent sur :

 L’agencement des pages


 La dimension des pages
 La position des informations
 Les graphismes et les couleurs

OUATTARA MOROU YOUSSEF 5


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

1.1. L’agencement des pages

Afin de respecter les critères d’ergonomie, les pages d’une application orientée Web se
baseront sur la structure traditionnelle d'une page Web dont les spécifications sont les suivantes
:

 Un logo situé en haut à gauche. La plupart du temps le logo est cliquable et


mène à la page d'accueil
 Une zone de navigation (menu), située en haut
 Un en-tête contenant le nom du site, un bandeau de navigation
 Un corps de page, contenant l'essentiel de l'information
 Une zone de recherche vers le bas à gauche

Un pied de page regroupant des informations utiles telles que la date de mise à jour, un lien
vers un formulaire de contact, un plan d'accès, etc.

1.2. La dimension des pages

La taille de la page Web dépend essentiellement de la définition d'affichage des postes des
visiteurs. Ainsi, afin de permettre aux visiteurs de survoler facilement l'information pour
repérer les éléments qui l’intéresse, plusieurs stratégies peuvent être mise en œuvre pour
garantir un affichage optimal :

 Choisir la plus petite largeur supportée par le plus grand nombre (entre 600 et
1000 pixels de largeur par exemple)
 Choisir une page comportant des tableaux invisibles de largeurs variables
(définies en pourcentage)

1.3. La position des informations

Des études sur le comportement humain ont montré que l'œil de l'internaute moyen
parcourt généralement la page web selon un cheminement global en « zigzag » commençant à
l'angle supérieur gauche, jusqu'à l'angle inférieur droit. Ainsi le positionnement des
informations sur la page se fera selon leur importance. Le menu s’affichera en haut, les trois
plus récents articles se présenteront au milieu de la page suivie de trois autres à droit, et les
trois derniers s’afficheront au bas du site.

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

1.4. Les graphismes et couleurs

 Le choix du format des images

Actuellement, les trois formats de fichiers d’image le Web exploite sont : GIF, JPG et
PNG utilisant toute une technique de réduction de volume par compression. Ainsi pour que
celle-ci fonctionne, et pour que les images s’affichent conformément aux attentes des
utilisateurs, les pages de l’application comporteront des images dont le format sera fonction de
leurs types : Le format GIF (Graphics Inter change Format) sera associé à tous les graphiques
colorés et tracés simple. Le format JPEG (Joint Photographic Experts Group) : sera associé aux
photographies polychromes 24 bits et aux graphismes complexes contenant des dégradés, des
ombrés et des flous
Aucune image n’aura le format PNG car il n’est pas pris en charge par certains navigateurs.

 Le choix des couleurs

Afin de respecter le critère de sobriété, la couleur principale le blanc est plus utilise car
elle symbolise la paix et le bleu comme couleur associé de notre application tout ce mélange a
donné une belle vue à notre site. En considérant l’harmonie des couleurs, le rouge servira à

mettre les informations importantes en évidence.

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

CHAPITRE III : CAPTURES D’ECRAN ET CODES

1. Écrans

Écran 1 : Tableau de bord des Enseignants de l'établissement

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Écran 2 : Tableau de bord administrateur du système SchoolManager

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Écran 3 : Tableau de bord de l'étudiant

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

CONSLUSION

Durant ce stage effectué à A-bouake.net, il nous a été́ demandé de mettre en place une
plateforme (mobile & web) de gestion d’établissement scolaire.

Quant à la réalisation de notre système << SchoolManager >>, nous espérons qu’il pourra aider
l’ensemble des établissements scolaires privé et public, le ministère de l’éducation national.

En outre, nous sortons beaucoup enrichi de ce stage. En effet, il nous a permis de mettre en
pratique les nombreuses connaissances théoriques acquises au cours de notre formation, de
nous imprégner des réalités de l’entreprise notamment les relations humaines, la prise de
décision et d’améliorer nos connaissances et méthodes de travail. Ce stage nous a enfin permis
de comprendre certains détails de la conception et de la programmation d’une API et de nous
adapter aux exigences du monde professionnel ainsi que le travail en équipe.

Le développement d’Api devient de plus en plus vulgarisé. Il serait donc bénéfique pour tout
étudiant, professeur et même professionnel de s’y intéresser pour ne pas être mis à l’écart par
l’avancée de la technologie.

Un penseur français du nom d’Antoine de Saint-Exupéry disait : << La perfection est


atteinte non pas lorsqu’il n’y a rien à ajouter, mais lorsqu’il n’y a plus rien à retirer.>> ;
afin de stipuler que nous encourageons tout apport correctif ou suggestif, en vue de fignoler
notre ouvrage.

Bibliographies
1) J.Aldrich, C.Chambers, and D.Notkin (2002) « ArchJava : Connecting SoftwareArchitecture to
Implementation ». InProc. International Conference on SoftwareEngineering, pages 187–197.
ACM Press
2) Laurent Audibert, « Diagramme de séquence » [archive], sur developpez.com

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

3) Cian, Nouveautés UML 2.0 : Diagramme de séquence [archive], sur developpez.com

4) [Roques 06] Les cahiers du Programmeur UML 2 : modéliser une application web, P. Roques, 2006,
Eyrolles.

Webographies
1) Documentation sur l’utilisation des API REST sur Openclassroms. Reference
www.openclassroms.com
2) Utilisation de la documentation de Laravel, Référence www.laravel.com
3) Moteur de recherche, Référence www.google.com
4) Installation et utilisation des packages du Framework Flutter, Référence www.flutter.dev

5) utilisation de la documentation du Framework Flutter , Référence www.docs.flutter.dev

6) Installation et utilisation de VueJs doc, Référence www.vuejs.org

7) Outils Wso2, Référence www.wso2.com

8) Design maquette figma, Référence www.figma.com

9) Prototypage application mobile figma Référence www.figma.com

10) Schématisation diagram AgroUml, Référence www.agroagrouml.tigris.org

11) Schématisation architecture logiciel Diagrams, Référence www.diagrams.net

Annexe

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

Table des matières

ABSTRACT................................................................................................................................................................3

LISTE DES TABLEAUX..........................................................................................................................................6

LISTE DES ÉCRANS................................................................................................................................................6

SOMMAIRE...............................................................................................................................................................7

INTRODUCTION GENERALE...............................................................................................................................8

OUATTARA MOROU YOUSSEF 6


MISE EN PLACE D’UN SYSTEME MULTI-PALTEFORME DE GESTION D’ETABLISSEMENT

PROBLEMATIQUE..................................................................................................................................................9

PARTIE I : CADRE D’ETUDE..............................................................................................................................10

I. PRESENTATION DE ABOUAKE.NET.....................................................................................................11
II. ORGANIGRAMME...................................................................................................................................12
CHAPITRE II : PRESENTATION DU PROJET..................................................................................................13
I. ONTEXTE...................................................................................................................................................13
CHAPITRE I : METHODE D’ANALYSE ET DE CONCEPTION.....................................................................16
I. NOTION DE MÉTHODE D’ANALYSE ET DE CONCEPTION..............................................................16
II. CHOIX DE LANGAGE DE MODÉLISATION.......................................................................................17
III. PRÉSENTATION D’UML..................................................................................................................17
CHAPITRE II : ETUDE FONCTIONNELLE.......................................................................................................20
1. Les rôles..................................................................................................................................................22
2. Diagramme de contexte...........................................................................................................................24
3. Diagramme de cas d’utilisation..............................................................................................................24
3.1. Gestion des élèves et étudiants...........................................................................................................26
I. Diagrammes d’activités...........................................................................................................................32
II........................................................................................................................................................................33
II. Diagramme de séquence.........................................................................................................................33
1. Diagramme de séquence gestion d’établissement...................................................................................34
2. Diagramme de séquence d’authentification............................................................................................35
III. CONCLUSION PARTIELLE..........................................................................................................................36

CHAPITRE III : CONCEPTION DU SYSTEME D’INFORMATON...............................................................37

III. DIAGRAMME DE CLASSE ÉLÈVE..................................................................................................40


CHAPITRE IV : CHOIX DES OUTILS DE REALISATION..............................................................................41
I. MATÉRIELS............................................................................................................................................43

PARTIE III: REALISATION DE L’APPLICATION..........................................................................................54

1. Web design et User Interface (UI/UX)....................................................................................................59


◻ Le choix du format des images................................................................................................................61
◻ Le choix des couleurs..............................................................................................................................61
CHAPITRE III : CAPTURES D’ECRAN ET CODES.........................................................................................62
1. Écrans....................................................................................................................................................62
CONSLUSION......................................................................................................................................................65
BIBLIOGRAPHIES.....................................................................................................................................................65
WEBOGRAPHIES......................................................................................................................................................66

OUATTARA MOROU YOUSSEF 6

You might also like