République Algérienne Démocratique et Populaire

Ministère de l'Enseignement Supérieur et de la Recherche Scientifique

Université M'Hamed BOUGARA - Boumerdès

Faculté des Sciences

Département d’Informatique

Domaine : Mathématiques Informatique.

Filière : Informatique.
Spécialité : Ingénierie des systèmes d’information et du logiciel.

Mémoire de fin d’études en vue de l’obtention du

Diplôme de Licence Académique

Thème
DEVELLOPEMNT D’UNE APPLICATION WEB
POUR SUIVRE L’ASSIDUITE ET LA
PARTICIPATION DES ETUDIANT

PRESENTER PAR :

SEGHIER Amine
KAHLANE Abdeldjalil

Soutenue le 00/00/2024 Devant le jury compose

Mr. Ali BELGACEM : Encadreur
Mr. Ali BERRICHI : Examinateur

1
 REMERCIEMENT

Nous tenons à exprimer notre profonde gratitude envers

Dieu, source de toute sagesse et de toute inspiration,
pour nous avoir guidés et soutenus tout au long de ce
parcours académique. Sa lumière nous a éclairés dans les
moments de doute et de difficulté, et Sa grâce nous a
permis de persévérer jusqu'à l'accomplissement de ce
travail.

Nous tenons aussi à exprimer notre profonde gratitude

envers le professeur Ali BELGACEM, pour son soutien
indéfectible, ses conseils avisés et son accompagnement
tout au long de ce travail. Sa patience, son expertise et
sa disponibilité ont été d'une aide précieuse dans la
réalisation de ce projet.

Enfin, nous tenons à exprimer notre gratitude envers tous

ceux qui, de près ou de loin, ont contribué à la réalisation
de ce mémoire. Leur contribution a été un élément
déterminant dans l'aboutissement de ce travail.

KAHLANE Abdeldjalil

SEGHIER Amine

2
Table Des
Matières………………………………………………………………
INTRODUCTION GENERALE ……………………………………………………………………………8
1. Chapitre 01 : Présentation de l’organisme d’accueil ………………………………………… 10

1.1 Introduction.......................................................................................................................11

1.2 Exposition de l’organisme d’accueil.............................................................................11

1.2.1 Présentation de l’Université M’Hamed BOUGARA de Boumerdès.....................11
1.2.2 Présentation de la Faculté des sciences (Campus sud-Boumerdes)..................13

1.3 Description des procédures de la gestion des informations des étudiants : cas
du département informatique....................................................................................................14

1.4 Comprendre le processus et les critères d'évaluation pour le contrôle continue

des étudiants...................................................................................................................................15

1.5 Importance de Surveiller l’Assiduité et la Participation..........................................16

1.6 Objectifs de Surveiller l’Assiduité et la Participation...............................................17

1.7 Conclusion..........................................................................................................................17

2. Chapitre 02 : Etude de l’existant et specification des besoins ……………………….18

2.1 Introduction.......................................................................................................................19

2.2 Etude de l’existant............................................................................................................19

2.2.1 Analyse du système actuel.........................................................................................19
2.2.2 Critique de l'Existant...................................................................................................21
2.2.3 Solution proposée........................................................................................................22

2.3 Spécification des besoins................................................................................................22

2.3.1 Besoins fonctionnels...................................................................................................22
2.3.2 Besoins non-fonctionnels...........................................................................................23

2.4 Identification des acteurs...............................................................................................23

2.5 Conclusion..........................................................................................................................24

3. Chapitre 03 : Conception.......................................................................................................... 25

3.1 Introduction.......................................................................................................................26

3.2 Définition d‘UML...............................................................................................................26

3.3 Diagrammes de cas d'utilisation...................................................................................26

3
 3.3.1 Notions et symboles du diagramme de cas d’utilisation......................................26
3.3.2 Diagramme de cas d’utilisation générale du système..........................................28
3.3.3 Diagramme de cas d’utilisation "Administrateur”................................................29
3.3.4 Diagrammes de cas d’utilisation ”Enseignant”......................................................31

3.4 Diagramme de séquence.................................................................................................32

3.4.1 Définition.......................................................................................................................32
3.4.2 Les concepts principaux d’un diagramme de séquence.......................................32
3.4.3 Diagramme de séquence d’authentification...........................................................33
3.4.4 Diagramme de séquence de chercher une donnée...............................................34
3.4.5 Diagramme de séquence de supprimer une donnée............................................35
3.4.6 Diagramme de séquence d'ajouter une donnée....................................................36
3.4.7 Diagramme de séquence de modifier une donnée................................................37
3.4.8 Diagramme de séquence de prendre des notes (participation et présence)...38

3.5 Les diagrammes de classes.............................................................................................39

3.5.1 Définition.......................................................................................................................39
3.5.2 Les concepts principaux d’un diagramme de classe.............................................39
3.5.3 Diagrammes de classe.................................................................................................41
3.5.4 Dictionnaire de donnes...............................................................................................43

3.6 Passage du Modèle Conceptuel au Modèle Relationnel............................................45

3.7 Le Modèle Relationnel.....................................................................................................45

3.8 Conclusion..........................................................................................................................46
4. Chapitre 4 : Realisation et implementation ....................................................................47

4.1 Introduction.......................................................................................................................48

4.2 Architecture du système.................................................................................................48

4.3 Environnement de développement..............................................................................49

4.3.1 Environnement matériel :..........................................................................................49
Langages de programmation :.................................................................................................49
4.3.2 Environnements logiciels :.........................................................................................50

4.4 Les interfaces de l’application.......................................................................................52

4.4.1 Interface de l’authentification :.................................................................................52
4.4.2 Espace de Admin..........................................................................................................52
4.4.3 Espace de l'enseignant................................................................................................60

4.5 Conclusion :........................................................................................................................65

4
CONCLUSION GENERALE ………………………………………………………………………………… 66

BIBLIOGRAPHIE ………………………………………………………………………………………..…….6

5
 LISTE DES FIGURES

Figure 1. 1 l’organigramme générale de l’université de Boumerdès.

Figure 1. 2 L’organigramme de département d’informatique.

Figure 3. 1 les Notions et symboles du diagramme de cas d’utilisation.

Figure 3. 2 Diagramme de cas d'utilisation globale.

Figure 3. 3 Diagramme de cas d'utilisation Administrateur.

Figure 3. 4 Diagramme de cas d'utilisation d’Enseignant.

Figure 3. 5 Diagramme de séquence d'authentification.

Figure 3. 6 Diagramme de séquence de chercher une donnée.

Figure 3. 7 Diagramme de séquence de supprimer une donnée.

Figure 3. 8 Diagramme de séquence d'ajouter une donnée.

Figure 3. 9 Diagramme de séquence de modifier une donnée .

Figure 3. 10 Diagramme de séquence de prendre des notes.

Figure 3. 11 Les concepts base d’un diagramme de classe.

Figure 3. 12 Diagramme de classe générale.

Figure 4. 1 Diagramme de déploiement.

Figure 4. 2 Interface de l’Authentification du système.

Figure 4. 3 Interface de La page d’accueil pour l’administrateur.

Figure 4. 4 Interface de La page de gestion de profil.

Figure 4. 5 Interface de La page de gestion des spécialités.

Figure 4. 6 Interface de La page de gestion des Modules.

Figure 4. 7 Interface de La page de Gérer Les Enseignants.

Figure 4. 8 Interface de La page de Gérer Les É tudiants.

6
Figure 4. 9 Interface de La page de Voir les Notes.

Figure 4. 10 Interface de La page de Voir les Statistiques.

Figure 4. 11 les graphes individuels du graphe père.

Figure 4. 12 Interface de La page d’accueil pour l'enseignant.

Figure 4. 13 Interface de La page de Gérer le profil.

Figure 4. 14 L’Interface de Voir la liste des étudiants.

Figure 4. 15 Interface de Prendre les présences.

Figure 4. 16 Interface qui affiche la participation, présence et le comportement des

étudiant.

Figure 4. 17 Interface de Voir les Notes.

Figure 4. 18 Représente les donnes télécharger en format EXCEL.

Figure 4. 19 représente le graphe principal des informations.

Figure 4. 20 les extensions du graphe.

7
 INTRODUCTION GENERALE

Dans un paysage éducatif en constante évolution, l'engagement des étudiants et la

qualité de leur participation sont devenus des aspects cruciaux de l'expérience
d'apprentissage. Les enseignants aspirent à créer des environnements où les étudiants sont
activement impliqués dans le processus d'acquisition de connaissances, où les interactions en
classe jouent un rôle central dans le développement des compétences et des aptitudes.
Cependant, évaluer de manière précise et régulière ces interactions et participations peut
représenter un défi de taille pour les enseignants. Les méthodes traditionnelles de suivi,
reposant souvent sur des feuilles de présence manuelles ou des systèmes peu efficaces,
peuvent être sujettes à des erreurs et ne permettent pas toujours une évaluation juste et
équilibrée.

Face à cette réalité, l'intégration de solutions technologiques apparaît comme une

