Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification Coordonator știi nțific: Conf. Dr. Ing. Boiangiu… [604735]

UNIVERSITATEA POLITEHNICA BUCUREȘTI
FACULTATEA DE AUTOMATICĂ ȘI CALCULATOARE
DEPARTAMENTUL CALCULATOARE

PROIECT DE DIPLOMĂ

Aplicație didactică pentru dezvoltare abilităților
de project management bazată pe gamification

Coordonator știi nțific:
Conf. Dr. Ing. Boiangiu Costin -Anton

Absolvent: [anonimizat]
2017

MIHALESCU GABRIELA ANGELICA

Cuprins

Introducere ………………………….. ………………………….. ………………………….. ………………………….. …… 3
Abstract ………………………….. ………………………….. ………………………….. ………………………….. …….. 3
Descriere generală și motivație ………………………….. ………………………….. ………………………….. .. 4
Contextul aplicatiei ………………………….. ………………………….. ………………………….. ……………………. 5
Domeniul aplicației ………………………….. ………………………….. ………………………….. …………………. 5
Lucrări similare existente ………………………….. ………………………….. ………………………….. ………… 9
Tehnologii ………………………….. ………………………….. ………………………….. ………………………….. …… 11
Alegerea tehnologiilor ………………………….. ………………………….. ………………………….. …………… 11
Tehnologii folosite ………………………….. ………………………….. ………………………….. ………………… 12
Setări de configurare ………………………….. ………………………….. ………………………….. …………….. 16
Aplicație ………………………….. ………………………….. ………………………….. ………………………….. ……… 17
Fluxul aplicație ………………………….. ………………………….. ………………………….. ……………………… 17
Cazuri de utilizare ………………………….. ………………………….. ………………………….. …………………. 18
Accesare aplicație ………………………….. ………………………….. ………………………….. ……………… 18
Autentificare ………………………….. ………………………….. ………………………….. …………………….. 19
Joc project management ………………………….. ………………………….. ………………………….. ……. 21
Quiz ………………………….. ………………………….. ………………………….. ………………………….. …….. 26
Acordarea medaliei ………………………….. ………………………….. ………………………….. …………… 27
Chat ………………………….. ………………………….. ………………………….. ………………………….. …….. 28
Top utilizatori ………………………….. ………………………….. ………………………….. ……………………. 29
Pagina de administrare ………………………….. ………………………….. ………………………….. ……… 30
Feedback ………………………….. ………………………….. ………………………….. ………………………….. 31
Responsive design ………………………….. ………………………….. ………………………….. …………….. 32
Evaluarea aplicației ………………………….. ………………………….. ………………………….. ………………. 33
Dezvoltări ulterioare ………………………….. ………………………….. ………………………….. ………………… 34
Concluzii finale ………………………….. ………………………….. ………………………….. ………………………… 35
Bibliografie ………………………….. ………………………….. ………………………….. ………………………….. ….. 37

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

3 Introducere
Abstract
Industria IT se află în topul celor mai profitabile și de viitor domenii pentru studenții care
absolv ă facultățile tehnice. Un mare ava ntaj al acestor facultăți este acela că oferă oportunități de
carieră diverse pentru absolvenți , astfel încât fiecare persoană pasionată de tehnologie să poată să își
găsească un loc de muncă cât mai potrivit.
Lucrarea mea de licență se adresează studențil or care sunt atrași de lumea managementului
de proiecte software. Aplicația este centrată pe dezvoltarea abilităților de project manager a
utilizatorului, prin folosirea unui instrument de bază din domeniul project management -ului, și anume
diagrama Gantt. Acest instrument este folosit în planificarea proiectelor, în general prin împărțirea
activităților în funcție de durata lor ținând cont de dependențele care există între task -uri.
Aplicația web creată este un cadru perfect în care utilizatorul să își îmb unătățească
cunoștințele de managementul proiectelor prin verificarea acestora. Având în vedere că învățarea prin
gamificare are o multitudine de avantaje, am ales să implementez un joc în care utilizatorul să asigneze
resurse pe activitățile unui proiect generat aleator și să câștige sau să piardă puncte prin alocarea
acestora corespunzător. Pe lângă jocul dezvoltat, utilizatorii vor putea să își testeze cunoștințele din
acest domeniu, să discute cu alți jucători, să ofere feedback sau să vadă evoluția alt or jucători.

MIHALESCU GABRIELA ANGELICA

Descriere generală și motivație

Ideea acestui site web s -a născut din faptul că studenții facultății noastre participă de -a lungul
celor patru ani la realizarea multor proiecte, însă întampină dificultăți în o rganizarea timpului sau a
activităților necesare. Acest joc vine în întampinarea nevoii de a crea un mediu didactic în care
studenții să își cunoască abilitățile de manageri de proiect și să le dezvolte. Scopul principal este ca
utilizatorul să își formeze o viziune de ansamblu asupra proiectelor, să cunoască etapele prin care
acestea trec și să vadă mai mult decat fazele în care a fost implicat până acum în cadrul facultății sau
în perioada de practică.
În funcție de nivelul la care se află jucătorul, sist emul va genera aleator o diagramă Gantt și
un pool de resurse disponibile împărțite pe departamente. Pe lângă informațiile despre domeniul în
care lucrează resursele disponibile (dezvoltare, securitate, analiza, networking, testare, arhitectura
sistem, etc .), jucătorul va vedea și un cost/man -day al resurselor și nivelul de cariera (entry level,
middle level, senior level). În funcție de nivelul de carieră ales, persoanele alocate vor avea un cost
diferit și vor implementa task -urile asignate cu o anumită p erformanță.
După generarea timeline -ului și a pool -ului de resurse, utilizatorul va trebui să asigneze
resursele pe fiecare activitate, astfel încât proiectul să se finalizeze în timp și în buget. Resursele
generate sunt suficiente pentru ducerea la bun sf ârșit a proiectului, important este ca Project
Manager -ul (adică jucătorul) să le organizeze în mod eficient. După împărțirea persoanelor, jucătorul
va apăsa butonul Finish și se va calcula bugetul cheltuit pentru ducerea la bun sfârșit a proiectului
astfe l: pentru fiecare resursă se va contoriza costul activității sale și se va calcula suma tuturor
costurilor pentru a ajunge la bugetul final.
Întreaga aplicație va avea la bază un sistem de gamificare, la fiecare rundă jucătorul va primi
un anumit număr de puncte (în funcție de timpul pe care l -a avut și costul proiectului). Sistemul de
gamificare ales se numește PBL (Points, Badges, Leaderboards) [34] și este cea mai frecventă metodă
utilizată ce se concentrează pe îmbunătățirea jucătorului prin oferirea u nor puncte, insigne și existența
unor clasamente. La un număr stabilit de puncte, utilizatorul va primi o medalie de bronz, apoi o
medalie de argint și una de aur. Toate acestea au scopul de a motiva jucătorul să se implice și să iși
crească nivelul de dif icultate pentru a ajunge la titlul de The God of Project Management.
Un alt mod prin care jucătorul poate să ajungă în topul clasamentului este să răspundă la
întrebările din domeniul managementului de proiecte, deoarece aplicația oferă funcționalitatea de a
realiza quiz -uri. Un chestionar va conține zece întrebări alese aleator din baza de date și fiecare
răspuns corect poate să aducă un punct în plus la experiența jucătorului.
Învățarea prin gamificare nu presupune numai acordarea de puncte atunci când u tilizatorul
acționează conform scenariului, ci conține și feedback imediat, oportunități de a crește în nivele,
distracție, discuții și recunoaștere. În cadrul aplicației am atins aceste criterii pentru a -l face pe jucător
să fie motivat să învețe, să își dezvolte simțurile de manager de proiect și să evolueze.
Principalele obiective ale sistemului ce au fost stabilite de la bun început sunt:
1. Crearea unei aplicații web funcționale.
2. Dezvoltarea abilităților de project management a utilizatorilor.
3. Implemen tarea unei aplicații bazată pe un sistem de gamificare.
Toate aceste trei obiective formează scopul proiectului și atingerea lor returnează succesul
sau eșecul aplicației lucrării curente de licență.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

5 Contextul aplicatiei
Domeniul aplicației

WWW [1] (W orld Wide Web) sau pe scurt web, reprezintă totalitatea documentelor și a
informațiilor de tip hypertext (o formă de document electronic care conține diverse tipuri de formate,
și anume: text, imagini, audio, video etc.). Toate aceste documente și informaț ii mai sunt numite
resurse web și pot fi accesate prin rețeaua de Internet.
Resursele sunt identificate prin adresa lor, reprezentată de un URI [2] (Uniform Resource
Identifier). Acesta este format dintr -un URL [3] (Uniform Resource Locator) care identifi că resursele
prin intermediul mecanismului de accesare: domeniu simbolic, adresă de rețea și dintr -un URN [4]
(Uniform Resource Name) care identifică resursele prin nume, în mod persistent, chiar dacă resursa
este una abstractă).
Accesul la conținutul resu rselor se face prin protocolul HTTP [5] (HyperText Transfer
Protocol) care este un protocol fiabil, de tip cerere/ răspuns ce are ca și rol permiterea comunicării
între un server și un client. În figura 1 este reprezentat modul prin care se face comunicar ea între un
client și un server.

Fig. 1. Comunicare client -server

Clientul poate fi un browser web, iar serverul poate fi un calculator ce găzduiește site -ul web.
Săgețile semnifică pașii prin care o comunicare de acest fel trece:
● pas 1: Clientul trimi te o cerere HTTP c ătre serverul de tipul GET/POST;
● pas 2: Serverul primește cererea și const ată că are nevoie de o căutare în baza de date,
astfel încât trimite o cerere către baza de date prin care solicită informațiile de care are
nevoie;
● pas 3: Baza de date răspunde serverului oferindu -i informațiile cerute;
● pas 4: Serverul răspunde clientului redirectând informațiile primite de la baza de date,
însă câteodată se poate ca serverul să prelucreze acest răspuns pentru a -l oferi clientului
în funcție de soli citare.

Exista mai multe metode [6] prin care clientul poate sa facă o cerere către server, însă cele
mai folosite metode sunt cele de tip GET si POST. Toate metodele (numite și verbe) existente sunt:
● GET – se face atunci când solicitarea este adresată un ei resurse specifice fără a interveni
în conținutul răspunsului;
● POST – se face atunci când se dorește modificarea informației;
● OPTIONS – reprezintă o cerere de informații despre opțiunile de comunicare disponibile;
● HEAD – este identică cu GET cu mențiune a că serverul nu este obligat să adauge în
răspuns și datele, se trimit doar headerele;

