Ejecu o de búsquedas del eso o con
ealidad aumen ada
Po
Lei e Osés Sánchez
Ad ián de Lucas Gómez
Da id Czepiel
William Molina Cumba
T abajo de Fin de G ado en Desa ollo de Videojuegos
Facul ad de In o má ica
Di igido po
Ped o Pablo Gómez Ma ín
Ped o An onio González Cale o
Augmen ed eali y easu e hun s
engine
Mad id, 2021–2022
Ejecu o de búsquedas del eso o con
ealidad aumen ada
En es e TFG se plan ea la ealización de una aplicación web pa a c eación y
con igu ación de búsquedas del eso o en las que uno de sus ing edien es p incipales es el
econocimien o de obje os ísicos, que pe mi en i desbloqueando las pis as. Pa a
ejecu a lo se desa olla á un mo o que pueda ejecu a la a en u a según la con igu ación
dada po el usua io. También se pod án mos a , en pun os conc e os, minipuzzles
especí icos que encajen con la ambien ación de la búsqueda del eso o pa icula .
Lei e Osés Sánchez
Ad ián de Lucas Gómez
Da id Czepiel
William Molina Cumba
Di igido po
Ped o Pablo Gómez Ma ín
Ped o An onio González Cale o
Depa amen o de Ingenie ía del So wa e e In eligencia A i icial
Facul ad de In o má ica
Uni e sidad Complu ense de Mad id
Mad id, 2021-2022
Resumen
Las búsquedas del eso o y las yincanas son una se ie de juegos adicionales que consis en
en a a de esol e una se ie de e os y p uebas con el obje i o de gana algún ipo de
p emio o ecompensa. Pueden se jugados de o ma indi idual o en g upos y pueden ene
un plan eamien o más compe i i o o casual.
La idea del TFG es c ea un mo o y una he amien a web que si a pa a pode gene a
es e ipo de juegos con la p emisa de que el usua io no necesi a ene conocimien o de
p og amación alguno.
Es as aplicaciones es a án o madas po ases de di e en es ipos y en di e sas can idades
según las necesidades del c eado de la a en u a pa a adap a se mejo al en o no donde
a a se u ilizado y el obje i o que se quie e consegui .
Pa a gene a las a en u as los usua ios deben hace uso de una he amien a web disponi-
ble en un se ido de la UCM donde pueden con igu a desde el nomb e de la a en u a que
ayamos a c ea , a odas y cada una de las di e en es ases disponibles y luego pe mi i
desca ga nos el p oyec o pa a gene a el ins alado pa a disposi i os And oid.
Palab as cla e
Búsqueda del eso o
Ejecu o búsquedas del eso o
He amien a de au o ía
Videojuegos pa a disposi i os mó iles
Realidad Aumen ada
Aplicación web
2
Summa y
T easu e hun s and gymkhanas a e a ype o adi ional games ha consis in ying o
sol e a se ies o challenges and es s wi h he p emise o winning some kind o p ize o
ewa d. They can be played indi idually o in g oups and hey can ha e a compe i i e
o casual app oach.
The idea o he TFG is o c ea e an engine and a web ool ha is used o gene a e
and play his ype o games wi h he p emise ha he use does no need o ha e any
knowledge o p og amming o make use o i .
These applica ions will be made up o phases o di e en ypes and in a ious amoun s
acco ding o he needs o he c ea o o he ad en u e o be e adap i o he en i onmen
whe e i will be used and he objec i e ying o be achie ed.
In o de o c ea e hese games use s will use a web ool a ailable a a UCM se e whe e
hey can con igu e om he name o he ad en u e ha hey a e going o c ea e, each and
e e y one o he di e en phases a ailable and hen allow hem o download he p ojec
o gene a e he ins alle o use i in And oid de ices.
Key wo ds
T easu e Hun s
T easu e Hun s engine
Au ho ship ool
Mobile ideo games
AR - Augmen ed eali y
Web-based con igu a o ool
3

Índice gene al
Página
Bloque de in oducción. 1
1. In oducción 1
1.1. Mo i aciones ................................. 2
1.2. Plande abajo................................ 2
1.3. Reposi o io y página del p oyec o . . . . . . . . . . . . . . . . . . . . . . 3
1. In oduc ion 4
1.1. Mo i a ions.................................. 5
1.2. P ojec ´sschedule .............................. 5
1.3. P ojec ’s eposi o y and web page . . . . . . . . . . . . . . . . . . . . . . 6
2. Es ado del A e 7
2.1. Juegosse ios ................................. 7
2.2. Aplicacionesweb ............................... 10
2.2.1. Mul i Page Applica ion . . . . . . . . . . . . . . . . . . . . . . . 11
2.2.2. Single Page Applica ion . . . . . . . . . . . . . . . . . . . . . . . 12
2.2.3. Capas de las aplicaciones web . . . . . . . . . . . . . . . . . . . . 12
2.3. RealidadAumen ada............................. 13
2.4. P oduc osdelsec o ............................. 17
2.4.1. ARVR ech: T esu e Hun . . . . . . . . . . . . . . . . . . . . . . 17
2.4.2. Educaplay............................... 18
2.4.3. Oni ix................................. 20
2.4.4. uAd en u e.............................. 21
3. He amien as 26
3.1. Uni y ..................................... 26
3.1.1. Funcionamien o de Uni y . . . . . . . . . . . . . . . . . . . . . . 27
3.1.2. Ca ga de ecu sos en Uni y . . . . . . . . . . . . . . . . . . . . . 28
3.2. Vu o ia..................................... 28
3.2.1. Funcionamien o de Vu o ia Engine . . . . . . . . . . . . . . . . . 29
3.2.2. Cla es de Vu o ia . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
3.3. Reac ..................................... 30
3.3.1. Funcionamien o de Reac . . . . . . . . . . . . . . . . . . . . . . 30
3.3.2. Componen es............................. 31
4
Augmen ed eali y easu e hun s engine UCM
Bloque de implemen ación. 34
4. Diseño e implemen ación 34
4.1. Tiposde ases................................. 34
4.1.1. FaseQuiz............................... 35
4.1.2. FaseQR................................ 35
4.1.3. FaseImagen.............................. 35
4.1.4. FaseAR................................ 35
4.1.5. Fasedesonido ............................ 36
4.1.6. Fasede ex o ............................. 36
4.1.7. FasedeGPS ............................. 36
4.2. Con igu ación de las a en u as . . . . . . . . . . . . . . . . . . . . . . . . 36
4.3. Ejecución de las a en u as . . . . . . . . . . . . . . . . . . . . . . . . . . 37
4.4. Da os que cons i uyen una a en u a . . . . . . . . . . . . . . . . . . . . . 37
4.5. Ciclo de gene ación de una a en u a . . . . . . . . . . . . . . . . . . . . 37
5. He amien a de au o ía de yincanas 39
5.1. F on end.................................... 39
5.1.1. Flujo de la aplicación . . . . . . . . . . . . . . . . . . . . . . . . . 39
5.1.2. Es uc u a de los componen es de la WEB . . . . . . . . . . . . . 41
5.1.3. Es adoin e no ............................ 41
5.1.4. Ins anciación de los componen es . . . . . . . . . . . . . . . . . . 42
5.1.5. Es uc u a de los componen es . . . . . . . . . . . . . . . . . . . 43
5.1.6. Se ialización de la a en u a . . . . . . . . . . . . . . . . . . . . . 50
5.2. Backend.................................... 52
5.2.1. A anque del se ido . . . . . . . . . . . . . . . . . . . . . . . . 52
5.2.2. Se icios del backend . . . . . . . . . . . . . . . . . . . . . . . . . 53
5.2.3. Comunicaciones F on -End/Back-End . . . . . . . . . . . . . . . 55
5.2.4. Comunicaciones al gua da una aplicación . . . . . . . . . . . . . 56
6. Mo o de ejecución de yincanas 59
6.0.1. GameManage ............................ 60
6.0.2. Mas e Objec ............................. 61
6.0.3. Ad en u eIn o............................. 61
6.0.4. S age ................................. 61
6.1. Implemen ación de las ases . . . . . . . . . . . . . . . . . . . . . . . . . 62
6.1.1. FaseQuiz............................... 62
6.1.2. FaseQR................................ 62
6.1.3. Faseconimagen ........................... 63
6.1.4. Fase de ealidad aumen ada . . . . . . . . . . . . . . . . . . . . . 63
6.1.5. Faseconaudio ............................ 64
6.1.6. Fase de in oduci ex o . . . . . . . . . . . . . . . . . . . . . . . 65
6.1.7. Fase con geolocalización . . . . . . . . . . . . . . . . . . . . . . . 65
7. Resul ados ob enidos 67
7.1. Busqueda del eso o - Demos ación . . . . . . . . . . . . . . . . . . . . . 68
7.1.1. Reco ido y p uebas de la demo . . . . . . . . . . . . . . . . . . . 68
7.2. E aluación con usua ios . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
7.3. Posibilidades como mo o de juegos se ios . . . . . . . . . . . . . . . . . 70
5
Augmen ed eali y easu e hun s engine UCM
Bloque de conclusiones. 73
8. Conclusiones 73
9. T abajo u u o 75
8. Conclusions 77
9. Fu u e Wo k 79
10.Con ibuciones indi iduales 81
10.1.Lei eOsésSánchez.............................. 81
10.2. Ad ián de Lucas Gómez . . . . . . . . . . . . . . . . . . . . . . . . . . . 82
10.3.Da idCzepiel................................. 84
10.4. William Molina Cumba . . . . . . . . . . . . . . . . . . . . . . . . . . . . 86
Bloque de anexos. 90
A. Manual de usua io 90
A.1. C eación de una a en u a . . . . . . . . . . . . . . . . . . . . . . . . . . 90
A.1.1. Con igu a una ase Quiz . . . . . . . . . . . . . . . . . . . . . . . 91
A.1.2. Con igu a una ase QR . . . . . . . . . . . . . . . . . . . . . . . 91
A.1.3. Con igu a una ase Image . . . . . . . . . . . . . . . . . . . . . . 92
A.1.4. Con igu a una ase de RA . . . . . . . . . . . . . . . . . . . . . . 93
A.1.5. Con igu a una ase de GPS . . . . . . . . . . . . . . . . . . . . . 93
A.1.6. Con igu a una ase de ex o . . . . . . . . . . . . . . . . . . . . . 94
A.1.7. Con igu a una ase de sonido . . . . . . . . . . . . . . . . . . . . 94
A.1.8. Ayudasypis as............................ 95
A.2. Edi a una a en u a p e ia . . . . . . . . . . . . . . . . . . . . . . . . . . 96
A.3. Desca ga a en u as de o os usua ios . . . . . . . . . . . . . . . . . . . . 96
A.4. C eación del APK con Uni y . . . . . . . . . . . . . . . . . . . . . . . . . 97
A.5. Ins alación en un disposi i o And oid . . . . . . . . . . . . . . . . . . . . 98
A.6. Despliegue de la he amien a . . . . . . . . . . . . . . . . . . . . . . . . 98
Bloque de bibliog a ía. 100
Bibliog a ía y enlaces de e e encia 100
6
Índice de igu as
2.1. Popula ización de los juegos se ios en el nue o milenio y sus campos de
aplicación ................................... 8
2.2. Aplicaciones web con o ma o Mul i-Page Applica ion y Single-Page Ap-
plica ion.................................... 11
2.3. Ciclo de ida de una MPA . . . . . . . . . . . . . . . . . . . . . . . . . . 11
2.4. Ciclo de ida de una SPA . . . . . . . . . . . . . . . . . . . . . . . . . . 12
2.5. Espada de Damocles (HMD), 1966 . . . . . . . . . . . . . . . . . . . . . 13
2.6. Knowledge-based Augmen ed Reali y o Main enance Assis ance, 1993 . 14
2.7. ARQuake: In e ac i e Ou doo Augmen ed Reali y Collabo a ion Sys em,
2000 ...................................... 15
2.8. Wiki udeD i e,2010............................. 15
2.9. In izimals en ba alla, 2009 . . . . . . . . . . . . . . . . . . . . . . . . . . 16
2.10. Pokemon Go AR+ mode, 2017 . . . . . . . . . . . . . . . . . . . . . . . 16
2.11. Búsqueda del eso o c eada po ARVR como demos ación . . . . . . . . 18
2.12. Algunas de las ac i idades disponibles pa a con igu a . . . . . . . . . . 19
2.13. Ac i idad sob e animales en F oggy Jumps . . . . . . . . . . . . . . . . . 19
2.14.Edi o webdeOni ix............................. 20
2.15. Búsqueda del eso o c eada po Oni ix como demos ación . . . . . . . . 21
2.16. Vis a gene al de escenas y conexiones en e ellas . . . . . . . . . . . . . . 22
2.17. Con igu ado de una escena no mal . . . . . . . . . . . . . . . . . . . . . 23
2.18. Con igu ado de códigos QR . . . . . . . . . . . . . . . . . . . . . . . . . 23
2.19. Con igu ado de una escena geoposicionada . . . . . . . . . . . . . . . . 24
2.20. Visual sc ip ing en uAd en u e . . . . . . . . . . . . . . . . . . . . . . . 24
3.1. In e az g á ica del edi o de Uni y . . . . . . . . . . . . . . . . . . . . . 27
3.2. P ocesamien o de una imagen en la SDK de Vu o ia . . . . . . . . . . . . 30
3.3. P oceso de ges ión de cambios de es ado en Reac . . . . . . . . . . . . . 31
4.1. Ciclo gene al de la gene ación de una a en u a . . . . . . . . . . . . . . . 38
5.1. Flujodeaplicación .............................. 40
5.2. Es uc u a del es ado global y es ados locales en Reac . . . . . . . . . . 42
5.3. Esquema de ins anciación de los componen es Reac . . . . . . . . . . . . 42
5.4. Elemen os isuales del componen e S eps . . . . . . . . . . . . . . . . . . 43
5.5. Componen e de esumen de la a en u a . . . . . . . . . . . . . . . . . . . 44
5.6. Componen e de ca ga de a en u as . . . . . . . . . . . . . . . . . . . . . 45
5.7. Fo mula io aseQuiz............................. 46
5.8. Fo mula io ase de QR . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
7
Augmen ed eali y easu e hun s engine UCM
knowledge. The ad en u e edi o will be accessed om he b owse whe e we can choose
he phases and hei con en in a g aphic and simple way. When he use is sa is ied wi h
he ad en u e con igu ed, i can be sa ed in he se e o download he Uni y p ojec o
gene a e he execu able o an And oid de ice.
1.1. Mo i a ions
This p ojec has achie ed he c ea ion a e y use ul ool o he gene a ion o small
in e ac i e games ha could be di ec ed o a ious ields. In he educa ional ield, games
could be c ea ed ha in i e s uden s o apply concep s gi en in class, s eng hening hem.
In he cul u al ield as an in e ac i e guide in isi s o museums. Wi hin he mos play ul
sphe e, gene a ing easu e hun s wi h he aim o en e aining g oups o people.
The p ojec , wi hin he ield o educa ion, bene i s eache s and s uden s as i allows he
o me o gene a e in e ac i e and gami ied ma e ial in a simple and in ui i e way. S u-
den s ecei e an in e ac i e expe ience ha is mo e engaging and p esen ed in a iendlie
way.
We also show ha i has he po en ial o be a simple engine o c ea ing se ious games[3].
La e we will see ha se ious games ha e ano he objec i e beyond en e ainmen , which
can be eaching, emembe ing concep s, e c.
1.2. P ojec ´s schedule
Du ing he de elopmen o he p ojec we a e going o se a se ies o miles ones o be
accomplished in he sho e m in o de o add new ea u es each ime, always ha ing a
unc ional e sion o he p ojec . The agile me hodology used will be SCRUM and we
will ha e one-week sp in s. A he end o each sp in , a mee ing wi h he u o s will be
held o show he p og ess and ecei e eedback.
In Oc obe , he wo k o he p ojec will ocus on expe imen ing wi h di e en ools ha
will be necessa y o de elop his p ojec , as we will see in he chap e 3. In Uni y we
will de elop a p og am ha eads in o ma ion om JSON and gene a es scenes and goes
om one o ano he as necessa y.
In No embe wi h his base and wi h he chosen ools, wo comple e phases will be
de eloped o be able o c ea e a mini ad en u e. To gene a e his JSON, a web ool will
ha e o be made om which you can c ea e a easu e hun by con igu ing and combining
he wo phases de elop. Then he ile ha de ines he ad en u e w i en in JSON can be
copied in o he execu o and o c ea e an execu able o use on ou de ice.
Now he objec i e will be o simpli y he p e ious p ocess so ha he execu o wi h
he JSON o he gymkhana al eady a ached can be downloaded di ec ly om he web
con igu a o and o be able o compile he p ojec di ec ly using a ba ch sc ip .
A he s a o Feb ua y and wi h ha cycle closed, a da abase will be c ea ed wi hin he
se e o be able o sa e he ad en u es ha a e c ea ed in o de o be able o modi y
hem la e and also upload he ins alle s o hese ad en u es so ha o he use s can
download and play hem di ec ly.
5