réponse nécessaire pour moderniser et optimiser le processus d'évaluation continue en classe.
Notre projet s'inscrit ainsi dans cette dynamique de transformation numérique de
l'enseignement, en proposant le développement d'une application web dédiée à la gestion des
informations des étudiants. Cette application vise à offrir aux enseignants un outil efficace
pour suivre de près la participation et l'assiduité des étudiants ainsi que le comportement,
module par module, spécialité par spécialité, et ce, de manière transparente et accessible.

L'objectif principal de notre projet est de fournir aux enseignants un moyen pratique et
fiable de collecter, stocker et analyser les données relatives aux performances des étudiants
en classe. En centralisant toutes ces informations au sein d'une plateforme conviviale, notre
application permettra aux enseignants de générer des rapports détaillés sur les progrès de
chaque étudiant, tout en facilitant la communication et la collaboration entre les différents
acteurs de l'éducation. En outre, en proposant des fonctionnalités avancées telles que la
génération de statistiques et de graphiques personnalisés, notre application contribuera à une
évaluation plus approfondie et éclairée des performances des étudiants, favorisant ainsi une
approche pédagogique plus individualisée et adaptée à chaque apprenant.

Dans les chapitres suivants, nous explorerons en détail les étapes de la

réalisation de notre application web dédiée à la gestion des informations des étudiants.
Nous commencerons par une présentation approfondie de l'Université M'Hamed

8
Bougera de Boumerdès, incluant son fonctionnement interne. Ensuite, nous
procéderons à une analyse de l'existant et à la spécification des besoins. Après cela,
nous aborderons la phase de conception, détaillant les choix techniques et conceptuels à
travers les cas d'utilisation, les diagrammes de séquence et de classes, ainsi que la
transition vers un modèle relationnel adapté. Enfin, nous présenterons l'architecture du
système, l'environnement de développement utilisé, et les interfaces utilisateur conçues
pour répondre aux besoins des différents utilisateurs du système.

9
 Chapitre 01
Présentation d’organisme
d’accueil

10
1.1 Introduction

Dans ce chapitre, nous allons présenter l'historique de l'Université M'Hamed

BOUGARA et de ses facultés, en particulier la Faculté des sciences, en spécifiant le
département d'informatique comme cas d'étude. Nous détaillerons ensuite les
procédures de gestion des informations des étudiants, en soulignant leur importance
pour un suivi efficace, ainsi que les critères d'évaluation. Nous terminerons par les
objectifs de cette gestion.

1.2 Exposition de l’organisme d’accueil

1.2.1 Présentation de l’Université M’Hamed BOUGARA de Boumerdès

L’Université M'Hamed BOUGARA de Boumerdès a été créée en 1998 par le décret

exécutif n°98-189 du 02 juin 1998 sur la base du regroupement de six (6) Instituts
Nationaux dont la création remonte aux années 60-70 et 80 (Institut National des
Hydrocarbures (INH), Institut National de Génie Electrique et Electronique (INELEC),
Institut National de Génie Mécanique (INGM), Institut National des Matériaux de
Construction (INMC), Institut National des Industries Manufacturières (INIM) et Institut
National des Industries Alimentaires (INIA)). Parallèlement aux formations héritées de
ces anciens instituts nationaux, l’Université a ouvert, depuis sa création, d’autres filières
en Sciences et Technologies, Sciences de la Nature et de la Vie, Sciences Economiques et
de Gestion, Sciences Commerciales, Droit et Langue et Littératures Etrangères dans le
système classique.

Le système LMD, introduit depuis l’année universitaire 2004/2005 compte neuf

(9) domaines (ST, SM, Ml, SNV, LLE, SEGC‫ ؛‬LLA, DSP et STAPS). Chaque domaine
comprend au moins une filière. Ce système est en nette progression par rapport au
système classique. Des formations de masters et de doctorats de 3ème cycle dans le
prolongement des licences LMD ont été ouvertes. Le LMD signifie :

 Licence Bac+3 il faut réunir 180 crédits, contient 06semestre.

 Master Bac+5 il faut réunir 120 crédits, contient 04semestre.

11
 Un semestre comporte en général 04 catégories d’unités d’enseignements : Les
UE fondamentales (EUF), les UE méthodologique (UEM), les UE découverte (UED), les
UE transversales (UET).

L’université de Boumerdès donne une grande importance à la recherche

scientifique, elle regroupe une vingtaine de laboratoires de recherche agrée, 1 unité de
recherche portant sur plusieurs domaines, 605 chercheurs, 78 Projets de Recherche
Universitaires (PRU) et 33 Projets Nationaux de recherche.

L’UMBB coopère avec des établissements universitaires de plusieurs pays

comme (la France, Belgique, Italie, Canada), cette coopération par la signature de plus
de 98 conventions nationales et internationales. Ces accords ont été conçus pour
faciliter les échanges et les rechercher scientifique, ainsi l’amélioration des méthodes
pédagogique [1].

L’organigramme générale de l’université

Figure 1. 1 l’organigramme générale de l’université de Boumerdès.

12
 1.2.2 Présentation de la Faculté des sciences (Campus sud-

Boumerdes)

La Faculté de science a été créé le 02/12/1988 par le décret n° 98-395 au sein

l’université M’HAMED Bougera de Boumerdès, Elle est située dans les anciens locaux de
l’x institut INIM, elle dirigée par le doyen de la faculté des sciences.

Elle est composée des 05 départements :

 Département de chimie.
 Département de physique.
 Département des Mathématiques.
 Département d’informatique.
 Département de biologie.

Et Chaque département de L’UMBB est sous la responsabilité d’un chef de

département.

Les domaines d’études :

 Mathématique et informatique (MI).

 Sciences de la nature et de la vie (SNV).
 Sciences de la matière (SM).
 Science et technologies (ST). [2]

Le département d'informatique de cet Faculté offre des programmes académiques

diversifiés et axés sur les technologies de l'information et de la communication.

Ce département vise à fournir aux étudiants une formation complète dans le

domaine de l'informatique, couvrant à la fois les aspects théoriques et pratiques. Les
programmes d'études comprennent des cours sur les fondamentaux de l'informatique,
tels que les langages de programmation, les algorithmes, les structures de données, les
bases de données, les réseaux informatiques, la sécurité informatique, ainsi que des
sujets plus avancés comme l'intelligence artificielle [2].

13
L’organigramme de département d’informatique

Figure 1. 2 L’organigramme de département d’informatique.

1.3 Description des procédures de la gestion des

informations des étudiants : cas du département
informatique

Le projet vise à développer une application web pour suivre l’assiduité, la

participation et les performances des étudiants, générant des statistiques et des
graphiques pour une évaluation continue

Dans cette section, nous détaillons les procédures pour les enseignants et les
administrateurs, ainsi que les fonctionnalités communes.

14
  Les enseignants doivent se connecter à l'application avec leurs
identifiants pour garantir un accès sécurisé. Ils peuvent ensuite gérer les
cours,
Suivre l'assiduité et la participation des étudiants ainsi que le
comportement, et générer des rapports et des statistiques pour visualiser
les performances des étudiants.
 Les administrateurs, également soumis à un processus de connexion
sécurisé, gèrent les utilisateurs et les informations des étudiants, ainsi que
les cours et modules. Ils supervisent également les rapports globaux pour
avoir une vue d'ensemble de l'assiduité, participation et le comportement.
 Les deux types d'utilisateurs disposent d'un tableau de bord interactif
affichant notifications, rappels et résumés des activités récentes, ainsi que
d'une fonctionnalité d'historique et d'archivage pour consulter et analyser
les données passées.

L'application proposée offrira une solution complète pour la gestion des

informations étudiantes, avec des procédures claires pour les enseignants et les
administrateurs, garantissant une évaluation continue précise et une prise de décision
informée grâ ce à des rapports détaillés et des statistiques visuelles.

1.4 Comprendre le processus et les critères d'évaluation

pour le contrôle continue des étudiants.

Pour mettre en place un processus efficace et des critères d'évaluation pour le

contrô le continu des étudiants, il est crucial de définir des étapes claires et des critères
précis.

 Tout d'abord, Il s'agit de déterminer les compétences et connaissances

que les étudiants doivent maîtriser à la fin du semestre en fixant des
objectifs spécifiques pour chaque module et spécialité.
 Ensuite, Les critères d'évaluation incluent la participation en classe,
l'assiduité, la qualité des interventions, et l'implication dans les travaux

15
 pratiques. Un suivi individuel des étudiants est essentiel, avec des
réunions pour discuter des progrès et des points à améliorer.
 L'utilisation d'une application web permet d'enregistrer les notes et
d'analyser les données pour générer des statistiques et des rapports,
facilitant ainsi le suivi des performances.
 Enfin, des ajustements périodiques des critères d'évaluation et des
méthodes d'enseignement sont nécessaires, accompagnés de formations
continues pour les enseignants afin d'améliorer leurs compétences en
évaluation continue et en suivi pédagogique.

En suivant ce processus structuré et en appliquant des critères d'évaluation

clairs, les enseignants peuvent assurer un suivi continu et une évaluation précise des
performances des étudiants. Cela permet non seulement de détecter les problèmes
rapidement mais aussi de soutenir les étudiants dans leur progression académique.

1.5 Importance de Surveiller l’Assiduité et la Participation

La surveillance de l’assiduité et de la participation est primordiale pour