MIHALESCU GABRIELA ANGELICA

● PUT – metodă care este opusă lui GET și care se folosește atunci când se dorește punerea
unor documente pe server;
● DELETE – este opusă metodei PUT pentru că se cere ște rgerea unor informații de pe
server;
● TRACE – se folosește atunci când se dorește diagnosticarea deoarece oferă detalii despre
traseul urmat de legătura HTTP;
● CONNECT – metodă folosită de serverele intermediare.

Un site web reprezintă un grup de pagini We b care pot fi accesate prin Internet oricui și care
conțin e text, imagini, animații, fișiere media, fișiere audio sau altele. Este un sistem pe care rulează un
server Web și care găzduiește o serie de resurse înrudite (pot fi ale unei persoane, companii,
organizații).
O aplicație web este o colecție interconectată de pagini Web, având conținut generat
dinamic. Scopul acesteia este de a oferi utilizatorilor o funcționalitate specifică iar interacțiunea dintre
utilizatori și aplicație se face prin intermediu l unei interfețe Web.
În figura 2 este reprezentat parcursul unei cereri din partea unui client, care este navigatorul
web în cadrul aplicației curente.

Fig. 2. Parcursul unei cereri

Cei șase pași prin care o cerere de la un client la server trece s unt:
● pas 1: browser -ul formulează o cerere de tip HTT P GET pentru a obține un fișier;
● pas 2: serverul Web redirecțio nează cererea către motorul PHP;
● pas 3: preprocesorul PHP accesează fișierul fie de pe h ard disk, fie din memoria CACHE;
● pas 4: hard disk -ul sau me moria CACHE returnează fișierul;
● pas 5: preprocesorul PHP trimite fișierul serverului Web;
● pas 6: serverul Web răspunde clientului prin trimiterea fișierului.

În cadrul aplicației curente, cererile de la browser se declanșează atunci când utilizato rul
acționează în site -ul web, ce are ca și scop dezvoltarea abilităților de project management a
utilizatorilor prin metode ce vor fi descrise ulterior.

Managementul proiectelor în industria IT reprezintă baza unui rezultat de succes, deoarece
este forma t din mai multe etape prin care un proiect trece și vine în întâmpinarea tuturor problemelor
care pot să apară pe parcurs.
Un proiect este o lucrare temporară cu un început și un sfârșit care creează un produs, un
serviciu sau un rezultat unic elaborat progresiv [7]. Sfârșitul unui proiect poate fi atins în trei situații:
atunci când obiectivele stabilite în faza de inițiere a proiectului sunt îndeplinite, atunci când se
întrerupe pentru că obiectivele de la care s -a plecat nu pot fi realizate sau atunci când se constată că

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

7 proiectul în derulare nu mai este necesar și nu aduce beneficii.
PMI (Project Management Institute) spune în Ghidul cunoștințelor în managementul
proiectelor (Ghidul PMBOK – editia 4) [7] că un proiect poate să creeze:
● un produs care poate fi singular sau poate fi o componentă a altui produs mai mare;
● prestarea unui serviciu (cum ar fi întreținerea sau mentenanța unui produs);
● un rezultat (un efect, un document).
Succesul unui proiect depinde de trei mari criterii: cost, scop și timp. Aceste criterii formează
triunghiul unui proiect căruia i se mai spune și triunghiul de fier [8] și poate fi observat în figura 3.

Fig. 3. Triunghiul unui proiect

Nu poți modifica planificarea, bugetul sau scopul proiectului fără a le afecta pe cele lalte.
Toate cele trei componente stau la baza evoluției fiecărui proiect și împreună definesc succesul unui
proiect. Cu timpul, experiența a arătat că de fapt definiția succesului într -un proiect include: intervalul
de timp alocat proiectului, bugetul în care trebuie să se încadreze acesta, dacă nivelul de performanță
este adecvat complexității proiectului, acceptul clientului, influența negativă exterioară și dacă
cerințele sunt aliniate cu strategia de afaceri a clientului.
Managementul de proiect reprez intă aplicarea în cadrul activităților din proiect a
cunoștințelor, abilităților, uneltelor și a tehnicilor necesare pentru a atinge cerințele proiectului.
Managementul de proiect se realizează prin aplicarea și integrarea corespunzătoare a 47 de procese
grupate în mod logic, care sunt clasificate în cinci grupe de proces.

Fig. 4. Ciclul de viață a unui proiect

Faza 1 – Inițierea proiectului – este faza de start a proiectului care începe prin conceperea unui
business case. Rolul unui business case est e acela de a justifica propunerea de proiect prin definirea
scopului, bugetului si a beneficiilor pe care le va aduce acel proiect. Dacă părțile interesate
(stakeholders) aprobă proiectul, următorul pas este crearea unui document de inițiere (project

MIHALESCU GABRIELA ANGELICA

chart er) care reprezintă nevoile afacerii, părțile implicate, riscuri, probleme prevăzute și informațiile
din business case mai detaliate.
Faza 2 – Planificarea proiectului – este faza în care se formează echipa de proiect, se identifică
care sunt obiectivele proiectului și acțiunile necesare atingerii lor, care sunt resursele potrivite pentru
acest proiect și se estimează durata fiecărei activități de implementare. O unealtă foarte folosită în
acestă fază este diagrama Gantt care ilustrează grafic data de star t și de sfârșit a fiecărei activități din
proiect și dependențele între acestea.
Faza 3 – Execuția proiectului – este faza în care se implementează fiecare activitate din
planificare de către resursele asignate în timpul estimat și agreat de echipa de pro iect.
Faza 4 – Monitorizarea și controlul proiectului – reprezintă etapa care se desfășoară pe toată
durata de viață a proiectului și are ca scop urmărirea progresului pentru fiecare etapă din proiect.
Monitorizarea și controlul se fac de către managerul de proiect și el este cel care este responsabil de
mitigarea riscurilor și rezolvarea problemelor care apar pe parcurs, cu scopul de a urmări îndeplinirea
indicatorilor de performanță stabiliți în project charter.
Faza 5 – Închiderea proiectului – este ul tima etapă dintr -un proiect, etapă în care se stabilesc
lecțiile învățate din proiect, se apreciază echipa de proiect și se documentează documentul de
închidere a proiectului (project closure).
Un manager de proiect este o persoană care are rolul de a li vra proiectul și de a valida fiecare
livrabil, astfel încât rezultatul final să îndeplinească obiectivele proiectului. Principalul scop al unui
manager de proiect este acela de a se asigura că proiectul este livrat OTOBOS (on time, on budget, on
scope) – în timp, în buget și în scopul propus. Responsabilitățlei unui manager de proiect sunt:
● crearea studiului de fezabilitate a proiectului;
● pregătirea documentului de inițiere a proiectului;
● estimarea activităților și planificarea proiectului;
● monitorizarea fi ecărei activități din planificarea proiectului;
● gestionarea riscurilor și mitigarea lor;
● controlul schimbărilor care apar pe parcurs;
● coordonarea echipei de proiect;
● gestionarea bugetului și a documentelor;
● alocarea resurselor pe activități;
● escaladarea pr oblemelor;
● gestionarea relației cu clienții interni și externi.
Pentru a atinge aceste responsabilități, un manager de proiect trebuie să aibă anumite abilități
de leadership și comunicare dezvoltate, să poată să formeze o echipă și să o motiveze, să nego cieze
eficient, să gestioneze conflictele și propriul timp, să reziste la stres și să îi inspire pe ceilalți.
Aplicația curentă este concepută cu scopul de a dezvolta abilitățile și cunoștințele
utilizatorului pentru a deveni un bun manager de proiect prin tr-un sistem de gamificare. Conform
articolului despre gamificarea în educație [9], gamificarea descrie procesul de aplicare a principiilor
legate de joc, în special cele legate de experiența și implicarea utilizatorilor în contexte non -joc, cum
ar fi educ ația.
Învățarea prin gamificare este o abordare educațională ce are ca rol creșterea entuziasmului
și a angajamentului participanților prin folosirea elementelor de joc în ideea de a stârni interes și de
a-i motiva pe studenți să continue să învețe. Conf orm Wikipedia [10], principalele elemente de joc ce
pot fi folosite în educație sunt:
● metoda progresului, folosind puncte, medalii și clasamente;
● controlul jucătorului;
● feedback imediat;
● oportunități pentru a rezolva probleme colaborând în echipă;
● oportun ități de a crește în nivele;
● distracție;

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

9 ● provocări;
● muzică.
Beneficiile folosirii metodelor de mai sus sunt numeroase, însă cele mai importante constau
în faptul că studenții se simt stăpâni pe învățare și ca se creează o atmosferă relaxantă în care eșecu l
nu este văzut dramatic, deoarece cursanții pot încerca din nou. Învățarea prin gamificare este mai
distractivă decât învățarea în sala de curs și ea devine vizibilă prin indicatorii de progres ai fiecărui
participant la joc. Studenții se simt mai confort abili în acest context și pot descoperi motivația
intrinsecă pe care o au spre dezvoltare și învățare.
Principala lipsă de demotivare a elevilor și a studenților poate fi observată din rata
abandonului școlar, care este foarte mare în România. Învățarea prin joc în educație are potențial, din
punctul meu de vedere, să atragă studenții, să îi ajute să treacă peste bariere și greutăți și să îi atragă
catre domenii care nu par interesante la prima vedere.

Lucrări similare existente
O lucrare similară intitul ată The Project Management Game [11] a fost creată de Robert
Charney [12] și se concentrează în jurul unui instrument de gestionare a proiectelor – diagrama Gantt.
Scopul jucătorului este de a aloca resurse disponibile pe diferite sarcini din graficul Gant t, astfel încât
proiectul să fie finalizat în timp și în buget. Robert Charney este un programator din California ce a
parcurs o serie de oportunități de carieră. Este antreprenor, manager de proiect, inginer, dezvoltator
de jocuri web și are o varietat e largă de proiecte livrate.
Aplicația sa web are ca obiectiv principal testarea abilităților de manager de proiect deja
existente a utilizatorului, prin folosirea unor metode de gamificare. Jucătorul poate să apară în topul
global al tuturor utilizatorilor, poate să vadă dinamic evoluția proiectului la care a lucrat și poate să
intervină în timp real atunci când obiectivele jocului nu se ating.

Fig. 5. The Project Management Game de Robert Charney

