TREBALL DE FI DE GRAU
T´
ITULO DEL TFG: Juego de a a a es pa a una he amien as de gami icaci´
on
TITULACI ´
ON: G ado en Ingenie ´ıa de Sis emas Ae oespaciales,
menci´
on Ae ona egaci´
on
AUTOR: E a Clemen e Escoba
DIRECTORES: Miguel Vale o Ga c´ıa
Roc Mesegue Palla `
es
FECHA: 5 de sep iemb e de 2019
T´ı ulo: Juego de a a a es pa a una he amien as de gami icaci´
on
Au o : E a Clemen e Escoba
Di ec o es: Miguel Vale o Ga c´
ıa
Roc Mesegue Palla `
es
Fecha: 5 de sep iemb e de 2019
Resumen
El desa ollo de es e p oyec o se basa en la apo aci´
on de un m´
odulo a una aplicaci´
on de
gami icaci´
on pa a la educaci´
on llamada Classpip, que es ´
a compues a de a ios m´
odulos.
Todos los p oyec os que o man Classpip se han implemen ado siguiendo una a qui ec u a
de so wa e com´
un, desa ollada con di e en es he amien as de c´
odigo abie o.
El obje i o de es e p oyec o es el desa ollo de un juego des inado a la c eaci´
on de a a a-
es. El docen e ges iona el juego de a a a es de las di e en es clases desde el disposi i o
m´
o il, pa a pode pone en ma cha el juego du an e la clase. Con el ma e ial seleccionado
po el p o eso , el alumno end ´
a a su dispoci´
on ma e ial su icien e pa a c ea el a a a con
di e en es elemen os y que sea de su ag ado.
El concep o base de Classpip es la gami icai´
on, una he amien a que u iliza pun uaciones,
ni eles, ecompensas y o as din´
amicas que usan los ideojuegos pa a cualquie ´
ambi o
no l´
udico. Los p incipales ´
ambi os en los que se u iliza son el acad´
emico y el labo al, que
aunque di ie en los obje i os de un en o no a o o, las ´
ecnicas son muy simila es. Un
es udio aplicado a es os dos con ex os e leja el impac o de la gami icaci´
on y los aspec os
que ´
es a po encia.
Pa a da una idea c´
omo naci´
o Classpip se explica oda la a qui ec u a de la que pa en
odos los m´
odulos. Se necesi a un apo e de di e en es ecnolog´
ıas ex e nas a la aplica-
ci´
on con el in de pode hace un p oyec o comple o, ya que no se ex iende s´
olo a una
pla a o ma web, sino que ambi´
en ha sido e sionada pa a able s y sma phones.
Una ez se ha in oducido Classpip, se ´
a necesa i´
o segui p esen ado nociones nue as
como la de a a a . Concebi un a a a no es algo sencillo y menos cuando no se iene una
base e´
o ica de qu´
e es. Po eso se especi ica de d´
onde p o iene es a idea, qu´
e inalidad
iene y qu´
e aplicaciones la u ilizan m´
as ac ualmen e. De las aplicaciones que la u ilizan
hoy en d´
ıa se ecogen las m´
as a ac i as pa a pode llega a desa olla algo simila que
pueda cap a al p´
ublico de Classpip.
Teniendo los obje i os a cumpli es mucho m´
as sencillo comenza a cons ui el m´
odulo.
P ime o se habla de las unciones que quie en implemen a se es ableciendo un dise˜
no,
suje o a modi icaciones, pa a cada una de ellas. Sob e es as unciones y el dise˜
no se
desempe˜
na la implemen aci´
on eal, dando de alle sob e odos los concep os y inalmen e
se p esen a el esul ado inal, especi icando an o dise˜
no como unciones con su espec-
i a mec´
anica.
Esencialmen e, es e documen o a a de analiza y explica odas las uncionalidades que
desempe˜
na el juego de a a a es. Adem´
as se e al´
ua el m´
odulo comple o en cues iones
de dise˜
no, unciones y lo in ui i o que es pa a o ien a lo a cualquie usua io independien-
emen e de su expe iencia con la ecnolog´
ıa.
Ti le : A a a game o a gami ica ion ool
Au ho : E a Clemen e Escoba
Ad iso s: Miguel Vale o Ga c´
ıa
Roc Mesegue Palla `
es
Da e: Sep embe 5, 2019
O e iew
The de elopmen o his p ojec is based on he con ibu ion o a module o a gami ica ion
applica ion o educa ion called Classpip, which is composed o se e al modules. All he
p ojec s ha compose Classpip ha e been implemen ed ollowing a common so wa e
a chi ec u e, de eloped wi h di e en open sou ce ools.
The main objec i e o his p ojec is o achie e he de elopmen o a game o a a a s
c ea ion. The eache manages he a a a s game o he di e en classes om he mobile
de ice, o be able o launch he game du ing he class. Wi h he ma e ial selec ed by he
eache , he s uden will dispose om enough ma e ial o c ea e he a a a wi h di e en
elemen s, ul illing his will.
The concep base o Classpip is he gami ica ion, a ool ha uses sco es, le els, ewa ds
and o he dynamics ha games use o any non- ec ea ional en i onmen . The main a eas
in which i is used a e a academic and a wo k, al hough he objec i es di e om one
en i onmen o he o he , he echniques a e e y simila . A su ey applied o hese wo
con ex s e lec s he impac o gami ica ion and all he aspec s ha i enhances.
To gi e an idea abou how Classpip was bo n, i is explained all he a chi ec u e om which
all he modules begin. A con ibu ion o di e en echnologies ex e nal o he applica ion
a e needed in o de o be able o build a comple e p ojec , since i does no ex end only o
a web pla o m, bu has also been e sioned o able s and sma phones.
Once Classpip has been in oduced, i is necessa y o in oduce new no ions such as
a a a . Concei ing an a a a is no a simple hing, mo eo e i you do no ha e a heo e ical
basis o wha i is, i ’s e en mo e di icul . Tha is he eason why i is explained whe e his
idea comes om, which is i s pu pose and wha applica ions a e cu en ly used o a a a s.
F om he applica ions ha a e in use i oday, he mos a ac i e ones a e collec ed o be
able o de elop some hing simila ha can cap u e he public o Classpip.
When he objec i es o mee ha e been se is much easie o begin building he module.
Fi s we alk abou he unc ions ha we wan o ge implemen ed by es ablishing a de-
sign (a ached o modi ica ions) o each o hem. Abou hese unc ions and he design
es ablished, he eal implemen a ion is pe o med, gi ing de ails on all he concep s and
by las he inal esul is p esen ed, speci ying bo h he design and he unc ions wi h hei
espec i e mechanics.
Essen ially, his documen ies o analyze and explain all he ea u es played in he a a a s
game. Fu he mo e, he comple e module is e alua ed in e ms o design, unc ions and
how in ui i e i is o guide any use ega dless o his expe ience wi h echnology.

A mi amilia,
po habe hecho posible que pueda llega a se lo que siemp e quise se
A mis compa˜
ne os de piso,
po habe se con e ido en amilia y po hace de un luga ex a˜
no un hoga
A Anna Ru´
ız,
una g an amiga y uno de mis pun os de apoyo m´
as ue es du an e oda la ca e a
A Miguel y Roc
po habe in e ido iempo en aconseja me y guia me du an e odo es e abajo
´
INDICE GENERAL
INTRODUCCI ´
ON ................................. 1
CAP´
ITULO 1.LA GAMIFICACI ´
ON . . . . . . . . . . . . . . . . . . . . . . 3
1.1. Qu´
e es gami icaci´
on .............................. 3
1.2. Gami icaci´
on en el sec o labo al ....................... 4
1.2.1. P oduc i idad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
1.3. Gami icaci´
on en las aulas ........................... 5
1.3.1. Di e si´
on . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
1.3.2. Mo i aci´
on . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 6
1.3.3. Mejo a del ap endizaje . . . . . . . . . . . . . . . . . . . . . . . . 7
1.4. Aplicaciones m´
o iles pa a la gami icaci´
on . . . . . . . . . . . . . . . . . . 7
CAP´
ITULO 2.INTRODUCCI ´
ON AL PROYECTO . . . . . . . . . . . . . 9
2.1. A qui ec u a del P oyec o ........................... 9
2.1.1. He amien as ex e nas . . . . . . . . . . . . . . . . . . . . . . . . 11
2.2. Es uc u a de Classpip ............................. 12
2.2.1. Aplicaci´
on m´
o il . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12
2.2.2. Panel de adminis ado . . . . . . . . . . . . . . . . . . . . . . . . 14
2.2.3. A qui ec u a o ien ada a se icios . . . . . . . . . . . . . . . . . . . 15
2.3. Mo i aci ´
on .................................... 15
2.4. Obje i os del m´
odulo .............................. 16
CAP´
ITULO 3.ESTADO DEL ARTE . . . . . . . . . . . . . . . . . . . . . . 17
3.1. Qu´
e son a a a es ................................ 17
3.2. He amien as pa a a a a es . . . . . . . . . . . . . . . . . . . . . . . . . . 17
3.2.1. Voki . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
3.2.2. Bi moji . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
3.2.3. Classdojo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
3.3. Aspec os dis inguidos ............................. 21

´
INDICE DE TABLAS
INTRODUCCI ´
ON
La ecnolog´
ıa es una he amien a de la que cada d´
ıa se hace m´
as uso. Adem´
as las nue as
econolog´
ıas de hoy en d´
ıa es ´
an en cons an e ac ualizaci´
on, po lo que a eces se quedan
´
apidamen e obsole as. La in asi´
on del gigan e ecnol´
ogico es al que desde hace unos
a˜
nos ha pasado a es a al se icio del ap endizaje.
Desde emp ana edad los ni˜
nos ya in e ac ´
uan con able s y sma phones, po lo que in-
oduci la ecnolog´
ıa en las aulas no ha causado un g an impac o pa a ellos. Sin emba go
la b echa digi al en e los es udian es de las nue as gene aciones y los docen es es muy
g ande oda ´
ıa, po an o muchos docen es end ´
an que especializa se y conoce c´
omo
aplica el uso de las nue as ecnolog´
ıas en la educaci´
on.
Una de las he amien as ecnol´
ogicas en ocadas a un ambien e de ap endizaje es la Ga-
mi icaci´
on. U iliza las mismas din´
amicas que los juegos aplicadas al ambien e acad´
emico,
aplica pun uaciones y odo ipo de ecompensas en compe iciones indi iduales y g upa-
les y la in enci´
on de es e ´
u il es man ene la mo i aci´
on. Qu´
e es la gami icaci´
on, c´
omo
unciona, qu´
e aplicaciones exis en y qu´
e consecuencias iene u iliza la gami icaci´
on son
cues iones sob e las que habla en p o undidad en el cap´
ı ulo 1, donde adem´
as de es-
as cues iones se apo an in o maci´
on y da os de es udios eales elacionados con su
impac o.
El p op´
osi o de es e p oyec o es hace un apo e a Classpip, una aplicaci´
on de gami ica-
ci´
on desa ollada con en oque a la educaci´
on. Es a aplicaci´
on es un p oyec o colabo a i o,
desa ollado po di e sos es udian es de la EETAC. Classpip es ´
a compues o po di e en-
es piezas, que son m´
odulos au ´
onomos c eados de mane a independien e que siguen
una misma l´
ınea de desa ollo. Pues o que es e p oyec o es una pieza m´
as que se suma
a la aplicaci´
on, la pla a o ma ya es ´
a implemen ada, con una a qui ec u a de so wa e y
unas ecnolog´
ıas de desa ollo es ablecidas. Las he amien as con las que se ha abajado
pa a es e p oyec o o man pa e de la ecnolog´
ıa mode na de desa ollo pa a aplicaciones
en in e ne . Todo lo elacionado con la implemen aci´
on de Classpip y la l´
ınea de desa olo
que siguen los di e en es m´
odulos que la componen apa ece en el cap´
ı ulo 2.
La inalidad es desa olla un m´
odulo o ien ado a la c eaci´
on de a a a es. La aplicaci´
on de
Classpip, p e iamen e al desa ollo de es e m´
odulo ya dispon´
ıa de a a a es, pe o en´
ıan
p ede e minados con cada ipo de usua io. Con el apo e de un juego de a a a es, no s´
olo
se apo a c ea i idad a la aplicaci´
on, sino que ambi´
en se busca la mo i aci´
on del alumno,
que pa a pode deco a el a a a end ´
a que cumpli con los equisi os es ablecidos po
el docen e. El docen e ges iona ´
a el ma e ial pa a el a a a y concede ´
a los pe misos de
pe sonalizaci´
on a los alumnos. Mien as an o los alumnos end ´
an que es a al an o de
cumpli con los equisi os es ablecidos si quie en saca le odo el pa ido al juego.
Las secciones de adminis aci´
on que es ´
an disponibles desde el usua io del docen e se
han dise˜
nado e implemen ado de mane a que el mecanismo pa a c ea el juego de a a a-
es sea sencillo. Las ideas pa a implemen a y dise˜
na es os apa ados pueden e se con
de alle en el cap´
ı ulo 4.
El documen o se ha o ganizado de al mane a que se pueda segui el hilo sob e el que se
ha desa ollado el p oyec o. Pa a empeza es p imo dial la in oducci´
on a la Gami icaci´
on,
que es el concep o en o no al que gi a el p oyec o. O o de los concep os con mayo
impo ancia es Classpip y las he amien as de so wa e que han pe mi ido su desa ollo.
1
2 Juego de a a a es pa a una he amien as de gami icaci´
on
Adem´
as se in oduce la idea de a a a en el cap´
ı ulo 3, a pa i de d´
onde nace es e nue o
m´
odulo. Po ´
u ilmo se hace incapi´
e en el desa ollo del juego de a a a es, incluyendo
de alles de so wa e y he amien as ex e nas.
Pa a culmina , con expec a i as de pode mejo a en un u u o, se ecogen da os a ce ca
de una e aluaci´
on de la aplicaci´
on. Qu´
e an in ui i a es, si el dise˜
no es ap opiado pa a el
p´
ublico al que a di igida son algunas de las cues iones que se exponen en la e aluaci´
on.
CAP´
ITULO 1. LA GAMIFICACI ´
ON
El c ecien e uso de sma phones, able s y o os muchos disposi i os ecnol´
ogicos en e
los ni˜
nos ha p o ocado que los m´
e odos de ense˜
nanza adicionales queden algo obsole-
os.
La b echa digi al que se ha abie o en e docen es y es udian es es e iden e, y ha lle ado
a combina la educaci´
on con la ecnolog´
ıa. El obje i o es implica a una nue a gene aci´
on
de es udian es digi ales pa a hace las clases m´
as mo i ado as. Los ni eles, pun os, an-
kings, las me as y obje i os o c ea equipos pa a el desa ollo de a eas como si de un
ideojuego se a ase, son m´
e odos pa a gami ica un aula.
Teniendo en cuen a es a nue a necesidad de con e i el ap endizaje en una especie de
juego nace Classpip, una aplicaci´
on del Depa amen o de A qui ec u a de Compu ado es
de la Uni e sidad Poli ´
ecnica de Ca alu˜
na desa ollada po es udian es uni e si a ios. La
aplicaci´
on es accesible desde cualquie o denado , disposi i o m´
o il o able .
El obje i o de es e p oyec o es c ea un juego de a a a es que se inco po a a Classpip
pa a que los usua ios puedan ene una ep esen aci´
on g ´
a ica en la aplicaci´
on. De es a
mane a se puede apo a un oque m´
as pe sonal al juego.
1.1. Qu´
e es gami icaci´
on
La gami icaci´
on es una ´
ecnica que in eg a es a egias de juego en di e en es ´
ambi os no
l´
udicos, y iene como obje i o mo i a y ameniza las a eas lle adas a cabo en dichos
´
ambi os. Los sec o es que han implemen ado mayo i a iamen e es a ´
ecnica son: el labo-
al y el acad´
emico. La gami icaci´
on en los negocios po encia aspec os psicol´
ogicos den o
de los p ocesos emp esa iales, mien as que en la educaci´
on hace del ap endizaje algo
di e ido y lle ade o. Median e la mo i aci´
on, se consigue un desa ollo e icien e de las
a eas lle adas a cabo po los suje os que abajan con he amien as de gami icaci´
on. Las
ecompensas, pun uaciones y los ankings pe mi en da econocimien o, incen i ando as´
ı
el ´
animo de supe aci´
on.
Pa a man ene la expec aci´
on de los jugado es, es necesa io es a cons an emen e in-
no ando en el juego. Compe iciones, insignias y p i ilegios son algunos elemen os que
pueden u iliza se. Las din´
amicas de juego se basan en ac i idades con una de e mina-
da es uc u a, o ien adas a un p op´
osi o u o o. Dichas ac i idades hay que dinamiza las,
ambien a las pa a que esul en ag adables y di e idas de ca a al p´
ublico.
Las compe iciones se pueden u iliza como m´
e odo de e aluaci´
on cada cie o iempo.
Pues o que mues an un anking de pun uaci´
on, queda econocido el m´
e i o de los compe-
ido es y conlle a a ecompensa a los mejo es posicionados. Es a ecompensa ob enida
es el es el incen i o pa a despe a la mo i aci´
on del usua io que, si su e e ec o, implica
la p og esi´
on de las cualidades del indi iduo.
Pa a ene una idea menos abs ac a, pongamos un ejemplo. El docen e puede asigna
pun os a los es udian es po di e en es mo i os como pun ualidad o buen compo amien-
o. La suma de odos es os pun os du an e un pe iodo de iempo lle a a clasi ica a los
alumnos den o de un anking. Los es p ime os pod ´
an op a a di e en es p i ilegios co-
mo sen a se con el compa˜
ne o que quie an en clase o pode epe i una p egun a de
3

4 Juego de a a a es pa a una he amien as de gami icaci´
on
ex´
amen.
En los siguien es apa ados se exponen di e en es en o nos en los que puede aplica se
la gami icaci´
on.
1.2. Gami icaci´
on en el sec o labo al
El mundo emp esa ial y el sec o docen e son los p incipales consumido es de m´
e odos
de gami icaci´
on, sin emba go los obje i os inales son di e en es.
En los ´
ul imos a˜
nos g andes emp esas de odo el mundo han inco po ado la gami icaci´
on
pa a pode alcanza a ios obje i os, ya sea pa a mejo a la e iciencia de los abajado es,
aumen a las en as de un p oduc o, op imiza los p ocesos de onboa ding o mejo a la
o maci´
on del pe sonal, es una he amien a que puede esul a ´
u il en mul iples ´
a eas.
Buscando in o maci´
on y documen andose sob e la gami icaci´
on, no hay a ´
ıculo que de
una mala opini´
on sob e es a he amien a, pe o pa a i un poco m´
as all´
a es p e e ible
sabe la opini´
on di ec a de la pe sona que ealmen e abaja en un en o no gami icado.
El es udio ”The 2018 Gami ica ion A Wo k” de Talen MLS ecoge encues as a di e en es
usua ios de gami icaci´
on pa a que podamos isualiza po qu´
e es endencia.
Como esul ado gene al, un 80% de los en e is ados se di ie e aplicando la gami ica-
ci´
on en sus a eas del abajo. Den o de es e en o no se u ilizan las clasi icaciones po
ni eles, pun os, insignias, ecompensas y ablas de clasi icaci´
on. De odo es o lo alo ado
como m´
as mo i ado ue on las clasi icaciones po ni eles, mien as que lo peo pun uado
ue on las ecompensas. La clasi icaci´
on apa ece en el siguien e g ´
a ico, donde adem´
as
de clasi ica de mejo al peo pun uado, a la de echa apa ece la alo aci´
on sob e 5 que ha
ecibido cada elemen o.
Figu a 1.1: Ranking de elemen os de gami icaci´
on
Lo que las emp esas p e enden es que la gami icaci´
on enga un impac o en sus emplea-
dos, al que su p oduc i idad y mo i aci´
on aumen e, as´
ı que a con inuaci´
on e emos qu´
e
CAP´
ITULO 1. LA GAMIFICACI ´
ON 5
es lo que opinan sob e es o los que han espondido a las encues as pa a es e es udio.
1.2.1. P oduc i idad
La de inici´
on de p oduc i idad es la can idad de abajo que un empleado es capaz de
ealiza en un de e minado pe ´
ıodo de iempo. La opini´
on subje i a de los usua ios, al y
como e lejan los g ´
a icos que apa ecen a con inuaci´
on es que la gami icaci´
on les hace
m´
as p oduc i os.
Figu a 1.2: Impac o po enciado de la p oduc i idad
No es so p enden e que al hace de una a ea un juego, sea m´
as amena, y es que el
87% de los suje os que han pa icipado en el es udio de Talen MLS han a i mado que
la gami icaci´
on s´
ı que ha po enciado su p oduc i idad. En un es udio simila del 2014, el
79% ya a i maban es a cues i´
on,po an o a medida que la gami icaci´
on se a ab iendo
paso en el mundo labo al los empleados se comp ome en m´
as con la causa.
1.3. Gami icaci´
on en las aulas
En la educaci´
on odo lo que se p e ende es man ene mo i ado al es udian e pa a que la
a ea de es udia no suponga un es ue zo. Hace un examen o hace los debe es dejan de
se a eas se ias y abu idas. Aplicando la gami icaci´
on, como si de un juego se a ase,
iene como consecuencia consegui una ecompensa pa a in en a es a en e los mejo-
es clasi icados del anking. Todas las din´
amicas de juego que se aplican, o ecen como
inalidad lle a al alumno a implica se en el juego pa a comple a sus obje i os educa i os.
Pa a alo a la expe iencia del alumnado, se iene como e e encia un a ´
ıculo que es udia
el uso de la gami icaci´
on en la ense˜
nanza supe io , conc e amen e en la Asigna u a de
De echo Romano de la Uni e sidad Au ´
onoma de Mad id.
Pa a omen a la a enci´
on en las clases Magis ales y la mo i aci´
on pa a el ap endizaje de
la asigna u a Se lle a on a cabo dos ipos de ac i idades, una de ellas con la he amien a
Kahoo , du an e el inal de las clases Magis ales y o a de ellas es la c eaci´
on de un Juego
a a ´
es de un Moodle pa a hace un epaso inal de la asigan u a de ca a al Examen inal.
6 Juego de a a a es pa a una he amien as de gami icaci´
on
Figu a 1.3: P egun a de e aluaci´
on ealizada con Kahoo
Ambas p uebas ienen como obje i o mejo a el ap endizaje, pa a as´
ı ene un m´
e odo de
e aluaci´
on complemen a io a las p uebas cali ica o ias y de e aluaci´
on. Pe o, ¿Cu´
al es el
obje i o en o no al que gi a es a in e igaci´
on? Pues bien hay a ios es udios aplicando
la gami icaci´
on en di e en es ca ego ´
ıas de educaci´
on, pe o los da os que apo aban e an
escasos. As´
ı que el p op´
osi o de ´
es e es udio es comp oba emp´
ı icamen e cu´
ales e an
los e ec os de es as nue as ´
ecnicas de ap endizaje.
1.3.1. Di e si ´
on
A la p egun a ”¿Ha sido di e ido compe i con o os?”, un 65% de es udian es es ´
a com-
ple amen e de acue do, o o 31% es ´
a m´
as bien de acue do, mien as que s´
olo hay un
es udian e que ha espondido es a m´
as bien en desacue do y o o que se mues a neu-
al.
Figu a 1.4: Respues as a la p egun a ”¿Ha sido di e ido compe i con o os?”@
Los esul ados ecogidos mues an que la di e si´
on es uno de los ac o es p incipales
que lle an al es udian e a in oluc a las he amien as de gami icaci´
on. Da un a˜
nadido de
di e si´
on iene un e ec o que disminuye la ensi´
on del ambien e uni e si a io, que suele
se mucho m´
as se io que el ambien e de cualquie es udio de educaci´
on in e io .
1.3.2. Mo i aci´
on
Con es ando la p egun a “El uso de Kahoo me ha mo i ado a asis i a clase”, un 38,4%
delos encues ados es ´
a comple amen e de acue do, un 18,2% de los pa icipan es es ´
an
CAP´
ITULO 1. LA GAMIFICACI ´
ON 7
m´
as bien de acue do, mien as que un 38,2% se man iene neu al y un 5,5% es ´
a en
desacue do.
Respec o a la mo i aci´
on, los di e en es da os ecogidos e lejan que una mayo ´
ıa de
los alumnos ha conseguido sen i se m´
as mo i ada pa a asis i a clase y man ene una
mayo an enci´
on. Dependiendo de la pe sona el ni el de mo i aci´
on e a mayo o meno ,
a algunos les p opo cionaba un n´
ı el de mo i aci´
on al o mien as que en o os no su ´
ıa
e ec o.
1.3.3. Mejo a del ap endizaje
La a i maci´
on e e ida al ap endizaje, “C eo que Kahoo ha mejo ado mi ap endizaje de
la ma e ia De echo Romano”, es apoyada po el 32,7% que es ´
an comple amen e de
acue do y po un 41,8% que dice es a m´
as bien de acue do, con as ando con un 3,6%
que opina que es ´
a m´
as bienen desacue do y un 20% que se man iene neu al espec o
a lacues i´
on.
La mayo ´
ıa de los es udian es a i ma habe log ado una mejo a en las ´
ecnicas de ap en-
dizaje de De echo Romano g acias a las he amien as de gami icaci´
on. Hay que ene en
cuen a que es os esul ados se basan en la expe iencia pe sonal del usua io, no en los
esul ados e lejados po las p uebas de e aluaci´
on, mo i o po el que se p e ende hace
un es udio a pos e io i de la e oluci´
on basado en las p uebas de e aluaci´
on pa a e el
e ade o impac o de la e oluci´
on.
Concluyendo con los esul ados gene ales, la expe iencia de in oduci una aplicaci´
on de
gami icaci´
on en la ma e ia de De echo Romano, ha esul ado una expe iencia di e ida,
mo i ado a e incluso ha conseguido mejo a el ap endizaje de los usua ios.
1.4. Aplicaciones m´
o iles pa a la gami icaci´
on
Desde que el uso de la gami icaci´
on se ha ido ex endiendo, han apa ecido nume osas
aplicaciones pa a m´
o il que se ´
ıan como he amien a de gami icaci´
on. P ime o habla-
emos de Kahoo , la aplicaci´
on u ilizada en el expe imen o de la asigna u a de De echo
Romano del que hemos hablado en el apa ado an e io . Despu´
es p esen a emos A i i y,
una pla a o ma que se u iliza como he amien a de gami icaci´
on en emp esas.
•Kahoo
Kahoo es una he amien a de gami icaci´
on que u iliza pa a ap ende y epasa
concep os de cualquie ipo de una mane a muy en e enida. Pun ua no s´
olo el
ace a la espues a co ec a, sino ambi´
en la elocidad con laque se esponde,
pun uando mucho m´
as al o con o me menos iempo se haya a dado en esponde .
De mane a an´
aloga, si se come e un allo la pun uaci´
on es a y cuan o meno sea
el iempo en come e el allo, m´
as son los pun os nega i os. La inalidad de es o es
c ea un anking po pun os en el que apa ezcan odos los pa icipan es.
Cualquie pe sona puede c ea ¨
un Kahoo ”, un es de p egun as cualesquie a. Pa a
hace que o as pe sonas pa icipen en el es c eado Kahoo asigna un n´
ume o PIN
al es c eado, pa a que ´
es e apa ezca al in oduci lo en la aplicaci´
on m´
o il.
14 Juego de a a a es pa a una he amien as de gami icaci´
on
cen e. Sin emba go un es udian e no puede e la lis a de alumnos de oda la clase
ni mucho menos in e ac ua con ´
es a.
Figu a 2.5: Apa ado Mi Pe il Figu a 2.6: Localizaci´
on Escuela
•Adminis ado
El adminis ado de la escuela iene el mismo men´
u que los dos oles explicados an-
e io men e, pe o ´
es e iene le posibilidad de e odos los es udian es de la escuela
egis ados en la aplicaci´
on (ya no de una sola clase) y adem´
as ambi´
en puede e
la lis a de docen es del cen o.
(a) Men´
u inicio (b) Apa ado Mi Pe il (c) Lis a de alumnos de cla-
se
Figu a 2.7: Vis a aplicaci´
on m´
o il pa a Docen e
2.2.2. Panel de adminis ado
Ya hemos is o las uncionalidades que iene el panel del adminis ado en la aplicaci´
on
m´
o il, pe o el adminis ado , pues o que su papel conlle a a eas di e en es a las ac i i-

CAP´
ITULO 2. INTRODUCCI ´
ON AL PROYECTO 15
dades que se ealizan en clase y le pueden lle a bas an e iempo, es m´
as c´
omodo que
acceda desde la e si´
on pa a o denado , o lo que llamamos ”dashboa d”.
Figu a 2.8: Dashboa d de Classpip
2.2.3. A qui ec u a o ien ada a se icios
La a qui ec u a o ien ada a se icios es uno de los componen es m´
as impo an es de la
aplicaci´
on. La aplicaci´
on de Loopback apo a una REST API que nos pe mi e adminis a
y ealiza ope aciones con la base de da os. En la API se exponen los modelos que se
an c eando y pa a cada uno de ellos con iene ope aciones pos , ge , pa ch y odo ipo de
unciones de p o ocolo h p.
2.3. Mo i aci´
on
El mo i o de desa olla un m´
odulo de a a a es pa a la aplicaci´
on iene del p ime blo-
que que u´
e desa ollado pa a Classpip. Fe ´
an es el alumno que apo ´
o el desa ollo de
la a qui ec u a pa a la aplicaci´
on, sen ando las bases y componen es necesa ios pa a
cons ui la pla a o ma de gami icaci´
on.
En su memo ia, Fe an explica qu´
e es un P oduc o Viable M´
ınimo (MVP, del ingl´
es Mini-
mum Viable P oduc ), un p oduc o con una se ie de ca ac e ´
ıs icas hechas pa a sa is ace
al clien e y p opo ciona una eacci´
on posi i a pa a un u u o desa ollo del mismo. Todo
es o o ma pa e de la es a egia a segui pa a come cializa un p oduc o. Las ca ´
ac e ´
ıs i-
cas que de inen al MVP es ´
an en ocadas a los clien es que se p e enden cap a , as´
ı el
p oduc o end ´
a una mayo acogida.
Uno de los equisi os que se de inen en ese MVP es que cada alumno debe ´
ıa pode
cambia su a a a , po an o de aqu´
ı nacela necesidad de c ea un juego de a a a es pa a
la clase. En los p ime os p oyec os desa ollados pa a Classpip ya hab´
ıa a a a es, pe o
e an una simple o o. Se p e ende que el a a a sea algo m´
as que eso, el alumno pod ´
a
cons ui lo den o de la aplicaci´
on y dependiendo de su pa icipaci´
on en clase, end ´
a
opci´
on a pe sonaliza lo m´
as o menos. La inalidad del a a a es da le juego a la aplicaci´
on
de la misma mane a que lo hace cualquie o o m´
odulo pe o con uncionalidades dis in as.
16 Juego de a a a es pa a una he amien as de gami icaci´
on
2.4. Obje i os del m´
odulo
Un paso p e io al desa ollo del p oyec o es plan ea una se ie de obje i os. En es e caso
el obje i o del p oyec o es implemen a una aplicaci´
on m´
o il pa a apo a a Classpip un
juego de a a a es. Las uncionalidades que p e enden desa olla se, son las lis adas a
con inuaci´
on:
•C ea clases con un lis ado de alumnos p opio. Cada clase end ´
a un iden i icado
(nomb e) p opio y un juego de a a a es que po de ec o es a ´
a desac i ado.
•A˜
nadi y elimina alumnos de la lis a de clase.
•Pode e el lis ado de alumnos que pe enece a cada clase con algunos da os.
•Ac i a y desac i a el juego de a a a es de cada clase cuando se c ea con enien e.
•A˜
nadi una amilia de a a a es. Cada juego end ´
a opci´
on a c ea una amilia de
pe sonas o de o o en e como puede se un mons uo.
•Dise˜
na unos equisi os pa a adminis a p i ilegios que pe mi an pe sonaliza el
a a a . El docen e se enca ga ´
a de es ablece cu´
ales son los obje i os a cumpli
pa a pode elegi un peinado o cualquie o o elemen o disponible.
•Concede los p i ilegios a los alumnos manualmen e, cuando el p o eso c ea ne-
cesa io.
•C ea un a a a , cuyo dise˜
no depende ´
a de los equisi os que el docen e haya es-
ablecido. Po ejemplo si el p i ilegio de cambia los ojos no ha sido concedido, el
alumno no pod ´
a pone le ojos al a a a .
•Ca ga una is a de la lis a de clase con los a a a es pe sonalizados de cada
alumno.
•A˜
nadi una gale ´
ıa de ma e ial, desde donde el p o eso pueda ca ga y e los
a chi os de im´
agen pa a c ea el a a a .
La es uc u a del p oyec o iene dos pila es, que son los oles de usua io que exis en en la
aplicaci´
on, el alumno y el p o eso . Una ez den o de la aplicaci´
on, encon amos odas las
unciones pa a adminis a el juego en la pa e del p o eso , mien as que en la pa e del
es udian e la a ea m´
as impo an e que se desempe˜
na es la de deco a el a a a . Ambos
oles pe mi en modi ica algo de la in o maci´
on pe sonal de la cuen a como la con ase˜
na,
que es la ´
unica acci´
on com´
un.
La im´
agen que apa ece jus o en es a secci´
on (??) si e pa a ene una lige a idea de
qu´
e es ´
a al alcance de cada usua io y qu´
e apo a es e nue o m´
odulo. C´
omo unciona el
m´
odulo y qu´
e mec´
anica lle a el c´
odigo de la aplicaci´
on se de allan m´
as adelan e en los
cap´
ı ulos 5y6, espec i amen e.
CAP´
ITULO 3. ESTADO DEL ARTE
3.1. Qu´
e son a a a es
A a a es un concep o cuyo signi icado iene a ias de iniciones, dependiendo del ´
ambi o
en el que se u ilice. Mien as que an a˜
no, en el hinduismo un a a a se conside a una
enca naci´
on del dios Visn´
u, pasando a oma apa iencia humana o animal; Ac ualmen e
en el mundo occiden al se asocia a un elemen o g ´
a ico que ep esen a a un usua io en
el ´
ambi o de la in o m´
a ica y la ecnolog´
ıa.
La a ian e del concep o de a a a que se u iliza es la que se ex iende al mundo digi-
al. Aplicaciones, edes sociales y p og amas in o m´
a icos pe mi en que sus usua ios se
iden i iquen median e alg´
un ecu so g ´
a ico.
La Web 2.0 o web social ue la p ime a he amien a en u iliza es e ecu so, c eando una
ed en la que los usua ios in e ac ´
uan en e s´
ı y se con ie en en usua ios ac i os. El
en´
omeno social empezaba a desa olla se con la suceso a de la Web 1.0, dando paso
a blogs, edes sociales, espacios web colabo a i os como Wikipedia, pla a o mas como
Google D i e o You ube. Toda es a can idad de pla a o mas y se icios han conseguido
c ece g acias a que los p opios usua ios e an a la ez pa ´
ıcipes del con enido de ´
es as.
Desde es e boom de la web 2.0 se han is o di e en es ipos de a a a es, desde los m´
as
b´
asicos has a los que se mue en, ienen masco as y complemen os y ienen oz p opia.
Figu a 3.1: Bus o de a a a Figu a 3.2: A a a con complemen os
3.2. He amien as pa a a a a es
En es a secci´
on se han ecopilado di e en es aplicaciones de a a a es que u ilizan ac ual-
men e pla a o mas de docencia o edes sociales.
El p op´
osi o de e las cualidades de cada una de ellas, es pode ex ae ideas pa a a
pa i de ´
es as, idea los a a a es que se inco po a ´
an en Classpip.
17
18 Juego de a a a es pa a una he amien as de gami icaci´
on
3.2.1. Voki
Voki es una he amien a que acili a el dise˜
no de a a a es pe sonalizados en 2 dimensio-
nes. Una de las ca ac e ´
ıs icas de es a aplicaci´
on es que sus pe sonajes pueden mo e se
e incluso se les puede a˜
nadi oz. Se nos o ece la posibilidad de elegi un pe sonaje y un
ondo. De en e los pe sonajes se puede escoge una pe sona, pol´
ı ico, amoso, animal o
pe sonaje de c´
omic. La opa del a a a ambi´
en es pe sonalizable, den o de la a iedad
que mues a la p opia aplicaci´
on y el ondo puede se uno de los p opo cionados po la
p opia he amien a, o bien puede se una apo aci´
on p opia subiendo una imagen cual-
quie a. Podemos cambia el colo de la piel, de los ojos, la o ma del pelo, e c.
Figu a 3.3: Edi o de a a a en Voki
Una de las en ajas que o ece Voki es que pe mi e o ganiza clases, pa a que se pueda
u iliza en el ´
ambi o docen e. Se pueden con igu a clases y pe mi e que los es udian es
accedan a sus a eas.
3.2.2. Bi moji
Bi moji es una aplicaci´
on que pe mi e c ea un a a a pe sonalizado. Es ´
a disponible en la
ienda de Ch ome, y hay una aplicaci´
on disponible pa a And oid e iOS. Tambi´
en exis e la
posibilidad de accede a la cuen a de Bi moji a a ´
es de la web.
Muchas o as aplicaciones de las m´
as u ilizadas po los usua ios, ienen in eg ada la apli-
caci´
on de Bi moji, como Snapcha , Facebook, Facebook Messenge , Gmail, Gboa d, Slack
e iMessage. En caso de que la aplicaci´
on no es ´
e in eg ada di ec amen e, simplemen e
se puede copia y pega el a a a pa a u iliza lo.
Pa a hace un Bi moji, an solo hay que desca ga la aplicaci´
on. Luego, la imagen se
puede gua da y compa i , o se puede sinc oniza con Snapcha . Una ez c eada se
puede segui edi ando an as eces como se quie a. Adem´
as de la p opia c eaci´
on del
a a a pe sonalizado, pe mi en bas an es opciones pa a deja lo al gus o del usua io. Se
puede cambia la opa del a a a , cuyo a ma io a cambiando con el iempo y en elaci´
on
CAP´
ITULO 3. ESTADO DEL ARTE 19
a e en os. Los e en os depo i os suelen ae opa depo i a que se a˜
nade al es ua io,
y emp esas como Pixa sacan packs de ex ensi´
on de los pe sonajes de sus pel´
ıculas.
Figu a 3.4: Edi o de a a a en Bi moji
3.2.3. Classdojo
Classdojo es una pla a o ma c eada pa a ges iona el aula con la que pueden in e ac ua
p o eso es, pad es y es udian es. Que pueda habe es ipos de usua ios quie e deci que
las uncionalidades a ´
ıan, as´
ı que a con inuaci´
on e meos en qu´
e consis e el papel de
cada uno de ellos.
•Cuen a de docen e
Un aula puede es a adminis ada po uno o a ios p o eso es, y de la misma ma-
ne a un p o eso puede es a al ca go de a ias aulas.
El p o eso a˜
nade a los es udian es y adminis a las aulas, eniendo la posibilidad
de c ea an as clases como c ea necesa ias. Como odo juego iene un sis ema
de asignaci´
on de pun os, que depende en odo momen o del p o eso . Si los pun-
os es an o suman, y qu´
e can idad de pun os se a ibuye a cada alumno ecae
di ec amen e sob e el docen e. O a unciones disponibles pa a el p o eso son la
mensaje ´
ıa di ec a con los pad es y asigna insignias como las de la igu a 3.5 a los
alumnos.
Figu a 3.5: Panel de insignias

20 Juego de a a a es pa a una he amien as de gami icaci´
on
Algo que es de g an u ilidad pa a el docen e son los in o mes que gene a Classdojo.
Re lejan la e oluci´
on de la clase omando como da os e e en es el compo amien o
y la pun uaci´
on de los es udian es. Los da os de es os in o mes pueden expo a se
a un iche o excel en caso de que se desee.
Figu a 3.6: In o me de e oluci´
on de la clase
•Cuen a de alumno
El es udian e es el ol que menos juego iene en la aplicaci´
on. Puede pe sonaliza
un peque˜
no mons uo a modo de a a a y ambi´
en e las pun uaciones e insignias
que le ha asignado el p o eso .
Figu a 3.7: Mons uo pe sonalizado
•Cuen a de pad e
La amilia del es udian e puede pa icipa ambi´
en en Classdojo. Un pad e puede
ene has a a ios alumnos a su ca go. Es a al an o de cu´
ales han sido las a-
lo aciones del docen e, pone se en con ac o con el p o eso a a ´
es de mensajes
p i ados y isualiza la in o maci´
on online son las opciones al alcance de es e ipo
de usua io. Cabe deci que odas es as uncionalidades an ligadas a los alumnos
de los que se hace ca go el pad e, es deci , no es posible que ea la in o maci´
on de
o as asigna u as, ni las cali icaciones de o os es udian es.
Una aplicaci´
on g a ui a y accesible desde cualquie pla a o ma web, iOS y And oid con
e siones en si e en es idiomas. Todas es as ca ´
ac e ´
ıs icas con ie en a Classdojo en
una he amien e muy ´
u il pa a la docencia.
CAP´
ITULO 3. ESTADO DEL ARTE 21
3.3. Aspec os dis inguidos
En es a secci´
on se ecogen algunas de las ca ac e ´
ıs icas que pod ´
ıan esul a de inspi-
aci´
on pa a desa olla el m´
odulo de a a a es.
Bi moji, dispone de una unci´
on ´
unica de la que pocas aplicaciones de c eaci´
on pueden
a da . No solo iene muchisima a iedad de ca as, peinados y complemen os, adem´
as
es capaz de cons ui un a a a a pa i de un ”sel ie”. Es quiz´
a la pa e m´
as a ac i a del
m´
odulo, pese a que supone ene un manejo ex ao dina io de lib e ´
ıas de econocimien o
acial y pod ´
ıa lle a mucho iempo desa olla algo simila .
Tambi´
en cabe dis ingui que las celeb aciones especiales me ecen una es imen a o com-
plemen os especiales a eces. La Na idad, e ano, Pascua, o incluso ca na al pueden
pasa a o ma pa e del mundo del a a a en Bi moji. Rompe un poco con la mono on´
ıa
del a a a y pod ´
ıa man ene a los es udian es m´
as mo i ados si el juego a cambiando
dependiendo de la ´
epoca del a˜
no.
De Classdojo lo que des aca po su sencillez es el edi o de a a a es. Es un dise˜
no muy
´
acil de implemen a , unciona con coo denadas de p o undidad, as´
ı supe poniendo unos
elemen os sob e o os se cons uye el a a a con odos sus componen es. Es una de las
ca ac e ´
ıs icas que se end ´
an en cuen a a la ho a de implemen a el dise˜
no del a a a .
Algo de Classdojo que ambi´
en puede esul a a ac i o a la ho a de escoge una aplica-
ci´
on de gami icaci´
on pa a el en o no docen e es inclui a los pad es en una aplicaci´
on.
Pa a es udian es de emp ana edad sob e odo, puede se econ o an e que los pad es
puedan es a al an o del compo amien o de sus hijos y ene un canal de comunicaci´
on
di ec o con el docen e. Pe o es e ma iz no iene sen ido en un juego de a a a es, quiz´
a
pueda esul a ´
u il de ca a al desa ollo de u u os m´
odulos de Classpip.
Lo m´
as ascinan e de Voki es que los a a a es puedan ene oz. No es una oz p eg aba-
da, es la oz del usua io que g abada con el mic o in e no del o denado queda egis ada
en la aplicaci´
on. O a unci´
on que le da ´
ıa un papel al a a a que no uese s´
olo isual.
CAP´
ITULO 4. CONCEPTO DE DISE ˜
NO
Como concep o b´
asico de un buen dise˜
no es imp escindible ene en cuen a las opciones
a las que pueden accede los dos ipos de ol que acoge el m´
odulo.
Los men´
us del p o eso y del alumno son comple amen e di e en es. De hecho, el ol del
p o eso es ´
a pensado pa a hace de adminis ado ealmen e, y po an o end ´
a el pode
de concede pe misos y adminis a las bases de da os a las que accede el juego.
4.1. Modelo de juego
Son a ias las mane as de da le juego a es e m´
odulo. El usua io que iene au o izado
pone en ma cha el m´
odulo de a a a es es el que iene el ol de p o eso . T as inicia
sesi´
on, el p o eso puede e sus clases y c ea un juego de a a a es pa a cada una de
ellas.
El m´
odulo es ´
a pensado pa a a˜
nadi una imagen ca ac e ´
ıs ica a cada alumno, que pod ´
a
es a dise˜
nada como es e quie a. El a a a pod ´
a ene es elemen os que i ´
an a iando
los usua ios a su gus o, como el pelo, los ojos y alg´
un complemen o. La g acia del jue-
go eside en que pa a modi ica es os elemen os, los usua ios deben ene pe miso del
adminis ado , y es que cada uno de los elemen os iene una condici´
on a cumpli pa a
consegui el pe miso.
En el apa ado mi pe il apa ecen los da os del usua io, que pod ´
a modi ica siemp e y
cuando c ea necesa io median e un o mula io de en ada. gale ´
ıa de ma e ial con end ´
a
odos los elemen os que pod ´
an usa se pa a pe sonaliza los a a a es, exis iendo la po-
sibilidad de a˜
nadi y elimina cuan os elemen os sean necesa ios. Una ez es ´
e ac i ado
el m´
odulo de a a a es, los alumnos que u ilicen la pla a o ma, encon a ´
an un bus o de
a a a desnudo al en a po p ime a ez a ´
es a, que se le asigna po de ec o cuando se
ac i a el m´
odulo de a a a es en la aplicaci´
on.
De mane a an´
aloga a oma la decisi´
on de ac i a el m´
odulo de a a a es pa a cada cla-
se, el docen e ambien decide, den o de cada clase, qu´
e alumnos pueden modi ica los
elemen os del a a a . Pa a es o end emos 3 elemen os pa a modi ica : pelo, ojos y com-
plemen os. La is a que apa ece de la lis a de alumnos de una clase mues a, a pa e
de los da os pe sonales de cada alumno, es as 3 casillas de elemen os pe enecien es
al a a a . Pa iendo de la in o maci´
on que con iene dicha lis a, el p o eso puede gene a
una is a de los a a a es, pa a pode mos a a sus alumnos en clase c´
omo se en odos
los a a a es de los miemb os de clase, lo supone que cada alumno puede e su a a a
pe o no el del es o.
4.2. Dise˜
no uncional
En es a secci´
on se explica c´
omo se an a dise˜
na las unciones de la aplicaci´
on de mane a
que cub a lo que se ha especi icado en los obje i os del p oyec o.
23
30 Juego de a a a es pa a una he amien as de gami icaci´
on
Figu a 4.8: Despliegue de pan allas pa a Mis clases
Figu a 4.9: Apa ado ”Juego de a a a es”pa a el ol del alumno
La secci´
on pe misos simplemen e accede a una pan alla en las que apa ecen las con-
diciones pa a consegui los pe misos pa a cambia el pelo, los ojos, complemen os del
a a a o e la lis a comple a de a a a es, con un indicado e de que indica que es ´
a
ac i o en ojo que signi ica que no es ´
a ac i ado.
Figu a 4.10: Vis a de ”Pe misos¨ desde el ol de alumno
Pa a pe sonaliza el a a a , el panel es muy in ui i o. Se mues a en una imagen cen al
el bus o desnudo del a a a y en un men´
u colocado en la pa e m´
as baja de la pan alla
3 bo ones sin ex o, con iconos que ep esen an los ojos, el pelo y los complemen os
del a a a . Cada bo ´
on desplega una gale ´
ıa de im´
agenes que con ien peinados, ojos y
complemen os espec i amen e. El usua io s´
olo pod ´
a accede a las gale ´
ıas que es e
au o izado.

CAP´
ITULO 4. CONCEPTO DE DISE ˜
NO 31
Figu a 4.11: Men´
u pa a pe sonaliza el a a-
a
Figu a 4.12: Elemen os pa a pe sonaliza el
a a a
Al selecciona una imagen de la gale ´
ıa de cualquie a de los apa ados, apa ece ´
a un ick
e de sob e la imagen que se haya seleccionado, y al pulsa en el OK que apa ece a iba
a la de echa, se e ocede a la is a p incipal que mos a ´
a el a a a con el pelo, ojos o
complemen o que se haya elegido.
Es as son odas las pan allas dise˜
nadas pa a implemen a en la aplicaci´
on, cuyo aspec o
y unciones pod ´
an a ia en unci´
on de las necesidades que ayan su giendo.
CAP´
ITULO 5. ENTIDADES DE LA BASE DE
DATOS
Median e una aplicaci´
on llamada Loopback, es posible c ea una API (Applica ion P o-
g amming In e ace) que adem´
as de con ene los da os de odos los usua ios, u iliza se -
icios que ecogen una se ie de p o ocolos y unciones pa a in e cambia da os en e
aplicaciones. Den o de es a aplicaci´
on hay a ios sis emas de ges i´
on de bases de da os
de c´
odigo abie o, de los que he escogido “In Memo y”, uno de los sis emas de c´
odigo
abie o que almacena los da os en la memo ia local.
5.1. Modelos
Los modelos ep esen an in o maci´
on con la que a a abaja el con olado , es ´
an de ini-
dos con a ibu os y se especi ica qu´
e ipo de in o maci´
on iene cada a ibu o. Si enemos
un a chi o con las ca ac e ´
ıs icas del modelo, el con olado y la is a HTML pueden co-
noce ambi´
en qu´
e p opiedades iene y c´
omo es ´
a es uc u ado.
Los modelos que han sido necesa ios pa a pode alcanza los obje i os p opues os en la
aplicaci´
on son cinco: pe sona, ma ´
ıcula, clase, imagen, con enedo y pe miso. A con i-
nuaci´
on se dan odo ipo de de alles a ce ca de los a ibu os de cada uno de ellos.
•Pe sona
La aplicaci´
on pide como da os de en ada un usua io y una con ase˜
na, da os que
debe ´
ıan se ´
unicos pa a cada pe sona que u ilice la aplicaci´
on y un modelo pe sona
es lo ideal pa a pode almacena es os da os.
En es e modelo se disponen de es a ibu os,un nomb e de usua io, una con a-
se˜
na y un a ibu o que ep esen e el ol de la pe sona. La unci´
on del ol es que la
aplicaci´
on pueda de ec a si la pe sona que ha iniciado sesi´
on es p o eso o alumno,
que esos se ´
an los dos ´
unicos alo es que pueda oma es e a ibu o.
•Clase
Todas las pe sonas con sus espec i os da os es a ´
an dis ibuidas en clases. As´
ı
que un modelo llamado clase a a con ene los da os de odas las asigna u as que
impa e el p o eso . En caso de que haya que adminis a m´
as de una clase al i a
e el lis ado de alumnos se pedi ´
a como pa ´
ame o de en ada el iden i icado de
la clase, pa a pode mos a los da os de odos los miemb os de la clase que se
co esponda con el iden i icado .
La clase end ´
a como a ibu os un iden i icado , pa a que el p o eso pueda sabe
de qu´
e clase se a a, un adminis ado , una a ibu o llamado a a a es, pa a indica
si el juego es ´
a ac i ado o no, una amilia de a a a es, acompa˜
nada de un a ibu o
al que llama emos bus o, pa a gua da el iche o del bus o de la amilia de a a a es,
y po ´
ul imo cua o a ibu os pa a gua da los cua o p i ilegios que se conceden en
el juego.
33
34 Juego de a a a es pa a una he amien as de gami icaci´
on
•Ma ´
ıcula
Una ez p esen ados los modelos de pe sona y clase, hace al a un e ce modelo
pa a elaciona a cada pe sona con su clase. Es e modelo es la ma ´
ıcula, que ie-
ne como a ibu os un iden i icado de alumno y un iden i icado de asigna u a, as´
ı
podemos ubica a la pe sona en una clase conc e a, y no s´
olo eso, sino que una
pe sona puede es a ma iculada de a ias asigna u as siemp e y cuando enga una
ma ´
ıcula pa a cada una de ellas. Adem´
as de es os dos a ibu os, en ma ´
ıcula apa-
ecen 10 a ibu os m´
as. Cua o de ellos son booleanos que si en pa a sabe si la
pe sona iene los pe misos del juego de a a a es que son 4: cambia se el peinado,
escoge los ojos, a˜
nadi un complemen o y pode e la lis a de a a a es de oda
la clase. O os cua o a ibu os an ligados a es os ´
ul imos, po que en caso de que
el es udian e enga pe miso pa a cambia el peinado del a a a implica que puede
escoge un a chi o de im´
agen, y que ´
es e end ´
a que gua da se en alguna pa e.
As´
ı que a ibu os pa a iche o de peinado, iche o de ojos, iche o de complemen o
y iche o de boca, que puede cambia se siemp e.
Po ´
ul imo, los dos a ibu os es an es que no son ele an es en el juego de a a a es
pe o ienen su unci´
on, son la no a y el iden i icado de la ma ´
ıcula, que es un
n´
ume o ´
unico pa a cada ma ´
ıcula.
•Con enedo T abaja con los con enedo es de almacenamien o implica hace la de-
cla aci´
on de alg´
un ipo de modelo pa a abaja de una o ma m´
as c´
omoda. Los
con enedo es ienen un nomb e y a chi os con un nomb e conc e o den o, po an-
o como amos a abaja con con enedo es po sepa ado, el ´
unico a ibu o que
amos a asigna le al con enedo es un nomb e de ipo s ing. El modelo con enedo
nos se ´
a´
u il pa a asigna una amilia de a a a es, la amilia end ´
a el mismo nomb e
que el del con enedo . Conoce el nomb e del con enedo es su icien e pa a ene
acceso a odas los a chi os que con enga.
•Im´
agen El modelo pa a hace e e encia a las imagenes se a a llama Imagen pa a
no con undi lo con el del con enedo que solo hace e e encia al luga donde se
almacenan es as. Como a ibu os iene un nomb e, haciendo e e encia al nomb e
del a chi o y un segundo a ibu o que es la di ecci´
on, pa a almacena la cadena de
ca ac e es que se i ´
a pa a e el a chi o.
Den o de cada con enedo hab ´
a a chi os ipo ’png’ o imagenes que pe enezcan a
la amilia de a a a es que ep esen a cada con enedo . T abaja con es as imagenes
pa a mos a las en HTML es un poco complejo, hay una unci´
on que se ´
a la enca -
gada de con e i los da os del iche o png en una URL. La URL es una secuencia
de ca ac e es que nos lle a a un si io conc e o de in e ne y pe mi e ecupe a un
ipo de in o maci´
on de e minada. Una URL lo que hace es edi igi nos a mos a la
im´
agen. La unci´
on que gene a la URL debe sabe de qu´
e a chi o iene que gene a
la di ecci´
on URL, as´
ı que lo mejo pa a abaja con los da os de la im´
agen es c ea
un modelo nue o sob e el que se sus en a el a chi o de o o.
•Pe miso
Adem´
as de un con enedo pa a las imagenes que componen el a a a , hay un con-
enedo que almacena los a chi os de ex o que se u ilizan pa a es ablece los e-
quisi os pa a consegui los pe misos. Los pe misos pe mi en cambia di e en es
elemen os del a a a y cada uno de ellos se concede si el usua io cumple unos
CAP´
ITULO 5. ENTIDADES DE LA BASE DE DATOS 35
equisi os que el p o eso es ablece. Pues bien, es os equisi os an ecogidos en
un a chi o de ex o. Pa a eso decla amos un nue o modelo de almacenamien o que
llama emos pe miso y que no end ´
a ning´
un a ibu o
en la siguien e im´
agen se mues a un diag ama de es os con sus a ibu os y c´
omo es ´
an
elacionados unos con o os.
5.2. Relaciones en e modelos
Una ez ligados odos los elemen os del juego de a a a es con los di e en es modelos,
es momen o de in oduci las elaciones. Las elaciones es ablecen la dependencia que
exis e en e dos modelos.
•Relaciones 1:1
En es e ipo de elaciones solamen e se elaciona un elemen o de un modelo con
o o elemen o de o o modelo. Po ejemplo, una ma ´
ıcula puede pe enece solo a
una pe sona.
•Relaciones 1:N
Un elemen o de un modelo A se elaciona con ninguno o con a ios elemen os de
o o modelo B, pe o los elemen os del modelo B solo pueden elaciona se con un
modelo de A. Es e es el caso de la ma ´
ıcula y la pe sona, una pe sona puede ene
a ias ma ´
ıculas, mien as que una ma ´
ıcula puede pe enece a una sola pe sona.
En loopback es e ipo de elaciones se llaman “belongsTo”.
•Relaciones N:M
Va ios elemen os de un modelo pueden es a elacionados con un solo modelo, po
ejemplo, enemos el modelo “pe sona” y el modelo “clase”. Una clase puede es a
o mada po a ias pe sonas y a su ez, una pe sona puede es a en a ias clases
di e en es. Es e ipo de elaci´
on en la aplicaci´
on se llama Hasmany.
T aducido al lenguaje que u iliza loopback, encon amos las siguien es elaciones:
1. clase-HasMany-pe sona
2. pe sona-HasMany-clase
3. pe sona-belongsTo-ma ´
ıcula
4. ma ´
ıcula-belongsTo-clase
Que dos modelos es ´
en elacionados supone que se conec an a a ´
es de una cla e,
que puede se p opia o de un modelo ajeno. Las cla es que apa ecen en las elaciones
de alladas an e io men e son ajenas o ambi´
en llamadas “ o eignKey”. El cla o ejemplo lo
apo a el modelo “ma ´
ıcula”, donde sus a ibu os “idAlumno” e “idAsigna u a” son ambos
“ o eignKeys”.

36 Juego de a a a es pa a una he amien as de gami icaci´
on
5.3. Ejemplos de acceso a la base de da os
En es e apa ado mos amos e ec os p ´
ac icos que nos pe mi en accede a la base de
da os median e los m´
e odos HTTP explicados en el apa ado 5.1..
Desde un a chi o u ilizado pa a se icios, que con iene unciones que hacen ope acio-
nes y pe iciones a la base de da os, c eamos una unci´
on que mues e los da os de una
pe sona. Pa a e i a consul a cons an emen e la base de da os, abaja emos con “Ob-
se ables” que e lejan au om´
a icamen e los cambios ealizados en la misma.
Ob ene la in o maci´
on de una pe sona equie e del iden i icado que iene el modelo “pe -
sona”. Todas las ins ancias de es e modelo se encuen an en una di ecci´
on h p conc e a,
as´
ı pa a ob ene los da os de una sola de ellas es necesa io ene el pa ´
ame o ´
unico de
cada pe sona (iden i icado ), a˜
nadiendo a la di ecci´
on de la h p donde se encuen an o-
das las pe sonas una / seguida del iden i icado se consiguen los a ibu os de la pe sona
deseada ob iando la in o maci´
on del es o.
Es os da os an a u iliza se pa a au en i ica al indi iduo conc e o en la aplicaci´
on. Reca-
pi ulando, en el apa ado 5.1 los a ibu os del modelo “pe sona” son, nomb e, que adem´
as
si e de iden i icado , pass haciendo e e encia a la con ase˜
na, y ol que especi ica si el
usua io es es udian e o docen e.
En el componen e pa a en a en la aplicaci´
on, se piden el nomb e de usua io y la con a-
se˜
na del indi iduo. Al hace click en el bo ´
on “inicia sesi´
on” la unci´
on “Au en i ica ” llama
al se icios que accede a la base de da os u ilizando la unci´
on “DamePe sona” que oma
como pa ´
ame o el nomb e de usua io in oducido, es a unci´
on se enca ga solo de hace
una pe ici´
on ge a la base de da os y e o na un “Obse able” de la pe sona. La unci´
on
“au en i ica ” es la que ecoge es e obse able y comp ueba que la con ase˜
na in oducida
coincide con la pe sona e o nada, y si la in o maci´
on concue da, dependiendo del ol del
usua io, le da ´
a acceso a una p´
agina o a o a den o de la aplicaci´
on.
O o caso en el que se consul a la base de da os median e un se icio ocu e cuando el
alumno accede a l apa ado de “mis asigna u as”. Aqu´
ı se llama a la unci´
on “DameClases”
del a chi o de se icios, que lanza una pe ici´
on ge a la di ecci´
on donde se encuen an
odas las clases, y e o na un obse able de odas ellas. Un ´
ul imo escena io en el que el
a chi o de se icios media en e la in e az de la aplicaci´
on y el almacenamien o de da os
se da a la ho a de c ea una clase nue a, la unci´
on “C eaClase” hace una ope aci´
on pos
con oda la in o maci´
on necesa ia pa a cub i los a ibu os eque idos de la clase que se
ecogen de un o mula io cumplimen ado po el p o eso .
CAP´
ITULO 6. IMPLEMENTACI ´
ON
La implemen aci´
on de la aplicaci´
on m´
o il se ha lle ado a cabo con angula e ionic. La
aplicaci´
on es ´
a o mada po componen es, que son peque˜
nos m´
odulos del so wa e com-
pues os po es pa es, la is a HTML, el con olado y el es ilo adem´
as de u iliza se i-
cios pa a conec a con la base de da os.
6.1. Componen es
En es e cap´
ı ulo se de allan los componen es m´
as impo an es y se explica qu´
e implica-
ci´
on ienen en el desa ollo del so wa e y de la aplicaci´
on. Dichos componen es es ´
an
o ien ados a la pa e del juego de a a a es, el es o de is as HTML, es ilos y con olado-
es no juegan el mismo papel en es e m´
odulo, son de alles adicionales que si en pa a
complemen a el m´
odulo. A modo in oducci´
on amos a enume a los componen es que
o man es a lis a de elemen os que dan juego a los a a a es:
•a a a es
En la p´
agina a a a es enemos la opci´
on de ac i a y desac i a el juego si el inicio
de sesi´
on en la aplicaci´
on ha sido hecho con usua io que enga el ol de p o eso .
Ac i a el juego supone selecciona una amilia de a a a es, que po de ec o es de
pe sonas. Las o a amilia disponible es de minions.
Cuando el juego es ´
a en uncionamien o, apa ecen dos bo ones: “Pe misos” y “Lis a
de a a a es”. Es os nos lle a ´
an a los componen es de lis aa a a es y pe misos,
espec i amen e. Es as dos secciones se explican m´
as adelan e.
Figu a 6.1: C´
odigo del con olado
37
38 Juego de a a a es pa a una he amien as de gami icaci´
on
Figu a 6.2: C´
odigo is a HTML
Pa a e de qu´
e mane a abaja un componen e elacionando la is a con el con o-
lado , en el ejemplo de la igu a 6.1 se obse a un pa ´
ame o que se llama idClase,
de ipo s ing. Es e pa ´
ame o eapa ece en la is a HTML de la igu a 6.2 en e una
doble lla e. Es o signi ica que el alo que oma es e pa ´
ame o en el con olado ,
se mos a ´
a en la is a HTML al usua io.
A con inuaci´
on se enume an m´
as componen es que pe enecen a la aplicaci´
on.
•gale ia
La gale ´
ıa es una p´
agina exclusi a pa a el p o eso , donde ca ga los a chi os de
im´
agen que cons i uyen di e en es elemen os del a a a . Encon amos di e sas sec-
ciones, una pa a cada elemen o del a a a .
Cada secci´
on iene dos subapa ados, uno pa a a˜
nadi ma e ial y o o pa a isuali-
za el ma e ial que adem´
as da la opci´
on de elimina lo si se desea.
•complemen os, ojos y pelos
Las uncionalidades y is as de es as es p´
aginas pueden explica se en conjun o,
ya que odas ellas ienen la misma unci´
on. Es ´
an disponibles unicamen e pa a el
usua io con ol de alumno. Una ez se ha explicado la p´
agina de la gale ´
ıa es mucho
m´
as sencillo comen a su uncionamien o.
Tienen la misma uncionalidad que la gale ´
ıa del p o eso , mos a los peinados,
ojos, complemen os y opa, pe o en p´
aginas po sepa ado.
•home
Home es el p ime componen e que en´
ıa po de ec o con la aplicaci´
on, que se ha
ap o echado pa a pe sonaliza el a a a . Desde un usua io con ol de alumno se
puede accede , siemp e y cuando el juego de a a a es es ´
e ac i o.
CAP´
ITULO 6. IMPLEMENTACI ´
ON 39
Al en a apa ece el a a a en el cen o de la pan alla se mues an los iche os del
a a a que enga el alumno, en caso de no ene ninguno se e ´
a el bus o del a a a
ac´
ıo o con los elemen os que enga. Desde es a secci´
on pod ´
a en a a cambia
los elemen os del a a a y end ´
a acceso a la lis a de pe misos pa a que el juego
sea comple o.
•lis aa a a es
La lis a de a a a es ca ga los a a a es de odos los alumnos que es ´
en ma iculados
en una asigna u a con juego de a a a es.
Teniendo un a a a pe sonalizado pa a cada alumno, la lis a de alumnos puede
cob a un poco de ida.
•pe misos
En “Pe misos” el p o eso iene las uncionalidades de subi a chi os de ex o a la
base de da os y de ca ga los en la aplicaci´
on pa a que se mues e po pan alla el
ex o que con ienen. Los a chi os de ex o pa a cada pe miso ienen una secci´
on
p opia.
• is ape misos
A la p´
agina is ape misos se accede desde “home”. Aqu´
ı apa ecen clasi icados
los equisi os que el p o eso ha seleccionado pa a concede los pe misos. Es una
secci´
on a la que acceden los usua ios que son alumnos y no iene ning´
un elemen o
pa a in e ac ua . Se mues a qu´
e se exige pa a consegui cada pe miso y adem´
as,
hay un indicado pa a que el alumno sepa si ya ha cumplido el equisi o o no.
6.2. Se icios
Un se icio es un m´
e odo que se u iliza pa a comunica dos in e aces, median e un
conjun o de p o ocolos es ablecidos. En es e p oyec o los se icios que se u ilizan son
dos, ”da os.se ice
2
”db-se ice.se ice”. Uno de ellos, db-se ice, iene al ededo de 400
l´
ıneas de c´
odigo y comunica esencialmen e con la base de da os, mien as que el se icio
da os iene unas 140 l´
ıneas de c´
odigo y si e pa a pasa in o maci´
on de un componen e
a o o den o de la aplicaci´
on.
En la im´
agen que apa ece bajo es e p´
a a o, se expone el c´
odigo de una unci´
on del
a chi o de se icios ”db-se ice”, que elimina una ma ´
ıcula de la base de da os median e
una ope aci´
on ”dele e”de p o ocolo h p. oma como pa ´
ame o de en ada la ma ´
ıcula
que a a elimina pa a pode localiza la ma ´
ıcula en la base de da os po su iden i icado .
Figu a 6.3: Cap ion
Pa a e m´
as ope aciones de es e ipo, que se u ilizan pa a accede a la base de da os, en
el anexo Fapa ece el c´
odigo de el a chi o “db-se ice” pa a ene una buena e e encia.

CAP´
ITULO 7. PRUEBAS Y EVALUACI ´
ON
Pa a comp oba que el c´
odigo sea obus o y no haya ninguna incohe encia que pueda da
luga a e o es, se han escogido cinco p uebas pa a comp oba el co ec o uncionamien o
de la aplicaci´
on.
7.1. Ba e ´ıa de p uebas
•Con ase˜
na e ´
onea
Pa a inicia sesi´
on en la aplicaci´
on, se equie e de un usua io y con ase˜
na. En caso
de que el usua io exis a en la base de da os, pe o la con ase˜
na no sea la co ec a,
no se debe ´
ıa pode inicia sesi´
on. Tal y como se mues a en la igu a XX, no s´
olo
se impide que el usua io inicie sesi´
on, sino que adem´
as apa ece un mensaje que
especi ica el mo i o que no le pe mi e en a en la aplicaci´
on.
•A˜
nadi un usua io ya exis en e
Tene dos usua ios con el mismo nomb e puede lle a a con usiones, y no debe
es a pe mi ido. As´
ı, cuando el p o eso egis a un nue o alumno, se comp ueba
que no haya o o con el mismo nomb e que haya sido egis ado p e iamen e. Si ya
se hab´
ıa egis ado a una pe sona con el mismo nomb e, o a no i icaci´
on apa ece
en la pan alla sugi iendo al p o eso que u ilice un nomb e nue o.
•Concede y e i a pe misos
Los pe misos se conceden desde un usua io con ol de p o eso , sin emba go a ec-
an a un usua io con ol de alumno. As´
ı que una buena mane a de comp oba que
es a unci´
on sigue el cu so co ec o, es e si el clic del p o eso , ha epe cu ido en
la ma ´
ıcula del alumno. Pa a es o se colocan unos ma cado es en el usua io del
alumno, que apa ecen en colo e de pa a indica que el pe miso es ´
a ac i ado.
•Elimina una clase que no exis e
Hace una pe ici´
on “dele e” a la base de da os elacionada con un elemen o que
no exis e puede desencadena un e o a al. Po es a az´
on, se alae a al docen e
cuando in en a elimina una clase inexis en e.
Todas es as p uebas pueden da se po supe adas, y apa ecen en el ap´
endice D.
7.2. E aluaci´
on de usua io
Siemp e es con enien e conoce la opini´
on de dis e en es pe sonas que pod ´
ıan hace
uso de la aplicaci´
on. La opini´
on de di e en es indi iduos a los que se les ha mos ado la
aplicaci´
on con sus espec i as uncionalidades iene ecogida en la encues a anexada en
la secci´
on Ede los ap´
endices.
Las p egun as ealizadas es ´
an ligadas a las uncionalidades del p o eso y del alumno,
se pide opini´
on pe sonal a ce ca de qu´
e encuen an a al a pa a hace del p oyec o un
47
48 Juego de a a a es pa a una he amien as de gami icaci´
on
m´
odulo m´
as comple o, se consul an qu´
e an in ui i o es n ega po la aplicaci´
on y se pide
escoge una uncionalidad a o i a.
Los esul ados gene ales e lejan que es un m´
odulo muy comple o en opini´
on de los en-
cues ados, bas an e in ui i o pa a cualquie usua io y que las uncionalidades a o i as
po igual, son a˜
nadi di e en es amilias de a a a es y pode concede p i ilegios pa a
pe sonaliza el a a a .
CAP´
ITULO 8. CONCLUSIONES
U iliza ecnolog´
ıas comple amen e desconocidas, de las que no se ha abajado a lo
la go de los a˜
nos de ca e a ha supues o un e o de ap endizaje au odidac a. Los ´
ıdeo-
u o iales de you ube y las webs de ma e ial de e e encia en p og amaci´
on o ien ada al
desa ollo de aplicaciones web y m´
o il han sido las gu´
ıas del p oyec o.
Adem´
as el uso de ionic como amewo k ha acili ado much´
ısimo la p og amaci´
on de la
aplicaci´
on m´
o il, ya que incluye un mon ´
on de documen aci´
on sob e ma e ial en su p´
agi-
na web. Po o a pa e Gi , la he amien a de con ol de e siones, ha sido o a de las
piezas cla e a laho a de ealiza cambios de la mane a m´
as segu a posible, pudiendo
deshace los en cualquie momen o.
8.1. Obje i os conseguidos
El juego de a a a es pa a una he amien a de gami icaci´
on se ha in en ado desa olla de
mane a que cumpliese con el mayo n´
ume o de obje i os p opues os posibles. De odos
los obje i os p opues os, hay dos que no se han llegado a alcanza . El nulo conocimien o
de las ecnolog´
ıas de desa ollo ha sido el mo i o p incipal, pues o que an o la ins alaci´
on
de odas lashe amien as, como el conocimien o de p og amaci´
on con ´
es as han lle ado
mucho m´
as iempo de lo espe ado al inicio del p oyec o. La lis a de obje i os es ´
a de inida
en el apa ado 2.4., de la que no se ha comple ado lo siguien e:
•Elimina alumnos de la lis a de clase
El iempo dedicado a implemen a el p oyec o se ha cen ado m´
as en las uncionalidades
de los a a a es, po an o de alles de es e ipo se han dejado pa a ´
ul ima ho a, sabiendo
que la pe sona que ome el ele o de la aplicaci´
on se ´
a capaz de a˜
nadi el de alle.
8.2. Valo aci´
on pe sonal
El p oyec o ha sido odo un desa ´
ıo, ya que en los di e en es cu sos de la menci´
on de
ae ona egaci´
on an s´
olo se impa en dos asigna u as dedicadas plenamen e a la p o-
g amaci´
on. Las lib e ´
ıas y el ipo de lenguaje que se han u ilizado en es e p oyec o son
o ien ados a obje os, que es la clase de p og amaci´
on que se u iliza en una de las asig-
na u as mencionadas p e iamen e, lo que p opo ciona una buena base. Sin emba go, el
ipo de ecnolog´
ıa que se u iliza pa a el desa ollo nada iene que e .
Uno de los mayo es obs ´
aculos pa a m´
ı ha sido la ins alaci´
on de odas y cada una de las
he amien as pa a pode desa olla el p oyec o. Muchas eces, la e si´
on ins alada no e a
la co ec a y daba e o es muy poco espec´
ı icos que no daban a en ende que las esiones
en e dos o m´
as he amien as no uesen compa ibles. O a de las di icul ades que se me
han p esen ado es el uso de la e si´
on 4 de Angula e Ionic, que no se hab´
ıan u ilizado
en p oyec os p e ios y eso supone que haya a iaciones en algunas de las lib e ´
ıas, po
an o lo que en la e si´
on 3 uncionaba pe ec amen e en la e si´
on 4 p obablemen e no
lo hiciese.
49
50 Juego de a a a es pa a una he amien as de gami icaci´
on
Cada e o que daba el c´
odigo, al p incipio e a odo un mundo pa a co egi lo. Si que es
e dad, que con la ayuda del es o de alumnos implicados en p oyec os de Classpip y con
los u o iales de Miguel, poco a poco ui ap endiendo a e i a an os allos en el sis ema.
El p oceso de ap endizaje, pese a que ha sido cos oso y algo la go, me ha apo ado
conocimien os su icien es como pa a que el esul ado sea sac ics ac o io.
8.3. L´ıneas abie as
El m´
odulo de a a a es a˜
nade una ca ac e ´
ıs ica isual y muy a ac i a a Classpip, sob e-
odo de ca a al p´
ublico m´
as j´
o en.
Es a p ime a e si´
on del p oyec o, deja muchas pue as abie as a la comunicaci´
on con
o os m´
odulos, como po ejemplo concede p i ilegios especiales a los ganado es de un
o neo pe enecien e al m´
odulo de compe iciones, o desbloquea un pe miso al llega a
un n´
ume o de pun os de e minado.
Quedan pendien e muchas posibles mejo as como uncionalidades nue as o incluso al-
guna gu´
ıa pa a usua ios eci´
en iniciados, ya que puede se un poco con uso el unciona-
mien o del p oyec o. Todas las secciones pueden mejo a sob e odo en cuan o a dise˜
no,
que es la pa e en la que menos se ha p o undizado. La aplicaci´
on se ha hecho lo m´
as
sencilla posible pa a pode cumpli con los obje i os.
Pa a e mina , es imp escindible inclui m´
as amilias en el m´
odulo y ma e ial exclusi o pa a
de e minadas ´
epocas. Todo es o ha ´
a que el juego no sea epe i i o, man enga mo i ados
a los usua ios y sa is aga al clien e.
BIBLIOGRAF´
IA
[1] A a a [online]: h ps://blog.ensalza.com/dicciona io/que-es-un-a a a -en-
in o ma ica/.
[2] Web 2.0. [online]: h ps://iweb2o.webnode.com.co/a a a /
[3] Voki [online]: h p://www.educacon ic.es/blog/ oki-pe sonajes-que-hablan- ex -speech
[4] Gi y Gi Hub [online]: h ps://desa olloweb.com/a iculos/in oduccion-gi -gi hub.h ml
[5] LoopBack [online]: h ps://loopback.io/
[6] Gami icaci´
on [online]: h ps://blog.a i i y.com/es/que-es-gami icacion-y-como-usa la
[7] Gami ica ion a Wo k Su ey [online]: h ps://www. alen lms.com/blog/gami ica ion-
su ey- esul s/
[8] Classdojo [online]: h ps://www.educacion espun oce o.com/ ecu sos/classdojo-que-
es-como-empeza /33376.h ml
[9] Gami icaci´
on en la asigna u a de De echo Romano [online]:
h ps://www. esea chga e.ne /p o ile/SoniaPamplona
[10] API-REST [online]: h ps://bb aopen4u.com/es/ac ualidad/api- es -que-es-y-cuales-
son-sus- en ajas-en-el-desa ollo-de-p oyec os
[11] Boo s ap [online]: h ps:// aiolane wo ks.es/blog/que-es-boo s ap/
[12] Ionic [online]: h ps://ionic amewo k.com/
[13] Angula [online]: h ps://angula .io/
[14] Kahoo [online]: h ps://www.xa aka.com/basics/kahoo -que-es-pa a-que-si e-y-
como- unciona
[15] Bi moji [online]: h ps://www.bi moji.com/
[16] NodeJS [online]: h ps://www.ne consul ing.es/blog/nodejs/
[17] Co do a [online]: h ps://es.wikipedia.o g/wiki/ApacheCo do a
[18] Zombies Run! [online] h ps://zombies ungame.com/
51

AP ´
ENDICES
AP ´
ENDICE A. MANUAL DE INSTALACI ´
ON
En es a secci´
on apa ecen los pasos a segui pa a ins ala odas las he amien as que
o man pa e de la a qui ec u a del so wa e.
A.1. Node y NPM
La e si´
on de NODE con la que se ha desa ollado el p oyec o es la 8.6.0, sin emba go
es a e si´
on no es compa ible con Angula CLI, as´
ı que u iliza emos la e si´
on 8.9.4.
Pa a es o accede emos a la web del link adjun ado a con inuaci´
on:
h ps://nodejs.o g/es/download/ eleases/
Figu a A.1: Opciones ins alaci´
on NODE
En ando en la secci´
on de“Todas las e siones”, se ab i ´
a el siguien e enlace h ps://nodejs.o g/dis /,
donde isualiza emos las e siones disponibles has a la echa. Ah´
ı ha emos click en la
e si´
on que que emos desca ga .
Figu a A.2: Ve si´
on de ins alaci´
on NODE
El NPM se ins ala au om´
a icamen e as ealiza la ins alaci´
on del NODE. Pa a e qu´
e
e si´
on se ha ins alado de cada uno de ellos, podemos ab i una l´
ınea de comandos o
como apa ece en Windows “S´
ımbolo del sis ema”.
Po an o la e si´
on del NPM no es impo an e, ya que iene ligada a la del NODE, que es
la que nos in e esa.
Median e las ´
o denes node – y npm – , apa ece en pan alla la e si´
on co espondien e
a cada una de las he amien as.
55
1. Hace el Fo k, clona y ab i el eposi o io del siguien e enlace:
h ps://gi hub.com/classpip/classpip-dashboa d
2. Ins ala odas las dependencias locales que hay en la ca pe a del classpip-dashboa d
con la ins ucciones que apa ecen a con inuaci´
on, ejecu adas una a una:
cd Ca pe aDondeEs ´
aElReposi o io/classpip-dashboa d
npm ins all
3. ejecu a la aplicaci´
on u ilizando la siguien e ins ucci´
on:
npm un s a
Con al de ab i la aplicaci´
on, hay que ab i el na egado e in oduci la siguien e
di ecci´
on:
h p://localhos :4200/
Es os son odos los elemen os que deben ins ala se en caso de que e emp ende unnue-
o p oyec o elacionado con Classpip.

AP ´
ENDICE B. IMAGENES DE LAS
FUNCIONALIDADES PARA EL DOCENTE
La aplicaci´
on mues a di e en es is as, aqu´
ı se ecogen las que co esponden al usua io
de ol p o eso .
Figu a B.1: Pan alla de inicio de sesi´
on Figu a B.2: Men´
u de inicio pa a p o eso
T as el inicio de sesi´
on, como puede e se apa ecen es opciones en el men´
u p incipal y
un bo ´
on ojo a ba a la de echa que si e pa a ce a la sesi´
on.
A con inuaci´
on apa ecen las di e en es p´
aginas que se desplegan en cada una de las
opciones del men´
u.
63
B.1. Mi pe il
Empezando po “Mi Pe il”, emos odos los da os del docen e, y adem´
as hay una unci´
on
pa a cambia la con ase˜
na, que ex iende una en ada de ex o, al y como se obse a en
la igu a B.4.
Figu a B.3: Apa ado “Mi pe il”
Figu a B.4: Elecci´
on de unanue a con a-
se˜
na
B.2. Mis clases
Vol iendo al inicio, el siguien e apa ado, con ´
ı ulo “Mis clases”, mues a la siguien e apa-
iencia:
Figu a B.5: Apa ado “Mis clases” pa a ol de p o eso
La opciones de a˜
nadi clase y elimina clase es ´
an disponibles en la ba a in e io dela
pan alla. Pa a a˜
nadi una clase apa ece un o mula io a ellena mien as que pa a elimina
la clase simplemen e se pide in oduci el nomb e que iden i ica a la asigna u a.
Figu a B.6: A˜
nadi clase Figu a B.7: Elimina clase
El siguien e paso es isualiza las p´
aginas de las opciones “Ve lis a de alumnos” y “Juego
de A a a es” que apa ecen pa a cada clase.
La lis a de alumnos a ´
ıa lige amen e si el juego de a a a es es ´
a ac i ado, compa ada
con la e si´
on de la lis a que apa ece cuando no hay a a a es.
Figu a B.8: Lis a de alumnos con el juego de
a a a es desac i ado
Figu a B.9: Lis a de alumnos con el juego de
a a a es ac i o

Pa a a˜
nadi alumnos en la clase, apa ece un o mula io muy simila al de a˜
nadi clases
como se mues a en la igu a a con inuaci´
on.
Figu a B.10: Fo mula io pa a a˜
nadi alumnos a la clase
B.3. Juego de a a a es
Pa a ac i a el juego de a a a es, es necesa io en a en la secci´
on “Juego de A a a es”,
que es ´
unica pa a cada clase. Aqu´
ı se ac i a el juego con un bo ´
on “ oggle”. Al clica en el
bo ´
on, ´
es e se uel e de colo e de y apa ecen odos los elemen os elacionados con el
juego en un apa ado cen ado en la pan alla.
Figu a B.11: Juego de a a a es desac i ado Figu a B.12: Juego de a a a es ac i ado
Escoge la amilia de a a a es, como ya hab´
ıamos comen ado en cap´
ı ulos an e io es, es
muy simple, el desplegable que apa ece en la plan alla mues a las opciones que hay.
T as escoge amilia y clica en el bo ´
on “Gua da ” de la igu a B.12, as la ase “Has
escogido la amilia:” apa ece el nomb e de la ´
ul ima amilia gua dada.
Figu a B.13: Fo mula io pa a a˜
nadi alumnos a la clase
Respec o a la secci´
on de “Pe misos” encon amos una p´
agina donde se pueden ca ga
a chi os de ex o. En la ba a de la pa e in e io de la pan alla hay dos bo ones, uno a
cada lado. El bo ´
on ca ga ex iende una pan alla que pe mi e selecciona a chi os del
disposi i o en el que se u iliza la aplicaci´
on. Una ez seleccionado el a chi o, haciendo
clic en “Subi ”, ´
es e se ca ga en la base de da os.
Figu a B.14: Ca ga de a chi os de ex o pa a
mos a en pe misos
Figu a B.15: Selecci´
on de a chi o pa a mos-
a po pan alla
Pa a cada pe miso hay un desplegable, que pe mi e e odos los a chi os que se han
ca gado p e iamen e. Eligiendo un a chi o y clicando en el bo ´
on de Gua da , el ex o del
a chi o apa ece po pan alla. Puede ap ecia se la secuencia de elemen os desc i a en la
igu a B.14.

AP ´
ENDICE C. IMAGENES DE LAS
FUNCIONALIDADES PARA EL ESTUDIANTE
El es udian e iene bas an es menos uncionalidades que el p o eso . La pan alla pa a
inicia sesi´
on en la aplicaci´
on sin emba go, es la misma.
Figu a C.1: Pan alla pa a inicia sesi´
on Figu a C.2: Men´
u de inicio Alumno
79
Los dos apa ados que se mues an pa ecen id´
en icos a los del p o eso , y de hecho
la p ime a imp esi´
on es esa, no hay nada di e en e a simple is a, sin emba go como
e emos a con inuaci´
on en el apa ado de “Mis asigna u as” no se o ecen las mismas
uncionalidades. El apa ado “Mi pe il” s´
ı que es id´
en ico.
Figu a C.3: Apa ado “Mi pe il” pa a ol de
alumno
Figu a C.4: Apa ado de asigna u as pa a el
alumno
Como puede ap ecia se en la igu a C.4, la secci´
on“Juego de a a a es” bajo el bo ´
on en el
que pone Dibujo iene un colo muy apagado, lo que signi ica que pa a la clase de Dibujo
el juego no es ´
a ac i ado. Puede e se la di e encia de colo compa ado con la clase de
F´
ısica, que es ´
a jus o encima.
Den o de cada asigna u a, los apa ados de “In o maci´
on” y “Juego de a a a es” se en
como en las imagenes expues as a con inuaci´
on.
Figu a C.5: Apa ado “In o maci´
on”
Figu a C.6: Secci´
on “Juego de a a a es” pa a
alumno
Las siguien es im´
agenes pe enecen a los di e en es apa ados de ma e ial pa a el a a a .
La di e ecia de es os apa ados con la gale ´
ıa de ma e ial del p o eso es que aqu˜
ni se
hace un il o de ma e ial po amilias. El p og ama de ec a si el a chi o pe enece a una
amilia o a o a g acias a las eglas de nomencla u a.
•Secci´
on de peinados:
Figu a C.7: Peinados amilia “minion” Figu a C.8: Peinados amilia “pe sona”
•Secci´
on de ojos
Figu a C.9: Ojos amilia “minion” Figu a C.10: Ojos amilia “pe sona”

•Secci´
on de complemen os:
Figu a C.11: Complemen os amilia “minion”
Figu a C.12: Complemen os amilia “pe so-
na”
•Secci´
on de bocas:
Figu a C.13: Bocas amilia “minion” Figu a C.14: Bocas amilia “pe sona”
Po ´
ul imo se ´
ıa necesa io explica las ´
ul imas is as a la que se puede accede
desde el apa ado de pe sonalizaci´
on del a a a .
Po una pa e enemos la lis a de a a a es. Si el bo ´
on mo ado que apa ece en la
pa e supe io de la de echa es ´
a ac i ado, el alumno iene pe miso pa a isualiza
la lis a de a a a es. La di e encia en e un alumno que puede accede y o o que no
es ´
a en el colo del bo ´
on, que se e m´
as apagado si no es ´
a accesible.
Figu a C.15: Pe miso pa a e la lis a de a a-
a es concedido
Figu a C.16: Pe miso pa a e la lis a de a a-
a es denegado
La e si´
on de la lis a a la que se accede es exac amen e la misma que la que puede
e el p o eso , apa ece en las igu as B.16 yB.17.
Con la siguien e is a se e mina po comple o el abanico de p´
aginas a las que
accede el alumno.
En la secci´
on “Pe misos” apa ecen los equisi os que el alumno debe cumpli pa a
pode accede a los apa ados de peinados, ojos, complemen os y e la lis a de
a a a es. Cada pe miso iene un indicado que apa ece en e de si ´
es e ha sido
condedido.
Figu a C.17: Vis a de pe misos pa a alumno
Figu a E.2: Valo aci´
on de la in ui i idad del m´
odulo
Figu a E.3: Elecci´
on de la unci´
on a o i a del juego

Figu a E.4: Opiniones sob e uncionespa a a˜
nadi al ol de p o eso
Figu a E.5: Valo aci´
on de las unciones del alumno
Figu a E.6: Respues as a “¿U iliza ´
ıas es e juego en u clase?”
Figu a E.7: P opues as de mejo a pa a el m´
odulo de a a a es
AP ´
ENDICE F. C ´
ODIGO DE ARCHIVO DE
SERVICIOS PARA LA BASE DE DATOS
impo { Injec able } om ’@angula /co e’;
impo { Obse able, o , om } om ’ xjs’;
impo { H pClien , H pHeade s } om ’@angula /common/h p’;
impo { Pe sona } om ’./Pe sona’;
impo { Clase } om ’./Clase’;
impo { Imagen } om ’./Imagen’;
impo { Con aine } om ’./Con aine ’;
impo { Img } om ’./Img’;
impo { Ma icula } om ’./Ma icula’;
// Las siguien es lib e ´
ıas impo adas son pa a pode ealiza ope aciones H p
impo { H p, ResponseCon en Type, Reques Op ions, Response, Heade s } om ’@angula /h p’;
@Injec able({
p o idedIn: ’ oo ’
})
expo class DbSe iceSe ice {
// C eo un a ay en el que oy a gua da im´
agenes
// que end an de un con enedo conc e o
imagenesPelos: Img[] = new A ay();
imagenesOjos: Img[] = new A ay();
imagenesComplemen os: Img[] = new A ay();
idclase: s ing;
NPe sona: s ing;
ma icula: Ma icula;
// Decla o como s ing la URL de la BDD a la que me quie o conec a
p i a e APIU l = ’h p://localhos :3000/api/Pe sonas’;
p i a e APIClases = ’h p://localhos :3000/api/Clases’;
p i a e APIFo os = ’h p://localhos :3000/api/imagenes’;
APIPe misos = ’h p://localhos :3000/api/pe misos/A chi osTex o’;
// Inse o en el cons uc o el se icio H p pa a pode hace las ope aciones
//necesa ias
cons uc o (p i a e h p: H pClien ,
p i a e h p2: H p) { }
// A pa i de aqu´
ı decla o las ope aciones que a a o ece es e se icio
97
// La siguien e unci´
on lama a un obse able de la lis a de pe sonas
// Po es o mismo hemos impo ado a iba la clase Obse able
dameTodos(): Obse able<Pe sona[]> {
// La ope acion ge del p o ocolo h p de uel e lo que iene
// en e "< >", en es e caso una lis a de pe sonas.
e u n his.h p.ge <Pe sona[]>( his.APIU l);
}
dameFo osCon aine (con aine : s ing): Obse able<any[]> {
e u n his.h p.ge <any[]>( his.APIFo os + ’/’ + con aine + ’/ iles’);
}
DameMa iculaAlumno(idAsigna u a: s ing) {
console.log( idAsigna u a );
e u n his.h p.ge <Ma icula[]>(’h p://localhos :3000/api/ma iculas? il e [whe e][idAsigna u a]=’ + idAsigna u a);
}
PonMa icula(ma icula: Ma icula ): Obse able<any> {
e u n his.h p.pos <any>(’h p://localhos :3000/api/ma iculas’, ma icula);
}
Cuen aMa iculas(): Obse able<any> {
e u n his.h p.ge <any>(’h p://localhos :3000/api/ma iculas/coun ’);
}
Elimina (nomb e: s ing): Obse able<any> {
e u n his.h p.dele e<any>( his.APIU l + ’/’ + nomb e);
}
Elimina Clase(idClase: s ing): Obse able<Clase> {
e u n his.h p.dele e<Clase>( his.APIClases + ’/’ + idClase);
}
Elimina Ma icula(ma icula: Ma icula): Obse able<any> {
console.log(’Voy a elimina la ma ´
ıcula de: ’ + ma icula.idAlumno);
console.log(’El id que elimino es: ’ + ma icula.id);
e u n his.h p.dele e<any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id);
}
DamePe sona(nomb e: s ing): Obse able<Pe sona> {
console.log(nomb e);
e u n his.h p.ge <Pe sona>( his.APIU l + ’/’ + nomb e);
console.log(Pe sona);
}
Se IdClase(clase: s ing) {
his.idclase = clase;
}
Se Nomb ePe sona(npe sona: s ing) {
his.NPe sona = npe sona;
}
Se Ma icula(ma i: Ma icula) {
his.ma icula = ma i;
}
Re u nNomb ePe sona() {
e u n his.NPe sona;
}
Re u nIdClase() {
e u n his.idclase;
}
Re u nMa i() {
e u n his.ma icula;
}
DameClase(idclase: s ing): Obse able<Clase> {
his.idclase = idclase;
console.log(’Te doy los da os de: ’ + idclase);
e u n his.h p.ge <Clase>( his.APIClases + ’/’ + idclase);
}
DameClases(): Obse able<Clase[]> {
e u n his.h p.ge <Clase[]>( his.APIClases);
}
ColocoPelo(elemen oP: s ing) {
console.log(’Me llega un: ’ + elemen oP);
i (elemen oP === unde ined || elemen oP === ’’) {
console.log(’No has seleccionado ning´
un pelo’);
} else {

console.log(’En o a coloca ’);
a imagen = documen .c ea eElemen (’img’);
imagen.s yle.posi ion = ’absolu e’;
// imagen.s yle.zIndex = ’1’;
imagen.s yle.le = ’0px’;
imagen.s yle. op = ’0px’;
imagen.s c = elemen oP;
documen .ge Elemen ById(’a a a ’).appendChild(imagen);
}
}
CambiaEs adoJuego(clase: Clase) {
i (clase.a a a es === ue) {
clase.a a a es = alse;
} else {
clase.a a a es = ue;
}
console.log(’Aho a el es ado es es e:’ + clase.a a a es);
e u n his.h p.pu <any>( his.APIClases + ’/’ + clase.id, clase);
}
C eaClase(clase: Clase): Obse able<Clase> {
// clase.admin = admin;
e u n his.h p.pos <Clase>( his.APIClases + ’/’ + clase.id, clase);
}
PonPass(alumno: Pe sona, nue opass: s ing): Obse able<any> {
alumno.pass = nue opass;
e u n his.h p.pu <any>( his.APIU l + ’/’ + alumno.nomb e, alumno);
}
// A˜
nadi una pe sona a la BBDD es una ope aci´
on pos
// equie e la URL y en es e caso la pe sona que debemos a˜
nadi
// Es a unci´
on ambi´
en de ul e un obse able de cualquie ipo
// Va a se un m´
e odo usado ´
unicamen e po el p o eso
PonPe sona(pe sona: Pe sona): Obse able<any> {
e u n his.h p.pos <any>( his.APIU l, pe sona);
}
// C eo una unci´
on que si e s´
olamen e pa a la ca ga de a chi os
// como im´
agenes o a chi os de ex o, se i ´
a pa a que el p o eso
// ca gue el ma e ial en la gale ´
ıa y los a chi os de ex o que i ´
an ligados
// a los pe misos 1, 2 y 3 pa a cons ui el a a a
DameCon enedo es(): Obse able<any[]> {
e u n his.h p.ge <any[]>( his.APIFo os);
}
DameFo o(idcon e: s ing) {
// his.Vacia A ay();
a i;
his.h p.ge <any>( his.APIFo os + ’/’ + idcon e + ’/ iles’)
.subsc ibe( o oscon aine => { console.log(’Tengo los a chi os del con aine : ’ + o oscon aine );
// his.nomb eslogos = o oscon aine ;
o (i = 0; i < o oscon aine .leng h; i++) {
console.log( o oscon aine [i].name);
his.h p2.ge ( his.APIFo os + ’/’ + idcon e + ’/download/’ + o oscon aine [i].name,
{ esponseType: ResponseCon en Type.Blob} )
.subsc ibe( esponse => {
console.log( esponse);
his.Ca ga Logos( esponse, idcon e); });
}
console.log(’Ye he acabado’);
});
}
DameLogosPelo() {
// console.log(’Ya he ellenado el modelo’);
e u n his.imagenesPelos;
}
DameLogosOjos() {
e u n his.imagenesOjos;
}
DameLogosComp() {
e u n his.imagenesComplemen os;
}
Ca ga Logos( esponse: Response, idcon e: s ing) {
cons blob = new Blob([ esponse.blob()], { ype: ’image/jpg’});
cons eade = new FileReade ();
eade .addE en Lis ene (’load’, () => {
i (idcon e === ’Pelos’) {
// console.log(’No s´
e si en a’);
his.imagenesPelos.push( eade . esul . oS ing());
}
i (idcon e === ’Ojos’) {
his.imagenesOjos.push( eade . esul . oS ing());
console.log( his.imagenesOjos);
}
i (idcon e === ’Complemen os’) {
his.imagenesComplemen os.push( eade . esul . oS ing());
console.log( his.imagenesComplemen os);
}
}, alse);
i (blob) {
eade . eadAsDa aURL(blob);
}
}
Gua da Pelo(ma icula: Ma icula, p1: s ing): Obse able<Ma icula> {
console.log(p1);
ma icula.URLpelo = p1;
console.log(’He llegado al se icio’);
console.log(’h p://localhos :3000/api/ma iculas/’ + ma icula.id);
e u n his.h p.pu <any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id, ma icula);
}
Gua da Ojos(ma icula: Ma icula, p2: s ing): Obse able<Ma icula> {
ma icula.URLojos = p2;
e u n his.h p.pu <any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id, ma icula);
}
Gua da Comp(ma icula: Ma icula, p3: s ing): Obse able<Ma icula> {
ma icula.URLcomplemen o = p3;
e u n his.h p.pu <any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id, ma icula);
}
Gua da Boca(ma icula: Ma icula, p4: s ing): Obse able<Ma icula> {
ma icula.URLboca = p4;
e u n his.h p.pu <any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id, ma icula);
}
Gua da P1(ma icula: Ma icula, alo p1: boolean): Obse able<Ma icula> {
ma icula.pelo = alo p1;
e u n his.h p.pu <any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id, ma icula);
}
Gua da P2(ma icula: Ma icula, alo p2: any): Obse able<Ma icula> {
ma icula.ojos = alo p2;
e u n his.h p.pu <any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id, ma icula);
}
Gua da P3(ma icula: Ma icula, alo p3: any): Obse able<Ma icula> {
ma icula.complemen o = alo p3;
e u n his.h p.pu <any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id, ma icula);
}
Gua da P4(ma icula: Ma icula, alo p4: any): Obse able<Ma icula> {
ma icula. e clase = alo p4;
e u n his.h p.pu <any>(’h p://localhos :3000/api/ma iculas/’ + ma icula.id, ma icula);
}
Mues aFiche os(): Obse able<Con aine []> {
e u n his.h p.ge <Con aine []>( his.APIPe misos + ’/ iles’);
}
Gua daFiche oPe miso1(clase: Clase, a chi o: s ing): Obse able<any> {
clase.p1 = a chi o;
e u n his.h p.pu <any>( his.APIClases + ’/’ + clase.id, clase);
}
Gua daFiche oPe miso2(clase: Clase, a chi o: s ing): Obse able<any> {
clase.p2 = a chi o;
e u n his.h p.pu <any>( his.APIClases + ’/’ + clase.id, clase);
}
Gua daFiche oPe miso3(clase: Clase, a chi o: s ing): Obse able<any> {
clase.p3 = a chi o;
e u n his.h p.pu <any>( his.APIClases + ’/’ + clase.id, clase);