améliorer les performances académiques des étudiants. Les étudiants présents et
engagés en classe sont mieux préparés et réussissent généralement mieux aux
évaluations et aux examens. De plus, la participation active en classe renforce la
compréhension des sujets et facilite l'application des connaissances acquises. En
détectant précocement les problèmes d'assiduité, les enseignants peuvent identifier
rapidement les étudiants rencontrant des difficultés personnelles, sociales ou
académiques, et mettre en place des interventions adaptées pour les aider à surmonter
ces obstacles.

Encourager la présence et la participation active en classe favorise également

une culture de sérieux et de responsabilité parmi les étudiants, créant ainsi un
environnement académique stimulant et interactif. Les étudiants qui participent
activement sont souvent plus motivés et engagés dans leur apprentissage, ce qui
maintient leur intérêt pour le cours et renforce leur motivation intrinsèque. Par ailleurs,
la participation en classe permet de développer des compétences essentielles telles que

16
la communication, le travail en équipe et la pensée critique, cruciales pour leur future
carrière professionnelle.

1.6 Objectifs de Surveiller l’Assiduité et la Participation

L'un des principaux objectifs de la surveillance de l’assiduité et de la
participation est de fournir une évaluation continue et formative des performances des
étudiants. Cela permet de donner un feedback régulier et constructif, aidant les
étudiants à comprendre leurs points forts et les domaines nécessitant des
améliorations. Cette évaluation continue permet également d’adapter les méthodes
d'enseignement et de soutien en fonction des besoins individuels des étudiants.

En outre, l'amélioration de la qualité de l’enseignement passe par l'utilisation des

données sur l’assiduité et la participation pour évaluer et ajuster les pratiques
pédagogiques. Identifier les cours ou les sections où les étudiants sont moins engagés
permet d'ajuster les méthodes d’enseignement en conséquence. La surveillance vise
aussi à encourager l’autonomie et la responsabilité des étudiants, en les aidant à
développer une discipline personnelle et un sens des responsabilités vis-à -vis de leur
apprentissage.

Enfin, la réalisation des objectifs académiques est assurée grâ ce à une

participation active et régulière des étudiants, garantissant qu'ils acquièrent les
compétences et les connaissances nécessaires pour réussir. Les données recueillies
peuvent également être utilisées pour évaluer et améliorer l’efficacité des programmes
éducatifs, s’assurant que le curriculum reste pertinent et aligné sur les besoins des
étudiants et du marché du travail.

1.7 Conclusion

En conclusion, ce chapitre a présenté l'Université M'Hamed Bougera de

Boumerdès, en se focalisant sur la Faculté des sciences et le département
d'informatique. Nous avons examiné les procédures de gestion des informations des

17
étudiants, soulignant l'importance d'un suivi rigoureux et de critères d'évaluation.
L'objectif est d'assurer une gestion efficace et une évaluation continue pour améliorer
les performances académiques et le développement personnel des étudiants. Dans le
prochain chapitre, nous traiterons la spécification et l'analyse des besoins pour notre
projet, y compris l'utilisation de l'UML et les diagrammes de cas d'utilisation et de
séquence.

Chapitre 02
Etude de l’existant et
spécification des besoins

18
2 Chapitre

2.1 Introduction

Dans ce chapitre, nous examinerons les solutions actuelles de suivi de l'assiduité

et de la participation des étudiants à travers une application web. Notre objectif est
d'identifier les lacunes du système existant et de proposer des solutions amélioratives.
Nous analyserons et critiquerons le système actuel, puis explorerons les aspects
fonctionnels et non fonctionnels, et en concluant par l'identification des acteurs clés et
de leurs rô les pour assurer une répartition claire des responsabilités dans notre projet.

2.2 Etude de l’existant

2.2.1 Analyse du système actuel

Méthodes Traditionnelles

Actuellement, de nombreuses institutions éducatives utilisent encore des

méthodes traditionnelles pour suivre l'assiduité et la participation des étudiants.
Ces méthodes incluent l'appel nominal, la signature de feuilles de présence, et des
systèmes manuels de suivi des notes de participation.

L'appel nominal, où l'enseignant vérifie la présence de chaque étudiant en

appelant leur nom, peut être chronophage, surtout dans les classes de grande taille.
La signature de feuilles de présence, une autre méthode courante, repose sur
l'intégrité des étudiants pour signer honnêtement, mais cette méthode peut
facilement être falsifiée. Les systèmes manuels de suivi des notes de participation
nécessitent que les enseignants enregistrent les contributions et les absences de
chaque étudiant, ce qui est non seulement fastidieux mais aussi sujet à des erreurs
humaines et des biais. Bien que ces approches soient simples et bien établies, elles
sont souvent inefficaces, laborieuses et présentent un risque élevé d'inexactitudes.

19
 Les fonctionnalités des systèmes actuels de suivi de l'assiduité et de la
participation varient, mais comprennent généralement :

 L’Appel nominal : Méthode où l'enseignant appelle individuellement chaque

étudiant par son nom pour enregistrer sa présence en classe.
 Feuilles de présence : Utilisation de feuilles de papier sur lesquelles les
étudiants signent ou notent leur présence lors des cours.
 Systèmes manuels de suivi : Enregistrement manuel par les enseignants
des absences, des retards et des contributions des étudiants dans un journal
de classe ou un système de fiches.
 Calcul manuel des notes de participation : Les enseignants calculent
manuellement la participation des étudiants en se basant sur leurs
contributions en classe, discours ou réponses aux questions.

Ces méthodes traditionnelles sont souvent simples à mettre en œuvre mais

peuvent être sujettes à des erreurs humaines, à des falsifications et peuvent
nécessiter beaucoup de temps pour leur gestion et leur suivi.

Systèmes Numériques Existants

Pour améliorer l'efficacité et la précision du suivi de l'assiduité et de la

participation, certaines institutions ont adopté des systèmes numériques. Ces
systèmes comprennent des logiciels de gestion scolaire, des portails étudiants, et
des applications mobiles.

Par exemple, des établissements utilisent des systèmes de QR codes, où les

étudiants scannent un code pour enregistrer leur présence, éliminant ainsi la
nécessité de l'appel nominal ou de la signature de feuilles de présence. Ces solutions
numériques peuvent également intégrer des dispositifs de reconnaissance faciale
pour automatiser davantage le processus. En outre, des logiciels de gestion scolaire
permettent de centraliser et d'automatiser le suivi des absences et des retards,
rendant les données plus accessibles aux enseignants et aux administrateurs.

Cependant, bien que ces systèmes offrent des améliorations significatives

par rapport aux méthodes traditionnelles, ils ne sont pas exempts de limitations. Les

20
défis comprennent des coû ts de mise en œuvre élevés, des problèmes de
confidentialité des données, et des besoins en formation pour les utilisateurs.

2.2.2 Critique de l'Existant

Le système traditionnel de suivi de l'assiduité et de la participation des étudiants

est confronté à diverses limitations qui compromettent son efficacité et sa fiabilité
dans le cadre éducatif. Après une analyse détaillée de l’existant, nous avons pu
relever un certain nombre de difficultés, on trouve :

 Limitations Techniques : Les systèmes actuels présentent plusieurs

limitations techniques. Par exemple, l'intégration avec d'autres outils
éducatifs et la personnalisation des fonctionnalités peuvent être limitées.

 Expérience Utilisateur : L'expérience utilisateur est un autre point de critique.

De nombreux systèmes actuels ne sont pas intuitifs et nécessitent une formation
pour être utilisés efficacement. Les interfaces peuvent être complexes et non
conviviales, ce qui décourage les enseignants et les étudiants de les utiliser
régulièrement.
 Fiabilité et sécurité : La fiabilité et la sécurité des systèmes existants sont
également des défis majeurs. Les erreurs de données et les pannes de système
peuvent perturber le suivi de l'assiduité et de la participation. De plus, la
protection des données personnelles des étudiants n'est pas toujours garantie.
 Absence d’interactivité : les systèmes Traditionnelles peuvent manquer
d'interactivité et de capacité à encourager activement l'engagement des
étudiants. Par exemple, des fonctionnalités telles que des rappels automatisés
de présence ou des notifications personnalisées pourraient être absentes,
limitant ainsi l'interaction dynamique entre les étudiants, les enseignants et
les administrateurs.
 Coût Élevé et Complexité de Maintenance : Les méthodes traditionnelles de
suivi, comme l'utilisation de feuilles de présence papier et de registres
manuels, sont coû teuses et complexes à entretenir. Elles nécessitent des

21
 ressources importantes pour l'impression, le temps, la distribution et la
gestion des données manuelles. Cela représente un défi pour les
établissements d'enseignement à budget limité, limitant l'efficacité globale du
système.

2.2.3 Solution proposée

Face à ces lacunes identifiées, nous avons pu tracer l’objectif d’améliorer le

fonctionnement et l’organisation du système actuel. Nous proposons l’intégration d’une
application web moderne pour le suivie d’assiduité et de la participation des étudiants
adapté aux besoins, cet outil nous permettra d’avoir les fonctionnalités suivantes :

 L'enregistrement automatique de la présence.

 Le suivi en temps réel des absences et le comportement des étudiants.
 Interface Conviviale et Accessible.
 La gestion des notes de participation avec des outils d'analyse avancée.
 La génération de rapports personnalisés et détaillés pour les enseignants, les