Augmen ed eali y easu e hun s engine UCM
Du ing Ma ch and Ap il mo e di e en phases will begin o be added wi h he pu pose
o gi ing mo e con en and e sa ili y o he p ojec o c ea e o he expe iences. The
idea is o ha e a ound six o se en di e en phases o be able o con igu e and add o
he ad en u es.
In May wi h all he phases de eloped he goal will be o c ea e a comple e easu e hun o
es he en i e wo k low om he design, h ough i s c ea ion using he web con igu a o
an inally downloading i and gene a ing he execu able and hen playing i om he
mobile de ice.
Finally, he isual aspec o bo h he con igu a o and he execu o will be imp o ed
ollowing he same s yle and ying o use he mos pleasan and in ui i e design possi-
ble.
1.3. P ojec ’s eposi o y and web page
All he wo k done du ing he de elopmen o he p ojec has been done using Gi Hub
as ou e sion con ol ool o s o e he eposi o y 1and imp o e he wo k low, allowing
each membe o wo k independen ly in a di e en b anch.
In he p ojec a web ool2has de eloped o c ea ing easu e hun s, we include he link
o i whe e you can c ea e you ad en u es and whe e he demo sca enge hun seen in
he chap e 7 is also a ailable. This ad en u e in ques ion will be a ailable bo h o edi
i and download eady o ins all i on ou de ice and play i .
1h ps://gi hub.com/Ad ian-de-Lucas-Gomez/TFG-Ejecu o -de-busquedas-del- eso o
2h p:// g.U banAR.o g
6
Capí ulo 2
Es ado del A e
En es e capí ulo amos a da con ex o sob e los a ances y es udios que se han ealizado en
los campos que a añen a nues o p oyec o: ealidad aumen ada, ecnologías web y juegos
se ios en los úl imos años y que han pe mi ido que a día de hoy sea iable ealiza un
p oyec o como es e. También e emos algunas emp esas que desa ollan so wa e simila
y/o compa able que ya se encuen an asen adas en el me cado.
2.1. Juegos se ios
Los juegos se ios (se ious games en inglés) son juegos diseñados con un p opósi o conc e o,
dis in o al lúdico aunque pueden se ambién di e idos de juga . La exp esión “se io”
iene dada po que se u ilizan en el sec o educa i o, cien í ico, en la a ención médica,
plani icación u bana, ingenie ía y polí ica, en e o os campos.
El é mino ue acuñado en 1970 po Cla k C. Ab , in es igado es adounidense y au o
del lib o Se ious Games[3] donde se explo an las di e en es o mas en las que los juegos
se pueden inclui en el p oceso de enseñanza y ap endizaje sin elimina la di e sión y el
place .
Es e ipo de so wa e ha adqui ido g an impo ancia desde la en ada del siglo XXI
( igu a 2.1b) y ha sido adop ados po ins i uciones educa i as y emp esas, especialmen e
pa a p og amas de o mación y campañas publici a ias. En el caso especí ico de España[4],
hay muchas emp esas que ya es án u ilizándolos sob e odo en el campo educa i o pa a
la o mación an o de niños como de adul os. Algunas de es as emp esas son Human iks,
Gamelea n, Binnakle, Ne languages y Chia a en e o as.
Campos de aplicación de los juegos se ios
Como ya ocu e con los ideojuegos adicionales, los juegos se ios se ag upan po su
emá ica o su público obje i o. Como es e ipo de juegos es án pensados con una inalidad
y obje i o muy conc e o exis en muchas subca ego ías posibles pe o se suelen ag upa po
campo de aplicación ( igu a 2.1). A con inuación amos a e algunos de los campos de
aplicación más impo an e que hay en la ac ualidad.
7
Augmen ed eali y easu e hun s engine UCM
(a) Dis ibución po ámbi os de uso
de 1970 a 2002 (953 juegos)
(b) Dis ibución po ámbi os de uso
de 2002 a 2010 (1265 juegos)
Figu a 2.1: Popula ización de los juegos se ios en
el nue o milenio y sus campos de aplicación
Fuen e: www.ludoscience.com/ iles/ essou ces/o igins_o _se ious_games.pd
Educación
Es a pa e del me cado son los que conocemos como juegos educa i os, en los que el
obje i o que se pe sigue es que el usua io adquie a una se ie de conocimien os y compe-
encias. Uno de los p ime os y conocido en EEUU, ue The O egon T ail (1971). El juego
enía como obje i o enseña a los niños ace ca de la ida de los pione os de la Ru a de
O egón en el Siglo XIX. El jugado asumía el ol de un líde en un ca o e iba guiando
a su g upo de colonos a ando de sob e i i cazando y ges ionando los ecu sos. Tu o
éxi o, eniendo en cuen a la época ( igu a 2.1a), y a lo la go de los años u o múl iples
secuelas y spin-o s.
En la ac ualidad los juegos se ios an omando cada ez más y más ele ancia lo cual
ha hecho que desa ollado as de ideojuegos, en ocados en el ámbi o lúdico, lancen un
o ma o educa i o usando sus p opiedades in elec uales. Es e ue el caso de Mic oso y
Mojang con Minec a y su Educa ion Edi ion1lanzado en 2018. Se a a de una e sión
adap ada del popula juego Minec a donde los docen es pueden hace uso de he a-
mien as pa a ansmi i las lecciones a los alumnos de una o ma no edosa e in e esan e.
Sanidad
Los juegos pensados pa a el mundo médico y sani a io ienen como obje i o e esca
conocimien os al p opio pe sonal sani a io sob e cie os p ocedimien os, aunque ambién
exis en juegos que es án di igidos a un público gene al y pe mi en enseña a la ciudadanía
écnicas2que pod ían ayuda a sal a idas o ayuda a man ene la salud.
Den o del ámbi o médico ya se usan ideojuegos[12] desde hace años pa a ayuda en labo-
es de diagnós ico, a amien o y ehabili ación de los pacien es. En es e ámbi o des acan
juegos como F eeDi e3, usado pa a dis ae y anquiliza a pacien es con en e medades
1Minec a Educa ion Edi ion:h ps://educa ion.minec a .ne /en-us
2E ec i idad de juegos se ios con ealidad aumen ada po 3ciencias: h ps://www.3ciencias.com/wp
-con en /uploads/2018/09/A _4-1.pd
3h ps://www.b eakawaygames.com/case-s udies/ ee-di e/
8
Augmen ed eali y easu e hun s engine UCM
c ónicas o Hung y Red Plane 4, el cual a a de inculca buenos hábi os alimen icios en
los niños.
También hay que añadi que hay juegos que o iginalmen e no se habían c eado como
juegos se ios pa a el ámbi o de salud pe o que sí que se aplican. Es e uso no se limi a
solo a los hospi ales o cen os de salud, donde se aconseja a los pacien es que se jueguen
cie os ipos de juegos ya sea pa a man ene se en o ma, an o ísica como men al o como
ayuda a la ho a de ehabili a se. Tí ulos que se usan de es a o ma son Wii Spo s, B ain
Age, Ring Fi Ad en u es o Jus Dance po menciona algunos ejemplos.
Mili a
Uno de los ámbi os más an iguos de los juegos se ios son los simulado es mili a es[15],
u ilizados como he amien a de en enamien o. Comenza on siendo o mas de ensaya
maniob as mili a es du an e la Gue a F ía (1945-1989). Uno de es os p ime os juegos no
e a un ideojuego elec ónico sino de mesa, HUTSPIEL[5] (1955). Consis ía en un juego
pa a 2 jugado es donde debían de ges iona los ecu sos de combus ible y munición en
cada unidad con el obje i o de gana la ba alla.
En los años pos e io es, los o denado es comenza ían a oma más ele ancia en la escena
mili a lo que pe mi ió que se desa ollasen simulado es donde se enseñaba a las opas
a maneja los ehículos sin necesidad de sali a ealiza las maniob as y pudiendo p oba
escena ios conc e os de ba alla. Suelen i acompañados de compleja maquina ia pa a
simula de la mejo o ma posible el en o no.
Es os juegos no es án disponibles pa a el público gene al po mo i os de segu idad na-
cional, ya que e ela ía en enamien os y ác icas a o os países.
Publicidad
Los juegos se ios u ilizados como he amien as de ma ke ing, los conocidos como ad e -
gaming, son ideojuegos cuyo obje i o es el de publici a una ma ca o p oduc o. Los
juegos elabo ados como pa e de una es a egia de ad e gaming suelen se g a ui os y
dis ibui se de mane a online siendo compa ibles con di e en es disposi i os. El p o ago-
nis a de los mismos es la ma ca, emp esa, p oduc o, ins i ución o se icio que se quie e
p omociona .
Debemos dis ingui el ad e gaming de la publicidad inse ada den o de un ideojuego
es ánda , po ejemplo, los banne s den o de los es adios de ideojuegos depo i os. En
los juegos publici a ios la p esencia de ma ca no es secunda ia, sino que es el pun o cen al
del juego.
A día de hoy, en la e a de las edes sociales, son muy comunes es e ipo de juegos ya que las
ma cas han is o lo bien que uncionan. Algunos ejemplos de ad e games an es de la época
de las edes sociales son Ame ica´s A my (Windows, 2002), un juego bélico que lanzó
el ejé ci o de EEUU con el obje i o de cap a a los más jó enes pa a que se alis asen,
Pepsiman5(Plays a ion, 1999), un juego donde debíamos e i a obs áculos y ecoge
4h ps://se ious.gameclassi ica ion.com/EN/games/15815-Hung y-Red-Plane /index.h ml
5Gameplay de Pepsiman: h ps://www.you ube.com/wa ch? =8U gQ8jybIw
9
Augmen ed eali y easu e hun s engine UCM
Pepsis y po úl imo Ya is6(Xbox 360, 2007), un juego donde conducíamos un Toyo a
Ya is po pis as ubula es a ando de dispa a a los enemigos y gana pun os.
A e y cul u a
Es e ipo de ideojuegos a a de ansmi i conocimien os sob e a e, asgos cul u ales
o his o ia sob e un luga conc e o. En especial, cuando se a a de ci ilizaciones an i-
guas como omanos, g iegos o egipcios, la adap ación a ideojuegos (especialmen e en
3D) ayuda a en ende y isualiza mejo como e an esas sociedades. En la úl ima década
ha habido un auge de juegos de ealidad aumen ada en zonas de yacimien os a queo-
lógicos donde supe poniéndose a las uinas podemos e cómo e an las es ancias en su
época.
Es una de las ca ego ías que más es á c eciendo en los úl imos años. Incluso ha lle ado
a emp esas muy g andes del mundo de los ideojuegos con encionales a in oluc a se en
p oyec os de es a índole. Una de ellas ue Nin endo, quien en colabo ación con el Lou e
desa ollo una audioguía7in e ac i a pa a Nin endo 3DS.
Co po a i os
Videojuegos desa ollados pa a se usados como una he amien a pa a la emp esa con el
obje i o de en ena a sus abajado es o gami ica una se ie de ac i idades como pueden
se las euniones, con e encias, e c. Son juegos que no se hacen disponibles al público
ex e no a la emp esa ya sea po mo i os de segu idad u o os, aunque sí hay cons ancia
de algunos a lo la go de los años.
Uno de los que conocemos es Pepsi In ade s8(1983) el cual es un clon del ideojuego
Space In ade s9(1978) que usó in e namen e Coca-Cola con el obje i o de aumen a la
compe i i idad de sus empleados en e a Pepsi.
2.2. Aplicaciones web
La po encia de lo que es posible hace en la web ha ido aumen ado muchísimo desde
la llegada al me cado de los p ime os na egado es du an e la década de los 90. En esos
p ime os años los na egado es, las aplicaciones que pe mi en accede a la web, solamen e
se enca gaban de desca ga páginas HTML y mos a las. Un a ance impo an e en esos
años ue on los lenguajes de sc ip ing que pe mi ie on dinamiza es as páginas es á icas.
Aunque ha habido más a ances en la web, uno de los más ele an es en es e p oyec o
es el de pode pedi la in o mación bajo demanda, es deci , cuando sea necesa io. Es o
ha pe mi ido la c eación de aplicaciones que se ejecu an en el na egado , lo cual elimina
la necesidad de ene las ins aladas en nues o o denado y las hace más accesibles al
6Gameplay Ya is: h ps://www.you ube.com/wa ch? =S sW-ZW9iWI& =56s&ab_channel=Mis e
Jan ix
7Demos ación Nin endo 3DS Guide Lou e: h ps://www.you ube.com/wa ch? =27lAJiYTZwQ
8h ps://www. e ogames.cz/play_1215-A a i2600.php
9h ps://www. e ogames.cz/play_016-A a i2600.php
10

