Conception Et Réalisation D'une Plateforme Social Learning

REPUBLIQUE TUNISIENNE
MINISTERE DE LENSEIGNEMENT SUPERIEUR,

DE LA RECHERCHE SCIENTIFIQUE ET DES TECHNOLOGIES DE
LINFORMATION ET DE LA COMMUNICATION
UNIVERSITE DE TUNIS EL MANAR
INSTITUT SUPERIEUR DINFORMATIQUE
RAPPORT DE STAGE DE FIN DETUDES

Prsent en vue de lobtention du
Diplme : Licence Applique
Option : Systmes Informatiques et Logiciels
Par
BEN HAMMOUDA Roua
Conception et Ralisation dune plateforme Social

Learning
Organisme daccueil :
Centre National dInformatique
Encadrant lentreprise : Mr.HMADI Karim

Encadrant lISI : Mr.LAABIDI Mohsen
Anne Universitaire 2013-2014
Je ddie ce travail
lme ternelle de mon pre Jallel
ma mre Jamila
Que Dieu la protge
Pour tous les sacrifices consentis
Pour tous les encouragements quelle a su prodiguer aux moments difficiles. Quelle trouve,
dans ce travail, le tmoignage de ma vive gratitude et de ma grande reconnaissance, pour
lnergie quelle a su implanter en moi tous les moments de mes tudes.
mes surs Amal et Rim pour leurs sacrifices et leurs prcieuses directives, pour tout ce que
nous avons partag.
mon plus cher ami Mohamed Amine, qui m'a soutenu, et qui t toujours mes
cots
Que vous trouviez, dans ce travail, le tmoignage de ma sincre fraternit et de mon ternel
attachement familial.
toute ma famille,
mes chers amis
Quils trouvent ici, lexpression de mes sincres remerciements.
Roua
Nos remerciements sadressent notre Prsidente du jury

Mme. Yosra NAJJAR
pour lhonneur quelles nous font de juger notre travail.
Nous tenons galement exprimer nos sentiments de respect tous les membres de jury.
Nous exprimons nos profondes gratitudes et respectueuse reconnaissance notre

encadreur de la socit :
Mr. Karim HMADI
pour son assistance, sa disponibilit, ses encouragements et ses conseils continus.
Nous remercions aussi notre encadreur:
Mr. Mohsen LAABIDI
pour ses directives prcieuse, et pour la qualit de son suivi durant toute la priode de notre
projet.
Par la mme occasion, nous adressons nos remerciements tous nos enseignants pour leurs
efforts qui ont guid nos pas et enrichi nos connaissances tout au long de nos tudes
universitaires.
Table des matires

Introduction gnrale .................................................................................................................... 1
Chapitre I : Etude pralable et tat de lart ............................................................................... 4
Introduction.................................................................................................................................. 4
1. Prsentation de lorganisme daccueil ................................................................................... 4
1.1 Prsentation gnrale du Centre National de lInformatique(CNI) ................................... 4
1.2 Organigramme ................................................................................................................... 4
2. Prsentation du projet .............................................................................................................. 5
2.1 Description du projet ......................................................................................................... 5
2.2 Objectifs du projet ............................................................................................................. 5
3. Etat de lart .............................................................................................................................. 5
3.1 Cest quoi, une plate-forme dapprentissage en ligne ? ..................................................... 5
3.2 E-Learning ......................................................................................................................... 6
3.3 Blended Learning ............................................................................................................... 6
3.4 Web 2.0 .............................................................................................................................. 6
3.5 Le Social Learning (Lapprentissage social) ..................................................................... 7
4. Planning ................................................................................................................................... 8
Conclusion ................................................................................................................................... 8
Chapitre II : Analyse et spcification des besoins .................................................................... 11
Introduction................................................................................................................................ 11
1. Etude de lexistant ................................................................................................................ 11
1.1 Description de lexistant .................................................................................................. 11
1.2 Critique de lexistant ........................................................................................................ 12
1.3 La solution propose ........................................................................................................ 13
2. Spcification des exigences ................................................................................................... 13
2.1 Etude des besoins fonctionnels ........................................................................................ 13
2.2 Etude des besoins non fonctionnels ................................................................................. 14
2.3 Les acteurs systme ......................................................................................................... 14
2.4 Identification des cas dutilisation ................................................................................... 14
2.5 Diagramme globale des cas dutilisation ......................................................................... 16
3. Identification des risques ....................................................................................................... 17
Conclusion ................................................................................................................................. 18
Chapitre III : Conception ........................................................................................................... 20
Introduction................................................................................................................................ 20
1. Choix de la mthodologie de conception ............................................................................ 20
2. Raffinement des cas dutilisation......................................................................................... 20
2.1 Cas dutilisation Sauthentifier .................................................................................. 20
2.2 Cas dutilisation Grer le profil .................................................................................. 22
2.3 Cas dutilisation Grer blog ....................................................................................... 23
2.4 Cas dutilisation Grer wiki ....................................................................................... 23
2.5 Cas dutilisation Grer plateforme ............................................................................. 24
2.6 Cas dutilisation Grer les ressources ........................................................................ 25
2.7 Cas dutilisation Grer les sondages .......................................................................... 26
2.8 Cas dutilisation Grer les utilisateurs ....................................................................... 26
2.9 Cas dutilisation Grer les tests ................................................................................. 28
2.10 Cas dutilisation Grer les devoirs ........................................................................... 29
2.11 Cas dutilisation Se communiquer ........................................................................... 29
2.12 Cas dutilisation Grer les cours .............................................................................. 30
3. Modlisation conceptuelle des donnes ............................................................................... 31
3.1 Dictionnaire des donnes ................................................................................................. 31
3.2 Diagramme de classes ...................................................................................................... 31
4. Diagrammes dactivits ......................................................................................................... 32
4.1 Diagramme dactivits Grer les utilisateurs ............................................................. 32
4.2 Diagramme dactivits Grer les cours ...................................................................... 33
4.3 Diagramme dactivits Grer les devoirs ................................................................... 34
Conclusion ................................................................................................................................. 34
Chapitre IV : Ralisation ............................................................................................................ 36
Introduction................................................................................................................................ 36
1. Etude technique ................................................................................................................... 36
1.1 Matriels de base ............................................................................................................. 36
1.2 Choix du CMS (Content Management System) .............................................................. 36
1.3 Outils de dveloppement.................................................................................................. 38
1.4 Langages de dveloppement ............................................................................................ 40
2. Architecture gnrale de lapplication ................................................................................... 40
3. Prsentation des interfaces ..................................................................................................... 42

3.1 Scnario Administrateur ............................................................................................ 43
3.2 Scnario Tuteur .......................................................................................................... 47
3.3 Scnario Apprenant .................................................................................................... 50
4. Apports .................................................................................................................................. 53
4.1 Apports au niveau des connaissances techniques ............................................................ 53
4.2 Apports au niveau de la conception et du dveloppement............................................... 54
Conclusion ................................................................................................................................. 54
Conclusion et perspectives .......................................................................................................... 55
Bibliographie................................................................................................................................ 57
Webographie ................................................................................................................................ 58
Annexes ........................................................................................................................................ 60
Annexe A ................................................................................................................................... 60
Annexe B ................................................................................................................................... 65
Liste des figures

Figure 1: Organigramme du CNI .........................................................................................................4
Figure 2: Diagramme globale des cas dutilisation ............................................................................17
Figure 3: Cas dutilisation Sauthentifier .....................................................................................20
Figure 4: Diagramme de squence Authentification ...................................................................21
Figure 5: Cas dutilisation Grer le profil ....................................................................................22
Figure 6: Cas dutilisation Grer blog ..........................................................................................23
Figure 7: Cas dutilisation Grer wiki ..........................................................................................23
Figure 8: Cas dutilisation Grer la plateforme ............................................................................24
Figure 9: Cas dutilisation Grer les ressources ...........................................................................25
Figure 10: Cas dutilisation Grer les sondages ...........................................................................26
Figure 11: Cas dutilisation Grer les utilisateurs ........................................................................26
Figure 12: Diagramme de squence Ajout dun utilisateur ..........................................................27
Figure 13: Cas dutilisation Grer les tests ..................................................................................28
Figure 14: Cas dutilisation Grer les devoirs ..............................................................................29
Figure 15: Cas dutilisation Se communiquer ..............................................................................29
Figure 16: Cas dutilisation Grer les cours .................................................................................30
Figure 17: Diagramme de classes.......................................................................................................31
Figure 18: Diagramme dactivit Grer les utilisateurs ................................................................32
Figure 19: Diagramme dactivit Grer les cours .........................................................................33
Figure 20: Diagramme dactivit Grer les devoirs .......................................................................34
Figure 21: Architecture 3-tiers ...........................................................................................................41
Figure 22: Architecture MVC ............................................................................................................41
Figure 23: Page daccueil ...................................................................................................................43
Figure 24: Installation dun composant ..............................................................................................44
Figure 25: Paramtrage du composant install ..................................................................................44
Figure 26: Changer le thme ..............................................................................................................45
Figure 27: Lajout dun service ..........................................................................................................45
Figure 28: Lajout dun utilisateur .....................................................................................................46
Figure 29: Configuration des permissions des utilisateurs.................................................................46
Figure 30: Lajout dun sondage ........................................................................................................47