administrateurs.
 Suivi des Performances.

2.3 Spécification des besoins

Dans le domaine de l'informatique, l'identification des besoins fonctionnels et non
fonctionnels est essentielle. Les premiers spécifient les fonctionnalités clés attendues
d'une application, tandis que les seconds définissent les exigences de performance et de
sécurité nécessaires pour garantir son efficacité et sa convivialité.

2.3.1 Besoins fonctionnels

Dans chaque projet informatique, les fonctionnalités principales du futur

système sont représentées par les besoins fonctionnels, et dans notre projet, nous avons
identifié les suivants :

22
  Gestion d’Authentification et Gestion des Comptes.
 Gestion des Informations des É tudiants.
 Gestion des Cours, Modules et Groupes.
 Gestion de l'Assiduité, Participation et le comportement.
 Gestion de Rapports et de Statistiques.

2.3.2 Besoins non-fonctionnels

Une fois les besoins fonctionnels identifiés, il est essentiel de tenir compte des
contraintes techniques pour assurer une performance optimale du système. Nous
exposons ci-après les différentes contraintes à observer. En ce qui concerne le système,
nous nous concentrons sur :

 Facilite d'utilisation : L'interface utilisateur doit être intuitive et conviviale

pour permettre une navigation facile aux enseignants et aux administrateurs.

 Fiabilité : L'application doit garantir une fiabilité et une stabilité maximales,

réduisant ainsi les temps d'arrêt et les risques d'erreurs système.

 Évolutivité : L'application doit être conçue pour évoluer afin de s'adapter

aux besoins futurs, comme l'intégration de nouvelles fonctionnalités ou la
gestion d'un nombre croissant d'utilisateurs.

 Compatibilité : L'application doit être compatible avec différents systèmes et

technologies, assurant une intégration fluide avec d'autres systèmes existants
et futurs.

 Disponibilité : L'application doit être accessible en tout temps, garantissant

un service ininterrompu aux utilisateurs.

En répondant à ces besoins fonctionnels et non fonctionnels, l'application pourra

fournir une solution complète et efficace pour la gestion des informations des étudiants,
améliorant ainsi l'efficacité et la qualité de l'enseignement et de l'administration.

23
2.4 Identification des acteurs
Pour notre système, nous avons identifié et défini deux types principaux d’acteurs
qui interagiront avec les différentes fonctionnalités du système :

 Administrateur : son rô le possède tous l'autorité totale sur le système, avec

la responsabilité sur les aspects techniques de l'administration du système.

 Enseignant : Prendre l'assiduité et surveiller la participation des étudiants

permet aux enseignants d'obtenir des données essentielles sur leur
engagement et leur présence en classe.
Dans cette partie, nous détaillons les procédures pour les enseignants et les
administrateurs, ainsi que les fonctionnalités communes.

 Les enseignants doivent se connecter à l'application avec leurs identifiants

pour garantir un accès sécurisé. Ils peuvent ensuite suivre l'assiduité, la
participation ainsi que le comportement des étudiants, et générer des
rapports et des statistiques pour visualiser les performances des étudiants.

 Les administrateurs, également soumis à un processus de connexion sécurisé,

gèrent les enseignants et les informations des étudiants, ainsi que les
spécialités et modules. Ils supervisent également les rapports globaux pour
avoir une vue d'ensemble de l'assiduité, de la participation et du
comportement.

 Les deux types d'utilisateurs disposent d'un tableau de bord interactif

affichant des données telles que le nombre d'étudiants présents, le total des
présences, et d'autres statistiques pertinentes. Ils ont également la possibilité
de modifier leurs informations personnelles comme le mot de passe, le nom
et l'adresse e-mail, et peuvent consulter un historique et des archives pour
analyser les données passées.

L'application proposée offrira une solution complète pour la gestion des

informations étudiantes, avec des procédures claires pour les enseignants et les
administrateurs, garantissant une évaluation continue précise et une prise de décision
informée grâ ce à des rapports détaillés et des statistiques visuelles.
24
2.5 Conclusion

Dans ce chapitre, nous avons examiné les défis liés aux méthodes traditionnelles
de suivi de l'assiduité et de la participation des étudiants. En réponse à ces défis, nous
avons proposé une solution innovante : une application web intégrée permettant
l'enregistrement de la présence, le suivi en temps réel des absences, ainsi qu'une
gestion avancée des données pour répondre aux besoins fonctionnels et non
fonctionnels. Cette approche vise à améliorer l'efficacité et la qualité de l'enseignement
et de l'administration dans les établissements éducatifs.

Chapitre 03
Conception

25
3 Chapitre 03 : Conception

3.1 Introduction
Après la spécification et l’analyse des besoin, il est essentiel de passer par une
méthodologie d'analyse et de conception rigoureuse. Cette dernière vise à structurer les
étapes initiales du développement en formalisent des diagrammes de cas d'utilisation,
de séquence et de classe, ainsi que le modèle relationnel du système, Cela garantit une
structure cohérente et logique.

3.2 Définition d‘UML

UML, ou Unified Modeling Language, est un langage unifié utilisé pour la
modélisation dans la conception orientée objet. Il est devenu la norme pour le
développement de projets informatiques. Pour modéliser les différents diagrammes de
ces processus, nous avons choisi d'utiliser UML, car il est désormais reconnu comme le
standard dans le domaine du développement logiciel [3].

3.3 Diagrammes de cas d'utilisation

Un diagramme de cas d'utilisation représente visuellement les interactions entre
les utilisateurs et le système, en montrant les actions que les utilisateurs peuvent
effectuer et les fonctionnalités offertes par le système. Ce diagramme permet de
visualiser de manière claire et concise les fonctionnalités du système du point de vue
des utilisateurs.

26
 Tandis qu’un cas d'utilisation décrit une interaction entre un utilisateur et un
système pour atteindre un objectif spécifique sans entrer dans les détails de
l'implémentation technique [4].

3.3.1 Notions et symboles du diagramme de cas d’utilisation

Ce diagramme utilise des symboles spécifiques pour représenter les acteurs, les
cas d'utilisation, et les relations entre eux, offrant ainsi une vue d'ensemble
structurée et intuitive des besoins et des interactions des utilisateurs avec le
système.

 Cas d’utilisation : ovales de forme horizontale qui représentent les différentes

utilisations qu’un utilisateur peut avoir.
 Acteurs : Stick figures qui représentent les personnes qui emploient réellement
les cas D’utilisation.
 Associations : Une ligne entre les acteurs et les cas d’usage. Dans les schémas
complexes, Il est important de savoir quels acteurs sont associés à quels cas
d’usage.
 Inclusion (include) : une relation d’inclusion A par rapport à B signifie qu’une
instance de A contient le comportement décrit dans B.
 Extension (extend) : une relation d’extension A par rapport à B signifie qu’une
instance de A peut être étendue par le comportement décrit dans B.
 Zones de limites du système : une zone qui définit une portée du système pour
les Cas d’utilisation. Tous les cas d’utilisation en dehors des sentiers battus
seraient considérés comme hors du champ d’application de ce système.
 Package : une forme UML qui vous permet de regrouper différents éléments.
Tout comme pour les diagrammes de composants, ces regroupements sont
représentés sous forme de dossiers de fichiers.

27
Figure 3. 1 les Notions et symboles du diagramme de cas d’utilisation

28
 3.3.2 Diagramme de cas d’utilisation générale du système

Figure 3. 2 Diagramme de cas d'utilisation globale.

Ce diagramme représente les différents cas d'utilisation de notre projet. Il met en

évidence les interactions possibles entre les utilisateurs et le système. On peut voir que
le système est utilisé par deux types d'utilisateurs : l'administrateur et l'enseignant.
L'administrateur a accès à une palette de fonctionnalités étendue, lui permettant de
gérer les spécialités, les modules, les enseignants et les étudiants. D'un autre cô té,
l'enseignant peut accéder à ces palettes aussi : de voir les étudiants, gérer les présences
et consulter les statistiques. Tous les cas d'utilisations nécessitent une authentification
pour accéder au système, ce qui garantit une sécurité et une confidentialité appropriées.

29
Diagrammes de cas d’utilisation détaillés

Dans cette section, nous présenterons les diagrammes de cas d'utilisation

détaillés pour chaque acteur du système afin d'apporter plus de précision.

3.3.3 Diagramme de cas d’utilisation "Administrateur”

Figure 3 . 3 Diagramme de cas d'utilisation Administrateur

Description textuelle de ce diagramme

Ce diagramme de cas d'utilisation montre les actions que l'administrateur peut

réaliser dans le système, L'administrateur peut :

 Gérer les enseignants, inclut :

 Créer un enseignant

30
  Modifier un enseignant
 Supprimer un enseignant
 Assigner un module
 Recherche

Le cas d'utilisation "Assigner un module " dépend du cas d'utilisation "Gérer les
enseignants". Cela signifie que l'administrateur doit gérer les enseignants avant
d'assigner un module à un enseignant.

Le cas d'utilisation "Gérer les enseignants" est étendu par les cas d'utilisation "Créer
un enseignant", "Modifier un enseignant" et "Supprimer un enseignant".

Le cas d'utilisation "Rechercher" étend le cas d'utilisation "Gérer les enseignants".