Jocul începe prin generarea unei diagrame Gantt și puner ea la dispoziție a funcționalităților
necesare pentru alocarea de resurse pe fiecare activitate. Proprietarul jocului oferă informații despre
bugetul alocat proiectului și lista resurselor disponibile. Scopul jucătorului este de a asigna resurse
astfel încât proiectul să se încadreze în bugetul alocat. Când ju cătorul apasă pe butonul Start o bară
verticală se va deplasa de la stânga la dreapta pe grafic, bară ce reprezintă trecerea timpului. Toate

MIHALESCU GABRIELA ANGELICA

sarcinile trebuie completate înainte ca timeline -ul să ajungă l a sfârșitul proiectului. Jocul oferă
posibilitatea schimbării resurselor în timpul execuției în cazul în care jucătorul dorește asta.
Robert Charney oferă vizitatorilor de pe site un ghid cu instrucțiuni pentru a înțelege logica
jocului și pentru a afla cu m poți să duci la bun sfârșit un proiect.

Fig. 6. Instrucțiuni thatpmgame.com

Deși nu atât de vizibile la prima vedere, această lucrare are și alte funcționalități importante
pe lângă jocul în sine. Una dintre aceste funcționalități este posibilitatea de a discuta cu ceilalți jucători
și de a oferi feedback cu privire la experiența prin care trece un utilizator. Faptul că topul jucătorilor
este global îi determină pe vizitatorii site -ului să participe activ și să obțină punctaje cât mai mari. O
altă fun cționalitate este aceea de a -ți crea un cont pe site p entru a -ti memora numele de jucător,
astfel încât aplicația recunoaște utilizatorii atunci când se întorc pe site.

O altă lucrare similară în care se dorește dezvoltarea abilităților de project managem ent a
utilizatorilor este Sharkworld [13], implementat de șase mari companii: RANJ Serious Games [14],
Apunto Solutions Consulting [15], Xmediaworks [16], TenStep Latinamerica [17], IT Preneurs [18], și
Bogdan Associates [19].
Jocul Sharkworld permite ca managerii de proiect să experimenteze și să dob ândească
experiență în aspecte cheie ale managementului de proiect într -un cadru distractiv și motivant. Acest
joc creează un mediu virtual convingător în care un proiect este dezvoltat în timp real, îndemnâ nd
jucătorul să intervină atunci când lucrurile nu merg bine sau atunci când este nevoie să se implice. Mai
multe scenarii cu suspans cresc valoarea de divertisment a jocului, care nu acoperă numai aspectele
economice ale unui proiect, ci și aspectele soci ale, gestionarea conflictelor și aptitudinile diplomatice.
Acest joc nu este gratuit, fiind destinat jucătorilor care plătesc o licență pentru a -și descărca
jocul pe calculator sau pe mobil. În figura 7 se regăsește o captură de ecran luată de pe site -ul jocului
care ilustrează un scenariu cu care jucătorul se poate întâlni.
Din informațiile parcurse pe site , am observat că și acest joc este bazat pe învățarea prin
gamificare. Un lucru pe care l -am apreciat est e faptul că jocul pune utilizatorul în situații cât mai
aproape de realitate și are o grafică impresionantă. Creatorii acestui joc au filmat diferite scene din
ciclul de viață al unui proiect, iar pentru fiecare situație s -au creat mai multe scenarii. În f uncție de
scenariul ales de jucător, aplicația transmite rezultatul deciziei sale și proiectul este influențat de
aceste decizii.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

11
Fig. 7. The Sharkworld game

În acest capitol am prezentat motivația pentru care am ales să realizez această aplicație și
care este contextul ei. Am vorbi t despre domeniul web pentru că aplicația este un site web și am
prezentat informații generale despre managementul proiectelor, având în vedere faptul că aplicația
se bazează pe îmbunătățirea abilităților de manager de proiect ale utilizatorului printr -un sistem de
gamificare.
În continuare voi face o scurtă parcurgere despre tehnologiile folosite în implementarea
aplicației și modul de utilizare al acestora.

Tehnologii
Alegerea tehnologiilor
Pentru implementarea aplicației curente am folosit ca și limba je de bază cele trei
componente principale a unui site web: HTML , CSS si Javascript . Aceste limbaje formează coloana
vertebrală a unui site web și pot oferi programatorilor o masă largă de oportunități de implementare.
Pe lângă aceste limbaje, am ales să f olosesc PHP, librăriile jQuery și AngularJS. Pentru
gestionarea bazei de date am utilizat Idiorm, deoarece oferă o interfață fluentă și este foarte ușor de
utilizat.
Motivul pentru care am ales aceste tehnologii a fost, în primul rând, faptul că pe o parte din
acestea le -am studiat în cursul de Programare Web din cadrul facultății [20]. Cunoștințele acumulate
de-a lungul semestrului și aplicarea acestora la laboratoare și în implementarea temei de casă, m -au
ajutat mult în implementarea lucrării curente. Pe lângă ce am învățat la laborator, am parcurs câteva
tutoriale online pentru a -mi consolida și îmbunătății cunoștințele.
În perioada alegerii temei pentru licență, l -am contactat pe Robert Charney [12] care a
implemenatat jocul The Project Management Game [11]. Scopul contactării lui a fost să aflu care sunt
tehnologiile pe care le -a folosit și care au fost problemele pe care le -a întâmpinat. Aplicația sa
folosește un server web Apache și o bază de date MySQL. Limbajul de programare principal este PHP,
însă în implementare a folosit și Javascript.

MIHALESCU GABRIELA ANGELICA

Având în vedere cele menționate, în continuare voi detalia fiecare tehnologie pe care am
folosit -o în cadrul implementării.

Tehnologii folosite

HyperText Markup (HTML) [21] este un limbaj standard pentru creare a paginilor we b și a
aplicațiilor web, care, î mpreună cu CSS (Cascading Style Sheets) și JavaScript, formează coloana
vertebrală a tuturor site -urilor și a continutului web. Navigatoarele web primesc documente HTML de
la un server sau dintr -un spatiu de st ocare și le transformă în pagini web.
Un document scris în HTML nu va fi doar lizibil pentru utilizator, ci va transmite și structura
documentului, relația dintre conținut ul său și al altui document și î i va permite utilizatorului să se
conecteze și la al te pagini. HTML poate face toate acestea, deoarece este un limbaj de marcare. Acest
lucru înseamnă că HTML este folosit pentru a marca conținut, în scopul de a explica ce este acel
conținut și modul în care se referă la alt conținut din pagină.
Deși HTML a crescut și a evoluat de la prima sa versiune, nu s -a schimbat dramatic. Această
consecvență a contribuit la dezvoltarea web -ului și va continua să crească dincolo de navigatoarele
web, trăind într -o lume a dispozitivelor și a aplicațiilor. Creșterea numă rului de dispozitive conectate
la internet cum ar fi tabletele, telefoanele și alte dispozitive inteligente reprezintă crearea unui
ecosistem mult mai mare pentru conținutul HTML.
Cu toate că CSS controlează aspectul unei pagini și JavaScript controlează m odul în care se
comportă, HTML oferă structura esențială pentru paginile web. Dacă eliminam CSS -ul, vom avea o
pagină fără stil. Dacă eliminăm JavaScript, anumite comportamente vor înceta să funcționeze. Însă
dacă îndepărtăm HTML, nu vom rămâne cu nimic, n u vom avea pagină web și nici conținut, de aceea
aș putea spune că HTML este cel mai important limbaj dintre cele trei.

CSS (Cascading Style Sheets) [22] este un limbaj de stil care definește aspectul documentelor
HTML folosind fonturi, margini, culori, l inii, animații, imagini de fundal și altele. În termeni de sintaxă,
CSS nu este un limbaj de marcare precum HTML și nici un limbaj de scripting precum JavaScript.
CSS este un limbaj de stil care constă într -o colecție de reguli de formatare care identifică
elementele din document pe care ar trebui să le controleze și proprietățile pe care ar trebui sa le ofere
elementelor. Aceste stiluri sunt de obicei conținute într -un fișier extern care poate controla un singur
document sau un întreg site web.
Termenul d e cascadă se referă la modul în care stilurile sunt aplicate paginilor, deoarece ele
sunt aplicate în ordine în care sunt găsite, fie că acestea vin din stilurile plasate local sau din stilurile
aflate în fișierele externe de tip css.
Unul dintre avantajele majo re ale limbajului CSS este că permite un design web modularizat.
Deși acest lucru reprezintă o simplificare, site -urile web sunt controlate și construite de cinci elemente
principale:
● HTML – controlează structura documentului;
● CSS – controlează aspectul do cumentului;
● JavaScript – controlează comportamentul în cadrul clientului sau al browserului;
● Limbajul PHP – este un limbaj de server care procesează controlul și logica aplicației;
● mySQL – stochează datele în mod organizat.
În unele cazuri, un site web ar putea utiliza toate aceste elemente, în timp ce în altele, ar putea
folosi doar cod HTML și CSS. Această abordare modulară înseamnă că se pot schimba fiecare dintre
aceste elemente independent una de cealaltă. În ceea ce privește CSS, se poate modifica înt regul
aspect și design al unei pagini fără a schimba niciodată conținutul sau structura sa.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

13 Bootstrap [23] este o bibliotecă de CSS pentru dezvoltarea de proiecte mobile, receptive, pe
web. Această bibliotecă este un framework open source ce a fost dezvol tat de Twitter [24] și
reprezintă o combinație de cod HTML, CSS și Javascript pentru a crea componente utile interfeței
utilizator. Această colecție gratuită de instrumente pentru crearea unui site web conține șabloane de
design HTML și CSS pentru tipograf ii, formulare, butoane și alte componente de interfață, precum și
extensii JavaScript opționale.
Motivele pentru care programatorii aleg să folosească Bootstrap în favoarea creării propriilor
clase de CSS sunt: existența unei liste extinse de componente și etichete, este ușor de folosit, are
suport pentru majoritatea elementelor HTML și este una dintre cele mai cunoscute biblioteci.

JavaScript [25] este un limbaj de programare de scripting de la Netscape și este mai ușor și
mai rapid de folosit față de limb ajele de compilare C și C++. JavaScript este folosit în dezvoltarea site –
urilor web pentru a face modificări automat în pagini în mod interactiv. El rulează în browser și
interacționează cu regulile HTML și CSS pentru a schimba ceea ce utilizatorul vede sa u ce poate să
facă.
JavaScript are aceeași sintaxă ca Java și are asemănări istorice cu acest limbaj, însă ele sunt
doua limbaje de programare diferite. Numele standardizat la nivel internațional al limbajului
JavaScript este ECMAScript, deci este doar o c oincidență nefericită de nume.
JavaScript este folosit în dezvoltarea front -end a aplicațiilor web și oferă un nivel ridicat de
interactivitate cu utilizatorul, deoarece poate interpreta comportamentul acestuia analizând click –
urile, filtrele pe care le f ace utilizatorul sau unde menține mouse -ul.
În cadrul aplicației curente, am folosit doua framework -uri importante ale limbajului
JavaScript, și anume jQuery și AngularJS.