Figure 31: Grer blog .........................................................................................................................48
Figure 32: Ajout dun cours ...............................................................................................................48
Figure 33: Ajout dun devoir ..............................................................................................................49
Figure 34: Ajout dun vnement au calendrier partag ....................................................................49
Figure 35: Affichage dun vnement au calendrier ..........................................................................49
Figure 36: Communication Forum ...............................................................................................50
Figure 37: Grer le profil ...................................................................................................................51
Figure 38: Communication Chat ..................................................................................................51
Figure 39: Liste des cours ..................................................................................................................52
Figure 40: Tlchargement dun cours...............................................................................................52
Figure 41: Partage sur les mdias sociaux .........................................................................................52
Figure 42,43: Suivre la plateforme sur mdias sociaux .....................................................................52
Figure 45: Participation un sondage ................................................................................................53
Liste des tableaux

Tableau 1: Planning prvisionnel .........................................................................................................8
Tableau 2: Comparaison des solutions existantes ..............................................................................12
Tableau 3: Identification des cas dutilisation....................................................................................15
Tableau 4: Matriels de base ..............................................................................................................36
Tableau 5: Comparaison entre des CMS ............................................................................................37
Introduction gnrale
Introduction gnrale
Internet forme, lducation se transforme
Par Mario Asselin
LInternet a rvolutionn le monde des ordinateurs et des communications comme rien

dautre auparavant. En effet, elle est la fois une capacit de diffusion dans le monde entier, un
mcanisme de distribution de l'information et un moyen de collaboration et d'interaction entre les
individus et leurs ordinateurs, peu importe l'emplacement gographique.
Par ailleurs, lexplosion des mdias sociaux modifie profondment internet et ses usages.
S'il est courant pour des adultes d'utiliser titre personnel ou professionnel les mdias sociaux, il
en va autrement dans les milieux ducatifs, la formation continue ou professionnelle. Et pour
servir mieux encore lorganisation, elle se doit dtre la hauteur des ambitions quelle porte :
rapidit, flexibilit, efficacit et rentabilit. Pour y faire face, le systme traditionnel de
formation par son approche prsentielle, conditionn par lunit de temps et de lespace semble
tre insuffisant pour rpondre ce grand dfi do la ncessit dune nouvelle approche qui est le
social Learning.
Les tuteurs, nont plus le monopole de la transmission Lapprenant 2.0 ne se limite pas
utiliser Internet pour consulter des pages web ; sil a commenc par changer du courriel et des
messages textes, il exploite maintenant les possibilits quoffre le World Wide Web dans les
deux sens, consultation et diffusion.
Bien que lenseignement par internet (ou tl-enseignement ou e-Learning) souffre de
carences principalement lis l'absence relative de l'enseignant et donc la difficult
d'adaptation de l'enseignement au niveau et au comportement de l'apprenant, il constitue un des
moyens pdagogiques actuels et prometteurs.
Le social learning devrait venir complter loffre existante de formations classiques,
prsentiels et e-learning. Lun des problmes du e-learning est bien souvent, larrt en cours de
formation. Les apprenants ne vont pas au bout de leur apprentissage. En effet, seuls face leurs
crans, ils ne trouvent pas la motivation pour samliorer. Le social learning permet aux
Introduction gnrale
apprenants de discuter, dchanger propos de la formation et de progresser ensemble.
Limportant est donc de donner des outils pour lier les gens les uns aux autres afin quils se
parlent et sauto-forment.
Pour ce fait le Centre National dInformatique, CNI, a dcid dinformatiser la formation
quil offre aux personnels de ltat qui souhaitent bnficier du cours acclrs en informatique.
Il nous a confi la tche de concevoir et de dvelopper une plateforme Social Learning.
Dans ce contexte vient s'inscrire notre projet de fin d'tudes de licence en informatique
spcialit Systmes Informatique et Logiciel (SIL) l'Institut Suprieur de lInformatique (ISI).
Et cela constitue, une occasion pour appliquer ce que nous avons tudi au cours de notre
processus de formation et mettre en uvre nos connaissances dans les diffrentes phases de
dveloppement.
Le prsent rapport sarticule autour de quatre chapitres. Nous commencerons par le
chapitre Etude pralable et tat de l'art qui localise le contexte gnral du notre projet et met
laccent sur le champ dtude de notre application qui est lapprentissage social.
Le deuxime chapitre Analyse et spcification des besoins ddi ltude de lexistant ou
nous prsenterons une synthse des solutions existantes sur le march en discutant les avantages
et les inconvnients de chacune delles. Puis, nous formulerons les principales fonctionnalits de
la solution raliser.
A la lumire de ce chapitre, nous entamerons le troisime chapitre intitul Conception, dans
lequel nous prsenterons la notation de modlisation utilise ainsi que lensemble des
diagrammes conus.
Conclurons avec le quatrime chapitre Ralisation qui sera consacr ltude technique ou
nous dtaillerons notre environnement de travail suivis
dune
prsentation des diffrents
fonctionnalits de notre plateforme Social Learning travers des capture dcran.
Chapitre I
Etude pralable et tat de

lart
Chapitre I: Etude pralable et tat de lart
Introduction
Ltude pralable constitue une tape prliminaire pour la ralisation de notre plateforme. Tout
dabord, nous commenons par la prsentation de lorganisme daccueil. Ensuite, nous passons
la dfinition des objectifs atteindre, ainsi que notre champ dtude.
1. Prsentation de lorganisme daccueil

1.1 Prsentation gnrale du Centre National de lInformatique
(CNI)
Le CNI est un tablissement public caractre non administratif, dot de la personnalit civile et
de lautonomie financire.
Les principales missions du CNI sont:
Infogrance des systmes dinformation nationaux de ladministration
Mise en uvre et dploiement de le-administration
Fixation et proposition des mthodes et des normes dingnierie et techniques
Matrise douvrage dlgue
Assistance des utilisateurs
Ralisation dtudes : orientation, stratgie et mission daudit informatique
Formation dans le domaine de linformatique au profit des tablissements publics
Le CNI est un renfort au secteur priv dans le cadre du partenariat tenant compte des orientations
nationales [10].
1.2 Organigramme
Figure 1: Organigramme du CNI

4
2. Prsentation du projet
2.1 Description du projet
Le systme consiste mettre en place, sur le site web du CNI, une plateforme sociale Learning
pour le compte des personnels de ltat qui souhaitent bnficier du cours acclrs en
informatique chez le CNI.
2.2 Objectifs du projet

Dans un secteur o les contraintes de formation en prsentiel sont importantes (disponibilit, le
frais de dplacement, etc.), le concept de la formation distance offre des rponses
complmentaires et une plus grande flexibilit au apprenant qui pourra se former son rythme en
fonction de ses disponibilits.
Notre objectif consiste crer une plateforme du social Learning qui rpond au besoin du tuteur
et des apprenants la fois et de manire :
Favoriser une pdagogie socioconstructiviste (collaboration, activits, rflexion critique,

etc.),
Garantir plus de souplesse pour la planification des formations laide dune interface
ergonomique, lgre, efficace, compatible -sans ncessit d'un navigateur rcent- et
simple manipuler pour les diffrents utilisateurs,
Faciliter laccs aux ressources et services,
Offrir aux apprenants un espace dapprentissage individualis,
Faciliter le partage, la production, la communication et la collaboration distance,
Offrir un accs aux fonctionnalits ncessaires des rseaux sociaux et des services web
2.0.
3. Etat de lart
3.1 C'est quoi, une plate-forme d'apprentissage en ligne?
Une plateforme d'apprentissage en ligne, appele encore LMS (Learning Management System),
est un site web qui hberge le contenu didactique et facilite la gestion de l'apprentissage et la
mise en uvre de stratgies pdagogiques. On trouve aussi les appellations de Centre de
formation virtuel ou de Plate-forme e-learning (FOAD).
5

