Aplicație didactică pentru dezvoltare abilităților de project management bazată pe gamification BUCUREȘTI 2017 Introducere Abstract Industria IT se… [302303]

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

BUCUREȘTI

2017

Introducere

Abstract

Industria IT se află în topul celor mai profitabile și de viitor domenii pentru studenții care absolvă facultățile tehnice. [anonimizat].

Lucrarea mea de licență se adresează studenților care sunt atrași de lumea managementului de proiecte software. Aplicația este centrată pe dezvoltarea abilităților de project manager a utilizatorului, [anonimizat], și anume diagrama Gantt. [anonimizat]-uri.

Aplicația web creată este un cadru perfect în care utilizatorul să își îmbunătățească cunoștințele de managementul proiectelor prin verificarea acestora. Având în vedere că învățarea prin gamificare are o [anonimizat]. [anonimizat], [anonimizat].

Descriere generală și motivație

Ideea acestui site web s-a născut din faptul că studenții facultății noastre participă de-a [anonimizat] 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 [anonimizat] a fost implicat până acum în cadrul facultății sau în perioada de practică.

[anonimizat] 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, [anonimizat].), jucătorul va vedea și un cost/man-day al resurselor și nivelul de cariera ([anonimizat], senior level). [anonimizat]-urile asignate cu o anumită performanță.

[anonimizat] a pool-[anonimizat], 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, [anonimizat] (adică jucătorul) să le organizeze în mod eficient. [anonimizat] a proiectului astfel: 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 unor 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 dificultate 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 utilizatorul 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:

Crearea unei aplicații web funcționale.

Dezvoltarea abilităților de project management a utilizatorilor.

Implementarea 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ță.

Contextul aplicatiei

Domeniul aplicației

WWW [1] (World 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 identifică 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 resurselor 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 comunicarea î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 trimite o cerere HTTP către serverul de tipul GET/POST;

pas 2: Serverul primește cererea și constată 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 solicitare.

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ă unei 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țiunea că serverul nu este obligat să adauge în răspuns și datele, se trimit doar headerele;

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 ștergerea 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 Web care pot fi accesate prin Internet oricui și care conține 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 intermediul 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 sunt:

pas 1: browser-ul formulează o cerere de tip HTTP GET pentru a obține un fișier;

pas 2: serverul Web redirecționează cererea către motorul PHP;

pas 3: preprocesorul PHP accesează fișierul fie de pe hard disk, fie din memoria CACHE;

pas 4: hard disk-ul sau memoria 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 utilizatorul 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 format 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ă 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 celelalte. 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 reprezintă 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 este 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 charter) 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 start ș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 proiect.

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 ultima 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 livra 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 fiecă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 problemelor;

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ă negocieze 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 printr-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 educaț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. Conform 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ă;

oportunități de a crește în nivele;