jQuery [26] este una dintre cele mai populare și mai utilizate librării web JavaS cript din zilele
noastre. jQuery face mult mai ușoare toate tipurile de scenarii comune în dezvoltarea aplicațiilor web
și oferă o modalitate standardizată și simplificată de extragere, manipulare și creare a conținutului
paginii web.
Sintaxa jQuery este concepută astfel încât să faciliteze navigarea pe un document, crearea
animațiilor, gestionarea evenimentelor și dezvoltarea aplicațiilor AJAX. Faptul ca folosind jQuery
dezvoltatorii pot să creeze plugin -uri le aduce ușurință în implementarea unor efecte avansate și
widget -uri de nivel înalt. Abordarea modulară a bibliotecii jQuery permite crearea de pagini web
dinamice.
Principiile de dezvoltare folosind jQuery sunt:
● Separarea HTML de JavaScript – jQuery oferă o sintaxă simplă pentru adăugarea de handler -e
de evenimente astfel încât nu mai e necesară integrarea JavaScript -ului în HTML;
● Claritatea și concizia – jQuery promovează claritate și concizie prin faptul că permite folosirea
unor nume prescurtate pentru funcții;
● Eliminarea incompatibilăților – Java Script se comportă diferit în funcție de navigatorul web
folosit, iar jQuery se ocupă de aceste inconsistențe și oferă o interfață consistentă care
funcționează în orice browser;
● Extensibilitatea – se pot adăuga cu ușurință evenimente noi, elemente și meto de ce pot fi apoi
reutilizate ca un plug -in.

MIHALESCU GABRIELA ANGELICA

AngularJS [27] este un cadru modern pentru dezvoltarea aplicațiilor și o structură care ajută
dezvoltatorii să creeze aplicații mai rapid prin furnizarea unui număr mare de servicii și obiecte.
Aplicațiile Ang ular rulează mult mai rapid decât aplicațiile care folosesc doar JavaScript pur, pentru că
Angular se î nvâr te în jurul componentelor. Această bibliotecă permite crearea de funcții folosind
etichete personalizate și oferă posibilitatea dezvoltatorului să inventeze pr opriile etichete și apoi să
programeze funcționalitatea acestora.
Angular este construit pe baza arhitecturii MVC. Modelul MVC (Model, View, Controller) este
un model de design software folosit pentru dezvoltarea aplicațiilor web și este alcătuit din tre i părți:
● Model (model) – este nivelul cel mai scăzut al arhitecturii și este responsabil pentru
menținerea datelor;
● Vizualizare (view) – este nivelul responsabil pentru afișarea datelor pentru utilizator;
● Controlul (controller) – este codul software care c ontrolează interacțiunile între model și
vizualizare.
Acest model construiește un concept de succes răspândit pentru că separă logica de business
de considerentele interfeței utilizator, astfel încât permite modificarea aspectului vizual sau a nivelelor
inferioare fără a afecta alte nivele. Această arhitectură este foarte populară în programarea web,
pentru că cei care întrețin aplicația pot să facă schimbări fără a bloca utilizatorii să folosească aplicația.
În figura 8 este reprezentată arhitectura aplicaț iei curente prezentând și modelul MVC.
Fiecare pas numerotat în imagine semnifică:
● pas 1 – clientul comunică doar cu componenta View;
● pas 2 – componenta View este desenată pe baza datelor primite de la componenta Model;
● pas 3 – datele se schimbă conform lo gicii oferite de componenta Controller;
● pas 4 – logica componentei Controller poate schimba componenta View;
● pas 5 – componenta Controller ia sau trimite date la serverul Apache al aplicației.

Fig. 8. Arhitectura aplicației curente

În cadrul aplicați ei curente, principala funcționalitate este jocul implementat pe baza unei
diagrame Gantt, folosind biblioteca angular -gantt [28]. Această bibliotecă pune la dispoziție o serie
largă de plugin -uri utile pentru afișarea și folosirea unei diagrame de activi tăți. Cea mai importantă
caracteristică ale acestei biblioteci constă în flexibilitatea pe care o oferă: suportul avansat în
gestionarea calendarului, sortarea rândurilor și aplicarea de filtre, legarea datelor între componentele

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

15 View și Model, dependențe între activități, caracteristici personalizate, activități cu comportament și
proprietăți diferite, etc.
Angular -gantt utilizează un șablon care este compilat atunci când directiva Gantt se găsește
în aplicație. Acest template este localizat în src/templ ate/gantt.tmpl.html și folosește o serie de
directive care sunt construite pentru a da o structură lizibilă aplicației [29]. O directivă este un
marcator din documentul DOM (Document Object Model) care poate reprezenta un atribut, un
element, un comentariu sau o clasă CSS. Aceste marcatoare descriu compilatorul HTML al bibliotecii
Angular JS si permite programatorului să își definească propriile tag -uri HTML.
Șablonul angular -gantt utilizat este compus de următoarele directive principale:
● gantt -labels – conține rânduri cu etichete în zona stângă a componentei;
● gantt -header – zona superioară a componentei ce conține și header -ele tuturor coloanelor;
● gantt -body – zona principală a componentei,care conține rânduri și coloane;
● gantt -body -background – reprezintă fundalul diagramei Gantt;
● gantt -row-background – reprezintă fundalul unui rând;
● gantt -body -foreground – reprezintă fundalul din față a diagramei;
● gantt -body -columns – container -ul pentru toate coloanele;
● gantt -time -frame – cadrul de timp;
● gantt -body -rows – container -ul pentru toate rândurile;
● gantt -timespan – intervalul de timp;
● gantt -row – directiva pentru rândurile diagramei;
● gantt -task – directiva pentru activități.

Fig. 9. Angular -gantt

PHP (Hype rtext Preprocessor) este un limbaj de programare interpretat și open -source care
este folosit în dezvoltarea aplicațiilor și a paginilor web. Procesarea se realizează la nivelul serverului
web înainte ca paginile web să ajungă în browser, având o sintaxă f oarte ușoară.
PHP este un limbaj simplu deoarece nu este necesară includerea de biblioteci sau directive
de compilare, este flexibil pentru că poate fi integat pentru orice tip de server și poate accesa cu
ușurință diverse baze de date (MySQL, PostGreSQL etc.). PHP e o tehnologie ce folosește o verificare
dinamică a tipurilor de date, deoarece nu este necesară o declarare explicită a variabilelor înainte de

MIHALESCU GABRIELA ANGELICA

folosirea lor și în timpul compilării nu se face o verificare a tipurilor variabilelor.
Există trei domenii principale în care sunt utilizate scripturi le PHP, conform manualului de
PHP [30]:
● cel mai tradițional domeniu este cel al serverelor, unde pentru a utiliza un script este necesar
un server web, un browser web și un analizator PHP (parser). Aceste c omponente rulează pe
calculatorul programatorului, iar utilizatorii au acces numai la browser;
● un alt domeniu este scripting -ul în linia de comandă, care nu necesită server sau browser web.
Singura componentă obligatorie este analizatorul php (parser -ul), ce este folosit pentru sarcini
simple de procesare a textului în scripturi execuate în mod regulat;
● ultimul domeniu în care se folosesc scripturile PHP este scrierea aplicațiilor desktop. PHP nu
oferă oportunități moderne pentru a dezvolta o interfață gra fică pentru utilizatori, însă are
funcții avansate care pot fi utile în aplicațiile desktop.

Pentru gestionarea bazei de date, am folosit interfața Idiorm, care este bazat ă pe biblioteca
ORM (object -relational mapper). ORM transformă rândurile bazei de dat e în obiecte native ale
limbajului de programare și ajută în formularea query -urilor complexe. Idiorm are o singură clasă ORM
care funcționează ca un API inteligent de interogare SELECT.
Idiorm este o interfață care permite programatic accesarea bazei de date, iar în cazul aplicației
curente baza de date este SQLite. SQLite este o bibliotecă care implementează un motor de baze de
date SQL bazat pe tranzacții și care are propriul său server. SQLite este cea mai răspândită bază de
date din lume cu foarte mul te aplicații, inclusiv câteva proiecte de profil înalt.

Setări de configurare

Pentru dezvoltarea aplicației, am avut nevoie de următoarele utilitare:
● server Apache versiunea 2.4.23;
● PHP versiunea 5.6.30;
● npm versiunea 3.10.8;
● bower versiunea 1.8.0;
● Angu larJS versiunea 1.4.7 (și alte biblioteci specifice de AngularJS la versiunile lor cele mai
recente);
● Bootstrap versiunea 4.0.0;
● Sqlite versiunea 3.14.0.
Înainte de începerea dezvoltării aplicației, am început prin instalarea unui utilitar care să
agrege serverul Apache și motorul PHP, astfel încât am apelat la ajutorul MAMP (My Apache – MySQL
– PHP) [31]. Acesta a instalat versiunile de Apache – 2.4.23 și PHP – 5.6.30 automat, pentru că fac parte
din pachetul MAMP.
Pentru a putea avea acces la o bază de date simplă, am decis să apelez la Sqlite pe care l -am
instalat cu ajutorul unui terminal. Informații despre cum se folosește sqlite și cum se instalează am
preluat din laboratorul 5 al materiei Programare WEB din cadrul Facultății de Automatică și
Calcula toare, Universitatea Politehnica din București [20].
Pentru dezvoltarea jocului care folosește diagrama Gantt, am folosit utilitarul bower care este
un manager de pachete pentru aplicatii web. Pentru a instala acest manager de pachete am avut
nevoie de npm (Node.js Package Manager) care vine odată cu instalarea unei versiuni de Node.js.
Bower este un manager de pachete care permite cu ușurintă instalarea diferitelor module ce pot servi
în dezvoltarea aplicațiilor web. Printre dependențele aplicației web s e numară: AngularJS versiunea

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

17 1.4.7, Bootstrap versiunea 4.0.0, jQuery versiunea 3.1.1, angular -gantt versiunea 1.3.1, a ngular -route
versiunea 1.4.7, angular -bootstrap versiunea 2.5.0 si angular -ui-select versiunea 0.19.8.
Folosind utilitarele, limbajele și arhitectura prezentate mai sus, am implementat site -ul web
The GOD of Project Management, ce va fi detaliat și explicat în continuare.