Une plateforme e-learning (ou LMS) est un produit driv des logiciels CMS (Content
Management System) mais prsente des fonctions diffrentes pour la pdagogie et
l'apprentissage [3].
3.2 E-learning
Le E-learning, ou formation en ligne, est une technique de formation reposant sur la mise
disposition de contenus pdagogiques via un support lectronique : Cd-rom, Internet, intranet,
extranet, etc.
Le E-learning dsigne les outils, les applications et lensemble des contenus mis disposition
dun stagiaire dans le but dune formation pdagogique. Longtemps rduites des supports cdrom, le E-learning a volu et utilise dornavant le web et diffrentes applications.
Contrairement ce que lon pourrait penser, la formation en ligne nest pas synonyme
disolement. Cette solution permet aussi de nombreuses possibilits dchange et dinteractivit
[7].
3.3 Blended Learning

Le Blended-learning (galement appel formation mixte) est un dispositif de formation alliant
diffrents modes de formation, afin doffrir lapprenant le moyen de formation le plus complet
du march.
Le mot Blended learning vient de langlais blend qui signifie mlange, et learning
signifie apprentissage.
Le Blended learning permet donc dassocier des cours danglais par tlphone, des cours
danglais online, des mails lessons, du mobile learning, des cours danglais particuliers en face-face et encore des cours danglais collectifs [8].
3.4 Web 2.0

Le Web 2.0 ne peut pas tre rsum une technologie ou une technique, c'est un ensemble de
bons procds qui suivent une volution logique du Web. C'est une notion (un concept) qui n'a
pas vraiment une dfinition mais plusieurs, ce terme a t invent par O'reilly dans son fameux
post what is Web 2.0 .

On peut rsumer le "concept" Web 2.0 en deux aspects : l'un qui est technique et l'autre qui est
plus li la communication et le partage :
Au niveau technique le Web 2.0 correspond ce que l'on peut appeler les interfaces
enrichies (Ajax, Flash 8, Ruby on Rails, etc.). Tous ces outils techniques, ont pour but de
faciliter la navigation et l'ergonomie
Au niveau communication cela correspond au partage et la diffusion dinformation

(blog, rss, utilisation dapi, portail communautaire, forum, folksonomie, wiki) mais
aussi au marketing viral [12]
Les notions fondamentales sont :
les interactions entre internautes (collaboration, partage, communaut, rseau)
l'interaction avec les contenus proposs en ligne (possibilit d'intervenir sur les contenus)
l'ouverture (possibilit facile et rapide d'entrer et de sortir des contenus)
la gratuit de la plupart des services
l'accessibilit (sites visibles sur les navigateurs standards, applications en ligne) [14]
3.5 Le social Learning (Lapprentissage social)

Le social Learning est un mode dapprentissage qui permet de partager, de construire, de
collaborer avec dautres distance via des outils collaboratifs (wiki, chat, forum, blog,) ou des
rseaux sociaux dentreprises [6].
Cest lvolution du blended Learning, ce dernier mlange la formation classique et le e-learning.
Il permet, par exemple, aux apprentis de poursuivre la discussion lorsquelle est termine. Mais,
pour une entreprise, le vritable avantage tient dans le bnfice. En effet, les collaborateurs bien
forms seront plus mme de proposer des solutions intelligentes et efficaces aux clients.
Daprs Frdric Domon directeur de lagence Social Learning Le social Learning peut tre
considr comme laccroissement des connaissances, des comptences et des comportements par
la connexion des autres, que ce soient des collaborateurs, des conseillers ou des experts via les
mdias lectroniques [9].
Le Social Learning permet de dvelopper les connaissances, les attitudes et les aptitudes par la
connexion aux autres (collgues, mentors ou experts) via les mdias numriques synchrones ou
asynchrones.

Lapprenant nest plus uniquement destinataire du savoir dispens par lenseignant mais il
devient acteur du dispositif denseignement. Il participe son propre apprentissage et collabore
avec lenseignant et les autres apprenants. Enfin, il partage son savoir et ses connaissances [6].
4. Planning
La cl principale de la russite dun projet est un bon planning. En effet, le planning aide bien
subdiviser le travail et sparer les taches raliser, il offre une meilleure estimation et gestion de
temps ncessaire pour chaque tache. De plus, il donne assez de visibilit permettant destimer
approximativement la date dachvement de chaque tche.
Dans notre projet, nous avons estim de raliser notre application dans une dure approximative
de trois mois. Le tableau ci-dessous montre le planning que nous avons adapt pour mener bien
notre ralisation des diffrentes parties du projet.
Semaine
Etape
Fvrier
1
Mars
4
Avril
4
Mai
4
Etude pralable
Conception
Ralisation
Test et validation
Rdaction du rapport
Tableau 1: Planning prvisionnel
Conclusion
A travers ce chapitre nous avons tent de prsenter de manire synthtique lactivit du CNI
ainsi que le cadre de notre projet.
Dans le chapitre qui suit, nous passerons lanalyse et le critique de lexistant afin de mieux
comprendre le comportement de notre projet et mieux assimiler ses exigences.
.
Chapitre II
Analyse
&
Spcification des besoins
Chapitre II: Analyse et spcification des besoins
Introduction
Ltape danalyse et de spcification des besoins joue un rle important dans le cycle de
dveloppement des systmes dinformations. Cette phase permet dclaircir au mieux les besoins
fonctionnels et non fonctionnels attendus du systme afin davoir une meilleure comprhension
du sujet.
1. Etude de lexistant
Lanalyse de lexistant comprend principalement trois parties qui sont la description de
lexistant, la critique de lexistant et la solution propose.
1.1 Description de lexistant

La formation continue au CNI se fait actuellement de faon traditionnelle: cours, apprenants et
tuteurs sur place.
Dans le but de rsoudre ces inconvnients plusieurs plateformes de formation en ligne se
subdivisent en plateformes propritaires et plateformes libres .
a) Plateformes propritaires :
DIDACTI: Une plateforme pdagogique o enseignants et lves viennent dposer des
contenus sous forme dactivits dapprentissages pour ensuite les partager puis crer
une interactivit [3].
WebCT: Une plate-forme dveloppe par
l'informaticien Murray W. Goldberg
l'Universit de Colombie-Britannique. la suite de recherche sur l'application des

technologies Web la pdagogie, Goldberg constate que la satisfaction et la
performance acadmique pourraient tre grandement rehausses par des systmes
fonds sur des pages Web. Il dveloppe la premire version de WebCT [3].
b) Plateformes libres :
Moodle: Une plateforme d'apprentissage en ligne (e-learning en anglais) sous licence
"open source" servant crer des communauts d'apprenants autour de contenus et
d'activits pdagogiques [3].
11

LUniversit Virtuelle de Tunis (UVT) dispose un Environnement de Travail
Numrique (ENT) accessible aux tudiants et aux enseignants tunisiens, cet
environnement est dispens sur la plateforme Moodle.
Chamilo : Une plateforme qui vous permet d'implmenter une institution ducative
virtuelle en quelques tapes simples, ou d'enrichir vos cours prsentiels grce un
portail web accessible partout, tout le temps [3].
1.2 Critique de lexistant

Le tableau ci-dessous rcapitule les avantages et les inconvnients de toutes les plateformes
traites.
Plateformes
Didacti
Avantages
- Rseau
social focalis web
2.0
Inconvnients
- Version gratuite rduite

- Encore
en construction,
pas
trs connue
WebCT
- Rpond
la demande, trs
stable, interface agrable
- Accs interdit au code source

- Donnes
contenues dans des
fichiers
textes
(moins
performant quune base de

donnes)
Moodle
- Logiciel libre et gratuit

- Intgration
possible dans un
- Interface
moins
conviviale
quun blog
ENT
Chamilo
- Une
version gnrique qui
- Bien
qu'intuitive et agrable,
comprend dj de nombreux
l'interface de Chamilo n'est
outils intgrs
pas non plus mtaphorique.
- Une inspiration web 2.0 avec

des outils sociaux intgrs
Les
fonctionnalits
et
l'ergonomie sont globalement

les mmes que sur Moodle ou
toute
autre
plateforme
12

textuelle
Tableau 2: Comparaison des solutions existantes
Comme le montre le tableau ci-dessus, les solutions existantes des formations distance sur le
march proposent diffrents fonctionnalits de base (Chat, sharing, etc.). Cependant, elles
possdent des inconvnients.
1.3 La solution propose

Ltude lexistant nous a permis de dgager plusieurs anomalies que nous avons dtailles dans
la section prcdente. Pour faire recours ces anomalies nous proposons de concevoir et
dimplmenter une plateforme social-Learning pour le compte des personnels de l'tat qui
souhaitent bnficier du cours acclrs en informatique chez le CNI.
2. Spcification des exigences

Dans cette section nous identifions une liste dexigences fonctionnelles et non fonctionnelles du
systme concevoir. Certaines exigences sont ajoutes pour clarifier davantage les besoins des
utilisateurs.
2.1 Etude des besoins fonctionnels