distracție;

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șecul 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 confortabili î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ă intitulată 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 Gantt, 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 varietate 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 punerea 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 jucă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 sarcinile trebuie completate înainte ca timeline-ul să ajungă la 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 cum 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ă funcționalitate este aceea de a-ți crea un cont pe site pentru 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 management 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 sociale, 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 este 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 funcție de scenariul ales de jucător, aplicația transmite rezultatul deciziei sale și proiectul este influențat de aceste decizii.

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 vorbit 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 limbaje 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ă folosesc 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.

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 crearea paginilor web ș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 stocare ș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ținutul său și al altui document și îi va permite utilizatorului să se conecteze și la alte 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ă modul î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, nu 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, linii, 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 de 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 majore 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 documentului;

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 întregul aspect și design al unei pagini fără a schimba niciodată conținutul sau structura sa.

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 dezvoltat 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 tipografii, 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 limbajele 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 sau 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 coincidență 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 face 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 JavaScript 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 – JavaScript 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 metode ce pot fi apoi reutilizate ca un plug-in.

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 Angular rulează mult mai rapid decât aplicațiile care folosesc doar JavaScript pur, pentru că Angular se învârte în jurul componentelor. Această bibliotecă permite crearea de funcții folosind etichete personalizate și oferă posibilitatea dezvoltatorului să inventeze propriile 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 trei 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 controlează 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 logicii 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ției 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 activităț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 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/template/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 (Hypertext 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ă foarte 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 folosirea lor și în timpul compilării nu se face o verificare a tipurilor variabilelor.

Există trei domenii principale în care sunt utilizate scripturile 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 componente 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ță grafică 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 date î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 multe 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;

AngularJS 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 Calculatoare, 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 se numară: AngularJS versiunea 1.4.7, Bootstrap versiunea 4.0.0, jQuery versiunea 3.1.1, angular-gantt versiunea 1.3.1, angular-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ăților 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 accesează link-ul aplicației. Atunci când acesta vizitează site-ul web, are posibilitatea 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 joc este aceea de a-i stârni interesul vizitatorului și de a-l atrage.

Fig. 10. Fluxul aplicație

Î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 utilizatorilor î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 acelui 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 utilizare 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 implicat;

scenariul de utilizare prin prezentarea setului de pași;

pre-condițiile care spun care sunt 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 scenariului;

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 putea accesa aplicația.

Post-condiții: Aplicația se deschide.

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 Submit.

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!”.

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 avatar, 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 utilizare:

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.

Utilizatorul 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:

Utilizatorul acceasează aplicația.

Utilizatorul se loghează.

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

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ă pentru 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 mediul 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.

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 activitate. 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 numă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 oferă 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 activitate, î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 majoritatea resurselor cu o experiență mare (seniori), există riscul de a depăși bugetul proiectului.

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 ansamblu 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. Alocarea 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 date 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ă utilizatorul 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 eroare You need less resources și nu i se va permite alocarea resursei/resurselor.

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 finalizarea 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 cel 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.

Alternative:

Dacă nu este realizată conexiunea la internet utilizatorul nu se va putea accesa aplicația.

Dacă utilizatorul 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 client 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 primi 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.

Experienț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 Mulcahy [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 după apăsarea butonului Submit sistemul îi arată dacă a răspuns corect.

Fig. 16. Întrebări din chestionar

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: Utilizatorul 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 creată 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

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ăspunzâ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 sistemul 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 mesajele 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 logat, nu va vedea butonul de chat în meniu.

Post-condiții: Se afișează stochează în baza de date mesajele trimise.

Fig. 18. Chat

Top utilizatori

Scenariu: Top utilizatori

Actor: Utilizatorul logat sau nelogat.

Descriere: Orice vizitator poate 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 pentru 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 buni utilizatori.

Fig. 19. Topul utilizatorilor

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 utilizator î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. Blocarea 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.

Utilizatorul 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 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.

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.

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 va 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 cadrul 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.

Post-condiții: 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 internet, 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 web 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 Am I Resposive.

Evaluarea aplicației

Pentru evaluarea aplicației am folosit utilitarul Performance al browserului Google Chrome 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 diagramei 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 figura 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 memorie 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 graficul 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; procesorul), 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țea 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 utilizatorul le face cu aplicaț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 apare 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ă aproape 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 felii 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:

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ă.

Alocarea resurselor – în baza de date fiecare activitate are stocat un vector 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 această 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.

Editarea diagramei Gantt – 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.

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.

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 valoare aplicației se află:

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.

Training-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 finale

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 capabil 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 pentru a atinge obiectivele principale stabilite de la începutul dezvoltării aplicației:

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.

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 rezolvarea diagramei gantt sau rezolvarea întrebărilor din quiz-uri.

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 caracteristici 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 vizată 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.

Bibliografie

World Wide Web, Disponibil online la: https:// ro.wikipedia.org/ wiki/ World_Wide_Web, Data accesării: 10 iunie 2017

Uniform Resource Identifier, Disponibil online la: https:// en.wikipedia.org/ wiki/ Uniform_Resource_Identifier, Data accesării: 10 iunie 2017

Uniform Resource Locator, Disponibil la: https:// en.wikipedia.org/ wiki/ URL, Data accesării: 10 iunie 2017

Uniform Resource Name, Disponibil online la: https:/ /en.wikipedia.org/ wiki/ Uniform_Resource_Name, Data accesării: 10 iunie 2017

Hypertext Transfer Protocol, Disponibil online la: https:// ro.wikipedia.org/ wiki/ Hypertext_Transfer_Protocol, Data accesării: 10 iunie 2017

Method Definitions, Disponibil online la: https:// www.w3.org/ Protocols/ rfc2616/rfc2616-sec9.html, Data accesării: 10 iunie 2017

Ghidul cunoștințelor în managementul proiectelor (Ghidul PMBOK), Edișia a 4-a, Tradus de PMI România Chapter, Capitolul 1, pagina 37

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

GAMIFICATION IN EDUCATION, Disponibil online la: https:// www.learning-theories.com/ gamification-in-education.html, Data accesării: 13 iunie 2017

Gamification of learning, Disponibil online la: https:// en.wikipedia.org /wiki /Gamification_of_learning, Data accesării: 13 iunie 2017

The Project Management Game, Disponibil online la: http://thatpmgame.com/, Data accesării: 13 iunie 2017

Robert Charney, The Game Maker (GamesByRobc), Disponibil online la: http:// gamesbyrobc.com/ #contentcontacts, Data accesării: 13 iunie 2017

Sharkworld, Disponibil online la: http:// www.sharkworldgame.com/, Data accesării: 14 iunie 2017

RANJ Serious Games, Disponibil online la: http:// www.ranj.com/ about, Data accesării: 14 iunie 2017

Apunto Solutions Consulting, Disponibil online la: http://apunto-sc.com/, Data accesării: 14 iunie 2017

Xmediaworks, Disponibil online la: www.xmediaworks.nl, Data accesării: 14 iunie 2017

TenStep Latinamerica, Disponibil online la: www.latam-tenstep.com, Data accesării: 14 iunie 2017

IT Preneurs, Disponibil online la: https:// www.itpreneurs.com/ about-us, Data accesării: 14 iunie 2017

Bogdan Associates, Disponibil online la: http:// www.bogdanov-associates.com/, Data accesării: 14 iunie 2017

Programare Web, Disponibil online la: http:// cs.curs.pub.ro/ wiki/ pw/, Data accesării: 15 iunie 2017

HyperText Markup Language, Disponibil online la: https:// en.wikipedia.org/ wiki/ HTML, Data accesării: 13 Iunie 2017

Cascading Style Sheets, Disponibil online la: https:// ro.wikipedia.org/ wiki/ Cascading_Style_Sheets, Data accesării: 13 Iunie 2017

Bootstrap, Disponibil online la: http:// getbootstrap.com/, Data accesarii: 13 Iunie 2017

Twitter, Disponibil online la: https:// twitter.com/, Data accesării: 13 Iunie 2017

Javascript, Disponibil online la: https:// www.javascript.com/, Data accesării: 13 Iunie 2017

jQuery, Disponibil online la: https://jquery.com/, Data accesării: 16 Iunie 2017

AngularJS, Disponibil online la: https:// docs.angularjs.org/ tutorial/ step_00, Data accesării: 17 Iunie 2017

Angular-gantt, Disponibil online la: https:// www.angular-gantt.com/, Data accesării: 17 Iunie 2017

Customize Angular-gantt, Disponibil online la: https:/ /angular-gantt.readthedocs.io/ en/ latest/ configuration/ customize/, Data accesării: 17 Iunie 2017

PHP, Disponibil online la: http://php.net/, Data accesării: 16 Iunie 2017

MAMP – My Apache – MySQL – PHP, Disponibil online la: https:// www.mamp.info/ en/, Data accesării: 22 Iunie 2017

PMP Exam Prep, Eighth Edition Study Guide and Related Products by Rita Mulcahy

Am I Responsive, Disponibil online la: http://ami.responsivedesign.is/#, Data accesării: 22 Iunie 2017

LEARN ABOUT GAMIFICATION, Disponibil online la: https:// gamification21.wordpress.com/ learning-content-2/ 10-pbl/ Data accesării: 24 Iunie 2017