Augmen ed eali y easu e hun s engine UCM
público ya que pueden accede desde cualquie disposi i o en el que se pueda ejecu a un
na egado web.
Pa a el desa ollo de páginas web se suelen segui uno de es os dos pa ones: MPA (Mul i-
Page Applica ion) y SPA (Single-Page Applica ion).
(a) Página web que usa MPA (GAME) (b) Página web que usa SPA (Twi e )
Figu a 2.2: Aplicaciones web con o ma o Mul i-Page Applica ion y Single-Page Appli-
ca ion
2.2.1. Mul i Page Applica ion
El pa ón de diseño de las Mul i Page Applica ion (MPA) consis e en la di isión del
con enido de la página en di e en es pan allas. Es e es el pa ón que se ha usado du an e
muchísimos años en el desa ollo web. A día de hoy sigue es ando muy ex endido y se
usa gene almen e pa a páginas muy g andes ya que suelen ene mucho con enido y muy
a iado po lo que es más azonable el di idi lo ya que no se ía iable ene lo odo en
una sola pan alla.
Figu a 2.3: Ciclo de ida de una MPA
Al accede a una página MPA emos que en su ciclo de ida ( igu a 2.3) se pide la página
y es a se mues a al usua io pe o cada ez que se p oduzcan cambios de página o se
ac ualice la in o mación de la misma el se ido nos da á un nue o a chi o HTML y CSS
con la página ac ualizada, desca ando la que se es aba mos ando has a aho a.
Cada una de las di e en es pan allas que iene una MPA lle a asociada una URL (Uni o m
Resou ce Loca o ) la cual si e pa a iden i ica a cada uno de los ecu sos disponibles en
la ed y pode accede di ec amen e a ellas e i ando pasa po o as páginas in e me-
dias.
11
Augmen ed eali y easu e hun s engine UCM
2.2.2. Single Page Applica ion
La iloso ía de diseño[7] de páginas web conocida como Single-Page Applica ion (SPA)
consis e en una aplicación web que mues a odo el con enido desde una misma página.
Es o no quie e deci que odo el con enido es é al mismo iempo en la pan alla sino que
se a ocul ando y mos ando con enido según se aya necesi ando.
Al ca ga po p ime a ez la página se desca ga el HTML, CSS y el código Ja asc ip [11].
Es e código Ja asc ip con ola el cambio de una sección a o a, ac ualizando lo que se
debe mos a en pan alla. Al ca ga se es a es uc u a lige a al p incipio, y después ca ga
el con enido desde el se ido , los iempos de espues a de la aplicación son mejo es y es o
mejo a la expe iencia de usua io no haciéndole espe a an o pa a ab i la página.
Figu a 2.4: Ciclo de ida de una SPA
Aunque se accede a odo el con enido desde la misma URL, es a se puede modi ica pa a
que cada sección enga una p opia como pasa ía en una MPA. Es o es ú il pa a accede
di ec amen e a la sección que e in e esa de la página sin ene que epe i el eco ido
desde el inicio de la web. Las SPA suelen i asociadas a una base de da os desde la cual
desca gan el con enido, ya que es e suele i cambiando (ej. Twi e : igu a 2.2b). En es e
ciclo de ida ( igu a 2.4) se puede e que solamen e piden el con enido a mos a , no la
página en e a ya que no se a a e esca comple amen e.
2.2.3. Capas de las aplicaciones web
Cabe des aca que un en oque ípico en el desa ollo web es con a con una di isión cla a
en e la in e az y el se ido donde se encuen a alojada la in o mación de la aplicación.
Dichas capas eciben el nomb e de on en y backend espec i amen e.
El on end es la capa de una aplicación enca gada de mos a el con enido en pan a-
lla y con la que in e ac úa el usua io. Pa a el apa ado isual se emplea gene almen e
HTML con hojas de es ilo y pa a la uncionalidad suele emplea se Ja aSc ip como len-
guaje de p og amación. Es ípico el uso de amewo ks como Reac o Angula pa a la
implemen ación de es a capa.
El backend, po o o lado, es la capa de la aplicación que se ejecu a en el se ido la
cual se u iliza pa a la ges ión del en ío y ecepción de solici udes y da os que se en ían
en e el clien e y el se ido . Se puede usa cualquie lenguaje de p og amación pa a
implemen a la, aunque algunos de los más usados son: Node.js, Py hon, PHP o Ja a.
Es o se debe a que es án pensados pa a que sea ácil hace que se comuniquen con bases
de da os, se ializa la in o mación pa a se en iada o ealiza abajo de o ma asínc ona
que es muy común en el desa ollo web.
12
Augmen ed eali y easu e hun s engine UCM
Cabe des aca que hay webs que usan un modelo híb ido en el que ienen secciones
implemen adas como SPAs pe o es án den o de páginas sepa adas y conec adas como
ocu e en una MPA.
2.3. Realidad Aumen ada
La ealidad aumen ada es una ecnología que consis e en la supe posición de elemen os
i uales sob e el mundo eal de o ma que, de la sensación de que esos elemen os i ua-
les ealmen e exis en en la mundo eal[1]. Pa a expe imen a es a ecnología hay a ias
o mas: a a és de la pan alla de un disposi i o como puede se el caso de un elé ono
mó il o a a és de láminas anslúcidas sob e las que se p oyec a la imagen a supe -
pone como ocu e po ejemplo con Google Glass10. Debido a la g an popula ización de
es a ecnología a día de hoy es ba a a y accesible g acias a la g an can idad de so wa e
g a ui o y la escasa necesidad de ha dwa e especí ico. A di e encia de la ealidad i ual
(VR) la ealidad aumen ada no sus i uye la ealidad po una i ual sino que la expande
y complemen a.
Uno de los p ime os a ances en es e campo ue en el año 1966, cuando el p o eso de
Ingenie ía Eléc ica de la Uni e sidad de Ha a d, I án Su he land[9], c eó el HMD (Head
Moun ed Display). Conocido ambién como La Espada de Damocles11, el disposi i o e a
un iso ( igu a 2.5a) que mos aba elemen os idimensionales con g á icos ec o iales
(wi e ame) p oyec ados sob e unas len es de c is al. Pa a sabe la localización y o ación
de la cabeza del indi iduo se hacía uso de di e sos senso es mecánicos ( igu a 2.5b) que
enía el anclaje de las ga as al echo en conjun o a senso es de ul asonidos.
(a) Viso del disposi i o (b) Esquema de uncionamien o
Figu a 2.5: Espada de Damocles (HMD), 1966
Imágenes HMD: h ps://p oyec oidis.o g/espada-de-damocles/
10h ps://www.google.com/glass/s a /
11Espada de Damocles: h ps://www.you ube.com/wa ch? =eVUg U P4uk&ab_channel=Ul im
a eHis o yo VideoGames
13
Augmen ed eali y easu e hun s engine UCM
K.A.R.M.A.[16] (Knowledge-based Augmen ed Reali y o Main enance Assis ance) ue
desa ollado en la Uni e sidad de Columbia12 po S e en Feine , Blai MacIn y e y Do ée
Seligmann en 1993. Desa olla on un so wa e que iba dando ins ucciones al usua io
sob e cómo eca ga la imp eso a, sin ene que ecu i al manual de uso, p oyec ando
igu as ec o iales ( igu a 2.6b) que iban indicando los pasos a segui a a és de un iso
( igu a 2.6a) con p oyec o es y len es anspa en es.
Pa a mos a las imágenes hicie on modi icaciones sob e un so wa e p e io llamado
IBIS[6], el cual se especializaba en la gene ación de ilus aciones basado en eglas de-
sa ollado po S e en Feine y Do ée Seligmann.
(a) Viso del disposi i o (b) G á icos mos ados
Figu a 2.6: Knowledge-based Augmen ed Reali y o Main enance Assis ance, 1993
En el año 2000 su ge un nue o hi o en el desa ollo de la ealidad aumen ada, ARQuake[18].
Es e p oyec o e a una demos ación écnica13 de ealidad aumen ada pe o es a ez en-
ocada al mundo de los ideojuegos. Es e p oyec o e a una de i ación del popula juego
Quake de id So wa e14 lanzado en 1996. Desa ollado po Wayne Pieka ski y B uce Tho-
mas, es e p o o ipo pe mi ía segui la posición del jugado en el mundo eal a a és
de GPS de al a p ecisión. También empleaba una combinación de gi óme o15 y b újula
magné ica pa a egis a y maneja la o ación de la cabeza del usua io. Pa a mos a el
con enido usaban un HMD (Head Moun ed Display).
La ele ancia de es e p oyec o iene ma cada po se la p ime a ez que hacía uso de RA
( ealidad aumen ada) en un disposi i o “po á il”, ya que el o denado que p ocesaba
odo se encon aba den o de la mochila ( igu a 2.7a). Es o, unido a la capacidad GPS,
pe mi ía al usua io mo e se lib emen e po su en o no ( igu a 2.7b) in e ac uando con
pue as, enemigos, a mas, e c ( igu a 2.7c). Los desa ollado es además ab ie on una
página web16 donde se pueden e da os écnicos del p oyec o y del disposi i o. T as es e
p o o ipo comenza on con el desa ollo de Tinmi h17, el cual es una e sión mejo ada y
gené ica del ha dwa e usado en ARQuake pa a c ea aplicaciones de RA al ai e lib e.
12h ps://g aphics.cs.columbia.edu/p ojec s/ka ma/ka ma.h ml
13Video ARQuake: h ps://you u.be/No7QF0MwSjg
14h ps://www.idso wa e.com/es-es
15Apa a o que si e pa a medi la elocidad de o ación de una máquina.
16Página ARQuake: h p://www. inmi h.ne /a quake/
17Página sob e Tinmi h: h p://www. inmi h.ne /
14
Augmen ed eali y easu e hun s engine UCM
(a) Realidad aumen ada po ubicación (b) Realidad aumen ada po supe icie
Figu a 2.15: Búsqueda del eso o c eada po Oni ix como demos ación
Fuen e: h ps://www.you ube.com/wa ch? =i1zA xlGkjU&ab_channel=Oni ix
2.4.4. uAd en u e
uAd en u e24 es una pla a o ma pa a el desa ollo de juegos de o denado de a en u as
clásicas con ines educa i os. Es a pla a o ma ha sido desa ollada po el g upo de in-
es igación de la Uni e sidad Complu ense de Mad id. Es la suceso a de la pla a o ma
eAd en u e25. A di e encia de su p edeceso , que se c eó en el ma co de Ja a, uAd en u e
se ejecu a sob e el mo o de juego Uni y y pa a u iliza lo no se equie en conocimien os
p e ios de Uni y.
Es e mo o ue concebido pa a hace juegos se ios de ipo a en u as g á icas que pueden
o no hace uso de geoposicionamien o según la a en u a que que amos c ea . uAd en u e
se ins ala como un paque e en Uni y y o ece un edi o p opio sepa ado del edi o de
Uni y en el cual nos o ecen di e en es ipos de obje os que podemos c ea pa a hace
nues as a en u as:
24h ps://www.e-ucm.es/uad en u e/
25h p://e-ad en u e.e-ucm.es)
21

Augmen ed eali y easu e hun s engine UCM
Figu a 2.16: Vis a gene al de escenas y conexiones en e ellas
Escenas: aquí podemos añadi y modi ica escenas que o ma án pa e de nues-
a a en u a. Se puede añadi el ondo, zonas de in e acción, obje os y pe sonajes
( igu a 2.17) pa a da la uncionalidad que se busque en ese momen o. Podemos
isualiza las conexiones ( igu a 2.16) que engamos en e dis in as escenas.
Pe sonajes: en es a sección podemos añadi y e los pe sonajes c eados. Es as son
las en idades con las que podemos con e sa den o del juego pudiendo ene cua o
o ien aciones di e en es según hacia donde mi en.
Con e saciones: pe mi e c ea líneas de diálogo en e los pe sonajes y ambién pa a
el p o agonis a. Pueden se dispa adas po e en os como po ejemplo al accede a
una escena nue a.
Obje os: aquí podemos c ea y edi a los obje os con los que podemos in e ac ua
du an e la pa ida pudiendo elegi su ep esen ación en pan alla y los e en os a los
que es án asociados.
Códigos QR: pe mi e la c eación de códigos QR ( igu a 2.18) que luego se escanea-
án du an e el juego eniendo la opción de gua da los e imp imi los.
Escenas de mapa: es e ipo de escena iene la pa icula idad de que es á asociada a
una localización eal y se suele u iliza pa a hace secciones o juegos geoposiciona-
dos. El ondo de la escena siemp e se á el mapa de la zona en la que se encuen e el
usua io y en él se pueden añadi zonas especiales ( igu a 2.19) que desa en e en os
al en a en ellas y coloca obje os y pe sonajes en zonas del mapa.
Obje os geoposicionados: son una a ian e de los obje os pensada pa a se colocada
y u ilizada en los mapas geoposicionados. Se puede es ablece además de su aspec o,
la dis ancia a la que es isible.
22
Augmen ed eali y easu e hun s engine UCM
Figu a 2.17: Con igu ado de una escena no mal
Figu a 2.18: Con igu ado de códigos QR
23
Augmen ed eali y easu e hun s engine UCM
Figu a 2.19: Con igu ado de una escena geoposicionada
A la ho a de p og ama es as a en u as g á icas en uAd en u e se hace odo a a és
de isual sc ip ing ( igu a 2.20). Es o quie e deci que la p og amación de los compo a-
mien os del juego se ealizan a a és de secuencias de nodos que son una o ma g á ica
de manipula obje os y compo amien os en Uni y sin ene que esc ibi código desde
ce o. La lógica se cons uye conec ando nodos en e sí, lo que pe mi e que pe sonas no
amilia izadas con la p og amación puedan c ea juegos y sis emas in e ac i os de una
mane a sencilla. Es a he amien a ya incluye compo amien os ya p ede inidos pa a ac-
ciones comunes como el inc emen o de a iables, na egación en e escenas, ac i ación de
obje os, bo ado de obje os, e c.
Figu a 2.20: Visual sc ip ing en uAd en u e
24
Augmen ed eali y easu e hun s engine UCM
uAd en u e al se un mo o que es á muy pensado pa a la c eación de juegos se ios iene
un sis ema de eleme ía. Un sis ema de eleme ía se enca ga de la ecolección de da os
du an e las sesiones de juego de los usua ios, pe mi iendo gua da los de o ma local o en
un se ido , y el o ma o de la in o mación puede se en o ma o CSV o XAPI. Es o es
muy ú il ya que pe mi e e alua que al unciona el juego y cuál ha sido el desempeño de
los jugado es en unción de los alo es ecogidos.
25
Capí ulo 3
He amien as
En es e capí ulo amos a conoce algunas de las he amien as que hemos u ilizado pa a
desa olla es e TFG. Comenza emos hablando de qué ipo es la he amien a, sus o ígenes,
como unciona in e namen e y las ca ac e ís icas que nos han hecho decan a nos po ellas
sob e o as al e na i as. Como el p oyec o cons a de dos pa es bien di e enciadas, la
aplicación web y el ejecu o de las búsquedas del eso o, ha emos uso de he amien as
di e en es pa a cada una de las pa es.
3.1. Uni y
Uni y1es una pla a o ma de desa ollo de ideojuegos la cual combina mo o g á ico,
mo o ísico, mo o de audio, sis emas de inpu , un edi o con el que pode c ea los juegos
y la capacidad pa a gene a e siones pa a dis in as pla a o mas. Exis e g an can idad
de in o mación y documen ación pa a el desa ollo de ideojuegos y además una ienda
donde podemos accede a miles de ecu sos que se pueden añadi a un p oyec o pa a se
u ilizados, an o g a ui os como de pago.
Uni y su gió a aíz del ideojuego “GooBall”, desa ollado po Da id Helgason, Nicholas
F ancis y Joachim An e. Aunque no u o el éxi o espe ado, pa a ese p oyec o desa olla on
una se ie de he amien as muy ú iles a la ho a de desa olla un ideojuego, po lo que
decidie on ag upa esas he amien as c eando un mo o con el que pudiesen abaja
p og amado es, diseñado es y a is as, ya ue an es udios g andes o pequeños pa a c ea
juegos, y después pode desplega lo en di e en es pla a o mas.
Uni y ue p esen ado en la Wo ldWide De elope s Con e ence (WWDC) de Apple en el
año 2005 siendo inicialmen e solo disponible pa a MacOS pe o iempo después apa ece ía
ambién en la pla a o ma Mic oso Windows. O iginalmen e el modelo de negocio que
seguía Uni y e a con e siones de pago, la e sión Indie y la P o. En e ambas e siones
no solo exis ía una sus ancial di e encia en p ecio (300 dóla es la Indie y 1500 dóla es la
P o) sino ambién con espec o a la uncionalidad ya que la e sión de acceso ca ecía de
algunas unciones más a anzadas. En ese en onces, Uni y no podía compe i en igualdad
de condiciones con los mo o es de ese momen o.
1h ps://uni y.com/es
26