Les besoins fonctionnels reprsentent les attentes de chaque acteur de la future plate-forme.
Toute solution conceptuelle doit satisfaire, pralablement, des besoins fonctionnels afin de
dlimiter le primtre fonctionnel de lapplication et surveiller la traabilit des besoins lors de la
phase de dveloppement.
La prsente plateforme doit satisfaire les besoins fonctionnels suivants :
La gestion des utilisateurs,
La gestion des cours,
La gestion des devoirs,
La gestion des tests,
La gestion des notes,
La gestion des actualits,
13

La gestion des ressources,
La gestion de la communication entre les utilisateurs,
La gestion des sondages,
La gestion des blogs,
La gestion des wikis,
La gestion des services web.
2.2 Etude des besoins non fonctionnels

Un besoin non fonctionnel est une restriction ou une contrainte qui pse sur un service du
systme, telle les contraintes lies lenvironnement et limplmentation et les exigences en
matire de performances.
Les besoins non fonctionnels :
Le code doit tre clair pour permettre des futures volutions ou amliorations,
La plateforme doit fournir un accs rapide aux informations, et doit faire la mise jour en
temps rel,
La plateforme doit tre portable, extensible, rutilisable et fiable,
La plateforme offre une interface conviviale et facile utiliser,
La plateforme doit garantir la confidentialit, lintgrit et la cohrence des donnes.
2.3 Les acteurs systme

Un acteur reprsente labstraction dun rle jou par des entits externes (utilisateur, dispositif
matriel ou autre systme) qui interagissent directement avec le systme tudi.
Les acteurs interagissant avec notre systme sont :
Administrateur : cest le responsable de ladministration du site de tlformation.
Tuteur : anime des formations dans le salon de formation.
Apprenant : assiste une formation dans le salon de formation.
2.4 Identification des cas d'utilisation

Un cas d'utilisation dfinit une manire d'utiliser le systme et permet d'en dcrire les exigences
fonctionnelles. Chaque cas d'utilisation contient un ou plusieurs scnarios qui dfinissent
comment le systme devrait interagir avec les utilisateurs (appels acteurs) pour atteindre un but
14

ou une fonction spcifique d'un travail. Un acteur d'un cas d'utilisation peut tre un humain ou un
autre systme externe celui que l'on tente de dfinir. Il permet d'adopter le langage de
l'utilisateur final ou de l'expert du domaine. Chaque cas d'utilisation est reprsent au sein d'un
diagramme de cas d'utilisation.
Cas dutilisation
Acteurs
Grer son profil (crer compte, indiquer son propre fuseau horaire,
ajouter photo, choisir la langue de l'interface, mettre jour ses
informations, etc.)
Administrateur
Sauthentifier
Grer la plate-forme(les thmes, les composants, les services web,

etc.)
Grer les utilisateurs (Ajouter, supprimer, grer les droits daccs,

etc.)
Grer les ressources (Ajouter, supprimer, etc.)
Grer les sondages (crer, consulter, supprimer, etc.)
Grer les blogs (crer, partager, etc.)
Grer les wikis (rdiger, distribuer, etc.)
informations, etc.)
Sauthentifier
Grer les cours (ajouter, modifier, grer leurs droits daccs, etc.)
Grer ses apprenants (dsigner manuellement ses apprenants,
Tuteur
dsinscrire manuellement des apprenants de ses cours, etc.)
Se communiquer (tchatcher avec les apprenants au cours dune

formation, participer des forums, etc.)
Grer les notes (dfinir son propre barme pour les notes, etc.)
Grer les sondages (crer, consulter, supprimer, etc.)
Participer un sondage
15
Grer les tests (dfinir une base de donne de question, supprimer,

modifier, consulter, etc.)
Grer les ressources (dposer, modifier, grer les droits daccs,

etc.)
Grer les wikis (crer, partager, etc.)
Grer les blogs (crer, partager, etc.)
Se bnficier des principaux services web
informations, etc.)
Sauthentifier
Se communiquer (tchatcher avec les apprenants au cours dune
Apprenant
formation, participer des forums, etc.)
Se bnficier des principaux services web
Participer un sondage
Passer des tests
Passer des devoirs
Grer les wiki (rdiger, distribuer, etc.)
Grer les ressources sur le serveur (dposer, modifier, grer les

droits daccs, etc.)
Tlcharger un cours
Tableau 3: Identification des cas dutilisation
2.5 Diagramme globale des cas dutilisation

Une fois les diffrents cas dutilisation identifis, nous pouvons laborer le diagramme des cas
dutilisation qui met en relation les acteurs et les cas dutilisation quils utilisent.
16
Figure 2: Diagramme globale des cas dutilisation
3. Identification des risques

Afin dassurer le bon fonctionnement du projet, il faut prendre en considration un certain
nombre de contraintes :
Non matrise des outils de dveloppement : le fait de ne pas matriser quelques outils de
dveloppement nous amne passer un temps important pour apprendre et matriser ces
outils.
Risque de crer une architecture inadapte
17
Conclusion
Dans ce chapitre nous avons entam la phase danalyse et de spcification des besoins.
En effet, ltude de lexistant nous a permis de prparer une tude conceptuelle de la solution
propose mettre en place.
18
Chapitre III
Conception
Chapitre III: Conception
Introduction
Afin datteindre les objectifs de notre projet, et aprs lanalyse et la spcification des besoins de
notre future systme, nous nous focalisons dans ce chapitre la conception.
1. Choix de la mthodologie de conception :

Dans la cadre de notre projet, nous avons opt pour le langage UML comme un langage de
conception.
UML (Unified Modeling Language, traduisez langage de modlisation objet unifi ) est n de
la fusion des trois mthodes qui ont le plus influenc la modlisation objet au milieu des annes
90 : OMT, Booch et OOSE [15].
2. Raffinement des cas dutilisation

Dans le but de mieux comprendre notre systme et les interactions avec les utilisateurs, dans
cette partie nous allons dtailler les scenarios de principaux cas dutilisation
2.1. Cas dutilisation Sauthentifier
Figure 3: Cas dutilisation Sauthentifier

CU1: Sauthentifier
Rsum: Ce CU1 permet lacteur daccder son espace personnel
Acteurs: administrateur, tuteur, apprenant
Pr-condition: Lacteur doit tre un membre enregistr dans la plateforme
Post-Condition: le cas dmarre aprs le point 02 de lenchainement nominal.
Scnario nominal:
DEBUT
20

01 : Le systme affiche un formulaire de connexion lacteur.
02 : lacteur saisit son nom ainsi que son mot de passe.
03: Le systme vrifie les paramtres.
04 : Le systme ouvre l'espace de travail correspondant au profil.
FIN
Scenario alternative :
Le login ou le mot de passe est incorrect: ce scnario commence au point 03 du scnario
nominal.
01: Le systme informe lacteur que les donnes saisies sont errones et lui demande sil veut
changer son mot de passe.
Diagramme de squence :
Figure 4: Diagramme de squence Authentification
21
2.2 Cas dutilisation Grer le profil
Figure 5: Cas dutilisation Grer le profil

CU2: Grer le profil
Rsum: Ce CU2 permet lacteur de mettre jour ses informations.
Pr-condition: Lacteur doit tre un membre identifi.
Scnario nominal:
DEBUT
01 : le systme affiche le profil actuel de lacteur.
02 : lacteur met jour ses informations.
03 : le systme vrifie la validit des informations saisies.
04 : le systme enregistre ces informations dans la base de donnes.
05 : le systme notifie lacteur du bon droulement de mise jour de son profil.
FIN
les informations sont manquantes ou incorrectes: ce scnario commence au point 03 du
scnario nominal.
01 : Le systme informe lacteur que les donnes saisies sont errones, garde les informations
saisies avant et le scnario reprend au point 02 du scnario nominal.
22
2.3 Cas dutilisation Grer blog
Figure 6: Cas dutilisation Grer blog
CU3 : Grer blog

Rsum: Ce CU3 permet lacteur de crer, supprimer, modifier ou commenter son blog.
Acteurs: administrateur, tuteur
Pr-condition: Lacteur doit tre connect.
2.4 Cas dutilisation Grer wiki
Figure 7: Cas dutilisation Grer wiki

23

CU4 : Grer wiki
Rsum: Ce CU4 permet lacteur de crer, supprimer, modifier ou commenter un article.
2.5 Cas dutilisation Grer plateforme
Figure 8: Cas dutilisation Grer la plateforme

CU5: Grer la plateforme
Rsum: Ce CU5 permet ladministrateur de modifier la composition interne de la plateforme.
Acteurs: administrateur
Scnario nominal:
DEBUT
01 : le systme affiche ltat actuel de la plateforme.
02 : lacteur met jour la plateforme.
03 : le systme vrifie la validit des mis jour.
24