Le cas d'utilisation "Authentification" est inclus dans les cas d'utilisation "Gérer les
enseignants" et "Assigner un module". Cela signifie que l'administrateur doit
s'authentifier avant d'effectuer l'une de ces actions.

31
 3.3.4 Diagrammes de cas d’utilisation ”Enseignant”

Figure 3. 4 Diagramme de cas d'utilisation d’Enseignant.

Description textuelle de ce diagramme

Ce diagramme de cas d'utilisation montre les interactions entre un professeur et

le système d'information. Les cas d'utilisation du professeur (enseignant) sont :

 Voir les étudiants : le professeur peut visualiser la liste des étudiants.

 Gérer les étudiants : le professeur peut modifier les informations des
étudiants, ajouter des étudiants, etc.
 Gérer la présence : le professeur peut saisir la présence des étudiants.
 Prendre les présences : le professeur peut utiliser cette fonctionnalité pour
prendre la présence des étudiants.
 Afficher la fréquentation : le professeur peut afficher la fréquentation des
étudiants.
 Gérer les statistiques : le professeur peut gérer les statistiques des étudiants,
notamment les notes, la présence, etc.

32
  Voir les notes : le professeur peut consulter les notes des étudiants.
 Voir les statistiques : le professeur peut consulter les statistiques des
étudiants.

L'utilisation de << extend >> et << include >> permet d'organiser les cas
d'utilisation et de montrer les relations entre eux. Par exemple, "Afficher la
fréquentation" est une extension de "Gérer la présence", car l'affichage de la
fréquentation est une action qui peut être effectuée après la saisie de la présence. "Gérer
les statistiques" inclut "Voir les statistiques", car l'action de voir les statistiques est une
partie de l'action de gérer les statistiques.

3.4 Diagramme de séquence

3.4.1 Définition
Un diagramme de séquence est un type de diagramme UML qui montre comment
les objets interagissent entre eux au fil du temps, en illustrant les messages échangés
dans un ordre chronologique pour réaliser une fonctionnalité spécifique [5].

3.4.2 Les concepts principaux d’un diagramme de séquence

 Acteurs et objets : Les entités qui participent à l'interaction, représentées par

des rectangles en haut du diagramme.
 Lignes de vie : Les lignes verticales qui descendent de chaque acteur ou objet,
montrant leur durée de vie pendant l'interaction.
 Messages : Les flèches horizontales entre les lignes de vie, représentant les
communications ou appels de méthode entre les objets, on trouve 3 types :
 Messages synchrones : Utilisé pour obliger un expéditeur d’attendre
une réponse à un message avant de continuer.
 Messages asynchrones : N’oblige pas l’expéditeur d’attendre une
réponse à un message avant de continuer.
 Messages de réponse : Ils représentent les réponses aux appels.

33
 Fragments : Les cadres rectangulaires qui délimitent des portions du
diagramme pour illustrer des structures de contrô le comme des boucles, des
conditions ou des parallélismes.

3.4.3 Diagramme de séquence d’authentification

Figure 3 . 5 Diagramme de séquence d'authentification.

34
 3.4.4 Diagramme de séquence de chercher une donnée

Figure 3 . 6 Diagramme de séquence de chercher une donnée.

Le diagramme montre comment rechercher une donnée dans une base de

données. L'utilisateur du système se connecte d'abord. Ensuite, il demande à rechercher
des données (voire les statistiques, listes des étudiants…), Il remplit le formulaire. Si le
formulaire est incorrect, il reçoit un message d'erreur. Si le formulaire est correct, le
système envoie une requête à la base de données. La base de données peut soit
renvoyer une erreur, soit trouver les données demandées. Si aucune donnée n'est
trouvée, l'utilisateur reçoit un message d'erreur. Si les données sont trouvées, elles
seront affichées.

35
 3.4.5 Diagramme de séquence de supprimer une donnée

Figure 3 . 7 Diagramme de séquence de supprimer une donnée.

Le diagramme de séquence illustre le processus de suppression de données par un

administrateur. Après s'être authentifié, l’administrateur demande la suppression d'une
donnée, ce qui déclenche l'affichage de l'interface de suppression. Il peut alors choisir
de confirmer ou d'annuler la suppression. Si la suppression est confirmée, le système
envoie une commande à la base de données, qui exécute la suppression et renvoie un
message de succès. En revanche, si l’administrateur annule la suppression, le système
informe simplement du retour à la page précédente.

36
 3.4.6 Diagramme de séquence d'ajouter une donnée

Figure 3 . 8 Diagramme de séquence d'ajouter une donnée.

Le diagramme de séquence illustre le processus d'ajout de données dans une base de

données. Après l'authentification de l'administrateur, le système lui demande d'ajouter
des données, ce qui entraîne l'affichage de l'interface d'ajout. L'administrateur remplit
alors le formulaire, et le système vérifie les données. En cas de champs vides, un
message d'erreur est affiché. Si les champs sont remplis, le système envoie une requête
d'insertion à la base de données. En cas d'échec de l'insertion, un message d'erreur est
renvoyé à l'administrateur. Si l'insertion est réussie, un message de confirmation est
transmis à l'administrateur.

37
 3.4.7 Diagramme de séquence de modifier une donnée

Figure 3 . 9 Diagramme de séquence de modifier une donnée.

Le diagramme de séquence décrit le processus de modification de données par un

utilisateur. Initialement, l'utilisateur se connecte au système en s'authentifiant. Une fois
connecté, il peut accéder à l'interface de modification en cliquant sur le bouton
"Modifier". Ensuite, il remplit les champs de l'interface et valide en cliquant sur le
bouton "Mettre à jour". Le système procède à une vérification des données saisies. En
cas d'erreur, un message d'erreur est affiché à l'utilisateur. Si les données sont
correctes, le système envoie une requête de modification à la base de données. Après
traitement de la requête par la base de données, un message de confirmation est

38
renvoyé à l'utilisateur. (L’enseignant n’est pas concerné de la modification sauf la
modification de son compte)

3.4.8 Diagramme de séquence de prendre des notes (participation

et présence)

Figure 3 . 10 Diagramme de séquence de prendre des notes.

Ce diagramme de séquence montre comment un enseignant saisit les notes de

participation et prend la présence. Après s'être authentifié, l'enseignant accède à
l'interface de saisie des notes et remplit un formulaire. Le système vérifie les données et

39
affiche un message d'erreur si elles sont incomplètes. Si les données sont correctes, le
système enregistre les notes dans la base de données et confirme leur enregistrement à
l'enseignant.

3.5 Les diagrammes de classes

3.5.1 Définition