Augmen ed eali y easu e hun s engine UCM
En el año 2009 desapa eció la e sión Indie de pago y es a pasó a se g a ui a. A pa i de
ese momen o solo se debe de paga en caso de ebasa un umb al de bene icios gene ados
po los juegos desa ollados en la pla a o ma. Es o aumen ó eno memen e la popula idad
del mo o , el cual comenzó a se usado po nue os usua ios c eando sus p ime os juegos.
En los años siguien es, Uni y ha con inuado añadiendo uncionalidades y mejo ando las
capacidades g á icas del mo o poniéndose al ni el de los e e en es en el sec o .
3.1.1. Funcionamien o de Uni y
Uni y sigue una a qui ec u a o ien ada a componen es y po lo an o pa a desa olla
juegos u o as aplicaciones se hace uso de dos ipos de obje os, las en idades conocidas
como GameObjec s y los componen es. Las en idades son p incipalmen e con enedo es
de componen es que po de ec o ienen la in o mación sob e su posición, o ación y escala
en un componen e T ans o m.
Figu a 3.1: In e az g á ica del edi o de Uni y
Fuen e de la imagen: h ps://uni y3d.com/es/be a/2020.1b
Los componen es se enca gan de apo a la uncionalidad conc e a que que emos pa a el
p og ama. Uni y o ece componen es de odo ipo pa a la mayo ía de unciones básicas
en cualquie juego como ende iza un obje o, emi i sonidos o ealiza in e acciones
ísicas, en e o as. Pa a pode hace juegos usando es as he amien as Uni y cuen a con
un edi o con in e az g á ica ( igu a 3.1) desde donde un usua io puede i añadiendo
en idades. Es á di idido en cua o secciones po de ec o:
Je a quía: colocado en la pa e izquie da, el usua io puede e un lis ado con los
GameObjec que iene en la escena en la que nos enco amos ac ualmen e.
Viso de escena y juego: en la pes aña cen al se puede e la ep esen ación
y posición de los GameObjec de la escena. También podemos e como se e la
escena a a és de la cáma a, que es como se e ía al ejecu a el juego.
Inspec o : en la pa e de echa se puede e oda la in o mación sob e los compo-
nen es del GameObjec seleccionado y a ia sus alo es di ec amen e.
27
Augmen ed eali y easu e hun s engine UCM
Explo ado de a chi os y consola: colocado en la pa e in e io , se pe mi e e
los di ec o ios de ecu sos del p oyec o donde podemos a as a o os nue os. En
la o a pes aña podemos e la consola donde apa ecen los mensajes de e o .
Uni y ges iona po sí mismo el bucle de juego además del ciclo de ida de la aplicación,
las en idades y sus componen es. Los usua ios pueden c ea sus p opios componen es
p og amándolos en sc ip s que pueden he eda de Monobeha iou [13] haciendo que el
ciclo de ac ualización del sc ip lo lle e Uni y. Es os sc ip s los edi a emos a a és de
IDEs2como Visual S udio u o os.
Uni y pe mi e añadi a los p oyec os paque es de e ce os que pueden ayuda a la ho a
de desa olla algo o pode añadi alguna uncionalidad, po ejemplo Vu o ia.
3.1.2. Ca ga de ecu sos en Uni y
En el sec o de los ideojuegos sabemos que es muy impo an e que la ca ga de ecu sos
sea ápida y e icien e debido al g an núme o de ex u as, modelos, sonidos y o os ele-
men os que equie en los juegos ac uales. Po es e mo i o el equipo de Uni y dio mucha
impo ancia a es e aspec o.
Los ecu sos que se ayan a u iliza en un p oyec o de Uni y deben es a almacenados
den o del di ec o io Asse s. Todos los ecu sos que es án bajo el con ol de Uni y con-
a án con a chi os con ex ensión me a. Es os a chi os ienen como unción almacena
la con igu ación de impo ación del a chi o al que es á asociado en el p oyec o y o as
unciones.
Uni y ambién nos pe mi e ca ga de o ma dinámica a chi os haciendo uso del di ec o io
Resou ces y su API3especí ica. Los ecu sos que se encuen an den o del di ec o io
Resou ces o ma án pa e de la aplicación inal independien emen e de si es án siendo
e e enciados po alguna de las escenas que la con o man, po lo que es ecomendable no
deja ecu sos no empleados en ese di ec o io.
3.2. Vu o ia
Vu o ia4es un ki de desa ollo de so wa e (SDK) pensado pa a la c eación de aplicacio-
nes de Realidad Aumen ada. Su uncionamien o es á basado en una ecnología de isión
compu acional con la que puede econoce y segui imágenes planas o idimensionales
conocidas como a ge s. Sob e esos obje i os que ha econocido podemos p oyec a ele-
men os i uales usando un mo o g á ico[10], po ejemplo el de Uni y, pa a simula que
exis en ealmen e. Vu o ia ue c eado o iginalmen e po Qualcomm pe o pos e io men e
ue endido en el año 2015 a PTC la cual ha seguido desa ollando el so wa e y añadiendo
nue as uncionalidades.
Vu o ia iene muy buena in eg ación con Uni y y es una he amien a g a ui a siemp e que
se use con ines no come ciales como es el caso del p oyec o. Es a he amien a pe mi e
2Sis ema so wa e pa a el diseño de aplicaciones que combina he amien as comunes pa a desa olla-
do es en una sola in e az de usua io g á ica (GUI).
3Uni y Resou ces: h ps://docs.uni y3d.com/Sc ip Re e ence/Resou ces.h ml
4Po al de Vu o ia: h ps://de elope . u o ia.com/
28
Augmen ed eali y easu e hun s engine UCM
la c eación de a ge s de o ma au omá ica sin necesidad de usa el con igu ado de su
p opia página, eliminando pasos a ealiza .
En Vu o ia encon amos es elemen os p incipales pa a el uncionamien o del econoci-
mien o de imágenes:
Ta ge : es el elemen o ísico que se a buscando a a és de lo que e la cáma a.
Puede se una imagen plana, un obje o o una supe icie.
T acke : es el enca gado de analiza y p ocesa lo cap ado po la cáma a buscando
coincidencias con los da os del a ge que es amos usando.
Da abase: es donde se gua dan los da os que iden i ican a los a ge que se es én
usando a la ez.
También nos o ece g an a iedad de ipos de a ge s que se pod ían llega a in eg a en
nues as a en u as ales como: Image Ta ge , Cilinde Ta ge , Cuboid Ta ge y Su ace
Ta ge .
3.2.1. Funcionamien o de Vu o ia Engine
Aho a amos a e cómo unciona in e namen e la lib e ía de Vu o ia pa a pode iden i-
ica y as ea los a ge s haciendo uso de la cáma a del disposi i o. Pa a ello du an e la
ejecución ( igu a 3.2), el disposi i o cap a ídeo a a és de la cáma a y de es e la SDK
de Vu o ia selecciona un o og ama. Es a imagen es ans o mada a una esolución más
educida pa a mejo a la elocidad de p ocesamien o y pode se co ec amen e a ada
po el T acke . Vu o ia analiza la imagen y busca coincidencias en la base de da os, la cual
es á compues a po “ a ge s”. Si consigue encon a coincidencias manda á a Uni y en-
de iza en pan alla los elemen os que es e obje i o u iese asociados, al e ando posición
y o ación según cambie la posición del a ge de ec ado.
3.2.2. Cla es de Vu o ia
Las aplicaciones de Vu o ia necesi an de una cla e pa a pode accede a las cualidades
del mo o . Dichas cla es se consiguen a pa i de las licencias que se mues an a con i-
nuación:
Licencia básica.
Licencia básica + sopo e en la nube.
Licencia p o.
Pa a consegui una se debe i a la página o icial de Vu o ia, c ea una cuen a nue a e i
al adminis ado de licencias pa a ob ene cualquie a de las mencionadas p e iamen e.
Al hace es o, se le pedi á al usua io que inse e un nomb e pa a gene a una nue a cla e
a pa i de dicha licencia. T as habe lo asignado, la cla e se mos a á disponible en el
adminis ado de licencias5de la cuen a del usua io.
5h ps://de elope . u o ia.com/ ui/de elop/licenses
29
Augmen ed eali y easu e hun s engine UCM
Figu a 3.2: P ocesamien o de una imagen en la SDK de Vu o ia
Fuen e de la imagen: h ps://www.sci p.o g/h ml/1-9301927_48585.h m
3.3. Reac
Reac 6es una lib e ía de código abie o pa a el lenguaje de p og amación web Ja aSc ip .
Fue concebida con el obje i o de acili a la c eación de aplicaciones en una única página
(Single Page Applica ion) las cuales imos en la sección 2.2.2. La lib e ía se enca ga
de la pa e isual de la página y se suele usa con aplicaciones cuyos da os cambian
cons an emen e.
Fue c eado po Jo dan Walke, ingenie o de so wa e en Facebook, bajo el nomb e de
FaxJS en el año 2011. Ese mismo año se comenzó usa en Facebook y al año siguien e
en Ins ag am. En el 2013 pasó a se de código abie o y en 2015, con la llegada de
Reac Na i e, pe mi i ía desa olla de o ma na i a en And oid, IOS, Uni e sal Windows
Pla o m. Elegimos usa Reac como lib e ía pa a c ea nues a aplicación web debido a
que es á especializada en SPAs y jus o ese es el en oque que que íamos da a la página
web con el obje i o de se simple y ápida.
3.3.1. Funcionamien o de Reac
Reac es á cons uido en o no a hace unciones, que oman las ac ualizaciones de es ado
de la página y que se aducen en una ep esen ación i ual de la página. Siemp e
que Reac es in o mado de un cambio de es ado, uel e a ejecu a esas unciones pa a
de e mina una nue a ep esen ación i ual de la página y, a con inuación, se aduce
au omá icamen e ese esul ado en los cambios del DOM7necesa ios pa a e leja como
6h ps://es. eac js.o g/
7Documen Objec Model: in e az de p og amación pa a los documen os HTML y XML
30
Augmen ed eali y easu e hun s engine UCM
o a que hizo an e io men e, debe de cons ui las desde ce o, lo cual es un incon enien e
impo an e cuando se a a de a en u as g andes.
Pa a soluciona es o, la aplicación web pe mi e almacena a en u as “en la nube”. Los
usua ios ienen la posibilidad de gua da la con igu ación de sus a en u as en el se i-
do que sos iene la aplicación web. Es as con igu aciones engloban elemen os como: el
nomb e de la a en u a, las ases que la cons i uyen y una desc ipción de lo que a a la
a en u a.
Adicionalmen e, es a he amien a pe mi e gua da aplicaciones hechas po los usua ios
con el obje i o de que si un usua io quie e di ec amen e juga una en u a almacenada, no
engan que gene a la a pa i de su con igu ación. Al igual que con dichas con igu aciones,
es as aplicaciones ambién son almacenadas jun o a una desc ipción sob e la misma dada
po su au o .
4.3. Ejecución de las a en u as
Po su pa e, pa a la ejecución en el mó il se ha decidido usa Uni y. Como se ha con ado,
Uni y es un mo o gene alis a pa a ealiza juegos. Lo que se ha hecho es c ea un “juego
sin e mina ” en el que le al an los da os eales de la yincana que se ejecu a á. Esos ienen
de la he amien a de au o ía. Cuando alguien hace una a en u a, lo que es á ealmen e
haciendo sin en e a se es c ea los ecu sos que le al an al “juego sin e mina ” y pa a
consegui la aplicación inal lo que se hace es jun a las dos pa es y pedi a Uni y que
haga la build inal.
4.4. Da os que cons i uyen una a en u a
Es os da os que gene a el usua io engloban: el nomb e de la a en u a, su cla e de Vu o ia
pa a accede a las cualidades del mo o de AR y las ases de las que se compone dicha
a en u a. La mane a en la que se almacena odo es o es median e un JSON. Sin emba go,
hay algunos ipos de ases que hacen uso de imágenes o iche os de audio. Po lo que, en
conjun o, los da os que con igu an la a en u a de un usua io es án ep esen ados po un
JSON y los iche os adicionales que se e e encien en el mismo.
4.5. Ciclo de gene ación de una a en u a
Habiendo mos ado los elemen os que cons i uyen es e p oyec o y los da os que ep esen-
an las a en u as del usua io, el esquema que se debe de segui pa a gene a una a en u a
es el que se mues a en la igu a4.1
37

Augmen ed eali y easu e hun s engine UCM
Figu a 4.1: Ciclo gene al de la gene ación de una a en u a
Pa a c ea su p opia a en u a, el au o ab i á la aplicación de au o ía, donde inse a á
da os como el í ulo de es a y su cla e de Vu o ia. A pa i de en onces, selecciona á las
ases que desea inclui y ellena á los o mula ios de cada una de es as. En el momen o
en el que es é sa is echo con su esul ado, pod á ma e ializa su a en u a, lo que le
o o ga á un p oyec o de Uni y que le pe mi i á gene a una aplicación que ep esen a á
su a en u a.
38
Capí ulo 5
He amien a de au o ía de
yincanas
Pa a consegui es a he amien a se necesi a una aplicación web que, como se io en la
Sección 4.2, es a aplicación es a á compues o de un on end, que es lo que ejecu a el na e-
gado , y el backend que p opo ciona se icios al on end. Pa a mejo a la in e ac i idad,
usamos una SPA.
El backend p opo ciona se icios de almacenamien o. En pa icula , man iene los da os
de las yincanas c eadas, de o ma que es posible eab i las y con inua su edición. Po
o o lado, man iene las aplicaciones pa a mó il gene adas a pa i de esas con igu aciones
de yincanas pa a que los usua ios puedan desca gá selas e ins ala las en sus mó iles pa a
juga las.
Pa a ap ende a u iliza es a he amien a se puede consul a el manual de uso en el
Apéndice A.
5.1. F on end
El módulo de on end ep esen a la página web que el usua io e. Es a pa e es á desa-
ollada con Reac . A con inuación se discu en las di e en es decisiones de diseño omadas
en es a pa e del p oyec o.
5.1.1. Flujo de la aplicación
La aplicación web p esen a una se ie de pan allas po las que le usua io puede pasa pa a
con igu a sus a en u as, un esquema del lujo de la aplicación que segui ía un usua io
se ía el que se mues a en la siguien e igu a:
39
Augmen ed eali y easu e hun s engine UCM
Figu a 5.1: Flujo de aplicación
40
Augmen ed eali y easu e hun s engine UCM
5.1.2. Es uc u a de los componen es de la WEB
Den o de las dos al e na i as que o ece Reac a la ho a de c ea componen es mencio-
nadas en la Subsección 3.3.2. Nues a decisión ha sido ealiza nues os componen es a
modo de componen es uncionales. Es o es debido a que su es uc u a es más sencilla de
esc ibi , además de que como ambien se ha is o en la Subsección 3.3.2, median e los
Hooks de Reac es posible ob ene uncionalidades como es ado in e no y ciclo de ida.
Po lo que é amos capaces de ob ene los mismos esul ados que u ilizando componen es
a modo de clases.
5.1.3. Es ado in e no
Pa a almacena los di e en es alo es elacionados con las a en u as que con igu a el
usua io, hacemos uso de los es ados de cada uno de los componen es del p oyec o.
El p oblema apa ece con el hecho de que, en la página web exis en múl iples componen-
es, cada uno especializándose en una sección conc e a de las a en u as, y ene oda su
in o mación despe digada po múl iples componen es no es buena idea a la ho a de eco-
pila la o accede a ella. Po lo que la solución a es o es, oma el es ado del componen e
p incipal de la aplicación (aquel que con iene a los demás) y dá selo al es o a la ho a de
ins ancia los. El obje i o de es o es que cada componen e enga su es ado p opio, en el
que almacene la in o mación que solo le in e esa a dicho componen e, pe o que el es o
de cosas que sean ele an es pa a la c eación de la a en u a se almacenen en el es ado
del componen e pad e, el cual de es a o ma pasa a se una especie de “es ado global”.
Lo que nos pe mi e es o es que, en caso de que sea necesa io consul a algún da o sob e
la a en u a, bas a con i al es ado del componen e pad e. Es a solución pe mi e ambién
la comunicación en e componen es que no es án elacionados en e sí, u ilizando pa es
cla e- alo auxilia es en el es ado global pa a in e cambia in o mación.
El es ado in e no cuen a con una es uc u a como la que se mues a en la igu a 5.2. En
él, apa e de almacena se in o mación gene al de la a en u a mencionada en la Sección 4.4
se almacenan los siguien es elemen os:
Una sección que ep esen a la ase que se es é con igu ando en cada momen o jun o
con in o mación adicional que pe mi e sabe si es á comple a o al an campos po
ellena .
Una a iable de con ol que pe mi e sabe si se p e ende c ea una ase nue a o
hace modi icaciones sob e una ya exis en e.
Un índice que ep esen a la posición en la que que emos que se añada la p óxima
ase que con igu emos den o la a en u a.
41
Augmen ed eali y easu e hun s engine UCM
Figu a 5.2: Es uc u a del es ado global y es ados locales en Reac
5.1.4. Ins anciación de los componen es
Como ya se ha mencionado, la idea es ene un componen e que uncione como pad e, y
que sob e es e se ins ancien el es o. Es e p oyec o iene como pila p incipal el componen-
e “App” el cual es el componen e que iene po de ec o cuando se c ea un nue o p oyec o
de Reac . En él, se an a i añadiendo los dis in os elemen os que den uncionalidad a la
página. Dicha es uc u a se mues a en la igu a 5.3.
Figu a 5.3: Esquema de ins anciación de los componen es Reac
En es e caso, el componen e que se ins ancia en App es “S eps”, el cual unciona como un
con enedo de los componen es que ep esen an los di e en es o mula ios que pe mi en
con igu a una a en u a. Cada uno de es os o mula ios iene como p opósi o con igu a
algún elemen o elacionado con es a.
42