04 : le systme enregistre les mis jours dans la base de donnes.
05 : le systme notifie lacteur du bon droulement de mise jour de la plateforme.
FIN
scnario nominal.
01: Le systme informe lacteur que les mis jour sont errones, garde ltat de la plateforme
2.6 Cas dutilisation Grer les ressources
Figure 9: Cas dutilisation Grer les ressources
CU6: Grer les ressources

Rsum: Ce CU6 permet aux acteurs darchiver des fichiers textuels, visuels, sonores
et audio-visuels sur la plateforme.
25
2.7 Cas dutilisation Grer les sondages
Figure 10: Cas dutilisation Grer les sondages

CU7: Grer les sondages
Rsum: Ce CU7 permet de crer, modifier et supprimer des sondages.
2.8 Cas dutilisation Grer les utilisateurs
Figure 11: Cas dutilisation Grer les utilisateurs

CU8: Grer les utilisateurs
Rsum: Ce CU8 permet lacteur dajouter et de supprimer un utilisateur.
Post-Condition: Le cas dmarre aprs le point 02 de lenchainement nominal.
Scnario nominal dajout dun utilisateur:
26

DEBUT
01: Le systme affiche un formulaire dinscription lacteur.
02: Lacteur saisit les informations du nouvel utilisateur et lui affecter un rle.
03 : Le systme vrifie la validit des informations saisies.
04: Le systme enregistre ces informations dans la base de donnes.
05: Le systme notifie lacteur du bon droulement de linscription.
FIN
scnario nominal.
01: Le systme informe lacteur que les donnes saisies sont errones et le scnario reprend au
point 02 du scnario nominal.
Diagramme de squence :
Figure 12: Diagramme de squence Ajout dun utilisateur
27
2.9 Cas dutilisation Grer les tests
Figure 13: Cas dutilisation Grer les tests

CU9: Grer les tests
Rsum: Ce CU9 permet lacteur dajouter, dannuler et modifier un test.
Acteurs: tuteur
Scnario nominal dajout dun test:
DEBUT
01: Lacteur saisit les questions en indiquant la vraie rponse et en prcisant un barme.
02: Lacteur configure les droits daccs au test.
03: Lacteur enregistre le test dans la base de donnes.
04: Lacteur ajoute le test au calendrier partage et notifie les apprenants de lajout du test.
FIN
28
2.10 Cas dutilisation Grer les devoirs
Figure 14: Cas dutilisation Grer les devoirs
2.11 Cas dutilisation Se communiquer
Figure 15: Cas dutilisation Se communiquer

29
2.12 Cas dutilisation Grer les cours
Figure 16: Cas dutilisation Grer les cours
CU13: Grer les cours

Rsum: Ce CU13 permet lacteur dajouter, dannuler et modifier un cours.
Acteurs: tuteur
Scnario nominal dajout dun cours:
DEBUT
01: Le systme affiche deux mthodes dajout dun cours.
<mthode1: Crer un cours>

02: Lacteur saisit le contenu du cours.
<mthode2: tlverser un cours>

02: Lacteur tlverse le cours.
03: Lacteur configure les droits daccs son cour.
04 : Lacteur enregistre le cours dans la base de donnes de la plateforme.
FIN
30
3. Modlisation conceptuelle des donnes

La modlisation conceptuelle des donnes donne une vue statique du systme permettant de
dcrire le systme dinformation laide des concepts proposs par le modle UML.
3.1 Dictionnaire des donnes

Le dictionnaire des donnes (voir annexe A) reprsente la liste des attributs composants toutes
les classes formants notre systme ainsi que leurs descriptions, leurs tailles et leurs types.
3.2 Diagramme de classes

La figure ci-dessous reprsente le diagramme de classes qui contient toutes les informations
telles que les classes, les mthodes, les associations et les proprits.
Figure 17: Diagramme de classes

31
4. Diagrammes dactivits
Le diagramme dactivits permet de mettre laccent sur les traitements. Il est donc
particulirement adapt la modlisation du cheminement de flots de contrle et de flots de
donnes. Il permet ainsi de reprsenter graphiquement le comportement dune mthode ou le
droulement dun cas dutilisation.
4.1 Diagramme dactivits Grer les utilisateurs
Figure 18: Diagramme dactivit Grer les utilisateurs
La figure ci-dessus illustre le droulement squentiel de la gestion des utilisateurs accomplis par
un administrateur ou bien un tuteur.
Aprs avoir sauthentifi, ces derniers peuvent ajouter ou supprimer un utilisateur.
Pour lajout dun utilisateur, le systme doit vrifier la validation des informations saisies. Au
cas o une information nest pas valide, le systme raffiche linterface dajout dun utilisateur.
32
4.2 Diagramme dactivits Grer les cours
Figure 19: Diagramme dactivits Grer les cours
La figure ci-dessus illustre le droulement squentiel de la gestion des cours accomplis par un
tuteur.
Aprs avoir sauthentifi, un tuteur peut ajouter, modifier ou supprimer un cours. Au cas dajout
ou de modification du cours, le tuteur doit ajouter cet vnement au calendrier partag pour
informer les apprenants du changement.
33
4.3 Diagramme dactivits Grer les devoirs
Figure 20: Diagramme dactivits Grer les devoirs

La figure ci-dessus illustre le droulement squentiel de la gestion des devoirs accomplis par un
tuteur.
Aprs lauthentification, un tuteur peut ajouter ou annuler un devoir. Au cas dajout, il faut lui
indiquer un dlai de remise, lui affecter un barme et lui configurer les droits daccs.
Finalement, et cest le cas dannulation aussi, le tuteur doit ajouter lvnement au calendrier
partag pour informer lapprenant du changement.
Conclusion
Dans ce chapitre, nous avons prsent une vue conceptuelle du systme raliser. Ainsi, on a pu
dfinir le diagramme de classe, les diagrammes dtaills des cas dutilisation de notre projet,
suivis de quelques diagrammes de squences et dactivits. Nous pouvons entamer la phase
suivante qui est la phase de ralisation de la solution.
34
Chapitre IV
Ralisation
Chapitre IV: Ralisation
Introduction
Aprs avoir labor la conception de notre application, nous abordons dans ce chapitre le dernier
volet de ce rapport, qui a pour objectif d'exposer la phase de ralisation.
Nous menons tout dabord une tude technique o nous dcrivons les ressources logicielles et
matrielles utilises dans le dveloppement de notre projet. Puis nous dtaillons larchitecture,
aussi nous prsentons quelques interfaces ralises pour illustrer le fonctionnement de quelques
activits du systme.
1. Etude technique
L'tude technique est une phase d'adaptation de conception l'architecture technique. Cette
tude, qui suit l'tude dtaille, constitue le complment de spcification informatique ncessaire
pour assurer la ralisation du futur systme.
1.1 Matriels de base

Le dveloppement de lapplication est ralis via deux ordinateurs portables ayant les
caractristiques suivantes :
Caractristique
DELL Inspiron N5010
Marque
Dell
Processeur
Intel Core i3 CPU
RAM
3 Go
Disque dur
300 Go
Systme dexploitation
Microsoft Windows 7 Edition Intgrale 32

bits
Tableau 4: Matriels de base
1.2 Choix du CMS (Content Management System)

Nous avons fait une analyse comparative parmi trois "leaders" actuels du march et ceux les plus
utilis en excluant Wordpress volontairement qui lui est destin des sites internet de type blog
[2].
36
CMS
Installation
Trs
Typo3
Joomla
Drupal
simple, Trs simple, installation Plusieurs
packages
installation en ligne trs en ligne trs intuitive
installer, ncessite des
intuitive
connaissances en gestion
de serveurs
Cration de
Il
faut
crer
dveloppement modules.
des Il
faut
crer
des Il
composants.
faut
crer
des
extensions.
sur mesure
Intgration
dune mise en
Systme de mise en Systme de mise en Langage de mise en page

page
mlangeant page mlangeant HTML spcifique bas sur des
page sur
HTML et PHP
mesure
Lintgrateur doit avoir Lintgrateur doit avoir