Un diagramme de classes fournit une vue globale statique (ils montrent les
entités qui interagissent, mais pas les détails de l'interaction elle-même) d’un système
en présentant ses classes, ses attributs et ses méthodes, ainsi que les relations
(d’associations et autres), les cardinalités et les interactions entre elles [6].

3.5.2 Les concepts principaux d’un diagramme de classe

Le diagramme de classes comporte généralement les éléments suivants :

 Classes : la description abstraite d’un ensemble d’objets ayant des

Caractéristiques communes.
 Attributs : représentent les caractéristiques d’une classe.
 Méthodes : représentent les fonctions s’appliquant aux objets d’une classe.
 Relations : expriment les liens sémantiques ou structurels entre classes. Parmi
ces liens :

 Association : représentent une relation sémantique entre les objets d’une

classe. Elles Indiquent que les propriétés sont partagées ou échangées par les
classes reliées entre-elles. Elles sont représentées par des lignes reliant les
classes concernées.

 Agrégations : représentent une relation de contenu-contenant. Elles sont

équivalentes à une relation de possession. Elles sont indiquées par des lignes
avec losange vide.

 Compositions : indique qu’un objet composite est constitué d’un ou de

plusieurs objets composants. Le cycle de vie des composants est tributaire

40
 de celui de composite : si le composite disparaît, alors le compostant disparaît
aussi. Le composant ne peut Pas appartenir simultanément à plusieurs
composites (multiplicité 1 ou 0.1 cô té Composite), C’est une relation forte.
 Généralisations : relation dans laquelle un élément de modèle (l'enfant) est
basé sur un autre élément de modèle (le parent). Les relations de
généralisation sont utilisées Dans les diagrammes de classes, de composants,
de déploiement et de cas d'utilisation Pour indiquer que l'enfant reçoit tous
les attributs, opérations et relations qui sont Définis dans le parent.

Figure 3 . 11 Les concepts base d’un diagramme de classe.

41
3.5.3 Diagrammes de classe

Figure 3 . 12 Diagramme de classe générale.

Description textuelle du diagramme

42
 La figure (FIGURE) présente le diagramme de classe qui met en évidence la
structure statique interne du système. Elle illustre les principales classes de notre
application, ainsi que leurs attributs, leurs méthodes et les relations entre elles.

 La classe spécialité : Cette table stocke des informations sur les spécialités,
telles que le nom de la spécialité et le nombre de groupes.
 La classe teacher : Cette table stocke des informations sur les enseignants, telles
que leur nom, leur adresse électronique, leur mot de passe, leur numéro de
téléphone et la date de création de leur compte. Elle comprend également des
méthodes pour afficher la liste des étudiants, la présence, la participation, les
notes, les enregistrements de présence et afficher le graphique de performance.
 La classe admin : Cette table stocke des informations sur les administrateurs,
telles que leur nom, leur adresse électronique, leur mot de passe. Elle comprend
également des méthodes pour ajouter, mettre à jour, supprimer les entités et
afficher les notes et le graphique de performance.
 La classe Etudiant : Cette table stocke des informations sur les étudiants, telles
que leur nom, leur nom, leur autre nom, leur numéro d'admission, l'ID de
spécialité et le groupe.
 La classe Module : Cette table stocke des informations sur les modules, telles
que l'ID du module, le nom du module, l'ID de spécialité, l'ID de l'enseignant et
s'il est attribué.
 La classe Suivi Présence : Cette table stocke des informations sur la présence
des étudiants, telles que l'ID d'admission, l'ID de spécialité, l'ID du module, la
présence, la participation et la date et l'heure prises.

Les relations entre les tables sont représentées par des lignes. Chaque ligne
représente une relation entre deux tables, et le nombre sur la ligne indique la
multiplicité de la relation. Par exemple, la relation entre les tables teacher et Etudiant
est une relation un-à -plusieurs, ce qui signifie qu'un enseignant peut être associé à
plusieurs étudiants, mais un étudiant ne peut être associé qu'à un seul enseignant.

Le diagramme montre également que les tables teacher et admin ont toutes deux
des méthodes pour afficher les notes et le graphique de performance. Cela suggère que
les enseignants et les administrateurs peuvent tous deux accéder à ces informations.

43
 3.5.4 Dictionnaire de donnes
Le dictionnaire de données est un descripteur qui regroupe toutes les données
de la base pour la réalisation d’un diagramme de classe [7].

Pour chaque donnée il faut préciser :

 Sa désignation.
 Sa longueur (en caractère). (Facultatif)
 Un code (attribut).
 Son type (N : Numérique, A : Alphabétique, AN : Alphanumérique, D : Date,
B : Booléen)
 Une observation si cela est nécessaire.

Nom de la Attribut Type Désignation Observation

classe
specialite Id N L’identifient de Identifiant
spécialité
specialiteName A Le nom de spécialité /
Groups N Numéro de groupe /
Admin Id N L’identifient de L’admin Identifiant

firstName A Le nom de l’admin /

emailAddress AN Courriel de l’admin /

lastName A Le prénom de l’admin /

password AN Le mot de passe de /

l’admin
teacher Id N L’identifient de Identifiant
l’enseignant
firstName A Le nom de l’enseignant /
lastName A Le prénom de /
l’enseignant
emailAddress AN Courriel de l’enseignant /
Password AN Le mot de passe de /
l’enseignant
PhoneNo N Numéro de téléphone /
de l’enseignant
dateCreated D La date d’inscription /
Etudiant Id N L’identifient de Identifiant
l’étudiant

44
 firstName A Le nom d’étudiant /
lastName A Le prénom d’étudiant /
otherName A Le surnom /
admissionNumber AN Numéro unique de /
chaque étudiant lors de
son admission à
l’établissement
SpecialityID N L’identifient de Identifiant
spécialité
Groupe N Numéro du groupe /
Module ModuleID N L’identifient de module Identifiant

moduleName A Le nom du module /

SpecialityID N L'identifient de Identifiant
spécialité
TeacherID N L'identifient de Identifiant
l’enseignant
IsAssigned N 1 pour oui, 0 pour non /
SuiviPresence Id N L’identifient de Identifiant
présence
admissionNo AN Numéro unique de /
chaque étudiant lors de
son admission à
l’établissement

SpecialityID AN L’identifient de Identifiant

spécialité
ModuleID AN L’identifient de module Identifiant

attendance B Indiquant si un étudiant /

était présent, absent
participate B Enregistrer des /
informations sur la
participation
Comportement B Enregistre le
comportement
d’étudiant
dateTimeTaken D La date de présence /

Table 3 :1 - Dictionnaire de données.

45
3.6 Passage du Modèle Conceptuel au Modèle Relationnel

Pour passer du modèle conceptuel vers le model relationnel on doit appliquer

quatre règle appelées “règles de passage” :

 Chaque classe devient une table, les attributs de la classe deviennent de la table
et L’identifiant devient clé primaire pour la table.
 Chaque association 1-1 est prise en compte en incluant la clé primaire d’une des
relations comme clé étrangère dans l’autre relation.
 Chaque association 1-N est prise en compte en incluant la clé comme clé
étrangère dans la relation dont la multiplicité maximale est la clé primaire de
l’autre relation.
 Une association de type N-N (c’est à dire qui a les cardinalités maximales
positionnées à « N » des 2 cô tés de l’association) se traduit par la création d’une
table dont la clé primaire est composée des clés étrangères référençant les
relations correspondant aux entités liées par l’association. Les éventuelles
propriétés de l’association deviennent des attributs de la relation [8].

3.7 Le Modèle Relationnel

En appliquant les règles de passage du modèle d’objet au modèle relationnel sur

notre diagramme de classe, nous obtenons les relations suivantes :

 Specialite (id, specialite_name, groups).

 Teacher (id, first_name, lastname, email_address, password, phone_no,
date_created).
 Admin (id, first_name, last_name, email_address, password).
 Etudiant (id, first_name, last_name, other_name, admission_number,
#specialty_id, groupe).
 Module (module_id, module_name, #specialty_id, #teacher_id, is_assigned).
 SuiviPresence (id, admission_no, specialty_id, module_id, attendance,
participate, comportement, datetimetaken).

46
3.8 Conclusion

Dans ce chapitre nous avons détaillé la vue conceptuelle de notre application à

travers les diagrammes de cas, de séquences et de classe réaliser par le model UML ainsi
que le model relationnel. Cette conception est essentielle pour la phase de réalisation de
la dernière phase qui est l’implémentation de notre système.

47
 Chapitre 04
Realisation et implementation

4 Chapitre 4

4.1 Introduction

48
 Après avoir terminé la phase de conception répondant aux besoins de
l'application, il est essentiel de passer à l'étape de réalisation et d'implémentation. Dans
ce chapitre, nous allons présenter l'environnement matériel et logiciel, ainsi que les
outils et langages de programmation utilisés pour le développement de notre
application web.

4.2 Architecture du système

Notre système repose sur une architecture client/serveur à trois tiers,

représentée par un diagramme de déploiement. Ce type de diagramme offre une vue
statique de l'infrastructure physique utilisée par le système, illustrant comment les
composants sont distribués et leurs relations mutuelles. Les éléments clés d'un
diagramme de déploiement comprennent les nœuds, les composants, les associations et
les artefacts.

Les composantes principales de notre système sont :

 PC Utilisateur : L'utilisateur envoie des requêtes HTTP vers le serveur, qui

répond en affichant les résultats.
 Serveur Web : Permet aux utilisateurs d'accéder à des pages web via un
navigateur.
 Base de données : Répond aux requêtes SQL provenant du serveur web.

La figure suivante illustre le diagramme de déploiement de notre système, montrant la

disposition et l'interaction des différents composants.

Figure 4 . 1 Diagramme de déploiement.

49
 Dans notre cas, ce diagramme de déploiement représente un système Web
simple composé de trois éléments : un PC utilisateur, un serveur Web et une base de
données.

Le PC utilisateur interagit avec le serveur Web via des requêtes HTTP, tandis que
le serveur Web exécute l’application Web qui accède à la base de données pour
récupérer des informations. Lorsque le serveur Web reçoit une réponse de la base de
données, il envoie une réponse HTTP au PC utilisateur.

La communication entre les différents éléments est indiquée par des flèches et
des messages. Le serveur Web est le point d'entrée du système pour le PC utilisateur et
joue un rô le central en orchestrant les interactions entre le PC utilisateur et la base de
données [9].

4.3 Environnement de développement

4.3.1 Environnement matériel :

Machine PC
Système Windows 11
d’exploitation
3.20 GHz
CPU (AMD Ryzen 7
5800H with
Radeon Graphics)
RAM 16GB

Langages de programmation :

Dans notre projet, nous avons employé plusieurs langages de programmation

pour développer une application web fonctionnelle et dynamique. Voici une description
des principaux langages utilisés et leur rô le respectif :

 HTML (HyperText Markup Language) : HTML est un langage de

balisage utilisé pour créer des applications web et des sites web. Il
permet de structurer et de mettre en forme le contenu des pages,
et d'inclure des ressources multimédias telles que des images ou des formulaires

50
 de saisie. L'utilisation de ce langage est souvent accompagnée d'autres langages
tels que PHP, JavaScript, et CSS [10].
 CSS (Cascading Style Sheets) : CSS est un langage de feuille de style
utilisé pour gérer la présentation des pages HTML. Il permet de
créer des effets visuels et des animations simples, améliorant ainsi
l'apparence des pages web [11].

 PHP (Hypertext Preprocessor) : PHP est un langage de script cô té

serveur, open source, spécialement conçu pour le développement
d'applications web. Il s'intègre facilement au HTML [12].

 SQL (Structured Query Language) : est un système de gestion de

base de données relationnelle open source utilisant SQL pour gérer
et manipuler les données [13].

 JavaScript : JavaScript est un langage de programmation interprété

dynamiquement, qui permet aux scripts cô té client de créer des
applications web et des sites web entièrement dynamiques [14].

 Bootstrap : Bootstrap est une collection d'outils pour créer le design des sites et
des applications web. Il comprend des modèles HTML et CSS pour les
formulaires, boutons, outils de navigation et autres éléments
interactifs, ainsi que des extensions JavaScript optionnelles [15].

4.3.2 Environnements logiciels :

Dans notre projet, nous avons utilisé plusieurs langages et outils logiciels pour le
développement de notre application web, Voici une présentation des principaux
composants et technologies que nous avons intégrés :

 XAMPP : est un serveur web très populaire qui aide à créer et tester
des programmes sur un serveur local. Créé par Apache Friends, il
est open source, donc tout le monde peut le modifier. Il inclut
plusieurs composants : Apache HTTP Server, MariaDB, et des outils pour des

51
 langages comme PHP et Perl. XAMPP est disponible en 11 langues et fonctionne
sur différentes plateformes [16].

 Visual Studio Code : est un éditeur de code extensible développé

par Microsoft pour Windows, Linux et MacOs. Les utilisateurs
peuvent personnaliser le thème, les raccourcis clavier et les
préférences, et installer des extensions pour ajouter des fonctionnalités
supplémentaires [17].

 Chart.js est une bibliothèque JavaScript open source pour créer des
graphiques interactifs sur des pages web. Elle permet de générer
divers types de graphiques, comme des graphiques en ligne, en
barres, et en secteurs. Facile à utiliser et personnalisable, elle s'adapte aux
besoins des utilisateurs [18].

 PowerAMC : est un outil de modélisation de données et de

processus. Il permet de concevoir et gérer des bases de données et
des architectures d'entreprise en créant des modèles conceptuels,
logiques et physiques, ainsi que des diagrammes de cas d'utilisation, de classe et
de séquence. Cet outil aide à améliorer la compréhension et la communication
des structures complexes dans les projets de développement [19].

 Ajax : Asynchrones JavaScript and XML, est une technique de développement

web qui permet de mettre à jour dynamiquement le contenu
d'une page web sans avoir à recharger entièrement la page.
Cela est rendu possible grâ ce à des requêtes asynchrones au serveur, permettant
ainsi une expérience utilisateur plus fluide et interactive [20].

Nous avons utilisé Dans notre projet les outils logiciels et matériel précédents
pour créer une application web dynamique et fonctionnelle. Ces composants ont assuré
une performance optimale et une structure bien organisée.

52
4.4 Les interfaces de l’application

4.4.1 Interface de l’authentification :

La page d'authentification est une interface de connexion simple. Les utilisateurs

saisissent leurs informations d'identification et leur rô le, puis cliquent pour se
connecter. S'ils réussissent, ils sont dirigés vers leur tableau de bord. Sinon, ils
voient un message d'erreur.
La figure suivante représente notre interface d’accueil de notre application, qui
sera accessible par tous les Utilisateurs :

Figure 4 . 2 Interface de l’Authentification du système.

4.4.2 Espace de Admin

La page d’accueil pour la Admin :

Cette page agit comme un tableau de bord administratif, affichant des métriques
essentielles à travers des cartes. Elle présente des données telles que le nombre
d'étudiants, de spécialités, de modules, la fréquentation totale des étudiants et les
53
enseignants, chacune accompagnée d'une icô ne pertinente. La page comprend
également des barres de navigation et un pied de page pour faciliter la navigation.

La figure suivante représente l’interface d’accueil (Tableau de bord) de notre

application pour l’administrateur, qui serait accessible juste par l’administrateur :

Figure 4 . 3 Interface de La page d’accueil pour l’administrateur.

La page de Gérer le profil :

Cette page permet aux administrateurs de mettre à jour leurs informations de

profil. Lors de la soumission, le formulaire valide les données et met à jour le profil
dans la base de données. La figure suivante illustre cette page :

54
 Figure 4 . 4 Interface de La page de gestion de profil.

La page de Gérer les spécialités :

Cette page permet aux administrateurs de gérer les spécialités. Ils peuvent en
créer de nouvelles, ainsi avec un affichage d’un tableau répertoriant les spécialités
avec des options pour éditer ou supprimer chaque entrée. La figure suivante illustre
cette page :

Figure 4 . 5 Interface de La page de gestion des spécialités

La page de Gérer Les Modules :

Cette page permet aux administrateurs de crée les modules, ainsi pour les gérer
pour les différents enseignants selon les besoins. Avec une option d’affichage si

55
chaque module est actuellement attribué à un enseignant. La figure suivante illustre
cette page :

Figure 4 . 6 Interface de La page de gestion des Modules.

La page de Gérer Les Enseignants :

Cette page facilite la gestion des enseignants et de leurs modules associés. Les
administrateurs peuvent ajouter, éditer ou supprimer des enseignants. Lors de la
suppression d'un enseignant, les modules qui lui sont attribués sont également
libérés.

La figure suivante représente cette page :

56
 Figure 4 . 7 Interface de La page de Gérer Les Enseignants.

La page de Gérer Les Étudiants :

Cette page facilite la gestion des étudiants et de leurs groupes associés dans une
spécialité. Dans cette page, Les administrateurs peuvent ajouter, éditer ou
supprimer des étudiants.

La figure suivante montre cette page :

57
 Figure 4 . 8 Interface de La page de Gérer Les É tudiants.

La page de Gérer les Statistiques

Voir les Notes :

Cette page facilite aux administrateurs la sélection d'une spécialité, d'un groupe
et d'un module sur une page web. Après la soumission du formulaire, le système
récupère les données nécessaires, calcule les notes des étudiants en tenant compte

58
de leur présence et de leur participation, puis les affiche. De plus, les
administrateurs ont la possibilité de télécharger les notes au format Excel.

La figure suivante illustre cette page :

Figure 4 . 9 Interface de La page de Voir les Notes.

Voir les Statistiques :

Cette page facilite aux administrateurs la sélection d'un étudiant par son numéro
d'admission sur une page web. Après soumission du formulaire, le système
récupère les données pertinentes, calcule les statistiques de performance de
l'étudiant pour chaque module (présence, participation, comportement), et les
affiche sous forme d'un graphique à lignes.

59
 La figure suivante représenter cette page :

Figure 4 . 10 Interface de La page de Voir les Statistiques.

La figure suivante représente les extensions du graphe de l'administrateur,

lesquelles peuvent se diviser en plusieurs graphiques individuels illustrant soit la
présence, soit la participation, soit le comportement.

60
 Figure 4 . 11 les graphes individuels du graphe père.

4.4.3 Espace de l'enseignant

61
La page d’accueil pour l’enseignant :
Cette page est un tableau de bord pour l’enseignants. Elle affiche des statistiques
de base telles que le nombre d'étudiants, de spécialités, de modules. La figure
suivante montre cette page :

Figure 4 . 12 Interface de La page d’accueil pour l'enseignant.

La page de Gérer le profil :

Cette page permet aux enseignants de modifier leur profil. Ils peuvent changer
leur prénom, nom de famille, le courriel, numéro de téléphone et mot de passe. Le
formulaire affiche les informations actuelles et permet les mètres à jour.

Figu
re 4 : 12 Interface de La page de Gérer le profil.

Voir la liste des étudiants :

62
 Cette page offre aux enseignants la possibilité de choisir une spécialité ainsi
qu'un groupe d'étudiants associé à cette spécialité. Une fois sélectionnés, les
informations des étudiants seront affichées, La figure suivante illustre cette page :

Fi
gure 4 . 13 L’Interface de Voir la liste des étudiants.

Prendre les présences :

Cette page permet aux enseignants de sélectionner une spécialité, un groupe, et

un module. Une fois sélectionnés, les informations des étudiants associés à ces
critères seront affichées, avec des cases à cocher pour enregistrer la présence et la
participation et le comportement des étudiants.

Fi
gure 4 . 14 Interface de Prendre les présences.

Présences Étudiants par Module :

63
 Cette page permet aux enseignants de sélectionner une spécialité, un groupe et
un module avec une date. Une fois sélectionnés, elle affiche les détails de présence,
de participation et de comportement des élèves associés à ces critères.

Les enseignants peuvent consulter les enregistrements de présence, de

participation et de comportement des élèves pour une date, dans diffèrent module
enseigner par cet enseignant.

La figure suivante montre cette page :

Figure 4 . 15 Interface qui affiche la participation, présence et le comportement des

étudiant.

Voir les Notes :

64
 Cette fonctionnalité permet aux enseignants de sélectionner une spécialité, un
groupe et un module spécifiques, puis afficher les détails de présence,
comportement et de participation des étudiants correspondants. Une fois les
critères choisis, les données sont présentées et peuvent être téléchargées au format
Excel.

Fig
ure 4 . 16 Interface de Voir les Notes.

La figure ci-après illustre un format de fichier Excel contenant les informations

des étudiants, y compris leurs notes de participation, de présence et de
comportement.

Figure 4 . 17 Représente les donnes télécharger en format EXCEL.

65
 Voir les Statistiques :

Cette page correspond à la récupération des données en fonction des choix

d'utilisateur, la représentation se fait en utilisant les détails de présence, de
participation et de comportement et à leur présentation visuelle à travers un
graphique à barres empilées.

La figure suivante représente cette page :

Figure 4 . 18 Interface de La page de Voir les Statistiques

Les figure ci-après montre les graphe qui

represente l'assiduité, de participation et de
comportement des étudiants dans la page
statistique :

Figure 4 . 19 représente le graphe principal des

informations.

66
 Figure 4 . 20 les extensions du graphe.

4.5 Conclusion :

Dans ce chapitre, nous avons détaillé les étapes de réalisation et

d'implémentation de notre application web. Nous avons décrit l'architecture du
système, les environnements matériel et logiciel utilisés, ainsi que les principaux outils
et langages de programmation employés. Nous avons également présenté les différentes
interfaces de l'application, conçues pour faciliter la gestion des spécialités, des modules,
des enseignants et des étudiants. L'ensemble de ces éléments a permis de créer une
application web robuste, fonctionnelle et bien structurée, répondant aux besoins
spécifiés durant la phase de conception.

67
 CONCLUSION GENERALE

En conclusion, nous avons réussi à concevoir et à mettre en œuvre une

application web spécialement conçue pour la gestion suivre l’assiduité et la
participation des étudiants, répondant ainsi aux exigences en matière d'évaluation
continue et de suivi académique. Nous voulions également sensibiliser et répondre aux
besoins des enseignants en développant une plateforme dédiée à la gestion des
informations des étudiants. Cette initiative visait à renforcer l'implication des étudiants
en suivant de près leurs interactions et activités pour une évaluation continue.

L'objectif était de fournir un outil efficace pour surveiller l'assiduité et la

participation en classe ainsi que le comportement. Cette application permettrait non
seulement de stocker et de gérer les performances étudiantes, mais aussi de fournir des
données précieuses sous forme de statistiques et de graphiques, illustrant ainsi les
progrès de chaque étudiant sur une date choisie par l'utilisateur.

Le projet s’est déroulé en quatre étapes pour développer une application web de
suivi de l’assiduité et de la participation des étudiants. D'abord, nous avons présenté
l'organisme d'accueil, l'Université M’Hamed BOUGARA de Boumerdès, et ses méthodes
traditionnelles de gestion. Ensuite, nous avons analysé les limitations du système actuel
et proposé une solution innovante via une application web. La conception de
l'application a été réalisée en utilisant des diagrammes UML pour modéliser le système.
Enfin, la réalisation et l'implémentation de l'application ont été détaillées, avec un focus
sur l’architecture, l’environnement de développement et les interfaces utilisateur. Ce
projet a abouti à une application efficace pour améliorer la gestion de l’enseignement et
de l’administration, offrant un modèle pour d’autres institutions.

Les points forts de notre projet incluent l'utilisation d'outils modernes et de

méthodologies éprouvées pour garantir une conception robuste et évolutive. La
flexibilité de l'application permet son adaptation à d'autres institutions éducatives,
offrant ainsi une solution scalable et adaptable à divers contextes académiques. De plus,
l'interface conviviale assure une prise en main rapide par les utilisateurs finaux, qu'ils
soient les enseignants et les administrateurs.

68
 En termes d'objectifs, nous avons visé non seulement à améliorer la gestion
académique au sein de l'université, mais également à promouvoir une culture de
transparence et d'engagement parmi les étudiants. En fournissant une surveillance
totale pour améliorer les performances académiques des étudiants et garantir un suivi
continu de leur progression, nous efforçons de créer un environnement propice à
l'apprentissage et à l'épanouissement académique. Cette approche proactive permet
non seulement d'identifier les difficultés potentielles dès leur apparition, mais aussi
d'adapter les méthodes d'enseignement et de soutien pour répondre aux besoins
spécifiques de chaque étudiant. En parallèle, nous encourageons la responsabilisation
individuelle et collective, renforçant ainsi l'engagement des étudiants dans leur propre
réussite et dans la communauté universitaire.

Notre projet représente une avancée significative vers la création d'un

environnement universitaire plus connecté et interactif, en exploitant la technologie
comme moteur pour stimuler l'engagement et la collaboration. En élargissant cette
initiative pour intégrer des capacités étendues de suivi des notes, nous permettons aux
enseignants de monitorer l'ensemble des performances académiques des étudiants,
allant au-delà de leur assiduité et de leur participation. Cette évolution soutient une
approche dynamique et adaptable de la gestion académique, nous préparant ainsi à
relever les défis futurs de l'enseignement supérieur grâ ce à une utilisation novatrice de
la technologie.

69
 BIBLIOGRAPHIE

[1] l’Université M’Hamed BOUGARA de Boumerdès

https://www.univ-boumerdes.dz/universit%C3%A9/presentation.html . [Consulté le
29/05/2024]

[2] Faculté des sciences (Campus sud-Boumerdes)

https://www.univ-boumerdes.dz/universit%C3%A9/facultes-institut.html#1 .
[Consulté le 30/05/2024]

[3] UML, en ligne PDF https://perso.liris.cnrs.fr/christine.solnon/coursUML.pdf .

[Consulté le 07/05/2024]

[4] cours diagramme de cas d’utilisation https://www.youtube.com/@abdelkhalek-

benhoumine/playlists . [Consulté le 08/05/2024]

[5] diagramme de séquence [En ligne]

https://lipn.univ-paris13.fr/~gerard/uml-s2/uml-cours05.html [Consulté le
11/05/2024]

[6] Cours Diagramme de classes [En ligne]

https://perso.liris.cnrs.fr/christine.solnon/coursUML.pdf . [Consulté le 17/05/2024]

[7] Dictionnaire de donnes [En ligne] https://datavalue-consulting.com/dictionnaire-

donnees . [Consulté le 20/05/2024]

[8] Passage du MCD au MLD [En ligne]

https://www-igm.univ-mlv.fr/~chochois/RessourcesCommunes/BDD/Modelisation/
coursMLD.pdf . [Consulté le 24/05/2024]

[9] Notions d’architecture 3 tiers [En ligne]

https://stph.scenari-community.org/bdd/lap2/co/webUC003archi.html . [Consulté le
29/05/2024]

[10] Def de html https://www.w3schools.com/html/default.asp ( HTML Tutorial

(w3schools.com)) . [Consulté le 15/06/2024]