Augmen ed eali y easu e hun s engine UCM
5.1.5. Es uc u a de los componen es
A con inuación se explica un poco más en de alle el es o de componen es que o man el
on end y pe mi en con igu a las a en u as del usua io:
Componen e S eps
Es e componen e unciona a modo de con enedo de los di e en es o mula ios que si en
pa a con igu a las a en u as, sin emba go, solo mues a uno de es os en cada momen o.
Su ep esen ación isual se mues a en la igu a 5.4:
Figu a 5.4: Elemen os isuales del componen e S eps
El es ado in e no de es e componen e cons a únicamen e de un índice que iene el p opósi-
o de indica cuál de odos los componen es que con iene es el que debe de mos a .
Componen e de esumen de la a en u a
Es el componen e que “S eps” mues a po de ec o, el obje i o de es e es mos a al usua-
io el es ado de la a en u a que es á con igu ando en cada momen o. Su ep esen ación
isual es la que se mues a en la igu a 5.5:
43
Augmen ed eali y easu e hun s engine UCM
Figu a 5.5: Componen e de esumen de la a en u a
Es e componen e ca ece de alo es en su es ado in e no debido a que odos los da os
que mues a en pan alla los ob iene o modi ica di ec amen e del es ado global de la
aplicación.
Componen e de ca a de ase
Es e componen e ep esen a las ca as que se u ilizan en la pan alla de esumen pa a
ep esen a las di e en es ases que iene la a en u a. Su ep esen ación isual es la que
se mues a en la igu a 5.5. El es ado in e no de es as ca as se compone de los siguien es
elemen os:
Un obje o con oda la in o mación de la ase a la que ep esen a.
Un índice con la posición de dicha ase den o de la a en u a.
Componen e de ca ga de a en u as
Es e componen e iene como obje i o da in o mación sob e las a en u as disponibles en
el se ido . Su ep esen ación isual es la que se mues a en la igu a 5.6
44
Augmen ed eali y easu e hun s engine UCM
Figu a 5.6: Componen e de ca ga de a en u as
Es e componen e almacena en su es ado in e no los siguien es elemen os:
Una lis a con los nomb es de las con igu aciones de a en u as disponibles pa a
ca ga .
Una lis a con las desc ipciones de dichas con igu aciones.
Una lis a con las aplicaciones disponibles pa a desca ga .
Una lis a con las desc ipciones de dichas aplicaciones.
Un iche o pa a gua da la posible aplicación que el usua io quie a manda al se -
ido pa a su almacenamien o.
Una cadena de ex o pa a almacena la desc ipción de dicha aplicación.
Componen e de ca as a en u as
Es e componen e es u ilizado pa a ep esen a an o las di e en es con igu aciones como
las aplicaciones que se encuen an almacenadas en el se ido y es án disponibles de ca a
al usua io. El es ado in e no de es e componen e es á o mado únicamen e po un índice
que si e pa a iden i ica la con igu ación o la aplicación que ep esen a. Su ep esen ación
isual se puede e en la igu a 5.6.
Componen e Quiz
Es e componen e ep esen a el o mula io que es necesa io ellena pa a pode inclui ases
de ipo Quiz en una a en u a. La ep esen ación g á ica de dicho o mula io se mues a
en la igu a 5.7.
45
Augmen ed eali y easu e hun s engine UCM
Figu a 5.7: Fo mula io ase Quiz
El es ado de es e componen e es á compues o po una cadena de ex o que ep esen a
la p egun a del quiz y una lis a de obje os que ep esen an las dis in as espues as del
mismo. Es as espues as es án compues as po dos elemen os, una cadena de ex o que
ep esen a la espues a en sí, y un booleano que indica si es co ec a o no.
Componen e QR
Es a ase ep esen a el o mula io que es necesa io ellena pa a pode inclui ases de
ipo QR en una a en u a. La ep esen ación g á ica del o mula io se mues a en la igu a
5.8.
Figu a 5.8: Fo mula io ase de QR
46
Augmen ed eali y easu e hun s engine UCM
5.2.2. Se icios del backend
El backend es á p epa ado pa a ecibi una se ie de pe iciones po pa e del clien e ha-
ciendo uso del amewo k Exp ess[2]2. Po medio de pe iciones POST, el backend ecibi á
ecu sos e in o mación necesa ia pa a con igu a una a en u a. Dichos ecu sos se án al-
macenados en el se ido haciendo uso de un middlewa e de Exp ess llamado Mul e [14].
Po o o lado, el clien e ha á uso de pe iciones GET, cuando quie a ecibi algo del se i-
do , como puede se la p opia página es á ica pa a con igu a la a en u a o los da os de
con igu ación de una a en u a alojada en el se ido . A con inuación amos a di e encia
los di e en es endpoin s de los que dispone el backend.
1. Endpoin s pa a ecibi iche os: El backend dispone de una se ie de endpoin s
que le pe mi en ecibi los di e en es a chi os con igu ados po el usua io en el
on end:
h p:// g.u bana .o g//image-upload(POST): ep esen a la di ección
a la que se en ían las imagenes elacionadas con las ases de ipo imagen.
h p:// g.u bana .o g/package-upload(POST): ep esen a la di ección
a la que se en ían las imagenes elacionadas con las ases de ipo AR que an
a se escaneadas.
h p:// g.u bana .o g/o e lapping-upload(POST): ep esen a la di ec-
ción a la que se en ían las imagenes elacionadas con las ases de ipo AR que
se an a supe pone sob e o as.
h p:// g.u bana .o g/sound-upload(POST): ep esen a la di ección a
la que se en ían los a chi os de audio elacionados con las ases de ipo sonido.
h p:// g.u bana .o g/apk-upload(POST): ep esen a la di ección a la
que se en ían las aplicaciones ealizadas po los usua ios pa a su almacena-
mien o en el se ido .
2. Endpoin s pa a gene a una a en u a: es os endpoin s se u ilizan pa a la ge-
ne ación del p oyec o de Uni y que le pe mi i á al usua io gene a su a en u a.
h p:// g.u bana .o g/ ese (GET): Tiene como obje i o p epa a los di-
ec o ios u ilizados pa a la gene ación de a en u as. Es o implica elimina
cualquie a chi o esidual que se pudie a habe quedado de una a en u a con-
igu ada an e io men e.
h p:// g.u bana .o g/gua dame-json(POST): Tiene como obje i o man-
da le al se ido un JSON con oda la in o mación que cons i uye una a en-
u a.
h p:// g.u bana .o g/gene a e-zip(GET): Tiene como obje i o ecopi-
la oda la in o mación elacionada con la a en u a en iada po el on end y
de ol e un a chi o comp imido con el p oyec o de Uni y que pe mi a gene a
la a en u a en cues ión.
3. Endpoin s pa a gua da a en u as: es as di ecciones se u ilizan pa a almacena
nue as con igu aciones de a en u as o aplicaciones en el se ido :
2h ps://exp essjs.com/es/
53

Augmen ed eali y easu e hun s engine UCM
h p:// g.u bana .o g/gua dame-a en u a(POST): ecibe una desc ip-
ción y iene como obje i o oma odos los iche os de la a en u a que se le
hayan mandado p e iamen e (imágenes, sonidos...), pa a c ea un nue o di ec-
o io den o del se ido en el que se almacene dicha a en u a. La es uc u a
de dicho di ec o io es la que se mues a en la igu a 5.17.
Figu a 5.17: Es uc u a de almacenamien o de con igu aciones de a en u as en el se ido
h p:// g.u bana .o g/gua dame-APK(POST): ecibe una desc ipción
y iene como obje i o oma la aplicación que p e iamen e el usua io ha man-
dado y ag upa la con dicha desc ipción en un nue o di ec o io que enga la
es uc u a que se mues a en la igu a 5.18.
Figu a 5.18: Es uc u a de almacenamien o de aplicaciones en el se ido
4. Endpoin s pa a ob ene a en u as almacenadas en el se ido : den o de
es a sección se engloban los endpoin s u ilizados pa a ob ene an o las con igu a-
ciones de a en u as como las aplicaciones que o os usua ios hayan gua dado en el
se ido p e iamen e:
h p:// g.u bana .o g/a en u as-gua dadas(GET): Tiene como obje-
i o de ol e una lis a con odas las con igu aciones de a en u as que se en-
cuen en disponibles en el se ido .
h p:// g.u bana .o g/dame-a en u a(POST): Recibe el nomb e de una
a en u a y iene como obje i o busca el JSON que con iene su es uc u a
den o de las con igu aciones alamacenadas en el se ido y de ol e lo como
espues a.
h p:// g.u bana .o g/ge File(GET): Recibe el nomb e de un iche o y
el nomb e de la a en u a a la que pe enece, iene como obje i o busca dicho
54
Augmen ed eali y easu e hun s engine UCM
iche o den o de los que componen la a en u a mencionada y de ol e lo como
espues a.
h p:// g.u bana .o g/aplicacionesLis as-gua dadas(GET): Tiene co-
mo obje i o de ol e una lis a con odas las aplicaciones almacenadas en el
se ido .
h p:// g.u bana .o g/ge APK(GET): Recibe el nomb e de una aplica-
ción, iene el obje i o de busca dicha aplicación en e las que se encuen an
almacenadas y de ol e la como espues a.
5.2.3. Comunicaciones F on -End/Back-End
T as habe is o la mane a en la que se pueden comunica los dos módulos de la aplicación
web. Es p eciso analiza las si uaciones en las que es as comunicaciones ienen luga .
Dichas si uaciones se p oducen en los siguien es escena ios.
Comunicaciones al gene a una a en u a
Es as comunicaciones se ealizan en el momen o en el que el usua io es á sa is echo con
la a en u a que ha con igu ado, ha cumplido odos los equisi os necesa ios pa a pode
gene a la y p esiona el bo ón de “Gene a A en u a”. A pa i de en onces los pasos que
se siguen se mues an en la igu a 5.19:
Figu a 5.19: Pe iciones al gene a una a en u a
P ime o se le a isa al backend de que se a a gene a una nue a a en u a, el siguien e
paso es manda le uno po uno los iche os elacionados con las ases que la con o man,
como imágenes y los iche os de audio. Pos e io men e se en ía el JSON con la es uc u a
de la misma y inalmen e se manda una pe ición pa a que se gene e el p oyec o con odos
los da os en iados que pe mi a gene a la a en u a con igu ada po el usua io.
55
Augmen ed eali y easu e hun s engine UCM
Comunicaciones al gua da una a en u a
Al igual que al gene a una a en u a, se llega a si uación cuando el usua io es á sa is echo
con la que ha con igu ado y p esiona el bo ón de ”gua da a en u a”. Los pasos que se
siguen son los mismos que a la ho a de gene a una a en u a, a excepción del úl imo,
donde en luga de ecopila odos los da os en un p oyec o de Uni y se mue en a o o
di ec o io del se ido pa a su almacenamien o. El p oceso que se sigue es el que se
mues a en el esquema de la igu a 5.20:
Figu a 5.20: Pe iciones al gua da una a en u a
5.2.4. Comunicaciones al gua da una aplicación
Se llega a es a si uación en el momen o en el que el usua io se encuen a en la pan alla
de ca ga de a en u as, ha subido una aplicación al on end y as p esiona el bo ón
de ”gua da ”ha dado una desc ipción sob e la misma. En caso de exis i una a en u a
con el mismo nomb e en el se ido , se le a isa al jugado de que en caso de gua da se
elimina á la ya exis en e. Si el jugado desea gua da la a en u a en el se ido , los pasos
que se siguen se mues an en la igu a 5.21.
Figu a 5.21: Pe iciones al gua da una aplicación
P ime o se en ía la aplicación del jugado , una ez hecho es o se manda o a pe ición
56
Augmen ed eali y easu e hun s engine UCM
con la desc ipción de la misma pa a ag upa las y almacena las en el di ec o io que co-
esponda.
Comunicaciones pa a ob ene las a en u as almacenadas en el se ido
Es as comunicaciones ocu en en la pan alla de ca ga de a en u as, donde al en a en
es a, se mandan pe iciones pa a p egun a po las con igu aciones y las aplicaciones que
puede ob ene el usua io. Los pasos que se ealizan en es a si uación se en en la igu a
5.22.
Figu a 5.22: Pe iciones pa a ob ene las a en u as disponibles en el se ido
En caso de que e ob ene una aplicación se manda únicamen e una pe ición con el nomb e
de dicha a en u a y se ob iene la misma como espues a. Los pasos que se siguen en es a
si uación se en en la igu a 5.23.
Figu a 5.23: Pe iciones al desca ga una aplicación almacenada en el se ido
En caso de que el usua io quie a ca ga la con igu ación de una a en u a los pasos que
se siguen son los que se mues an en la igu a 5.24.
57
Augmen ed eali y easu e hun s engine UCM
Figu a 5.24: Pe iciones al ca ga una con igu ación almacenada en el se ido
P ime o se manda una pe ición pa a ob ene el JSON de dicha a en u a, luego se analizan
las ases que es a con iene en busca de aquellas que equie an de a chi os adicionales,
como las de ipo imagen. Po cada una de es as ases se mandan pe iciones pa a ob ene
los a chi os que es as u ilicen.
58