certaines
notions
PHP.
marqueurs personnaliss.
de certaines
notions
de
PHP.
Gestion
Oui
multisite
(mutualisation
Gestion
et PHP
en
natif Via
une
extension Oui
en
natif.
du payante JMS multi-sites (mutualisation du noyau)
noyau)
(49.99 )
Oui
Oui
Oui
multilingue
Tableau 5: Comparaison entre des CMS
Le tableau ci-dessus montre quil existe des CMS qui permettent de dvelopper des applications
web, les plus clbres parmi eux: Drupal, Joomla et Typo3, chaque technologies parmi les trois
possde des avantages bien que des inconvnients.
On a opt pour le dveloppement de notre systme Drupal comme CMS vu quil est bien plus
complet que Joomla et Typo3 ; il permet la gestion multisite gratuite (inconvnient pour Joomla)
ainsi quune trs simple installation (inconvnient pour Typo3 quil ncessite des connaissances
en gestion du serveur).
37
1.3 Outils de dveloppement

Les principaux outils de dveloppements utiliss pour llaboration de notre application sont
prsents comme suit :
BITNAMI
Bitnami est une solution simple et conviviale pour dployer
facilement vos applications web sans casse-tte.
En fait, Bitnami est un kit complet, comprenant l'application,
une base de donnes MySQL et le serveur web Apache pour
installer votre structure web clef en main.
XAMPP v3.2.1
XAMPP est un ensemble de logiciels permettant de mettre en place
facilement
un serveur
Web
confidentiel,
un serveur
FTP et
un serveur de messagerie lectronique. Il s'agit d'une distribution

de logiciels libres (X Apache MySQL Perl PHP) offrant une bonne
souplesse d'utilisation, rpute pour son installation simple et rapide.
Notre objectif avec Bitnami est de rendre les logiciels open source
facile installer et grer sur toutes les plateformes.
Nous avons tabli un partenariat avec Apache Friends au port de la bibliothque Bitnami
d'applications XAMPP, fournissant un moyen simple pour installer vos applications
prfres, y compris Drupal, Joomla, WordPress et beaucoup plus.
Cette distribution se chargera donc dinstaller lensemble des outils dont vous pourriez
avoir besoin lors de la cration dun site web. Plus de dizaines dutilitaires sont intgrs,
comme MySQL, PHP, Tomcat ou encore phpMyAdmin. Il est distribu avec diffrentes
bibliothques logiciels qui largissent la palette des services de faon notable : OpenSSL,
Expat (parseur XML), PNG, etc. [5]
38
Drupal 7.26
Drupal est un CMS (Content Management System) ou SGC
(Systme de Gestion de Contenu) utilis dans le monde entier grce
aux nombreux avantages qu'il offre lors du dveloppement ou de la
gestion d'un site internet. Sa caractristique principale est son
organisation modulaire. Bitnami Drupal est une version de ce
systme de gestion de contenu populaire.
Malgr sa popularit croissante, Drupal a un processus d'installation quelque peu avanc
d'une manire qui exclut certains utilisateurs expriment pour grer des serveurs et des
bases de donnes. Cest pourquoi il est conseill dutiliser Bitnami Drupal car ce pack facilite
grandement ce processus.
Binami Drupal ralise les configurations ncessaires sur la base de donnes de MySQL et sur
le serveur Apache. Le tout d'une manire compltement automatise, l'utilisateur n'a besoin
de que slectionner quelques options simples [17].
Photoshop cs6
Photoshop CC est au cur de la quasi-totalit des projets de
cration numrique. Lapplication de retouche dimages la plus
performante au monde
Vous permet damliorer, de retoucher et de manipuler vos clichs
et autres images comme bon vous semble [4].
Nous avons utilis Photoshop pour prparer une maquette qui
reprsente notre future interface (voir annexe B).
Star UML
StarUML est diteur graphique trs complet pour les programmeurs
pour concevoir des diagrammes UML, ainsi il permettra le design
des diagrammes de classes, composants, objets, paquets, structures,
modules, activits, tats, squences, communications, interactions,
temps, etc [18].
39
1.4 Langages de dveloppement

Les principaux langages de dveloppements utiliss pour llaboration de notre application sont
prsents comme suit :
PHP Version 5.5.9

PHP (HyperText Preprocessor) est un langage de programmation
qui sintgre dans vos pages HTML. Il permet entre autres de
rendre automatiques des tches rptitives, notamment grce la
communication avec une base de donnes (utilisation la plus
courante de PHP) [16].
CSS3
Littralement Cascading Style Sheets (feuilles de style en
cascade), CSS est un langage dclaratif simple pour mettre en
forme des pages HTML ou des documents XML. Le langage XSS
permet de prciser les caractristiques visuelles et sonores de
prsentation dune page web : les polices de caractres, les marges
et bordures, les couleurs, le positionnement des diffrents
lments, etc [13].
HTML 5
Le HyperText Mark-up Language HTML est un langage dit de
marquage (de structuration ou de balisage) dont le rle est de
formaliser lcriture dun document avec des balises de formatage Les
balises permettant dindiquer la faon dont doit tre prsent le
document et les liens quil tablit avec dautres documents [11].
2. Architecture gnrale de l'application

Le systme se compose dun ou plusieurs ordinateurs reli linternet. Larchitecture gnrale
de la plateforme permet de donner une vision de haut niveau du systme.
40

Lapplication ralise sera fonde sur larchitecture 3 tiers.
Figure 21 : Architecture 3-tiers

Le deux premiers tiers seront constitus l'aide de la suite XAMPP qui est compose:
du moteur de base de donnes mySQL,
du serveur Web Apache,
du prprocesseur PHP,
de l'outil d'administration phpMyAdmin.
Le troisime tiers, le client, sera un navigateur standard (Firefox, Chrome, IE, etc.):
recevant des pages HTML,
excutant des feuilles de style (CSS),
excutant des scripts JavasSript.
Dans la ralisation de notre projet, nous avons opt pour une architecture MVC (Modle, Vue,
Contrleur) afin de garantir une assurance de la maintenabilit, la modularit de lapplication et
la rapidit de dveloppement.
Figure 22 : Architecture MVC

41

Ce modle de dveloppement distingue 3 fonctionnalits :
a) La vue (V)
Elle reprsente ce qui est expos l'utilisateur, en gnral il s'agit de HTML statique ou
gnr par du PHP ; il y a deux sortes de vue :
Les pages d'information navigables grce des liens
Les formulaires de saisies d'informations; ces formulaires peuvent tre prsentes

plusieurs reprises pour confirmation ou signalement d'erreurs.
b) Le contrleur(C)
Ce sont les contrleurs qui vont tre l'coute des requtes de l'utilisateur et fournir ainsi
la vue externe correspondante. Pour cela, il faudra tout moment connatre l'tat de
l'application c'est dire le contexte de la demande : "la page demande fait suite
quelle action prcise de l'utilisateur?" C'est au contrleur de connatre l'tat applicatif en
testant une variable qui sera nomme $action, provenant d'une requte POST ou GET.
c) Le modle (M)
C'est la couche (bibliothque de fonctions ou de classes) qui accde la base de donnes.
3. Prsentation des interfaces

Aprs les phases dtude de lexistant, la conception et la modlisation fonctionnelle et
organisationnelle nous avons dvelopp les interfaces de notre application.
Nous nous proposons dans cette section de prsenter des scnarios dutilisation illustrs par des
interfaces graphiques relatives aux diffrents acteurs de notre plateforme.
42
Figure 23 : Page daccueil

partir de cette premire interface, un utilisateur (administrateur, tuteur et apprenant) pourra se
connecter. Il suffit dentrer un login et un mot de passe et cliquer sur le bouton log in pour
ouvrir sa session.
3.1 Scnario Administrateur

Soit le scnario suivant :
1) Ajouter un composant la plateforme et le configure.
43

2) Changer le thme de la plateforme.
3) Ajouter un service web la plateforme.
4) Ajouter un utilisateur.
5) Configurer les permissions des utilisateurs.
6) Ajouter un sondage.
Figure 24 : Installation dun composant

Cette interface permet ladministrateur dinstaller des composants (modules, thmes) dans la
plateforme.
Figure 25 : Paramtrage du composant install

Ces nouveaux composants doivent tre paramtrs selon les besoins de ladministrateur.
Cette interface montre les liens qui lui permettent de le faire partir de la liste des modules.
44
Figure 26 : Changer le thme

Seul ladministrateur peut changer le thme de la plateforme. Cette action peut se faire partir de
cette interface.
Le lien Set default permet ladministrateur de changer le thme en mettant un autre le
thme par dfaut de la plateforme.
Figure 27 : Lajout dun service

Ladministrateur est le seul utilisateur qui peut grer la plateforme, du coup il ajoute, modifie et
supprime des services web de la plateforme.
Linterface ci-dessus permet ladministrateur de saisir les coordonnes du service web et les
enregistre dans la plateforme.
45
Figure 28 : Lajout dun utilisateur