Aplicație
Fluxul aplicație
The GOD of Project Management este o aplicație web care își propune antrenarea
abilitățil or jucătorului în domeniul managementului proiectelor. Pentru a atinge scopul acestui site,
am implementat o serie de funcționalități pe care jucătorul să le folosească.
În figura 10 este prezentat fluxul aplicației de la momentul în care un utilizator ac cesează
link-ul aplica ției. Atunci când acesta vizitează site -ul web, are po sibilitatea să se logheze sau să
navigheze prin aplicație fără a se autentifica . În cazul în care acesta nu alege să se autentifice, el nu va
avea drepturi de a vedea întregul meniu. Drepturile de acces pe care un utilizator neautentificat le are
sunt: citirea detaliilor de pe prima pagină, transmiterea unui feedback către administrator,
vizualizarea topului de jucători în funcție de experiența aleasă și parcurgerea instrucțiunilor. Ideea
posibilității de a vedea instrucțiunile deși nu are acces la j oc este aceea de a -i stârni interesul
vizitatorului și de a -l atrage.

Fig. 10. Fluxul aplicație

MIHALESCU GABRIELA ANGELICA

În cazul în care utilizatorul nu are un cont, el poate să îl creeze. După autentificare, jucătorul
va avea posibilitatea să participe la discuții pe chat, s ă își dezvolte abilitățile în joc sau să își testeze
cunoștințele răspunzând la un set de întrebări. Dacă utilizatorul logat este administratorul, acesta va
avea drepturi depline asupra site -ului și va avea posibilitatea de a gestiona conturile utilizatori lor în
pagina de administrare.

Cazuri de utilizare

Pentru a prezenta funcționalitățile aplicației, am ales să folosesc modelul cazurilor de
utilizare. Acest model a fost adoptat într -o măsură remarcabilă, devenind un instrument folosit în
înțelegerea și definirea specificațiilor unui sistem. Cazurile de utilizare arată interacțiunea între
utilizatori și sisteme, ce conține actori, scenarii și diagrame.
Un actor este o entitate care joacă un rol în cadrul sistemului și se determină observând
utilizatorii acel ui sistem și răspunzând la întrebările: cine este interesat de informațiile aflate în
sistem?, cine modifică datele?, cine interacționează cu sistemul?. Un utilizator poate să joace mai
multe roluri (în cazul aplicației curente un utilizator poate să fie ș i jucător și administrator).
Cazurile de utilizare descriu potențiale interacțiuni între sistem și actori și prin scenariile sale
intră în detalii. Un scenariu este o secvență de pași și alternative care descrie legătura dintre două
entități. Un caz de uti lizare descrie un set de scenarii corelate între ele.
Pentru fiecare caz de utilizare, o să definesc următoarele:
● numele cazului de utilizare și al scenariului aferent ;
● actorul implica t;
● scenariul de utilizare prin prezentarea setului de pași;
● pre-condițiile care spun care sun t asumpțiile pe care sistemul trebuie să le îndeplinească
pentru a duce la bun sfârșit scenariul cu un rezultat de succes;
● alternativele scenariului, adica situațiile în care scenariul eșuează;
● post -condițiile care reprezintă reacția sistemului în urma sce nariului;
● diagrame și capturi de ecran (opțional).

Accesare aplicație
Scenariu: Accesare aplicație
Actor: Utilizatorul web.
Descriere: Utilizatorul dorește să acceseze aplicația The GOD of Project Management.
Pre-condiții:
● Utilizatorul are conexiune la internet.
Pași de utilizare: :
● Utilizatorul deschide un navigator web.
● Utilizatorul tastează link -ul aplicației în navigator.
● Aplicația se deschide pe pagina de acasă.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va put ea accesa
aplicația.
Post -condiții: Aplicația se deschide.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

19
Fig. 11. Pagina Acasă a aplicației
Autentificare
Scenariu: Logare
Actor: Utilizatorul logat.
Descriere: Utilizatorul se autentifică în aplicație.
Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul are un cont creat și salvat în baza de date.
Pași de utilizare:
● Utilizatorul acceasează aplicația.
● Utilizatorul apasă pe butonul Login.
● Utilizatorul introduce numele de utilizator și parola corect.
● Utilizatorul apasă pe butonul Subm it.
● Utilizatorul s -a logat.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă numele de utilizator este introdus greșit, sistemul va afișa mesajul “ Incorrect
name or password!”.
● Dacă parola este introdusă greșit, sistemul va afișa mesajul “ Incorrect name or
password!”.

MIHALESCU GABRIELA ANGELICA

Post -condiții: Utilizatorul este logat și are acces la întreaga aplicație, cu drepturi de acces
aferente tipului de utilizator.

Scenariu: Creare cont
Actor: Utilizatorul web.
Descriere: Crearea unui cont în cadrul aplicației se face accesând butonul Create user din
pagina principală. Informațiile introduse se stochează în baza de date, iar atunci când utilizatorul este
logat, sistemul îl identifică și îi afișează fotografia de a vatar, precum se poate observa și în figura 12.

Fig. 12. Identificare utilizator și afișare fotografie

Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul nu are un cont creat și nu se regăsește salvat în baza de date.
Pași de utiliza re:
● Utilizatorul acceasează aplicația.
● Utilizatorul apasă pe butonul Create user.
● Utilizatorul introduce datele solicitate: nume, prenume, nume de utilizator, adresa de
email, parolă, fotografie de avatar.
● Utilizatorul apasă pe butonul Submit.
● Utilizatoru l are cont creat și se poate loga în aplicație.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu va putea accesa aplicația.
● Dacă utilizatorul nu completează toate câmpurile obligatorii va primi mesajul Vă rog
să completați toate câmpurile obligatorii. (încărcarea fotografiei nu este obligatorie).
Post -condiții:
● Utilizatorul are cont creat.
● Contul se salvează în baza de date a aplicației.

Scenariu: Logout
Actor: Utilizatorul logat.
Descriere: Utilizatorul poate să se delogheze dacă este autentificat și poate face acest lucru
apăsând pe butonul Logout afișat înaintea pozei de profil, după cum se poate observa în figura 12.
Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul este logat.
Pași de utilizare :
● Utiliz atorul acceasează aplicația.
● Utilizatorul se loghează.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

21 ● Utilizatorul apasă pe butonul Logout.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu va putea accesa aplicația.
● Dacă utilizatorul nu este logat nu i se afișează butonul de delogare.
Post -condiții:
● Utilizatorul se deloghează.
● Pagina se reîncarcă și se afișează meniul aferent vizitatorilor nelogați.

Joc project management
Scenariu: Start joc
Actor: Utilizatorul web.
Descriere: Pentru a începe jocul. utilizatorul trebuie s ă acceseze pagina jocului. Odată accesată
această pagină, sistemul are identificat utilizatorul logat și verifică în baza de date care este experiența
lui. Dacă jucătorul are experiență mai mică decât 50, nivelul acestuia este 1. Pentru experiență între
50 și 125, nivelul va fi setat la 2, iar pentru intervalul 125 – 225 nivelul va fi 3. Utilizatorul va fi numit
The GOD of Project Management atunci când va avea experiență mai mare decât 225 și automat va fi
la nivelul 4.
În funcție de experiență, diagrama Gantt are un nivel de dificultate mai ridicat sau mai scăzut.
Pentru generarea diagramei am definit o listă de activități posibile pe care le poate conține planificarea
proiectului, unele dintre acestea fiind obligatorii și altele nu. În tabelul 1 se află lista activităților din
baza de date pentru care fiecare activitate are următoarele informații: ID -ul task -ului, numele
activității, tipul resursei care poate să ducă la bun sfârșit activitatea, dacă aceasta este obligatorie sau
nu și ID -ul activității de care este dependentă.
Activitățile obligatorii formează un șablon de bază pentru generarea diagramei gantt, iar cele
opționale apar în joc cu o probabilitate ce ține cont de nivelul la care se află jucătorul. Pentru nivel 1,
variabila de probabilitate este 0.15, pentru nivelul 2 aceasta este 0.5, pentru nivelul 3 este 0.7, iar
pentru nivelul 4 probabilitatea de apariție a activităților opționale este 1.1.

Tabel 1
Lista activităților
ID Activity Resource Mandatory Predecessor
s
1 Cerințele clientului Clien t TRUE
2 Analiza cerintelor si crearea
specificatiilor functionale Business Analyst TRUE 1
3 Crearea diagramelor Business Analyst FALSE 2
4 Workshop intre analist și
dezvoltator Business Analyst FALSE 2

5
Crearea scenariilor de test Developer
TRUE
1 Client
6 Pregatirea planului de testare Business Analyst TRUE 5
7 Implementarea cerintelor Developer TRUE 2
8 Testarea calității Tester TRUE 7
9 Testarea de către client Client TRUE 8

MIHALESCU GABRIELA ANGELICA

10 Suport pentru teste și fixarea
bug-urilor Developer TRUE 9
11 Instalarea soluției în mediu de
test Developer FALSE 7

12
Semnarea acceptanței Dev Ops
FALSE
9 Client
13 Instalarea în mediul de
preproducție Developer FALSE 9
Dev Ops
14 Verificarea securității Information
Security Officer FALSE 8
15 Pregătirea rețelei Network engineer FALSE 7
16 Project management Project manager TRUE 1
17 QA management QA project
manager FALSE 7
18 Administrarea bazei de date Database &
Application
administrator FALSE 1
19 Propunerea arhitecturii soluției Software arhitect FALSE 1
20 Crearea Project Charter -ului Project manager FALSE 1
21 Aprobarea modificărilor de scop
apărute pe parcurs Client FALSE 7

Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul este logat.
Pași de utilizare :
● Utilizatorul acceasează aplicația.
● Utilizatorul se loghează.
● Utilizatorul apasă pe butonul Game.
● Sistemul deschide pagina jocului și generează diagrama Gantt.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă utilizatorul nu este logat, nu va putea accesa pagina jocului.
Post -condiții: Sistemul generează diagrama gantt cu dificultatea direct proporțională cu
nivelul la care se află jucătorul. În figura 13 se poate observa o diagrama generată pent ru un utilizator
ce are nivelul 3. În partea stângă este lista activităților din proiect sortată după timpul de început al
fiecărei activități, primele două rânduri arată luna și numărul săptămânii din an în care task -ul este
planificat, iar săgețile care care conectează două activități reprezintă dependențele între ele (Exemplu:
între activitatea de dezvoltare și testarea realizată de client există dependență între ele pentru că
testarea se poate face abia după implementarea cerințelor și livrarea lor în m ediul de test).
Pe lângă diagramă, această pagină are patru butoane: Go home – redirecționează utilizatorul
către pagina acasă a aplicației, New Game – generarea unei alte diagrame, Retry – regenerarea aceleiași
diagrame, Finish – terminarea jocului ce se face dacă se îndeplinesc anumite condiții ce vor fi descrise
ulterior.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