Capí ulo 6
Mo o de ejecución de yincanas
Du an e el desa ollo se u ilizó la e sión 2020.3.13 1[17] de Uni y pa a ap o echa las
en ajas de se una LTS1.
T as habe is o en p o undidad el uncionamien o de la aplicación web desa ollada pa a
con igu a nues as búsquedas del eso o, amos a de alla dónde deben almacena se los
dis in os ecu sos necesa ios pa a las a en u as, el uncionamien o de nues o ejecu o en
Uni y y como ha sido implemen ado.
Como se menciona en el apa ado an e io , la a en u a iene de inida en un iche o JSON,
que en nues o ejecu o de búsquedas del eso o se denomina “Ad en u eDa a.json”. Es á
compues o po el nomb e de la a en u a, la cla e de Vu o ia del usua io y un lis ado con
la con igu ación de las ases de las que a a cons a la búsqueda del eso o.
Dicho a chi o se á pos e io men e p ocesado po nues o mo o pa a gene a las ases que
con o men nues a a en u a jun o con el es o de a chi os adicionales que equie an las
ases de sonido, imagen y ealidad aumen ada. Dichos ecu sos adicionales se encon a án
almacenados den o de la ca pe a “Resou ces” en los siguien es di ec o ios:
Ad en u eImages: di ec o io en el que se encuen an almacenadas las imágenes
empleadas en la ase de imagen.
Ad en u eSounds: di ec o io en el que se encuen an almacenadas los audios
empleados en la ase de sonido.
O e lappingImages: di ec o io en el que se encuen an almacenadas las imágenes
que se deben supe pone sob e los a ge s en la ase de ealidad aumen ada.
Cabe des aca ambién la ubicación en el p oyec o de las imágenes que u iliza emos
como a ge s pa a la ase de ealidad aumen ada. Dichas imágenes se encuen an en
el di ec o io “/S eamingAsse s/Vu o ia” pa a que Vu o ia sea capaz de gene a los
a ge s en iempo de ejecución y sin necesidad de pasa po la página web pa a egis a los
den o de una base de da os. Los a chi os almacenados en S eamingAsse s2no se llegan
a p ocesa si no que se empaque an en la APK y al ab i se la aplicación po p ime a ez
se uelcan en un subdi ec o io den o del di ec o io de la aplicación.
1Ve sión de un so wa e que ecibi á man enimien o y pa ches a la go plazo.
2h ps://docs.uni y3d.com/Manual/S eamingAsse s.h ml
59
Augmen ed eali y easu e hun s engine UCM
Pa a que el desa ollo de las dis in as ases sea modula , se emplea una escena po cada
ipo de ase con igu able desde la aplicación web. De es a o ma se puede abaja de
o ma independien e en cada una de ellas y es ex ensible a la ho a de añadi ases nue as.
Como se de alla á más adelan e, se hace uso de ca ga adi i a de escenas, po lo que
con i en al mismo iempo los obje os que componen cada una de las escenas que es én
ca gadas.
Con amos además con es escenas p opias del mo o que no es án asociadas a ninguna
ase con igu able:
Una escena Logic, la cual es la p ime a en ejecu a se en el ciclo de ida de la
aplicación. En la escena Logic se encuen an odos los elemen os que son comunes
al es o de escenas: GameManage , el can as con el bo ón pa a pasa de ni el y las
cáma as an o de ealidad aumen ada como la cáma a po de ec o de Uni y. Como
empleamos ca ga adi i a, no es necesa io que ninguna de las escenas de las ases
engas es os los elemen os ya exis en en es a escena base.
Una escena S a en la que se mues a el nomb e designado po el usua io a la
búsqueda del eso o.
Una escena End en la que se mues a el logo de la Uni e sidad Complu ense de
Mad id con el po cen aje de ases supe adas.
T as es a in oducción sob e la es uc u a in e na del p oyec o y su di isión en escenas,
amos a de alla en p o undidad el uncionamien o del mo o haciendo un eco ido po
los componen es que han sido desa ollados.
6.0.1. GameManage
GameManage es la clase p incipal que con ola la adminis ación de la in o mación de
la a en u a ob enida del JSON, la ca ga de ecu sos y el cambio de escenas. Dicha clase
ha sido implemen ada siguiendo el pa ón Single on como se explica en el lib o Design
Pa e ns: Elemen s o Reusable Objec -O ien ed So wa e[8].
A pesa de que las escenas po las que podemos pasa po la a en u a son ela i amen e
lige as (p incipalmen e debido a que casi odos los elemen os p esen es son de la in e az),
con el obje i o de educi al mínimo la espe a al pasa de una ase a o a, el GameManage
hace uso de la ca ga adi i a de escenas. Una ez ha leído el JSON que compone la
a en u a, pone a p eca ga odas las escenas que es én in oluc adas, pe o no las ca gan
comple amen e, las deja a un ochen a po cien o pa a comple a el es an e una ez que
ayamos a pasa a dicha escena. En el momen o en el que una ase se ha comple ado
el GameManage es no i icado de es o y an es de pasa a la siguien e ase comp ueba
si quedan más ases de es e ipo. Si no uel e a apa ece se desca ga esa escena. La
excepción a es a no ma son las escenas de ealidad aumen ada y de escaneo de QR ya
que son conside adas como “pesadas” debido a que al necesi a accede a la cáma a,
consumen más ecu sos que las o as. La p eca ga de las escenas pesadas comienza una
ase an es de llega a ellas y su desca ga se ealiza au omá icamen e al comple a las
aunque uel an a apa ece en la a en u a, con la excepción de que la siguien e ase sea
idén ica a la que se acaba de ejecu a .
GameManage ambién se enca ga de la ges ión de las dis in as cáma as con las que
cuen a el p oyec o. Con amos con una cáma a de ealidad aumen ada que se emplea en
60
Augmen ed eali y easu e hun s engine UCM
las ases de escaneo de QR y de de ección de a ge s, mien as que en el es o de ases
se emplea la cáma a con los componen es po de ec o que p opo ciona Uni y. Cuando
se ealiza un cambio de ase, GameManage comp ueba cual es el ipo de ase a la que
amos a pasa y se enca ga de deja ac i a la cáma a co espondien e pa a que no haya
con lic os en e ambas.
6.0.2. Mas e Objec
Es e componen e es á asociado en cada una de las escenas de la a en u a a un obje o que
es ep esen ado como el pad e del es o de obje os que la componen. Su unción es ac i a
o desac i a los obje os de la escena dependiendo de si la ase en la que se encuen a es
la siguien e a ejecu a en la a en u a o no. Pa a ob ene la in o mación de si es e obje o
debe ac i a /desac i a al es o, se ha hecho uso del pa ón lis ene en el que es a clase,
al inicializa se, se egis a como lis ene del GameManage pasando a es a den o del
g upo de lis ene s de es e. Dichos lis ene s an a se no i icados en el momen o en el que
se pase de una ase a o a, y en dicha no i icación se les a a in o ma de la ase que
oca en la a en u a. De es a o ma, si el Mas e Objec es in o mado de que oca una ase
dis in a a la suya, desac i a odos los obje os que con iene.
6.0.3. Ad en u eIn o
Clase pad e que ep esen a la in o mación mínima que ienen que con ene las ases de
la a en u a. Cuen a con los siguien es a ibu os: el nomb e de la ase y la pis a asociada
a la misma. También decla a un mé odo pa a ellena dichas a iables con in o mación
ob enida del JSON que de ine la a en u a. Debido a que la in o mación de cada ase iene
una es uc u a y a ibu os di e en es, cada ase que he eda de Ad en u eIn o añade sus
a ibu os p opios pa a su co ec a de inición y ede ine el mé odo pa a asigna dichos
a ibu os. Es al p incipio de la ejecución, a la ho a de lee el JSON, cuando se ins ancian
es os obje os los cuales gua dan la in o mación que lle a cada ase pa a después se dada
al componen e que ejecu a la ase, los “S age’’.
6.0.4. S age
Clase abs ac a de la cual he edan el es o de ases pa a pode hace uso del polimo ismo
y la cual do a de la uncionalidad a la ase. Cuen a con dos mé odos abs ac os, Ini y
OnS ageEnd, que se án ede inidos en las clases hijas según la uncionalidad que equie a
cada ipo de ase en el momen o de comenza y inaliza la ase espec i amen e. El
mé odo Ini ecibe po pa áme o un obje o que he eda de Ad en u eIn o y que como se
ha is o almacena los da os de esa ase los cuales se usa án pa a con igu a la escena. Las
clases hijas end án o os mé odos que se enca ga án de da la uncionalidad p opia de
cada ase.
61
Augmen ed eali y easu e hun s engine UCM
6.1. Implemen ación de las ases
A con inuación, se desc ibi á qué in o mación se u iliza pa a cada ase disponible y cómo
unciona in e namen e de cada una de ellas.
6.1.1. Fase Quiz
La ase Quiz consis e en una escena de cues iona io donde se nos p esen a una p egun-
a, un lis ado de espues as posibles ( igu a 6.1a) que podemos selecciona y un bo ón
pa a con i ma nues a selección. La p egun a puede ene una o a ias espues as co-
ec as posibles. Pa a pasa a la siguien e ase debe emos de esponde a la p egun a
co ec amen e. Es a escena es a á con olada po la clase “QuizS age”.
Du an e la inicialización de la a en u a
La clase que ep esen a la in o mación con enida en una ase de quiz es “QuizIn o”, la cual
po medio del mé odo “ReadF omJSON”, lee á una es uc u a JSON pa a ob ene odos
los da os necesa ios pa a con igu a la ase. Es os da os son una p egun a a esponde y
una se ie de espues as ep esen adas po un s ing y un booleano que indica si es co ec a
o no.
Ejecución de la ase en la a en u a
La clase “QuizS age” ecibe en su mé odo inicialización un obje o de ipo “QuizIn o”, que
es de donde a a saca la p egun a y las espues as que debe mos a en pan alla.
Cuando el bo ón que disponemos pa a comp oba si hemos espondido bien al quiz es
pulsado, el obje o “QuizS age” comp ueba que dicha selección sea co ec a. En caso en
el que se haya espondido co ec amen e, se in o ma al GameManage de que la ase ha
sido comple ada pa a que podamos con inua la a en u a.
6.1.2. Fase QR
La ase de QR hace uso de la cáma a del disposi i o mó il a a és de Vu o ia. Pa a
comple a es a ase debe emos de busca el QR que haya en nues o al ededo y escanea lo
( igu a 6.1b). Es a ase es á con olada po la clase “QRS age”.
Du an e la inicialización de la a en u a
La clase que ep esen a la in o mación con enida en una ase de QR es “QRIn o”, la
cual po medio del mé odo “ReadF omJSON”, lee á una es uc u a JSON pa a ob ene
odos los da os necesa ios pa a con igu a la ase. Es os da os cons an de un s ing que
ep esen a el alo que iene el QR que debemos de escanea .
Ejecución de la ase en la a en u a
Cuando sea el u no de p ocesa una ase de QR, se llama a al mé odo Ini de QRS age
donde gua da emos el alo del QR almacenado en QRIn o en una a iable s ing pa a
más a de pode compa a el alo leído con el espe ado.
62
Augmen ed eali y easu e hun s engine UCM
4. In e e encias en el museo
Po desg acia FiDI aún no se á capaz de localiza los í ulos ya que siguen exis iendo
in e e encias. Nos suge i á subi a la e ce a plan a, el museo, ya que allí hay
muchos apa a os elec ónicos que pueden se causan es de las mismas. Usando la
ase de GPS ha emos un de ec o de in e e encias que nos indica á como de ce ca
o lejos es amos del causan e, el AD-1-32. Pa a pode apaga lo y elimina po in las
in e e encias se debe á esponde co ec amen e a p egun as sob e su his o ia.
5. Busca la biblio eca
Aho a FiDI, libe ada de las in e e encias, halla á donde es aban ocul os los í ulos,
en la biblio eca. Po ello se debe á de busca la en ada usando el GPS. Al llega
de nue o la pue a es a á bloqueada pe o no po o a con aseña sino po una lla e
la cual ha sido hecha pedazos y los agmen os han sido espa cidos po la acul ad.
6. P ime agmen o de lla e
Es e p ime agmen o es á ocul o en e los ideojuegos de ZX Spec um que hay
en el museo. Al llega debe emos de escanea las ca á ulas en busca de pis as. Al
escanea “Olé o o” se mos a á ex o sob e la ca á ula indicando en cual ca á ula
es á el agmen o que buscamos, siendo “A my Mo es” quien lo ocul a. Al se
escaneado e emos el agmen o de la lla e que no se eía a simple is a.
7. Segundo agmen o de lla e
El segundo agmen o de la lla e es a á en la segunda plan a, la de los labo a o ios,
donde debe emos de busca la sala de écnicos. Allí se p esen a el siguien e e o a
comple a que es encon a la combinación que se ob iene al aduci los símbolos
que hay en las pue as de los labo a o ios, p e iamen e colocados po el o gani-
zado de la yincana, siguiendo el o den: 5-4-9-7-10-2-1-3-6-8-11. Pa a ello usa á
una abla de con e sión que pod á ob ene en la sala de écnicos. Al in oduci la
co ec amen e ob end emos el segundo agmen o.
8. Te ce agmen o de lla e
El e ce agmen o se encon a á ocul o en e la maleza en la pa e ase a de la
acul ad po lo que se debe á de i a la plan a baja. Al sali al ex e io se usa á el
GPS como de ec o de me ales has a que se encuen e el úl imo agmen o de la
lla e.
9. Búsqueda del diploma
Ya con la lla e comple a se pod á accede al in e io de la biblio eca pa a busca
el p eciado í ulo uni e si a io, aunque debe emos de ebusca lo en e el mon ón
ya que solo nos in e esa el de nues a i ulación. Pa a iden i ica lo usa emos los
QR que ienen po den o. Es a mon aña de diplomas debe á de coloca se an es de
comenza el juego.
69