[11] Def de css https://www.w3schools.com/css/default.asp (CSS Tutorial

(w3schools.com)) . [Consulté le 15/06/2024]

[12] Def de php https://www.w3schools.com/php/default.asp (PHP Tutorial

(w3schools.com)). [Consulté le 15/06/2024]

[13] Def de de sql. https://www.w3schools.com/sql/default.asp (SQL Tutorial

(w3schools.com)). [Consulté le 15/06/2024]

[14] Def de js https://www.w3schools.com/js/default.asp (JavaScript Tutorial

(w3schools.com)). [Consulté le 15/06/2024]

70
[15] Def de bootstrap https://www.w3schools.com/bootstrap/bootstrap_ver.asp
(Choose a Bootstrap Version (3,4 or 5) (w3schools.com)) / [Consulté le 15/06/2024]

[16] Def de xampp https://locall.host/xampp/ . [Consulté le 15/06/2024]

[17] Def de Visual Studio Code https://fr.wikipedia.org/wiki/Visual_Studio_Code .

[Consulté le 15/06/2024]

[18] chart.js https://www.chartjs.org/ . [Consulté le 15/06/2024]

[19] Power AMC https://www.powerdesigner.biz/FR/ . [Consulté le 15/06/2024]

[20] AJAX https://aws.amazon.com/fr/what-is/ajax/ . [Consulté le 15/06/2024]