23
Fig. 13. Diagrama Gantt generată în joc
Scenariu: Alocare resurse
Actor: Utilizatorul logat.
Descriere: În acest scenariu va fi prezentat modul de alocare a resurselor pe fiecare ac tivitate.
Scopul aplicației este de a dezvolta abilitățile de manager de proiect ale utilizatorului, iar o primă
provocare pe care o are jucătorul este să aloce resursele potrivite pentru fiecare activitate.
În baza de date sunt stocate toate tipurile de resurse ce pot fi implicate în proiect (Client,
Business Analyst, Developer, Tester, Project Manager, Dev Ops, QA Project Manager, Information
Security Officer, System Architect, Network Engineer, Database Administrator, Application
Administrator). Pentru fiecare tip de resursă am stocat informații legate de nivelul de carieră posibil
(entry, level, middle) și câte un interval de cost pentru fiecare nivel de carieră. Acest interval de cost
îl folosesc pentru a stabili costul unei resurse pe zi alegând un nu măr aleator din interval.
Pentru a aloca resurse, utilizatorul trebuie să apese pe o activitate și i se va deschide un modal
în care va vedea informații despre activitate și despre resursele disponibile. După cum se poate vedea
și în figura 14, sistemul of eră utilizatorului o descriere a activității pe care a deschis -o pentru a -l ajuta
să își dea seama ce fel de resursă are nevoie să nominalizeze. În câmpul de selectare resursă,
utilizatorul poate să introducă numele unei resurse sau funcția ei și sistemul îi dă rezultatele în mod
dinamic aplicând filtrul dat de jucător.
Pe lângă nume și funcție, în acest modal se poate observa și nivelul de carieră la care se află o
persoană și costul aferent acestuia. Jucătorul trebuie să aleagă resursa potrivită pentru a ctivitate, însă
trebuie să țină cont și de bugetul proiectului. Dacă va alege prea multe resurse începătoare, proiectul
va consuma un buget mai mic, dar va avea riscul major de a nu atinge cerințele proiectului. Pentru
varianta în care utilizatorul alege m ajoritatea resurselor cu o experiență mare (seniori), există riscul
de a depăși bugetul proiectului.

MIHALESCU GABRIELA ANGELICA

Aici este prima situație în care aplicația îi antrenează jucătorului abilitățile de project manager
și îi oferă șansa de a vedea care este viziunea de ans amblu a unui proiect, de a -și pune întrebări și de
realiza că fiecare activitate care nu este realizată corespunzător poate afecta următorii pași din proiect
și automat echipa de proiect, satisfacția clientului și atingerea obiectivelor.

Fig. 14. Aloca rea resurselor pe activități

Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul este logat și a accesat pagina jocului.
● Utilizatorul a deschis modalul unei activități.
Pași de utilizare :
● Utilizatorul acceasează aplicația.
● Utilizatorul se loghează.
● Utilizatorul apasă pe butonul Game .
● Sistemul generează diagrama Gantt în funcție de nivelul la care se află utilizatorul
logat.
● Utilizatorul deschide modalul unei activități si alocă o resursă potrivită.
● Utilizatorul apasă butonul Ok.
● Modalul se închide.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă utilizatorul nu este logat, nu va vedea în meniu butonul Game.
● Dacă utilizatorul selectează o resursă care nu se află în baza de dat e ca resursă posibilă
pentru activitatea curentă. va primi mesajul de eroare “ Resource + resource.name +
resource.type + is not required for this type of task și nu i se va permite alocarea
resursei/resurselor .”
● Dacă utilizatorul selectează o resursă care este alocată pe altă activitate în aceași
perioadă cu activitatea curentă, va primi mesajul de eroare “ Resource +
resource.name + resource.type + is not available in this interval of time și nu i se va
permite alocarea resursei/resurselor .”
● Dacă utilizato rul selectează prea puține resurse pe activitatea curentă, va primi
mesajul de eroare You need more resources și nu i se va permite alocarea
resursei/resurselor .
● Dacă utilizatorul selectează prea multe resurse pe activitatea curentă, va primi
mesajul de er oare You need less resources și nu i se va permite alocarea
resursei/resurselor .

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

25 Post -condiții:
● Se alocă resursa/resursele pe activitatea curentă și se stochează această informație în
baza de date.
● Se actualizează bugetul proiectului cu bugetul curent + durata activității (numărul de
zile) * costul resursei alese.

Scenariu: Finalizare joc
Actor: Utilizatorul logat.
Descriere: Finalizarea jocului se realizează atunci când toate activitățile din diagrama Gantt au
alocate resurse. Sistemul va permite fina lizarea jocului doar atunci când nu există activități cu
persoane nominalizate pentru a îndeplini sarcinile aferente. Atunci când se îndeplinește această
condiție, utilizatorul va putea să apese pe butonul Finish și i se va deschide un modal, similar cu ce l
din figura 15.
După cum se poate observa, sistemul îi va calcula jucătorului bugetul cheltuit pentru întregul
proiect (suma costurilor pe activități). În funcție de resursele alocate, va primi un mesaj/feedback
pentru joc. Acestea vor fi descrise în sec țiunea de alternative, în figura 14 este mesajul primit atunci
când alocarea resurselor se face optim.
Pe lângă buget, în modal utilizatorul va vedea cu cât îi crește experiența și cât mai are de
parcurs până la prima medalie. Acest lucru îl motivează pe jucător să reîncerce diagrama Gantt curentă
sau să încerce una nouă.
În acest pas, utilizatorul are butoane la dispoziție prin care poate să reîncerce pentru aceeași
diagrama Gantt, să joace un nou joc sau să se întoarcă în pagina principală.

Fig. 15. Finalizare joc

Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul este logat și a alocat resurse pe toate activitățile din diagramă.
Pași de utilizare :
● Utilizatorul acceasează aplicația.
● Utilizatorul apasă pe butonul Game.
● Utilizatorul alocă resursele potrivite pentru fiecare activitate (conform scenariului
precedent).
● Utilizatorul apasă butonul Finish și primește puncte.

MIHALESCU GABRIELA ANGELICA

Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă util izatorul nu asignează resurse pe toate activitățile, va primi mesajul de eroare
“You didn't assigned resources for every task.”
● Dacă utilizatorul selectează majoritatea resurselor începătoare, va primi mesajul la
final “ Your project is finished, but the cl ient is not happy because in your team were
too many resources with little experience (entry level) and the project didn't
implement all the requirements.”
● Dacă utilizatorul selectează majoritatea resurselor cu experiență middle , va primi
mesajul la final “Your project is finished, but the client is not happy because in your
team are too many resources with middle experience (middle level) and the project
wasn't ready on time.”
● Dacă utilizatorul selectează majoritatea resurselor cu experiență ridicată, va p rimi
mesajul la final “ Your project is finished, but the client is not happy because in your
team are too many resources with a lot of experience (senior level) and the budget
was exceeded.”
Post -condiții:
● Utilizatorul finalizează cu succes jocul.
● Experi ența utilizatorului este crescută și se actualizează în baza de date.

Quiz
Scenariu: Test cu întrebări
Actor: Utilizatorul logat.
Descriere: Utilizatorul poate să își testeze cunoștințele din domeniul managementului
proiectelor prin a răspunde la întreb ări. Aplicația pune la dispoziție teste a câte zece întrebări, iar
fiecare răspuns corect poate să îi aducă un punct în plus la experiența acumulată.
Întrebările sunt colectate din PMP® Exam Prep, Eighth Edition Study Guide and Related
Products by Rita Mul cahy [32] și sunt alese din testele de la fiecare final de capitol. În baza de date se
află peste 30 de întrebări, dintre care se alege aleatoriu 10 la fiecare generare a testului. În figura 16
se află câteva întrebări la care utilizatorul a răspuns, iar d upă apăsarea butonului Submit sistemul îi
arată dacă a răspuns corect.

Fig. 16. Întrebări din chestionar

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

27
Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul este logat.
Pași de utilizare:
● Utilizatorul acceasează aplicația.
● Utilizatorul apas ă pe butonul Quiz.
● Utilizatorul răspunde corect la cele 10 întrebări.
● Utilizatorul apasă butonul Send.
● Utilizatorul primește 10 puncte experiență.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă utilizatorul nu va răspunde corect la toate cele 10 întrebări, va primi câte un
punct pentru fiecare răspuns corect.
Post -condiții: Se actualizează scorul total al utilizatorului logat.

Acordarea medaliei
Scenariu: Acordarea medaliei
Actor: Utilizat orul logat.
Descriere: Fiecare utilizator are în baza de date stocat progresul său pentru care i se acordă o
medalie. Modul de acordare a medaliilor jucătorul poate să îl afle citind instrucțiunile aplicației din
pagina Instructions din meniu, special cre ată pentru a detalia jocul.
Un jucător poate să primească:
● medalie de bronz, dacă are experiența mai mare decât 50;
● medalie de argint, dacă are experiența mai mare decât 125;
● medalie de aur, dacă are experiența mai mare decât 225.
Punctele se pot obține dacă utilizatorul se implică în jocul aplicației sau dacă răspunde corect
la întrebări. Medalia obținută poate să o vadă sub fotografia de profil, precum și numărul de puncte
de care mai are nevoie până la următoarea medalie.

Fig. 17. Afișarea medaliei obținute

MIHALESCU GABRIELA ANGELICA

Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul este logat.
● Utilizatorul are mai mult de 50 puncte experiență.
Pași de utilizare:
● Utilizatorul accesează aplicația.
● Utilizatorul obține mai mult de 50 puncte jucându -se sau răs punzând la întrebări.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă utilizatorul nu are minim 50 de puncte experiență, nu va avea nicio medalie
câștigată.
Post -condiții: Se afișează medalia obținută.

Chat
Scenariu: Comunicare many -to-many
Actor: Utilizatorul logat.
Descriere: Utilizatorii aplicației The GOD of Project Management pot să comunice între ei prin
funcționalitatea de chat implementată. Comunicarea este o unealtă importantă în s istemul de
gamificare, pentru că participanții își transmit părerile, se încurajează la evoluție și se creează o
competiție care în acest caz este utilă și benefică. Comunicarea se face many -to-many, adică toți
utilizatorii pot să comunice între ei cu mesa jele publice, nu există varianta comunicării doar între două
persoane.
Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul este logat.
Pași de utilizare:
● Utilizatorul accesează aplicația.
● Utilizatorul apasă pe butonul Chat din meniu.
● Utilizatorul scrie un mesaj.
● Utilizatorul apasă butonul Send message.
● Ceilalti utilizatori văd în timp real mesajul trimis.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă utilizatorul nu este log at, nu va vedea butonul de chat în meniu.
Post -condiții: Se afișează stochează în baza de date mesajele trimise.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