Augmen ed eali y easu e hun s engine UCM
7.2. E aluación con usua ios
Aunque no se han ealizado g an can idad de p uebas con usua ios sí que se han hecho
e aluaciones con las di e en es demos que se han ido c eando du an e el desa ollo y con
la a en u a de demos ación. Queda ían po hace p uebas con o os usua ios de o ma
más me ódica y o ganizada. Du an e es as p uebas hemos is o que en gene al el usua io
e a capaz de en ende que debía de hace en cada momen o de la a en u a a excepción de
cuando se pedía la con aseña pa a en a al edi icio, ya que no quedaba cla o que el alo
escaneado po el QR e a la con aseña. En ese momen o se indicó a los p obado es que
pueden consul a las pis as siendo la única si uación donde ha sido eque ido su uso.
Es as p uebas enían el in de puli los pun os de in e acción que no queden del odo
cla os a ni el del p opio mo o ya que pueden exis i o os p oblemas de comp ensión
de i ados del p opio diseño que se ha dado a la búsqueda del eso o.
7.3. Posibilidades como mo o de juegos se ios
Hemos is o que con el p oyec o es posible, además de hace búsquedas del eso o, adap a
y/o c ea juegos se ios. Tomando como ejemplo los ideojuegos desa ollados pa a la
asigna u a de Juegos Se ios en los que se usa la pla a o ma de uAd en u e is a en
el Capí ulo 2, an o las a en u as g á icas como las geoposicionadas, podemos e que
las in e acciones necesa ias pueden se anspo adas o adap adas pe o man eniendo la
esencia. Tomamos dos juegos desa ollados pa a esa asigna u a como ejemplo:
Gue a Ci il
Gue a Ci il2desa ollado po Miguel Mu , Geo gi Medkino y Liyuan Li es un
juego donde se eco e Ciudad Uni e si a ia a ando de iden i ica donde se habían
omado o og a ías du an e la Gue a Ci il Española (1936-1939). El iempo de
desa ollo del mismo es u o en o no a un mes en e diseño e implemen ación del
mismo.
El obo de B eda
El obo de B eda3, desa ollado po Ad ián de Lucas, Felipe Cuad a y Au o a Ga cía
es un juego en el cual se eco e el cen o de Mad id mos ando pun os de in e és de
la época de los Aus ias mien as sigues la pis a de un lad ón que había obado el
cuad o La Rendición de B eda de Velázquez. Al igual que el o o í ulo se desa olló
en un mes en e diseño e implemen ación.
En ambos casos los ing edien es p incipales de es os juegos son: los diálogos, las decisiones
y el uso del GPS pa a di igi al jugado po el mapa. Todos esos aspec os son eplicables
usando las ases disponibles ac ualmen e en el mo o e incluso pode econ e i o as
in e acciones que en los juegos o iginales no hubie an sido posibles como escanea QRs o
usa ealidad aumen ada.
2Reposi o io del juego Gue a Ci il: h ps://gi hub.com/JuegosSe iosG 3/JuegosGeoposicionados2
3Reposi o io del juego El obo de B eda: h ps://gi hub.com/Alone cp/Mad idDeLosAus ias
70
Augmen ed eali y easu e hun s engine UCM
Uno de los aspec os que no eplicables en nues o mo o se ía la no linealidad que se puede
consegui en uAd en u e. El mo o de es e TFG, al es a desa ollado con un en oque
hacia las búsquedas del eso o, es á o zado a se lineal y ene que comple a los obje i os
en el o den dado.
71
Bloque de conclusiones
72
Capí ulo 8
Conclusiones
O iginalmen e en la p opues a de es e TFG p oponía la ealización de un mo o en Uni y
con el obje i o de ejecu a búsquedas del eso o con elemen os de ealidad aumen ada.
La idea e a que ue a lo más gené ico posible pues se iba a usa pa a gene a es e ipo
de juegos en las di e en es acul ades de la Uni e sidad Complu ense de Mad id. Du an e
el desa ollo se plan eó la idea de hace un con igu ado web pa a simpli ica de ca a
al usua io la c eación de las búsquedas del eso o, el cual ha acabado siendo una pa e
undamen al del esul ado inal.
El esul ado inal del p oyec o son dos piezas bien di e enciadas: el con igu ado de a en-
u as en la web y el mo o de ejecución de las a en u as en Uni y.
He amien a de au o web
En el con igu ado web enemos la opción de c ea a en u as desde ce o, con inua con
una p e ia gua dada en el se ido o desca ga una búsqueda del eso o lis a pa a ins ala
y juga . A la ho a de con igu a a en u as pod ás añadi di e en es ipos de ases como ya
se han is o, añadi pis as a cada una, eo dena las ases o añadi las en la posición que
el usua io quie a. Podemos gua da la a en u a en el se ido pa a segui con igu ándola
en o o momen o y ambién desca ga el zip que con iene el p oyec o de Uni y.
El p oyec o cuen a con un o al de sie e ases di e en es en e las que elegi y con igu a
pa a c ea las búsquedas del eso o. Cada una de esas ases puede lle a asociada una
pis a en el caso de que se c ea con enien e da algo de in o mación ex a.
En el con igu ado se ha enido en cuen a la impo ancia de mejo a en cada e isión su
usabilidad con el obje i o de limi a en la medida de lo posible las icciones cuando se
use, a ando que el usua io enga la mejo expe iencia posible. Se ha c eado un pequeño
manual como o ma de ayuda pa a las p ime as eces que se haga uso de la he amien a
el cual se puede consul a en el Apéndice A.
73
Augmen ed eali y easu e hun s engine UCM
Mo o de ejecución de yincanas
El mo o de ejecución de Uni y implemen a odas las ases disponibles, la ges ión de
escenas y de ecu sos. El usua io no necesi a u iliza Uni y ya que solo debe á de u iliza
el a chi o Au oBuild.ba el cual gene a á la APK ya p epa ada pa a se ins alada en un
disposi i o And oid.
El mo o al a anca lee del a chi o de con igu ación las ases que componen la a en u a y
el o den de las mismas. Es as ases se ca ga án de o ma simul anea po ca ga adi i a en
el caso de se sencillas o bajo demanda si son más pesadas (como se io en el Capí ulo 6).
Según se a comple ando cada ase de la a en u a se comp ueba si esa ase apa ece más
eces en la a en u a pe o si no es el caso de desca ga po que ya no se á necesa ia.
Se añadie on las opciones de da pis as especí icas pa a cada ase y pe mi i sal a las.
Al inal de la a en u a se mues a un me cado que indica el po cen aje de ases que ha
comple ado el jugado po sí mismo sin ene que sal a la ase.
A la ho a de desa olla el mo o en Uni y hubo p oblemas de i ados de las di e en es
e siones de lib e ías que usamos, en especial Vu o ia ya que ha sido ac ualizado hace poco
a la e sión 10.0 y la documen ación p e ia de la e sión 9.8, la e sión que u ilizamos,
es á siendo eliminada de su página web di icul ando bas an e el desa ollo de las ases de
ealidad aumen ada.
74

Capí ulo 9
T abajo u u o
El es ado ac ual del p oyec o pod ía conside a se ce ado. Es o no qui a que se puedan
in oduci mejo as y añadidos que pod ían da más alo a los usua ios que ayan a
usa la. Algunas de las ideas pa a expandi el p oyec o son:
Gene ación del APK en el se ido :
La idea se ía de ene den o del se ido una copia de Uni y donde pode gene a
la build y de ol e al usua io únicamen e el APK en ez de hace al usua io de
baja se un zip y hace que enga que lanza el Au oBuild.ba . Es o elimina ía pasos
y complicación a usua ios menos amilia izados con la in o má ica.
Gua dado de pa ida:
Es a uncionalidad pe mi i ía a los usua ios gua da el p og eso que lle en en la
búsqueda del eso o que es én jugando ya sea po que deben pa a un momen o o
po que quie an con inua o o día. Al acaba cada ase es un momen o idóneo pa a
ealiza es os gua dados, qui ando la necesidad al usua io de hace lo manualmen e
a a és de un bo ón.
Sopo a nue as pla a o mas:
Uni y da muchas acilidades a la ho a de hace aplicaciones mul ipla a o ma po lo
que es a expansión se ía ela i amen e sencilla. Es o pe mi i ía que más pe sonas
puedan usa sus disposi i os en es e ipo de ac i idades.
Realiza e aluación o mal con usua ios:
Du an e el desa ollo se han hecho a ias p uebas con usua ios usando pequeñas
demos pe o se han ealizado con amilia es y amigos po lo que se ía bene icioso pa a
el p oyec o el ealiza p uebas más o males y plani icadas con o os usua ios ajenos
al p oyec o. Es o pe mi i ía e alua la he amien a web de c eación de a en u as y
ambién las di e en es ases del mo o pa a e si son in ui i as e iden i ica pun os
a mejo a .
75
Augmen ed eali y easu e hun s engine UCM
Sopo e de sesiones múl iples en la he amien a web:
Ac ualmen e la he amien a es á p epa ada pa a se usada po una pe sona a la ez.
Es o es así ya que si hay dos o más pe sonas puede habe solapamien o a la ho a de
manda los ecu sos de las a en u as con igu adas. La idea se ía da un iden i icado
único a cada sesión pa a hace las pe iciones de gua dado y ecupe ación en base a
ese iden i icado e i ando la colisión con da os de o os usua ios.
Fases compa imen alizadas en paque es de Uni y:
El obje i o se ía que cada una de las ases disponibles es u ie a en su p opio paque e
de Uni y y solo ins ala las necesa ias según la a en u a con igu ada, lo que ayuda ía
a educi el amaño de la aplicación al solo ene los ecu sos indispensables pa a
cada a en u a.
Nue as ases:
Aunque, como se ha demos ado, se puede llega a c ea una búsqueda del eso-
o muy comple a con las ases que ya hay disponibles, la adición de o as nue as
ab i ía más posibilidades a nue os ipos de puzles o dinámicas de juego. Algunas
p opues as pa a abajo u u o pod ían se ases con econocimien o de oz o eali-
dad aumen ada con obje os idimensionales.
Sis ema de eleme ía:
Un sis ema de eleme ía pod ía se una mejo a muy impo an e pa a el p oyec o
sob e odo si se hace uso de la aplicación como un juego se io ya que, po ejemplo,
un docen e pod ía comp oba : que han hecho sus alumnos, que espues as han dado
y que desempeño han enido en la p ueba. Hab ía e en os especí icos a cada ipo de
ase según los pa áme os que iene y ambién e en os más gené icos como du ación
de una ase.
76
Chap e 8
Conclusions
O iginally, in he p oposal o his TFG, was p oposed he ealiza ion o an engine in Uni y
wi h he objec i e o execu ing easu e hun s wi h elemen s o augmen ed eali y. The
idea was o i o be as gene ic as possible, since i was going o be used o gene a e his
ype o game in he di e en acul ies o he Complu ense Uni e si y o Mad id. Du ing
de elopmen , he idea o making a web con igu a o was p oposed o simpli y he c ea ion
o easu e hun s o he use , which has ended up being a undamen al pa o he inal
esul .
The inal esul o he p ojec is wo well-di e en ia ed pieces: he au ho ship ool on he
web and he ad en u e execu ion engine in Uni y.
Web-based au ho ship ool
In he web con igu a o we ha e he op ion o c ea e ad en u es om sc a ch, con inue
wi h a p e ious one sa ed on he se e o download a easu e hun eady o ins all
and play. When con igu ing ad en u es you can add di e en ypes o phases as we
ha e al eady seen, add clues o each one, eo de he phases o add hem in he posi ion
p e e ed. We can sa e he ad en u e on he se e o con inue con igu ing i a ano he
ime and also download he zip ha con ains he Uni y p ojec o c ea e he APK.
The p ojec o e s a o al o se en di e en phases o choose om and con igu e o c ea e
he easu e hun s. Each o hese phases can be associa ed wi h a clue in case i is
con enien o gi e some ex a in o ma ion and he e is also a bu on o skip he phase
in p og ess wi h he aim o p e en ing playe s om being blocked o no knowing how o
con inue.
In he ool he impo ance o imp o ing i s usabili y in each e ision has been aken
in o accoun wi h he goal o limi ing e o s as much as possible when using i , ying o
ensu e ha he use has he bes possible expe ience. A small manual has been c ea ed
as a o m o help o he i s imes ha he ool is used, which can be consul ed in he
Appendix A.
77
Augmen ed eali y easu e hun s engine UCM
T easu e Hun s engine
The Uni y un ime implemen s all a ailable s ages, scene and esou ce managemen . The
use does no need o use Uni y since he will only ha e o use he Au oBuild.ba ile which
will gene a e he APK al eady p epa ed o be ins alled on an And oid de ice.
When he engine s a s, i eads om he con igu a ion ile he phases ha a e pa he
ad en u e and hei o de . These phases will be loaded simul aneously by addi i e load
in he case o being simple o on demand i hey a e hea ie (as seen in chap e 6). As
each phase o he ad en u e is comple ed, i is checked i ha phase appea s mo e imes
in he ad en u e, bu i i is no he case he phase is emo ed because i will no longe
be necessa y.
The op ion o gi e speci ic hin s o each s age and allow hem o be skipped was added.
A he end o he ad en u e a ma ke is displayed ha indica es he pe cen age o phases
ha he playe has comple ed by himsel wi hou ha ing o skip he phase.
When de eloping he engine in Uni y he e we e p oblems de i ed om he di e en
e sions o lib a ies ha we use, especially Vu o ia since i has ecen ly been upda ed o
e sion 10.0 and he p e ious documen a ion o e sion 9.8, he e sion ha we use, is
being emo ed om i s websi e, making he de elopmen o he augmen ed eali y phases
qui e difficul .
78
Augmen ed eali y easu e hun s engine UCM
El hecho de u iliza siemp e los mismos di ec o ios pa a ag upa los iche os que componen
las a en u as en el backend gene ó di e sos p oblemas como la con aminación de las
a en u as con a chi os esiduales de o as a en u as con igu adas an e io men e. Po lo
que soluciené es o añadiendo uncionalidades al backend que solucionaban es a clase de
p oblemas.
Con la apa ición de nue as ases an o en el mo o de Uni y como en la página web ol í
a ealiza apo aciones en el mo o de Uni y con la c eación de la clase Mas e Objec
que con olaba los obje os de cada escena.
A la ho a de c ea nue os o mula ios en el on end me dediqué a p epa a el de las
ases de Sonido, in e ine en la c eación del componen e de esumen de la a en u a y c eé
el componen e que se especializa en la ca ga de a en u as almacenadas en el backend.
Es os dos úl imos con enían mucha in o mación que inicialmen e se mos aba no muy
elegan emen e asi que c eé los componen es que ep esen an las ca as que se u ilizan
pa a mos a dichos bloques de da os.
El siguien e apa ado en el que abajé ue en la posibilidad de almacena aplicaciones
hechas en el se ido siguiendo las mismas ideas que se u iliza on a la ho a de gua da
las con igu aciones.
A medida que íbamos p obando a hace a en u as de ejemplo, nos íbamos dando cuen a
de que en ocasiones, a pesa de que las ases de una a en u a es u ie an bien con igu adas,
podía su gi el caso de que un jugado no en endie a lo que se suponía que enía que hace .
Po lo que el siguien e elemen o en el que me puse a abaja ue en la inco po ación de
pis as, an o en la pa e del on end, como en la o o gación de las mismas en el mo o
de Uni y.
Habiendo enido en cuen a que e a posible que los usua ios pudie an no sabe cómo
comple a una ase, pensamos que pod ía ocu i lo mismo con los usua ios a la ho a
de ellena co ec amen e los o mula ios del on end, po lo que lo siguien e en lo que
me cen é ue en la posibilidad de o o ga le un bo ón en cada uno de es os que le die a
in o mación sob e cómo ellena los. Es o nos lle ó a pensa en la mane a en la que íba-
mos a mos a dicha in o mación, la solución a la que llegué ue en la u ilización de un
paque e de npm que daba la posibilidad de u iliza ale as es ilizadas las cuales se podían
pe sonaliza con di e sos elemen os.
Ap o echando es a nue a mane a de da le in o mación al usua io, lo siguien e que hi-
ce ue la p epa ación de ale as en momen os como cuando el usua io ha gua dado su
con igu ación pa a in o ma le de que la ope ación se ha hecho sa is ac o iamen e. O a la
ho a de in en a gua da una ase incomple a, da le in o mación de cómo se iene que
ellena el o mula io pa a pode gua da . En esencia, mejo a el diseño UX de la página
web.
El siguien e obje i o que u e, ue hace que las a en u as almacenadas en el se ido ,
an o las con igu aciones como las APKs, u ie an una desc ipción que el usua io que
las gua dó hubie a dado pa a da algo de in o mación sob e las mismas. Una ez hecho
es o hice que en el on end a la ho a de mos a las a en u as disponibles se mos a an
ambién sus espec i as desc ipciones.
Vol iendo a la pa e del mo o de Uni y, me dediqué a es iliza lo median e asse s que
enía gua dados, a ealiza las ansiciones en e escenas y a me e animaciones a los
85