Ladministrateur et les utilisateurs qui ont le rle tuteur sont les responsables dajout ou de
suppression des utilisateurs de la plateforme. Sauf quun tuteur ne peut ajouter ou supprimer
quun utilisateur de rle apprenant.
Un simple visiteur de la plateforme ne peut pas sinscrire distance aux formations organises
par le CNI, il est recommand de visiter le local du centre.
Linterface ci-dessus permet lutilisateur de remplir les coordonnes du nouvel utilisateur. Si
les donnes ne sont pas valides, un message derreur va tre affich.
Figure 29: Configuration des permissions des utilisateurs

46

Cette interface permet de configurer les droits daccs des utilisateurs selon leur rle aux divers
modules de la plateforme.
Figure 30: Lajout dun sondage

La figure ci-dessus schmatise la structure de linterface dajout dun sondage.
3.2 Tuteur
1) Ajouter un article son blog.
2) Ajouter un cours.
3) Ajouter un devoir.
4) Ajouter un vnement marquant lajout dun devoir au calendrier partag.
5) Discuter avec un apprenant via le module forum.
47
Figure 31: Grer blog

Pour quun tuteur ajoute un article son blog, il suffit de faire un simple clic sur le lien du page
blog dans la partie Navigation et, du coup, son blog personnel saffiche.
Un lien permettant dajouter le nouvel article est au-dessus des articles publis par le tuteur.
Figure 32: Ajout dun cours

48

Cette interface permet au tuteur dajouter un cours soit en le tlversant, soit en le crant laide
de lditeur WYSIWYG intgr dans la plateforme.
Figure 33: Ajout dun devoir
Figure 34: Ajout dun vnement au

calendrier partag
La premire interface permet au tuteur dajouter un devoir form de vrai ou faux questions.
Pour une meilleure organisation, aprs avoir cr le devoir, le tuteur partage cet vnement avec
les apprenants en le partageant au calendrier partag comme il le montre la deuxime interface.
Figure 35: Affichage dun vnement au calendrier
49

Linterface ci-dessous montre comment un tuteur se communique avec les apprenants via le
forum.
Figure 36: Communication Forum
3.3 Apprenant
1) Grer son profil.
2) Communiquer avec son tuteur via chat.
3) Consulter la liste des cours.
4) Partager un article du blog sur les mdias sociaux.
5) Suivre Social Learning sur les mdias sociaux.
6) Participer un sondage.
50
Figure 37: Grer le profil

Linterface ci-dessus permet lutilisateur de grer son profil (nom, mot de passe, photo, langue,
etc.).
Figure 38: Communication Chat

Linterface ci-dessus permet aux utilisateurs de se communiquer via loutil Chat .
51
Figure 39: Liste des cours
Figure 40: Tlchargement dun cours
Notre application permet aux apprenants de consulter la liste des cours, lire un cours directement
ou le tlcharger sur leurs machines.
Figure 41: Partage sur les mdias sociaux

Linterface ci-dessus permet aux utilisateurs de partager sur les mdias sociaux ou envoyer par
courriel un article (blog, wiki).
Figure 42, 43: Suivre la plateforme sur mdias sociaux
52

Les utilisateurs peuvent suivre la plateforme Social Learning sur ses pages sur les mdias
sociaux (Facebook, Twitter, Youtube, etc.).
Figure 44: Participation un sondage

La figure ci-dessus schmatise linterface qui permet aux utilisateurs de voter dans un sondage.
4. Apports
Ce projet de fin dtudes nous a permis de se familiariser avec un certain nombre de concepts
tout en se basant sur nos connaissances acquises au cours de notre formation au sein de notre
institut.
Ainsi, le fait davoir travaill avec nos encadreurs, les personnels de la socit nous a mis sur la
voie professionnelle.
Notre projet de fin dtude a t une occasion, pour dvelopper et exercer nos capacits
dobservation, danalyse, de conception, de dveloppement et de rdaction.
4.1 Apports au niveau des connaissances techniques

Ce projet de fin dtude nous a permis de :
Mettre en uvre les notions et les connaissances acquises au sein des modules
Mthodologie de conception des bases de donnes.
Manipuler les logiciels XAMPP, Drupal et Photoshop au cours du dveloppement de

lapplication.
Amliorer nos connaissances thoriques concernant la communication client/serveur.
Etudier les architectures multicouches et raliser limportance du travail sur ce type

dapplication dans le monde de programmation.
Apprendre grer un projet.
53
4.2 Apports au niveau de la conception et du dveloppement

Au niveau de la conception et du dveloppement, cette tude nous a permis de :
Mener une conception oriente objet reprsente avec le langage UML
Apprendre maitriser la mthodologie de conception et de dveloppement des

applications clientes.
Matriser les tapes de dveloppement et de conception dune application Web.
Conclusion
Dans ce chapitre, nous avons pu prsenter lenvironnement et le processus de dveloppement.
Nous avons expos ainsi le rsultat de dveloppement laide des aperus cran. Nous avons
cltur par une validation du travail ralis.
54
Conclusion et perspectives
Plus couramment dsigne par l'anglicisme "social learning", lapprentissage social est
prsente aujourd'hui comme personnalise et flexible, permettant un apprentissage
complmentaire et individualis, se librant des contraintes de temps, de lieu, de modalit
d'apprentissage et de ressources humaines.
Dans ce cadre, sinstalle notre projet qui porte sur la ralisation et la conception d une
plateforme social Learning pour le compte des personnels de ltat qui souhaitent se bnficier
du cours acclrs en informatique chez le CNI.
Pendant ces trois mois de stage de fin dtudes, nous avons appris la recherche des
informations et en faire une synthse, notamment pour ce rapport, ce qui nous a permis de
progresser rapidement dans lapprentissage dune technologie que nous ne connaissons pas.
Sur le plan humain, ce projet a t une vritable occasion de vivre de prs lexprience du
travail au sein dune socit, qui exige lintgration dans un groupe de travail. Ce qui nous a
permis damliorer nos capacits de communication et de nous adapter la vie professionnelle.
Nous avons fait de mon mieux pour bien laisser une bonne impression sur notre discipline,
nos qualits et nos comptences techniques vis vis du staff du CNI et de prsenter un travail
la hauteur de la formation qui nous avons eu au sein de l'ISI.
Pour aboutir ce but, nous avons procd en trois principales tapes. Nous avons
commenc par une tude des besoins. Nous avons prsent les besoins fonctionnels et non
fonctionnels, ainsi quun diagramme global des cas dutilisation. Nous avons pass par la suite
ltude conceptuelle et organisationnelle. Nous avons modlis laspect dynamique de notre
systme laide des diagrammes de squences et dautres dactivits. Laspect statique en
utilisant le diagramme de classes. Finalement, nous avons prsent l'architecture gnrale de
l'application et nous avons dploy dfrentes interfaces graphiques de la solution que nous
avons implment.
Les objectifs du projet ont t achevs terme. En effet, les fonctionnalits mentionnes
dans le cahier des charges ont t implmentes et sont fonctionnels. Lamlioration de notre
55
plateforme pourrait se rapporter lajout dautres fonctionnalits comme les Confrences audio
et vido en temps rel.
56
Bibliographie
Bibliographie
[1] Drupal for Education and E-Learning , crit par James G.Robertson et Bill Fitzgerald
http://www.it-ebooks.info/book/2945/
[2] Comparatif CMS , crit par M.Erwan Mollard
http://www.access-dev.com/?s=CMS
[3] Quelles normes appliques pour le meilleur choix de la plate-forme de-learning? , crit
par Nguyen Ngoc Luu Ly directrice adjointe du Dpartement de Langue et de Civilisation
franaises | cole Suprieure de Langues trangres | Universit Nationale de Hano
http://tapchi.vnu.edu.vn/Duc_Thien/so4/B%C3%A0i%202.%20Nguy%20n%20Ng%20c%20Lu
u%20Ly.pdf
57
Webographie
Webographie
[4] Photoshop CC , ralis par Adobe, visit le 17/03/2014
http://www.adobe.com/fr/products/photoshop.html
[5] Bitnami for XAMPP , crit par Bitnami, visit le 15/03/2014
https://bitnami.com/stack/xampp
[6] Notre approche E-Learning , crit par Cegos, visit le 09/02/2014
http://www.elearning-cegos.fr/notre-approche-e-learning/social-learning/
[7] Lactualit de la formation distance | E-Learning, crit par Christina BORK, visit le
08/02/2014
http://www.elearning-actu.org/e-learning_definition/
[8] Lactualit de la formation distance | Blended Learning, crit par Christina BORK,
visit le 08/02/2014
http://www.elearning-actu.org/blended_learning_definition/
[9] Lactualit de la formation distance | Social Learning, crit par Christina BORK, visit
le 08/02/2014
http://www.elearning-actu.org/le-social-learning/
[10] Prsentation du Centre National dInformatique , crit par CNI, visit le 18/02/2014
http://www.cni.nat.tn/FR/SCRIPT/missions.asp/
[11] HTML5 , crit par Comment a marche, visit le 17/03/2014
http://www.commentcamarche.net/contents/498-html-langage
[12] Un terme barbare pour expliquer lvolution actuelle dInternet , visit le 09/02/2014
https://sites.google.com/site/leweb20/
58
Webographie
[13] CSS , crit par Julien VAUBOURG, visit le 17/03/2014
http://www.jsand.net/definition_css.wju
[14] Les principes gnraux | Le web 2.0, crit par Laboratoire de Soutien
lEnseignement Tlmatique, visit le 08/02/2014
http://www.pmtic.net/cles_web2/contenus/principes_generaux/definition.php/
[15] UML , crit par Laurent PIECHOCKI, visit le 02/03/2014
http://uml.free.fr/
[16] PHP , crit par Molokai et Raf, visit le 30/04/2014
http://www.phpdebutant.org/article118.php
[17] Drupal , crit par PHPNUKE, visit le 28/02/2014
https://ra5-telecharger.phpnuke.org/fr/c113012/bitnami-drupal-gratuit#.U2e0EYF5NKY
[18] Star UML , crit par Programmes et Jeux, visit le 18/03/2014
http://staruml.programmesetjeux.com/
59
Annexes
Annexe A
Dictionnaire des donnes
N
Attribut
Libelle
Type
login
Identifiant
de Chaine
lutilisateur
2
pwd
email
Mot de passe de Chaine
status
de 60
caractres
Email
de Chaine
lutilisateur
4
de 60
caractres
lutilisateur
3
Taille
de 254
caractres
Status
de Chaine
lutilisateur
de 10
caractres
(actif, bloqu)
5
langage
Langage prfr Chaine