29
Fig. 18. Chat

Top utilizatori
Scenariu: Top utilizatori
Actor: Utilizatorul logat sau nelogat.
Descriere: Orice vizitator p oate să vadă care este topul celor mai buni utilizatori și ce medalii
au câștigat. Existența unui top are două avantaje majore într -un sistem de gamificare: îi atrage pe
utilizatorii care nu sunt implicați în joc să participe și să obțină rezultate bune pe ntru a apărea și
numele lor în listă; și îi încurajează pe participanții existenți să se autodepășească și să ajungă pe
podium.
Pre-condiții:
● Utilizatorul are conexiune la internet.
Pași de utilizare:
● Utilizatorul accesează aplicația.
● Utilizatorul apasă pe butonul Top users din meniu.
● Utilizatorul poate vizualiza care este lista celor mai buni jucători.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
Post -condiții: Se afișează topul celor mai bu ni utilizatori.

Fig. 19. Topul utilizatorilor

MIHALESCU GABRIELA ANGELICA

Pagina de administrare
Scenariu: Administrare utilizatori
Actor: Utilizatorul logat cu rol de administrare.
Descriere: Dacă utilizatorul logat este admin, atunci în meniul aplicației web va fi vizibil și
butonul Admin Page. În aceasta pagină, administratorul poate să vizualizeze utilizatorii site -ului cu
informații despre ei: nume, prenume, nume de utilizator, adresa de email, status și scor.
Câmpul status poate să fie activ sau inactiv. Statusul unui ut ilizator îl poate schimba numai
administratorul, având acces la funcționalitățile de gestionare. Pentru fiecare utilizator din listă,
administratorul va putea selecta sau de -selecta o căsuță. El va avea posibilitatea de multi -selecție,
adică să bifeze mai mulți utilizatori și să aplice aceeași acțiune pentru toți.

Fig. 20. Administrare utilizatori

După cum se poate observa în figura 20, administratorul va avea posibilitatea de a bloca unii
utilizatori, de a -i debloca sau de a -i șterge definitiv. Bloc area unui utilizator presupune că
administratorul nu îi va mai permite jucătorului să se logheze în aplicație. Atunci când acesta va încerca
să se autentifice, va primi un mesaj de eroare care îi va recomanda să contacteze administratorul
pentru deblocare. Pentru a -l debloca, administratorul poate să îl selecteze din listă și să apese butonul
Unblock selected users. Butonul Delete selected users șterge definitiv din baza de date utilizatorul.
Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizato rul logat are rol de administrare.
Pași de utilizare:
● Utilizatorul accesează aplicația.
● Utilizatorul se loghează.
● Utilizatorul apasă pe butonul Admin page din meniu.
● Utilizatorul poate bloca, debloca sau șterge utilizatori.
Alternative :
● Dacă nu este rea lizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă utilizatorul logat nu are rol de administrare, acesta nu va vedea pagina de admin.
Post -condiții: În cazul în care administratorul blochează un utilizator, se va modifica în baza de
date statusul în inactiv și acesta nu se va mai putea loga în aplicație. Dacă administratorul deblochează
un utilizator blocat, statusul lui va reveni în activ. La ștergerea unui utilizator se va scoate din baza de
date informațiile aferente acelui jucător.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

31 Feedback
Scenariu: Colectare feedback
Actor: Utilizatorul logat sau nelogat.
Descriere: Orice vizitator al aplicației The GOD of Project Management poate să transmită
opinia sa administratorului. Utilizatorul care oferă feedback nu trebuie sa fie neapărat logat, iar acest
lucru este benefic deoarece administratorul va putea vedea care sunt punctele forte ale site -ului, dar
și cum îl poate îmbunătății conform nevoilor utilizatorilor.
Un alt beneficiu alt feedback -ului în aplicație, este acela c ă într -un sistem de gamificare
părerea participanților este foarte importantă și jocul trebuie să se plieze pe așteptările jucătorilor.
Atunci când un participant oferă feedback și îi este luat în considerare, el va deveni mai motivat și mai
implicat.
Feedback -ul poate fi anonim pentru utilizatorii care doresc asta, astfel încât la completarea
formularului nu este obligatoriu să fii logat sau să introduci numele de utilizator.
Pre-condiții:
● Utilizatorul are conexiune la internet.
Pași de utilizare:
● Utilizatorul accesează aplicația.
● Utilizatorul apasă pe butonul Feedback din meniu.
● Utilizatorul poate să își scrie părerea în câmpul destinat.
● Utilizatorul apasă Send feedback.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se v a putea accesa
aplicația.
Post -condiții: Se înregistrează în baza de date părerile colectate.

Scenariu: Afișare feedback
Actor: Utilizatorul logat cu rol de administrare.
Descriere: Scenariul 4.2.9.1 descrie modul de transmitere a feedback -ului în ca drul aplicației.
Părerea utilizatorilor nu va fi publică, însă dacă aceștia își doresc să transmită un mesaj celorlalți
jucători, vor putea folosi chat -ul descris în scenariul 4.9.6.1. Opiniile utilizatorilor vor putea fi
vizualizate de către administrator în pagina de administrare.
Pre-condiții:
● Utilizatorul are conexiune la internet.
● Utilizatorul logat are rol de administrare.
Pași de utilizare:
● Utilizatorul accesează aplicația.
● Utilizatorul apasă pe butonul Admin page din meniu.
● Utilizatorul poate s ă vizualizeze părerile celorlalți utilizatori.
Alternative :
● Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa
aplicația.
● Dacă utilizatorul logat nu are rol de administrare, acesta nu va vedea pagina de admin.

MIHALESCU GABRIELA ANGELICA

Post -condiți i: Se afișează părerile colectate în baza de date.

Fig. 21. Afișarea feedback -ului

Responsive design

În implementarea aplicației, am ținut cont de faptul că în zilele noastre majoritatea
persoanelor au dispozitiv mobil de pe care se conectează la int ernet, de aceea este
important ca orice utilizator să poată accesa site -ul web și acesta să arate bine de pe orice
echipament.

Fig. 22. Resposive design

Pentru a testa dacă The GOD of Project Management este responsive design, am folosit
aplicația we b Am I Resposive [33] unde am introdus link -ul de accesare al jocului. După apăsarea
butonului Go, aplicația web a testat site -ul meu pe mai multe dispozitive și mi -a oferit posibilitatea
de a naviga pe site în condițiile a diferitor dispozitive. Faptul că site-ul este creat în ideea de a fi
resposive design se poate vedea în figura 22, care este o captură de ecran din aplicația A m I
Resposive.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

33 Evaluarea aplicației

Pentru evaluarea aplicației am folosit utilitarul Performance al browserului Google Chr ome din
cadrul Developer Tools . Pentru început am măsurat performanțele aplicației în cadrul jocului. Scenariul
folosit a fost următorul: am pornit utilitarul, am reîncărcat pagina, am intrat în joc, am asignat resurse
pentru două activități din cadrul diagrame i Gantt, iar pentru cea de -a treia activitate, am asignat o
resursă greșită astfel încât sistemul mi -a afișat o eroare. Graficul performanțelor în cadrul acestui
scenariu este următorul:

Fig. 23. Resursele utilizate de aplicație

Se poate observa din f igura 23 că printre resursele monitorizate se află: spațiul zonei de
memorie heap utilizat de scripturile Javascript, numărul de noduri HTML, numărul de listener -e
înregistrate și memoria GPU. Se poate observa ca memoria ocupată de spațiul de memor ie heap este
în continuă creștere cu câteva scăderi bruște. Aceste scăderi se datorează garbage collector -ului
Javascript care din când în când intervine pentru a elibera memoria care nu se mai folosește. De
asemenea, numărul de noduri HTML este în continu ă creștere odată cu memoria Javascript. Orice
scădere a memoriei produce și o scădere a nodurilor HTML. Memoria plăcii video nu este utilizată
deloc în această aplicație.
În figura 24 sunt surprinse alte câteva resurse utilizate de aplicație:

Fig. 24. Resursele utilizate de aplicație

În graficu l din figura 24 sunt surprinse patru resurse principale consumate de aplicația web:
numărul FPS (Frames Per Second – numărul de cadre pe secundă), CPU (Central Processing Unit –
unitatea centrala de procesare; proce sorul), NET (Network – traficul de rețea) și HEAP (spațiul ocupat
de zona de memorie heap). În imagine, se poate constata o utilizare intensă a procesorului la
încărcarea paginii, ceea ce este și normal într -un astfel de scenariu. La încărcarea unei pagini web,
browserul trebuie să intercepteze codul HTML, CSS și Javascript și să facă parsările necesare.
După parsarea codului, se execută rutine de desenare pe ecran și modificarea conținutului în
funcție de scripturile Javascript, astfel se justifică o încă rcare mai mare asupra procesorului în timpul
încărcării paginii.
De asemenea, această creștere a nivelului de utilizare al procesorului, este corelată și cu
apariția unor urme în cadrul resursei traficului de rețea. La încărcarea paginii, traficul de rețe a crește
întrucât browserul trebuie să procure fișierele necesare pentru a putea afișa pagina. Numărul de cadre
pe secundă are o valoare mică întrucât în pasul încărcării paginii, aplicația pare că se mișcă mai încet
din cauza tuturor procesărilor pe care navigatorul trebuie să le facă.
De la secunda 8 încolo, se poate observa că procesorul nu mai are o activitate atât de intensă
precum la început. Urmele de activitate care mai apar sporadic se datorează interacțiunilor pe care

MIHALESCU GABRIELA ANGELICA

utilizatorul le face cu apli cația. În momentul în care utilizatorul, spre exemplu, apasă un buton,
determină browserul să apeleze rutina special declarată ce se ocupă cu tratarea evenimentului de
apăsare de mouse. Asta înseamnă că browserul este determinat să execute cod și de aici a pare
activitate pe procesor. Memoria ocupată de zona heap a fost discutată anterior.
Datorită faptului că jocul ce utilizează diagrama Gantt este realizat folosind biblioteca
AngularJS, aceasta funcționează într -o singură pagină, ceea ce înseamnă că aproa pe tot traficul de
rețea generat se află la început, în momentul aducerii tuturor fișierelor necesare.
În cele ce urmează, voi prezenta o diagramă care ilustrează timpul petrecut de browser în
anumite faze:

Fig. 25: Împărțirea timpului analizat în feli i reprezentând diferite faze îndeplinite de browser

Se poate observa din figura 25 că pe lângă timpul de inactivitate (care este cel mai mare),
browserul a petrecut cea mai mare parte a timpului executând scripturi Javascript (Scripting), pe
locul trei clasându -se faza de desenare și afișare a conținutului (Rendering). Faza de încărcare
efectivă a paginii și a conținutului acesteia nu durează mult deoarece fișierele sursă nu au o
dimensiune mare (4.6 KB).

Dezvoltări ulterioare

The GOD of Project Management are potențial de a atrage utilizatori, de aceea îmi propun să
îmbunătățesc funcționalitățile existente sau să adaug altele noi. Versiunea actuală a aplicației este
baza a ceea ce poate fi un site web populat și util pentru studenți și nu numai.
În categoria de îmbunătățiri a site -ului web se află următoarele acțiuni:
1. Diagrame Gantt complexe – acum diagrama Gantt se generează pe baza a 22 de activități,
dintre care 9 formează șablonul de task -uri obligatorii. Îmi propun să extind această bază de
date cu mai multe intrări de diferite tipuri și cu mai multe dependențe, pentru a oferi
jucătorilor șansa de a progresa și după cele 225 puncte experiență pe care le acumulează.
2. Alocarea resurselor – în baza de date fiecare activitate are stocat un vecto r cu tipuri de resurse
ce pot îndeplini task -ul respectiv, astfel încât la momentul alocării unei resurse se verifică dacă
tipul persoanei asignate se află în vectorul care arată tipul resurselor ce pot realiza activitatea.
Îmi doresc să îmbunătățesc aceas tă funcționalitate prin extinderea tipurilor de resurse
potrivite pe o activitate și prin posibilitatea de a asigna oricâte persoane pe o activitate și
durata acesteia să se modifice dinamic în funcție de numărul de persoane alocate.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

35 3. Editarea diagramei Ga ntt – diagrama Gantt generată acum în aplicație este read -only, însă pe
viitor aș vrea să ofer șansa jucătorilor să modifice activitățile și durata acestora, să facă singuri
planificarea astfel încât să se încadreze într -un interval de timp.
4. Chat – chat -ul existent este many -to-many, adică este un cadru implementat pentru a discuta
toți jucătorii între ei. O îmbunătățire majoră ar fi să dezvolt funcționalitatea de a exista și
comunicare one -to-one sau posibilitatea de a face grupuri private.
5. Quiz – tabela ce conține întrebări are 33 de intrări momentan, creșterea acestui număr va
scădea probabilitatea ca anumite întrebări să se repete de la un test la altul și va antrena
cunoștințele jucătorilor.

În categoria funcționalităților noi ce ar aduce un plus val oare aplicației se află:
1. O pagină cu materiale utile – crearea unei noi pagini în aplicație care să conțină diferite
materiale utile despre project management pe care utilizatorul să le citească pentru a -și
dezvolta noțiunile despre acest domeniu.
2. Trainin g-uri video – crearea și adăugarea unor training -uri video cu scopul de a
discuta/prezenta subiecte specifice din project management. Această funcție ar crește
gamificarea aplicației și va ajuta utilizatorii să învețe mai ușor și mai rapid.

Concluzii fina le

Societatea puternic informatizată în ultimii ani își pune amprenta destul de puternic pe toate
domeniile de activitate și pe toate afacerile. Majoritatea companiilor sunt nevoite să se alinieze cu
evoluția tehnologiei și să implementeze sisteme care să răspundă nevolilor tot mai avansate a
publicului.
Acest lucru presupune efectuarea proiectelor IT în fiecare companie, indiferent de domeniu,
și automat echipe de specialitate care să le dezvolte. Fiecare proiect are nevoie de un manager de
proiect capabi l să ducă proiectul la bun sfârșit respectând termenele de livrare, cerințele clientului și
bugetul alocat.
Scopul principal al aplicației curente este de a antrena abilitățile utilizatorilor de manager de
proiect prin testarea cunoștințelor sau prin îmbun ătățirea skill -urilor jucându -se. În lucrarea de licență
am prezentat care este aplicația implementată, motivația alegerii acestei teme, tehnologiile folosite,
funcționalitățile dezvoltate și evaluarea aplicației.
Funcționalitățile au fost dezvoltate pent ru a atinge obiectivele principale stabilite de la
începutul dezvoltării aplicației:
4. Crearea unei aplicații web. Acest obiectiv este atins prin prisma faptului că aplicația
dezvoltată este un program care rulează într -o arhitectură client -server folosind, tehnologii
web.
5. Dezvoltarea abilităților de project management ale utilizatorilor. Acest obiectiv este realizat
prin funcționalitățile implementate special pentru a antrena skill -urile utilizatorilor din
domeniul managementului de proiect, de exemplu rezol varea diagramei gantt sau rezolvarea
întrebărilor din quiz -uri.

MIHALESCU GABRIELA ANGELICA

6. Implementarea unei aplicații bazată pe gamificare. Acest obiectiv este atins deoarece
aplicația are la bază un sistem de gamificare numit PBL, descris în primul capitol. Principalele
caracteri stici implementate plecând de la acest sistem sunt: acordarea de puncte si medalii,
urmărirea progresului utilizatorului curent și al celorlalți jucători, oferirea feeback -ului,
comunicarea în chat și posibilitatea de a progesa în nivele.
Pe viitor este v izată o îmbunătățire a sistemului The GOD of Project Management care să îl
facă mai flexibil și care să ofere mai multe provocări utilizatorilor.

Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification

37 Bibliografie

1. World Wide Web , Disponibil online la: https:// ro.wikipedia.o rg/ wiki/ World_Wide_Web,
Data accesării: 10 iunie 2017
2. Uniform Resource Identifier, Disponibil online la: https:// en.wikipedia.org/ wiki/
Uniform_Resource_Identifier , Data accesării: 10 iunie 2017
3. Uniform Resource Locator, Disponibil la: https:// en.wiki pedia.org/ wiki/ URL , Data accesării:
10 iunie 2017
4. Uniform Resource Name, Disponibil online la: https:/ /en.wikipedia.org/ wiki/
Uniform_Resource_Name , Data accesării: 10 iunie 2017
5. Hypertext Transfer Protocol, Disponibil online la: https:// ro.wikipedia. org/ wiki/
Hypertext_Transfer_Protoco l, Data accesării: 10 iunie 2017
6. Method Definitions , Disponibil online la: https:// www.w3.org/ Protocols/ rfc2616/rfc2616 –
sec9.html , Data accesării: 10 iunie 2017
7. Ghidul cunoștințelor în managementul proiectelor (Ghidu l PMBOK), Edișia a 4 -a, Tradus de
PMI România Chapter, Capitolul 1, pagina 37
8. Triunghiul unui proiect, Disponibil online la: https:// support.office.com/ ro -ro/article/
Triunghiul -unui -proiect -8c892e06 -d761 -4d40 -8e1f -17b33fdcf810 , Data accesării: 12 iunie
2017
9. GAMIFICATION IN EDUCATION, Disponibil online la: https:// www.learning -theories.com/
gamification -in-education.html, Data accesării: 13 iunie 2017
10. Gamification of learning, Disponibil online la: https:// en.wikipedia.org /wiki
/Gamification_of_learnin g, Data accesării: 13 iunie 2017
11. The Project Management Game, Disponibil online la: http://thatpmgame.com/, Data
accesării: 13 iunie 2017
12. Robert Charney, The Game Maker (GamesByRobc), Disponibil online la: http://
gamesbyrobc.com/ #contentcontacts, Data accesării: 13 iunie 2017
13. Sharkworld, Disponibil online la: http:// www.sharkworldgame.com/, Data accesării: 14
iunie 2017
14. RANJ Serious Games, Disponibil online la: http:// www.ranj.com/ about, Data accesării: 14
iunie 2017
15. Apunto Solutions Consulting, Di sponibil online la: http://apunto -sc.com/, Data accesării: 14
iunie 2017
16. Xmediaworks, Disponibil online la: www.xmediaworks.nl, Data accesării: 14 iunie 2017
17. TenStep Latinamerica, Disponibil online la: www.latam -tenstep.com, Data accesării: 14
iunie 20 17
18. IT Preneurs, Disponibil online la: https:// www.itpreneurs.com/ about -us, Data accesării: 14
iunie 2017
19. Bogdan Associates, Disponibil online la: http:// www.bogdanov -associates.com/, Data
accesării: 14 iunie 2017
20. Programare Web, Disponibil online la: http:// cs.curs.pub.ro/ wiki/ pw/, Data accesării: 15
iunie 2017
21. HyperText Markup Language, Disponibil online la: https:// en.wikipedia.org/ wiki/ HTML ,
Data accesării: 13 Iunie 2017

MIHALESCU GABRIELA ANGELICA

22. Cascading Style Sheets, Disponibil online la: https:// ro.wikipedia.or g/ wiki/
Cascading_Style_Sheets , Data accesării: 13 Iunie 2017
23. Bootstrap, Disponibil online la: http:// getbootstrap.com/ , Data accesarii: 13 Iunie 2017
24. Twitter, Disponibil online la: https:// twitter.com/, Data accesării: 13 Iunie 2017
25. Javascript, Dispon ibil online la: https:// www.javascript.com/, Data accesării: 13 Iunie 2017
26. jQuery, Disponibil online la: https://jquery.com/, Data accesării: 16 Iunie 2017
27. AngularJS, Disponibil online la: https:// docs.angularjs.org/ tutorial/ step_00, Data accesării:
17 Iunie 2017
28. Angular -gantt, Disponibil online la: https:// www.angular -gantt.com/, Data accesării: 17
Iunie 2017
29. Customize Angular -gantt, Disponibil online la: https:/ /angular -gantt.readthedocs.io/ en/
latest/ configuration/ customize/, Data accesării: 17 Iunie 2017
30. PHP, Disponibil online la: http://php.net/, Data accesării: 16 Iunie 2017
31. MAMP – My Apache – MySQL – PHP, Disponibil online la: https:// www.mamp.info/ en/, Data
accesării: 22 Iunie 2017
32. PMP Exam Prep, Eighth Edition Study Guide and Related Prod ucts by Rita Mulcahy
33. Am I Responsive, Disponibil online la: http://ami.responsivedesign.is/#, Data accesării: 22
Iunie 2017
34. LEARN ABOUT GAMIFICATION, Disponibil online la: https:// gamification21.wordpress.com/
learning -content -2/ 10 -pbl/ Data accesării: 24 Iunie 2017