[21] https://drive.google.com/file/d/1o0Ozr_or_T8cPh98HA5vwA8POFp60Yze/view
[Consulté le 06/04/2024]

[22] Bootstrap formation vidéo [En ligne] https://www.youtube.com/watch?v=T-

6dbrYUpxg&list=PLBOL5k415M_WJeZyalQeWrWtH3OHDHxCu . [Consulté le
01/04/2024]

[23] plateformes Comme ResearchGate, Google Scholar

https://www.researchgate.net/ , https://scholar.google.com/ . [Consulté le
15/04/2024]

[24] Apprenez à créer votre site web avec HTML5 et CSS3 - OpenClassrooms
https://openclassrooms.com/fr/courses/1603881-creez-votre-site-web-avec-html5-et-
css3 . [Consulté le 15/04/2024]

[25] Apprenez à programmer avec JavaScript - OpenClassrooms

https://openclassrooms.com/fr/courses/7696886-apprenez-a-programmer-avec-
javascript . [Consulté le 15/04/2024]

[26] Concevez votre site web avec PHP et MySQL - OpenClassrooms

https://openclassrooms.com/fr/courses/918836-concevez-votre-site-web-avec-php-
et-mysql . [Consulté le 15/04/2024]

[27] Programmez en orienté objet en PHP - OpenClassrooms

https://openclassrooms.com/fr/courses/1665806-programmez-en-oriente-objet-en-
php . [Consulté le 15/04/2024]

[28] livre É coconception web : les 115 bonnes pratiques. ‘’ Frédéric Bordage’’.

[29] Modern Web Development on the Jamstack. ‘’Mathias Biilmann & Phil
Hawksworth’’

71