de lutilisateur
idPhoto
caractres
Identifiant de la entier
photo
de 12
11
de
lutilisateur
7
idPlateforme
11
plateforme
8
nom
Nom
de
plateforme
9
idSondage
Identifiant
la Chaine
de 60
caractres
du entier
10
sondage
10
titre
Titre du sondage Chaine
de 60
caractres
11
DateCreation
Date cration du Date
sondage
12
resultat
Resultat
sondage
13
status
Status
du Chaine
de 254
caractres
du Chaine
de 10
60
Annexes
sondage
(actif, caractres
bloqu)
14
idWiki
Identifiant
du entier
11
module wiki
15
status
Status
du Chaine
sondage
de 10
(actif, caractres
bloqu)
16
idArticle
Identifiant dun entier
10
article wiki
17
18
titre
auteur
Titre dun article Chaine

wiki
caractres
Lutilisateur
Utilisateur
de 60
rdigeant
larticle
19
langage
Langage
sous Chaine
lequel
crit caractres
de 12
larticle
20
dateCreation
Date de cration Date
de larticle
21
dateModif
Date
de Date
modification de
larticle
22
idRessource
11
ressource
23
status
Status
de
la Chaine
ressource
24
titre
Titre
de
caractres
la Chaine
ressource
25
type
Type
de
de 60
caractres
la Chaine
ressource
(image,
de 10
de 10
caractres
son,
video, text)
26
distributeur
Lutilisateur qui Utilisateur
61
Annexes
a
publi
la
ressource
27
idService
Identifiant
du int
11
service web
28
titre
Titre de service Chaine

web
29
status
de 60
caractres
Status
du Chaine
service
web caractres
de 10
(actif, bloqu)
30
idIcone
Identifiant
de entier
10
licne du sevice
web
31
lien
Lien du service Chaine

web
32
idBlog
caractres
Identifiant
du Chaine
module blog
33
idArticle
35
titre
auteur
de 10
caractres
Identifiant dun Chaine

article blog
34
de 254
de 60
caractres
Titre dun article Chaine

blog
caractres
Lutilisateur
Utilisateur
de 60
rdigeant
larticle
36
langage
Langage
sous Chaine
lequel
crit caractres
de 12
larticle
37
dateCreation
de larticle
38
dateModif
Date
de Date
modification de
larticle
39
idForum
Identifiant
du entier
10
forum
62
Annexes
40
titre
Titre du forum
Chaine
de 60
caractres
41
idTheme
Identifiant
du entier
10
thme du forum
42
titre
Titre du thme
Chaine
de 60
caractres
43
editeur
Editeur
du Utilisateur
de entier
10
thme
44
idAvis
Identifiant
lavis
45
editeur
Editeur de lavis
46
idEmail
Identifiant
Utilisateur
de entier
10
de Utilisateur
Le rcepteur de Utilisateur
lemail
47
emetteur
Lemetteur
lemail
48
recepteur
lemail
49
sujet
Sujet de lemail
Chaine
de 60
caractres
50
idChat
10
session du chat
51
nbreConnects
Nombre
des entier
10
membres
connects
52
emetteur
Emetteur
de Utilisateur
de Utilisateur
de entier
10
message
53
recepteur
Recepteur
message
54
idDevoir
Identifiant
devoir
55
dateAjout
du devoir
56
dateDevoir
Date du devoir
Date
63
Annexes
57
tuteur
Tuteur qui cr Tuteur
le devoir
58
matire
Matire
du Chaine
devoir
59
idCour
Identifiant
de 60
caractres
du entier
10
cours
60
titre
Titre du cours
Chaine
de 60
caractres
61
auteur
le cours
62
matire
Matire
du Chaine
cours
63
dateAjout
de 60
caractres
du cours
64
idTest
Identifiant
du entier
10
test
65
tuteur
le test
66
dateAjout
du test
67
matire
Matire du test
Chaine
de 60
caractres
64
Annexes
Annexe B
Maquette
65

Conception Et Réalisation D'une Plateforme Social Learning

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Conception Et Réalisation D'une Plateforme Social Learning

Enviado por

Direitos autorais:

Formatos disponíveis

REPUBLIQUE TUNISIENNE

MINISTERE DE LENSEIGNEMENT SUPERIEUR,

INSTITUT SUPERIEUR DINFORMATIQUE

RAPPORT DE STAGE DE FIN DETUDES

Conception et Ralisation dune plateforme Social

Encadrant lentreprise : Mr.HMADI Karim

Anne Universitaire 2013-2014

Nos remerciements sadressent notre Prsidente du jury

Nous exprimons nos profondes gratitudes et respectueuse reconnaissance notre

Table des matires

3. Prsentation des interfaces ..................................................................................................... 42

Liste des figures

Figure 30: Lajout dun sondage ........................................................................................................47

Liste des tableaux

LInternet a rvolutionn le monde des ordinateurs et des communications comme rien

prsentation des diffrents

fonctionnalits de notre plateforme Social Learning travers des capture dcran.

Etude pralable et tat de

Chapitre I: Etude pralable et tat de lart

1. Prsentation de lorganisme daccueil

Infogrance des systmes dinformation nationaux de ladministration

Mise en uvre et dploiement de le-administration

Fixation et proposition des mthodes et des normes dingnierie et techniques

Matrise douvrage dlgue

Assistance des utilisateurs

Ralisation dtudes : orientation, stratgie et mission daudit informatique

Formation dans le domaine de linformatique au profit des tablissements publics

Figure 1: Organigramme du CNI

Chapitre I: Etude pralable et tat de lart

2.2 Objectifs du projet

Favoriser une pdagogie socioconstructiviste (collaboration, activits, rflexion critique,

Faciliter laccs aux ressources et services,

Offrir aux apprenants un espace dapprentissage individualis,

Faciliter le partage, la production, la communication et la collaboration distance,

Chapitre I: Etude pralable et tat de lart

3.3 Blended Learning

3.4 Web 2.0

Chapitre I: Etude pralable et tat de lart

Au niveau communication cela correspond au partage et la diffusion dinformation

Les notions fondamentales sont :

les interactions entre internautes (collaboration, partage, communaut, rseau)

l'ouverture (possibilit facile et rapide d'entrer et de sortir des contenus)

la gratuit de la plupart des services

3.5 Le social Learning (Lapprentissage social)

Chapitre I: Etude pralable et tat de lart

Chapitre II: Analyse et spcification des besoins

1.1 Description de lexistant

l'informaticien Murray W. Goldberg

l'Universit de Colombie-Britannique. la suite de recherche sur l'application des

Chapitre II: Analyse et spcification des besoins

1.2 Critique de lexistant

social focalis web

- Version gratuite rduite

stable, interface agrable

- Accs interdit au code source

contenues dans des

performant quune base de

- Logiciel libre et gratuit

version gnrique qui

l'interface de Chamilo n'est

pas non plus mtaphorique.

- Une inspiration web 2.0 avec

l'ergonomie sont globalement