Augmen ed eali y easu e hun s engine UCM
dis in os elemen os de la in e az. Sin emba go, solo ealicé la es ilización de un pa de
escenas, el es o ue e minado po mis compañe os.
Una ez llegados a es e pun o, eníamos ya la página web uncional y capaz de gene a
a en u as y el mo o p epa ado pa a pasa po odo el ciclo de ida de una de es as,
independien emen e de las ases que u ie a. Po lo que el siguien e paso ue hace la
a en u a de ejemplo que se mues a en el Capí ulo 7 con la ayuda de mis compañe os
Ad ián y William.
Po úl imo, mis úl imas apo aciones has a la echa en el TFG han sido en la memo ia,
donde he complemen ado la sección de implemen ación, edac ando la pa e elacionada
con la página web, y he ealizado apo aciones en la sección del mo o en Uni y.
10.4. William Molina Cumba
Tu e in e és en pa icipa en es e TFG po el ema de la ealidad aumen ada, a pesa
de no habe enido expe iencia p e ia con ninguna he amien a de las u ilizadas en es e
abajo como Vu o ia y Reac , a excepción de Uni y con el ya es aba amilia izado g acias
al g ado que es aba cu sando. Debido a es o, he podido p o undiza mis conocimien os
sob e odos los emas que a a nues o TFG, aunque pa iendo de ce o en algunos de
ellos.
Empecé in es igando sob e las dis in as he amien as a usa an es de inicia una imple-
men ación, y pa icipé en las decisiones sob e escoge e siones ap opiadas an o pa a
el p oyec o de Uni y como pa a Vu o ia. Sin emba go, me cen é en la implemen ación
y uso de los Sc ip able Objec s como con enedo es de lo que iba a se inalmen e una
a en u a den o del p oyec o de Uni y.
Pa iendo de la base que ealizó mi compañe o Ad ián pa a la ase de QR en Uni y,
ealicé una segunda i e ación pa a que es a sea comple amen e uncional y se adap ase a
la p ime a es uc u a de ases mon ada po mi compañe o Da id.
Con el obje i o de au oma iza la gene ación de una a en u a en o ma de APK a pa i
del p oyec o de Uni y c eado con las ca ac e ís icas de e minadas po el con igu ado
web, jun o a mi compañe o Ad ián, implemen amos un sc ip en C Sha p pa a Uni y y
un a chi o BAT que log a a una build comple a con su simple ejecución. Desa ollando
más es a idea de au oma ización de builds, me dediqué a explo a opciones pa a pode
ealiza las desde el p opio se ido , in es igando el se icio Uni y Cloud Build y desca -
ando la idea de ins ala Uni y en un sis ema ope a i o linux sin in e az g á ica como
e a el se ido .
Pos e io men e me enca gué de implemen a las bases del sis ema de p eca ga de escenas
en Uni y, que enía como obje i o e i a la gas espe as en e ases de la a en u a al se
comple adas, an icipando la ca ga de una escena que se usa ía consecu i amen e a o a
con ayuda del o den de e minado en el a chi o JSON que desc ibía la a en u a y el o den
de las ases.
Después de es ablece de nue o cie as bases en la es uc u a de las ases en Uni y,
me ocupé de la in es igación e implemen ación de escenas adi i as en Uni y, siguiendo
86
Augmen ed eali y easu e hun s engine UCM
el mismo p incipio an e io sob e ene una ca ga lige a de escenas. También jun o a
mis compañe os, pa icipé en las decisiones de diseño pa a las siguien es i e aciones de
implemen ación de es e sis ema.
El siguien e paso del que me enca gué, ue c ea un sc ip de comandos an o en e sión
Windows BAT como en e sión Linux SH pa a gene a de o ma au omá ica un a chi o
ZIP con odos los di ec o ios necesa ios del p oyec o de Uni y pa a gene a una a en u a.
A con inuación, abajé en el p oceso de pe ición desde el on end al backend pa a
llama a es e sc ip desde la he amien a web, y que inalmen e al acaba su ejecución,
se desca gase el ZIP con el p oyec o de Uni y pa a el usua io.
En cuan o a las implemen aciones de las ases en Uni y, empezó a su gi la necesidad de
ajus a los elemen os que componían las escenas y mejo a su disposición en pan alla,
po lo que añadí un paque e al p oyec o de Uni y pa a acili a el ajus e de los elemen os
UI y ealicé a ios ajus es en las escenas que habían c eadas en ese momen o. Siguiendo
con Uni y, con inué abajando en la lógica pa a la ase Quiz, la cual había sido iniciada
po Da id.
La misma necesidad de mejo a isual su gió en el apa ado web, po lo que modi iqué
la mayo ía de a chi os CSS y elemen os HTML, pa a ob ene un acabado más amigable
con el usua io de la he amien a web an o en las ases desa olladas has a ese momen o,
QR, Quiz, ImageCha ge e ImageTa ge , como en la na egación y aspec o del es o de
la web. Ap o echando la ealización de es os ajus es, ambién a eglé algún que o o bug
en la pa e de los componen es del on end.
Re omando el apa ado de implemen ación del p oyec o de Uni y, con inué ealizando
cambios en la ase pa a QR e implemen é la escena y la lógica pa a la ase Sound y
pa a la ase Inpu Tex . De es a úl ima además, añadí su co espondien e o mula io en
la pa e del on end, y ol iendo a amilia iza me con los cambios de mis compañe os,
hice algunos ajus es y a eglos de e o es en o os o mula ios.
Una ez mi compañe o Da id añadió los ecu sos isuales que se iban a usa pa a las
escenas inales en Uni y, adap é la mayo ía de escenas a la nue a es é ica de ini i a,
ajus é elemen os de la UI en las di e en es ases c eadas y me enca gué de que la in e az
unciona a de o ma co ec a en dis in as esoluciones de pan alla. Siguiendo con Uni y,
implemen é el con eo de las ases que se iban comple ando de o ma no mal y de las que se
iban sal ando con el bo ón de ayuda, y su pos e io mues a al inal de la a en u a.
Se ol ió a eque i una ez más cambios en el aspec o de la web, en es e caso me enca gué
de es a a ea modi icando algunos elemen os que ya había c eado en la an e io i e ación
y apo ando colo es más aco des al aspec o gene al de la he amien a web. Y ol iendo a
ecupe a con ac o con los cambios de mis compañe os en la pa e de on end en Reac ,
me dediqué a implemen a es icciones eque idas en la ase de Ta ge Image pa a e i a
posibles e o es o con lic os con el uso de Vu o ia. En e es as es icciones es aban que
las imágenes subidas en es a ase u ie an un amaño máximo de 2 Megaby es y en caso
de escoge una imagen a supe pone sob e el a ge , que es a enga el mismo amaño que
el a ge .
Como úl imas apo aciones al p oyec o en Uni y, es u e haciendo algunos ajus es más a
elemen os de la UI y inalmen e busqué ecu sos pa a los sonidos de oda la in e az e
implemen é el sis ema de sonido global pa a la aplicación.
87
Augmen ed eali y easu e hun s engine UCM
Sal ando de nue o a la he amien a web, conc e amen e en el componen e de ca ga de
a en u as, es u e abajando en on end y backend pa a mos a a isos y ad e encias
al usua io a la ho a de sob esc ibi una APK que ya había sido subida con el mismo
nomb e o no i ica que la APK ha sido gua dada en el backend. Al acaba es a a ea,
jun o a Da id solucionamos un e o que no pe mi ía ac ualiza de o ma co ec a la lis a
de APKs subidas.
Con el lujo de abajo y c eación de a en u a bas an e pulidos, colabo é en el diseño de la
a en u a de ejemplo jun o a mis compañe os Ad ián y Da id. Como úl imas apo aciones
al abajo, he es ado documen ando pa e del código en el p oyec o de Uni y, he ealizado
algunos ajus es mínimos en los elemen os de la he amien a web y me he dedicado a
colabo a en la co ección de es e documen o.
88
Bloque de anexos
89
Apéndice A
Manual de usua io
En es a sección e ás una in oducción a como se c ean las búsquedas del eso o con las
he amien as hechas pa a es e TFG, desde la con igu ación de la a en u a has a la ejecu-
ción en nues o disposi i o. Comenza emos explicando cómo se u iliza la aplicación web
donde amos a con igu a las búsquedas del eso o. Ve emos cómo se usa, que opciones
nos o ece y como se con igu an las di e en es ases disponibles. Una ez es emos con o -
mes con la a en u a pod emos desca ga el p oyec o de Uni y y se explica án los pasos y
equisi os necesa ios pa a pode gene a una APK pa a nues o disposi i o And oid.
A.1. C eación de una a en u a
La c eación de una a en u a de la búsqueda del eso o se ealiza desde una página web1en
los se ido es de la UCM. Una ez es emos den o de la página pod emos pone nomb e
a la a en u a e in oduci la cla e de Vu o ia aunque es a solo se á eque ida en el caso
de que haya ases de RA.
Si que emos añadi una ase a la a en u a usa emos en desplegable de la pa e supe io
donde pod emos elegi la ase que que emos. Tend emos como opciones: Quiz, QR, Image,
ImageTa ge , Sound, Inpu Tex y GPS.
Según ayamos añadiendo ases i emos iendo cómo se an añadiendo al esumen de la
a en u a. En es a sección ( igu a A.1) e emos odas las ases c eadas y el o den que
ienen. Pa a cada ase end emos la opción de edi a la o de bo a la comple amen e. Si
que emos inse a una ase en una posición conc e a den o de la a en u a pod emos
hace lo con el selec o de la pa e supe io donde pod emos selecciona lo. La ase que
hubie a en esa posición pasa a a se la siguien e en la lis a.
Una ez acabada la con igu ación de odas las ases pod emos gua da la a en u a en el
se ido , pudiendo ecupe a la más a de y ambién desca ga el p oyec o de Uni y con
odo lis o pa a gene a el APK.
A con inuación amos a e como se con igu a cada una de las di e en es ases que pode-
mos u iliza pa a c ea nues as p opias búsquedas del eso o.
1Página del con igu ado de a en u as: h p:// g.u bana .o g/
90

Augmen ed eali y easu e hun s engine UCM
Figu a A.1: Vis a esumen de ases que con o man la búsqueda del eso o
A.1.1. Con igu a una ase Quiz
La ase de Quiz pe mi e c ea una ase que con iene una p egun a y de dos a seis espues as
di e en es ( igu a A.2). El enunciado de la p egun a lo esc ibi emos en el p ime cuad o
de ex o que apa ece. Las espues as se i án añadiendo una a una en el cuad o de ex o
in e io . Cada ez que con i memos una espues a es a apa ece á un la pa e in e io donde
pod emos ma ca la como co ec a o inco ec a y ambién pod emos elimina la.
Figu a A.2: C eación de una ase Quiz
A.1.2. Con igu a una ase QR
La ase de QR se con igu a esc ibiendo lo que que emos que con enga el código QR ( igu-
a A.3). Según lo ayamos esc ibiendo el código que apa ece en pan alla se i á ecalculando
pa a que de uel a lo que hemos esc i o cuando sea escaneado.
Una ez es emos con o mes podemos desca ga el código QR pa a pode imp imi lo y
escanea lo du an e la a en u a y gua da la ase.
91
Augmen ed eali y easu e hun s engine UCM
Figu a A.3: C eación de una ase con código QR
A.1.3. Con igu a una ase Image
Las ases de Image consis en en una imagen en la pa e supe io y debajo un ex o donde
podemos esc ibi una desc ipción de lo que se e o da in o mación al usua io.
Pa a con igu a la ase se equie e que se seleccione una imagen ( igu a A.4) que el usua io
enga en el o denado pa a luego mos a la en la a en u a. También podemos añadi
un ex o que se debe á de in oduci en el cuad o de ex o que apa ece debajo de la
p e isualización de la imagen.
Figu a A.4: Con igu ación de una ase Image
92
Augmen ed eali y easu e hun s engine UCM
A.1.4. Con igu a una ase de RA
Lo p ime o que debe emos hace pa a pode con igu a una ase de ealidad aumen ada
se á dispone de una cuen a en la página2de Vu o ia. Es o se debe a que se necesi a una
key3pa a pode u iliza las uncionalidades de RA. Ya eniendo nues a cuen a pod e-
mos c ea una de o ma g a ui a desde la pes aña De elop->LisenceManage . Cuando la
engamos end emos que pone la en el esumen de la a en u a.
Pa a con igu a las ases con ealidad aumen ada enemos dos opciones disponibles que
son supe pone un ex o ( igu a A.5a) o una imagen( igu a A.5b) al obje i o que amos
a escanea . Pa a selecciona un ipo u o o ecu imos a un desplegable. En ambos casos
debe emos de subi una imagen que ha á de a ge y luego adicionalmen e le pasa emos
un ex o u o a imagen según que que amos consegui con la ase.
(a) Supe pone ex o (b) Supe pone imagen
Figu a A.5: Din in as con igu aciones pa a ases con ealidad aumne ada
A.1.5. Con igu a una ase de GPS
Pa a con igu a es e ipo de ases el usua io pod á u iliza un ma cado en el mapa
( igu a A.6) pa a indica el luga a donde quie e que llegue el jugado . En el luga escogido
pod emos e las coo denadas de la i ud y longi ud. Además debe emos de indica el adio
de acción que iene el luga indicado (según que amos que se ace que más o menos al
luga el jugado ) y podemos in oduci un ex o que si a de pis a pa a da una idea al
usua io de donde iene que i .
2Página de Vu o ia pa a c ea una cuen a: h ps://de elope . u o ia.com/ ui/au h/ egis e
3Cla e de p oduc o que se u iliza pa a e i ica que una copia de un so wa e es o iginal.
93
Augmen ed eali y easu e hun s engine UCM
Figu a A.6: Con igu ado de una ase con geolocalización
A.1.6. Con igu a una ase de ex o
Las ases de in oduci ex o solo equie en de in oduci un pequeño ex o pa a explica
al jugado lo que debe ía de hace o busca y luego la ase o con aseña ( igu a A.7) que
debe de in oduci el jugado pa a pode pasa a la siguien e ase.
Figu a A.7: Con igu ado de una ase con in oducción de ex o
A.1.7. Con igu a una ase de sonido
Pa a con igu a ases que hacen uso de sonido debe emos de subi el audio que que amos
usa en o ma o mp3 o wa y pone un ex o pa a pode explica al jugado lo que que-
amos. Una ez hayamos subido el audio a la aplicación podemos escucha lo ( igu a A.8)
pa a e i ica que es el co ec o.
94
Augmen ed eali y easu e hun s engine UCM
[16] S e en Feine , Blai MacIn y e, and Do ée Seligmann. Knowledge-based augmen ed
eali y, olume 36. Communica ions o he ACM, 1993.
[17] Uni y-Technologies. Uni y Use Manual 2020.3 (LTS).
[18] Wayne Pieka ski and B uce Thomas. ARQuake: The Ou doo Augmen ed Reali y
Gaming Sys em, olume 1. Bubok Publishing S.L, 2002.
101

Au o es:
Lei e Osés Sánchez
Ad ián de Lucas Gómez
Da id Czepiel
William Molina Cumba
Lei e Osés Sánchez
Ad ián de Lucas Gómez
Da id Czepiel
William Molina Cumba
21 de diciemb e de 2022
Ul . ac ualización 28 de mayo de 2022
L
A
T
EX lic. LPPL & powe ed by TEFLONCC-BY-NC-SA
Es a ob a es á bajo una licencia C ea i e Commons
“Reconocimien o-NoComme cial-Compa i Igual 3.0 Espa-
ña”.