Aplicación móvil para dispositivos iOS
Abstract
Este proyecto aborda la creación de una aplicación móvil, enfocada a los aficionados del campeonato del mundo de rallyes, en la que el usuario pueda grabar, publicar, compartir, comentar y valorar sus propios vídeos así como los vídeos de los demás usuarios. Además, los usuarios también podrán seguirse entre ellos, los que les permitirá mantenerse informados tanto de nuevas publicaciones como de actividades realizadas por sus amigos. En resumidas cuentas podría decirse que se trata de una red social donde todo gira en torno a los vídeos del campeonato del mundo de rallyes. Esta aplicación será desarrollada para dispositivos móviles con sistema operativo iOS.
Full text
!
!
!
!
Aplicación!mó il!pa a!disposi i os!iOS:!“VidWRC”!
P oyec o!Fin!de!Ca e a!
!
!
!
!
!
!
!
!
!
!
!
!
Au o :!Mahy!Quin ana!Díaz.!
Tu o :!Caye ano!Gue a!A al.!
Ingenie ía!en!In o má ica.!
23/06/2014!
!
!
1!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
2!
P oyec o! in!de!ca e a!de!la!Escuela!de!Ingenie ía!In o má ica!de!la!Uni e sidad!de!Las!
Palmas!de!G an!Cana ia!p esen ado!po !el!alumno:!
! !
!Mahy!Quin ana!Díaz!
!
Tí ulo!del!p oyec o:!Aplicación!mó il!pa a!disposi i os!iOS:!“VidWRC”!
!
Tu o :!
! Caye ano!Gue a!A al!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
3!
Dedica o ia!
!
!
!
!
!
!
!
!
!
!
!
A!mis!!pad es,!!
a!mi!he mana,!!
a!mi!no ia!y!
!a!mis!abuelas.!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
4!
Ag adecimien os!
!
!
A!mi! u o !Caye ano,!po !in e esa se!desde!el!p ime !momen o!en!la!idea,!po !guia me!y!po !
ayuda me!con!las!pequeñas!complicaciones!que!su gie on.!Muchas!g acias.!
!
A! odos!mis!compañe os!y!amigos!de!clase,!pe o!en!especial!a!los!que!siemp e!han!es ado!
ahí:!Dani,!Diego,!Ma cos!e!Imanol.!Muchas!g acias!po !echa me!una!mano!cuando!hacia! al a!
y!po !hace !más!di e ido!es e!la go!camino.!Espe o!que!es a!amis ad!du e!pa a!siemp e.!
!
A!mis!amigos!de! oda!la! ida,!a! odos,!siemp e!han!sido!un!g an!apoyo!pa a!mi.!
!
A!mis!pad es,!sin!ellos!es o!no!hab ía!sido!posible,!a!mi!he mana!y!a!mi!no ia,!po !su!apoyo!
en! odo!!momen o,!a!mi! amilia!en!gene al!y!en!especial!a!mis!dos!abuelas,!a!mi! ío!José!
Manuel!,!a!mi! ía!Inma!y!a!mi!mad ina!Rosa,!g acias!po ! odo!el!apoyo!y!ánimos!que!me!han!
dado!siemp e.!¡Muchas!g acias!a! odos!!!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
5!
Índice!
1.G!INTRODUCCIÓN!........................................................................................................................!11!
1.1._!PRESENTACIÓN.!............................................................................................................................!11!
1.2._!OBJETIVOS!DEL!PROYECTO.!..............................................................................................................!12!
2.G!ESTADO!DEL!ARTE!.....................................................................................................................!13!
2.1._!APLICACIONES!Y!SERVICIOS!DE!COMPARTICIÓN!DE!VÍDEO.!.....................................................................!13!
2.2._!APLICACIONES!Y!SERVICIOS!RELACIONADAS!CON!EL!MUNDIAL!DE!RALLYES.!...............................................!17!
3.GMETODOLOGÍA!Y!RECURSOS!UTILIZADOS!..................................................................................!22!
3.1._!METODOLOGÍA!DE!DESARROLLO!.......................................................................................................!22!
3.2._!RECURSOS!UTILIZADOS!...................................................................................................................!23!
3.2.1.%&Recu sos&ha dwa e&............................................................................................................&23!
3.2.2.%&Recu sos&so wa e&.............................................................................................................&23!
3.2.3.%&Tecnologías&u ilizadas&.......................................................................................................&24!
4.G!ANÁLISIS!...................................................................................................................................!25!
4.1._!LA!APLICACIÓN!..............................................................................................................................!25!
4.1.1.%&Especi icación&de& equisi os&de&usua io&.............................................................................&25!
4.1.2.%Especi icación&de& equisi os&so wa e&.................................................................................&27!
4.2._!LA!PLATAFORMA!MÓVIL.!.................................................................................................................!31!
4.3._!EL!SERVIDOR.!................................................................................................................................!33!
Se ido &de&da os&..........................................................................................................................&33!
Se ido &de& ídeo&..........................................................................................................................&35!
5.G!DISEÑO!.....................................................................................................................................!38!
5.1._!DIAGRAMA!DE!CLASES!DEL!SISTEMA.!.................................................................................................!38!
5.2._!DIAGRAMAS!DE!SECUENCIA.!............................................................................................................!39!
5.3._!DISEÑO!DE!PROTOTIPOS!PARA!LAS!INTERFACES!DE!USUARIO.!.................................................................!43!
5.4._!DIAGRAMA!ENTIDAD!RELACIÓN.!.......................................................................................................!50!
5.5._!DISEÑO!ARQUITECTÓNICO.!..............................................................................................................!50!
5.5.1.%&Pa se&..................................................................................................................................&51!
6.G!DESARROLLO!E!IMPLEMENTACIÓN.!..........................................................................................!52!
6.1._!CONFIGURACIÓN!E!IMPLEMENTACIÓN!DEL!BACKEND.!...........................................................................!52!
6.1.1.%&La&base&de&da os.&...............................................................................................................&53!
6.1.2.%&Cloud&code.&........................................................................................................................&56!
6.2._!DESARROLLO!DE!LA!APLICACIÓN!IOS.!................................................................................................!62!
6.2.1.%&A qui ec u a&de&una&aplicación&iOS&...................................................................................&62!
6.2.2.%&Con oles&y&lib e ías&ex e nas.&...........................................................................................&64!
UIImage%Ca ego ies&......................................................................................................................&64!
Reachabili y&..................................................................................................................................&65!
Fo ma e Ki &.................................................................................................................................&65!
JSQFla Bu on&...............................................................................................................................&65!
RMMul ipleViewsCon olle &.........................................................................................................&66!
RMPicke ViewCon olle &...............................................................................................................&66!
RMS epsCon olle &........................................................................................................................&66!
GTSc ollNa iga ionBa &.................................................................................................................&67!
MBP og essHUD&...........................................................................................................................&67!
XCDYouTubeVideoPlaye ViewCon olle &......................................................................................&67!
Facebook&SDK¶&iOS&.................................................................................................................&67!
You ube&API&..................................................................................................................................&67!
Pa se&SDK¶&iOS&.......................................................................................................................&67!
!
6!
6.2.3.%&Conexión&con&el&backend&e&in e acción&con&el&mismo.&.......................................................&68!
6.2.4.%&Vis as&e&implemen ación.&..................................................................................................&70!
6.2.5.%&No i icaciones&Push.&..........................................................................................................&92!
7.G!RESULTADOS!Y!CONCLUSIONES.!...............................................................................................!97!
8.G!TRABAJO!FUTURO.!....................................................................................................................!98!
9.G!BIBLIOGRAFÍA!...........................................................................................................................!99!
10.GANEXOS!.................................................................................................................................!100!
MANUAL!DE!USUARIO!..........................................................................................................................!100!
Inicio&de&sesión&y®is o&............................................................................................................&100!
Panel&p incipal&y&pes aña&Home&.................................................................................................&101!
Pes aña&Followings&.....................................................................................................................&104!
Pes aña&Came a&.........................................................................................................................&104!
Pes aña&Ac i i ies&.......................................................................................................................&105!
Pes aña&P o ile&............................................................................................................................&107!
¿Cómo&segui &a&o os&usua ios?&..................................................................................................&108!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
7!
Índice!de! igu as!
!
FIGURA!3.1:!MODELO!DE!CICLO!DE!VIDA!.......................................................................................!22!
FIGURA!4.1:!DIAGRAMA!DE!CASOS!DE!USO!....................................................................................!29!
FIGURA!4.2:!DIAGRAMA!DE!CASOS!DE!USO!....................................................................................!30!
FIGURA!4.3:!ARQUITECTURA!DEL!SO!IOS!........................................................................................!32!
FIGURA!4.4:!SERVIDOR!DE!VÍDEO!(PRIMERA!OPCIÓN)!...................................................................!36!
FIGURA!4.5:!SERVIDOR!DE!VÍDEO!(SEGUNDA!OPCIÓN)!..................................................................!36!
FIGURA!4.6:!SERVIDOR!DE!VÍDEO!(TERCERA!OPCIÓN)!....................................................................!37!
FIGURA!5.1:!DIAGRAMA!DE!CLASES!...............................................................................................!38!
FIGURA!5.2:!DIAGRAMA!SECUENCIA!(INICIO!DE!SESIÓN!1)!.............................................................!39!
FIGURA!5.3:!DIAGRAMA!SECUENCIA!(INICIO!DE!SESIÓN!2)!.............................................................!39!
FIGURA!5.4:!DIAGRAMA!SECUENCIA!(INICIO!DE!SESIÓN!3)!.............................................................!40!
FIGURA!5.5:!DIAGRAMA!SECUENCIA!(PUBLICAR!VÍDEO)!................................................................!41!
FIGURA!5.6:!DIAGRAMA!SECUENCIA!(BUSCAR)!..............................................................................!42!
FIGURA!5.7:!PROTOTIPO!DE!LA!VISTA!INICIAL!................................................................................!43!
FIGURA!5.8:!PROTOTIPO!DE!LA!VISTA!DE!REGISTRO!.......................................................................!44!
FIGURA!5.9:!PROTOTIPO!DE!LA!VISTA!DE!AUTENTIFICACIÓN!..........................................................!45!
FIGURA!5.10:!PROTOTIPO!DE!LA!VISTA!PRINCIPAL!.........................................................................!46!
FIGURA!5.11:!PROTOTIPO!DE!LA!VISTA!DE!COMENTARIOS!.............................................................!47!
FIGURA!5.12:!PROTOTIPO!DE!LA!VISTA!DE!PERFIL!..........................................................................!48!
FIGURA!5.13:!PROTOTIPO!DE!LA!VISTA!DETALLADA!DE!UN!RALLYE!................................................!49!
FIGURA!5.14:!DIAGRAMA!ENTIDAD!RELACIÓN!...............................................................................!50!
FIGURA!5.15:!ARQUITECTURA!DEL!SISTEMA!..................................................................................!51!
FIGURA!5.15:!ARQUITECTURA!DE!PARSE!........................................................................................!52!
FIGURA!6.1:!OBJETOS!DE!TIPO!PUNTERO!UTILIZADOS!....................................................................!56!
FIGURA!6.2:!ARQUITECTURA!DE!UNA!APLICACIÓN!IOS!..................................................................!62!
FIGURA!6.3:!UIWINDOW!................................................................................................................!63!
FIGURA!6.4:!IOS!G!MVC!...................................................................................................................!63!
FIGURA!6.5:!IOS!G!MVC!...................................................................................................................!64!
FIGURA!6.6!:!PROTOTIPO!DE!CELDA!PARA!VÍDEOS!.........................................................................!77!
FIGURA!6.7:!DIAGRAMA!DE!SECUENCIA!(ALMACENANDO!!VÍDEOS!+!DATOS)!.................................!81!
FIGURA!6.8.:!CICLO!DE!VIDA!DE!LAS!NOTIFICACIONES!PUSH!..........................................................!92!
!
!
!
!
8!
Índice!de!imágenes!
!
IMAGEN!2.1:!SERVICIOS!Y!APLICACIONES!DE!COMPARTICIÓN!DE!VÍDEO.!.......................................!13!
IMAGEN!2.2:!VINE!.........................................................................................................................!14!
IMAGEN!2.3:!COACH'S!EYE!.............................................................................................................!16!
IMAGEN!2.4:!UBERSENSE!COACH!...................................................................................................!17!
IMAGEN!2.5:!PROMOTOR!OFICIAL!DEL!WRC!..................................................................................!18!
IMAGEN!2.6:!APLICACIÓN!PARA!IOS!DEL!PROMOTOR!OFICIAL!DEL!WRC!........................................!19!
IMAGEN!2.7:!APLICACIÓN!IRALLY!...................................................................................................!20!
IMAGEN!2.8:!APLICACIÓN!WRC!NEWS!...........................................................................................!20!
IMAGEN!2.8:!WRC!FANS!APP!2014.!................................................................................................!21!
IMAGEN!6.1:!CREACIÓN!DE!UNA!NUEVA!“APP”!EN!PARSE!.............................................................!52!
IMAGEN!6.2:!CREACIÓN!DE!UNA!NUEVA!CLASE!EN!PARSE!.............................................................!53!
IMAGEN!6.3:!CREACIÓN!DE!UNA!NUEVA!COLUMNA!EN!PARSE!......................................................!53!
IMAGEN!6.4:!NAVEGADOR!DE!DATOS!DE!PARSE!............................................................................!54!
IMAGEN!6.5:!TIPOS!DE!RELACIONES!...............................................................................................!55!
IMAGEN!6.6:!RESULTADO!DE!USAR!LA!FUNCIÓN!“ROUNDEDCORNERIMAGE”!................................!65!
IMAGEN!6.7:!“!STRINGFORTIMEINTERVALFROMDATE:”!.................................................................!65!
IMAGEN!6.8:!EJEMPLO!DE!UN!BOTÓN!CREADO!CON!LA!LIBRERÍA!JSQFLATBUTTON!.......................!65!
IMAGEN!6.9:!EJEMPLO!DEL!CONTROL!“RMMULTIPLEVIEWSCONTROLLER”!....................................!66!
IMAGEN!6.10:!EJEMPLO!DEL!CONTROL!“RMPICKERVIEWCONTROLLER”!.........................................!66!
IMAGEN!6.11:!EJEMPLO!DEL!CONTROL!“RMSTEPSCONTROLLER”!...................................................!66!
IMAGEN!6.12:!EJEMPLO!DEL!CONTROL!“MBPROGRESSHUD”!.........................................................!67!
IMAGEN!6.13:!CLAVES!DE!ACCESO!AL!BACKEND!.............................................................................!68!
IMAGEN!6.15:!MOSAICO!................................................................................................................!71!
IMAGEN!6.16:!ESTRUCTURA!DE!LA!APLICACIÓN!.............................................................................!73!
IMAGEN!6.17:!SECCIONES!DE!LA!APLICACIÓN!................................................................................!74!
IMAGEN!6.18:!PILA!DE!VISTAS,!UINAVIGATIONCONTROLLER!.........................................................!75!
IMAGEN!6.21:!VISTA!DE!SELECCIÓN!DEL!THUMBNAIL!....................................................................!80!
IMAGEN!6.22:!VISTAS!PARA!ADJUNTAR!INFORMACIÓN!AL!VÍDEO!.................................................!80!
IMAGEN!6.23:!VISTAS!DE!LA!SECCIÓN!ACTIVITIES!..........................................................................!82!
IMAGEN!6.24:!VISTA!DEL!PERFIL!....................................................................................................!83!
IMAGEN!6.25:!VISTAS!DE!LOS!AJUSTES!..........................................................................................!84!
IMAGEN!6.26:!VISTA!DE!COMENTARIOS!........................................................................................!85!
IMAGEN!6.27:!VISTA!DE!USUARIOS!................................................................................................!85!
IMAGEN!6.28:!VISTA!DETALLADA!DE!UN!VÍDEO!.............................................................................!86!
!
15!
imagen! con! la! cual! el! usua io! puede! g aba ! buenas! omas! incluso! si! es á! en!
mo imien o.!
!
_Facebook:!Facebook!es!una! ed!social!c eada!po !Ma k!Zucke be g!y! undado!jun o!a!
Edua do!Sa e in,!Ch is!Hughes!y!Dus in!Mosko i z.!O iginalmen e!e a!un!si io!pa a!
es udian es!de!la!Uni e sidad!de!Ha a d,!pe o!se!ab ió!a!cualquie !pe sona!con!una!
cuen a!de!co eo!elec ónico.!
!
Facebook!cuen a!con!más!de!900!millones!de!miemb os,!y! aducciones!a!70!idiomas.!
En!ene o!de!2013,!Facebook!llegó!a!los!1230!millones!de!usua ios,10!de!los!cuáles!
hay!más!de!600!millones!de!usua ios!mó iles.!
!
A! a és!de!es a! ed!social!se!pueden!compa i !in inidad!de!con enido!en e!los!que!
se!encuen an!los! ídeos.!
!
_YouTube:!es!un!si io!web!en!el!cual!los!usua ios!pueden!subi !y!compa i ! ídeos.!
Fue!c eado!po ! es!an iguos!empleados!de!PayPal!en! eb e o!de!2005.!En!oc ub e!de!
2006,! ue!adqui ido!po !Google!Inc.!a!cambio!de!1650!millones!de!dóla es!y!aho a!
ope a!como!una!de!sus! iliales.!Ac ualmen e!es!el!si io!web!de!su! ipo!más!u ilizado!
en!in e ne .!
!
YouTube!usa!un! ep oduc o !en!línea!basado!en!Adobe!Flash!y!HTML5!pa a!se i !su!
con enido.! Es! muy! popula ! g acias! a! la! posibilidad! de! aloja ! ídeos! pe sonales! de!
mane a!sencilla.!Aloja!una! a iedad!de!clips!de!películas,!p og amas!de! ele isión!y!
ídeos!musicales.!Los!enlaces!a! ídeos!de!YouTube!pueden!se ! ambién!inse ados!en!
blogs! y! si ios! elec ónicos! pe sonales! usando! su! API! o! inc us ando! cie o! código!
HTML.!
!
!
_Vimeo:!Vimeo!es!una! ed!social!basada!en! ídeos,!lanzada!en!no iemb e!de!2004!
po ! la! compañía! In e Ac i eCo p.! El! si io! pe mi e! compa i ! y! almacena ! ídeos!
digi ales! pa a! que! los! usua ios! comen en! en! la! página! de! cada! uno! de! ellos.! Los!
usua ios!deben!es a ! egis ados!pa a!subi ! ídeos,!c ea !su!pe il,!ca ga !a a a es,!
comen a !y!a ma !lis as!de! a o i os.!
!
Vimeo!no!admi e!anuncios!de! ele isión,!demos aciones!de! ideojuegos!o!cualquie !
con enido! que! no! haya! sido! c eado! po ! el! usua io.! El! si io,! además,! ha! ganado!
epu ación!como!«p o eedo !de!imágenes»!pa a!di e sos!a is as,!debido!a!la!al a!
asa!de!bi s!y! esolución!de!sus! ídeos.!!
!
En! lo! e e en e! a! la! compa ición! de! ídeos! de! p opósi o! gene al,! los! se icios! y!
aplicaciones!mencionados!an e io men e!son!los!más!impo an es,!aunque! ambién!
exis en!muchos!más!como:!Viddy,!SocialCam,!Cinemag am,!Keek,!Wopp,!Tou ,!e c.!
!
!
!
!
!
16!
GSe icios!y!aplicaciones!de!compa ición!de! ídeo! elacionados!con!el!depo e:!
!
_Coach's!Eye:!Coach’s!Eye!pe mi e!a!los!depo is as!ap ende !a! a és!del!análisis!de!
ídeos.!Es a!aplicación!p opo ciona!una!mane a! ácil!y!e icaz!de!ap ende !o!en ena !
las! écnicas! de! los! di e en es! depo es.! El! swing! del! gol ,! el! lanzamien o! de! bola!
ápida!del!baseball,!los!pases!del! ú bol,!el!saque!de! olleyball!y! enis,!o!la!ca e a!en!
el!a le ismo,!son!algunas!de!las!mejo as!que!se!pueden!log a !g acias!a!la!“mi ada!del!
en enado ”!elec ónico.!
!
La! aplicación! iene! cinco! uncionalidades! p incipales.! La! p ime a! es! g aba ! al!
depo is a! en! acción.! De! o ma! ins an ánea,! el! ídeo! puede! se ! analizado! po ! el!
so wa e!de!Coach’s!Eye.!
!
En! segundo! luga ,! la! pe sona! puede! dibuja ! líneas,! lechas! y! o mas! pa a! indica !
de e minadas! pos u as! o! mo imien os! en! el! ídeo.! O a! de! las! he amien as! pa a!
ag ega !comen a ios!es!median e!un!mensaje!de! oz!que!acompaña!la!g abación.!
!
O a! ú il! uncionalidad! de! Coach’s! Eye! es! la! posibilidad! de! e ! el! ídeo! ame! po !
ame,!es!deci ,!en!cáma a!súpe !len a.!Es e!mecanismo!pe mi e!agudiza !la! isión!del!
en enado !digi al.!
!
Po !úl imo,!se!puede!compa i !el! ídeo!con!comen a ios!con! an!solo! oca !un!bo ón.!
La!aplicación!pe mi e!en ia lo!po !mensaje!de! ex o!o!co eo!elec ónico,!así!como!
subi lo!a!YouTube,!E e no e!o!D opbox.!
!
!
Imagen!2.3:!Coach's!Eye!
!
_Ube sense!Coach:!Slow!Mo ion!Vídeo!Analysis:!es a!aplicación!es!muy!simila !a!la!
an e io ,!ya!que! pe mi e! a!los! depo is as! g aba ,!compa a !y! analiza ! ídeos! pa a!
mejo a !sus! écnicas!y!habilidades.!A!di e encia!de!Coach's!Eye,!Ube sense! iene!un!
!
17!
en oque! más! social! ya! que! además! de! compa i ! el! ídeo! puedes! segui ! a! o os!
usua ios.!
!
Imagen!2.4:!Ube sense!Coach!
!
2.2.G!Aplicaciones!y!se icios! elacionadas!con!el!mundial!de! allyes.!
!
Hay!una!g an!can idad!de!páginas!webs! elacionada!con!el!mundo!de!los! allyes!en!gene al,!
así!como!una!c ecien e!can idad!de!aplicaciones!mó iles.!La!mayo ía!de!es os!se icios!son!
de! ca ác e ! in o ma i o,! con! un! g ado! de! in e ac i idad! bajo,! aunque! en! lige o! aumen o!
mo i ado!po !la!in eg ación!en!las!p incipales! edes!sociales.!!
!
_!P omo o !o icial!del!WRC:!a!con inuación!se!mos a á!la!web!o icial!del!Campeona o!del!
Mundo! de! Rallyes! (www.w c.com),! así! como! su! equi alen e! en! Facebook! y! su! pe il! de!
Twi e :!
!
18!
!
!
!
!!!!!!!!!!! !
Imagen!2.5:!P omo o !o icial!del!WRC!
!
Además! de! es o,! el! WRC! ambién! cuen a! con! una! aplicación! mó il!donde! podemos!
encon a ! odo!lo!que!se!encuen a!en!su!web!o icial!pe o!pa a! o ma o!mó il:!
!
19!
!
Imagen!2.6:!Aplicación!pa a!iOS!del!p omo o !o icial!del!WRC!
!
_!Páginas!webs!de!las!p uebas!que!componen!en!campeona o:!
• h p://www. ally acc.com!
• h p://www.adac_ allye_deu schland.de!
• h p://www. allya gen ina.com!
• h p://www. allysweden.com!
• e c.!
!
_!O as!webs!y! e is as:!
• h p://www. e is asc a ch.com/w c!
• h p://www.mo o pasion 1.com/ca ego ia/mundial_ allies!
• h p://www.au ohebdospo .es!
• e c.!
• !
_!Aplicaciones!mó iles:!
Es as!aplicaciones!son!en!su!mayo ía!de!ca ác e !in o ma i o.!En!ellas!pod emos!encon a !
las! clasi icaciones! de! los! allyes! ya! dispu ados,! in o mación! sob e! cual! se á! la! siguien e!
p ueba!den o!del!calenda io,!en e is as!a!pilo os,! o os,!e c.!
!!!
!
!
!
!
!
20!
• iRally!
!
!
Imagen!2.7:!Aplicación!iRally!
• WRC!News.!
!
Imagen!2.8:!Aplicación!WRC!News!
!
!
!
!
!
!
!
!
!
!
!
!
21!
• WRC!Fans!App!2014.!
!
Imagen!2.8:!WRC!Fans!App!2014.!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
22!
3.GMe odología!y! ecu sos!u ilizados! ! !
3.1.G!Me odología!de!desa ollo!
Como!modelo!de!ciclo!de! ida!se!usa á!ap oximación!inc emen al,!se!c ea á!p ime o!una!
aplicación!base! uncional!y!luego!se!i án!desa ollando!mejo as!y!nue as! unciones!pa a!i !
cub iendo!los! equisi os! es an es.!Es e! ipo!de!ciclo!de! ida!pe mi e!i ! es eando!y! alidando!
la!aplicación.!O o!mo i o!po !el!que!se!ha!usado!es e! ipo!de!ciclo!de! ida!es!po que!desde!
un! p incipio! quedan! bien! de inidos! los! equisi os,! lo! cual! pe mi e! i ! desa ollando! la!
aplicación!en! unción!de!es os.!
!
1. Análisis!de! equisi os!de!usua io.!!!
De inición!de!lo!que!el!usua io!espe a!del!sis ema.!!
2. Análisis!de! equisi os!so wa e.!!!
En! es e! apa ado! se! a a! de! ob ene ! una! de inición! del! so wa e! que! se! a! a!
!cons ui .!Se!cons uye!un!modelo!lógico!del!so wa e.!!
3. Diseño!a qui ec ónico.!!!
Se! de ine! la! es uc u a! del! so wa e,! equi ale! a! la! es uc u a! más! su! con ol.! !Se!
especi ica!cada!módulo!y!se!diseñan!las!in e elaciones!en e!ellos.!!
4. Diseño!de allado!y!p oducción.!!!
Se! de alla! cada! componen e! de! la! a qui ec u a! de inido! an e io men e.! A!
con inuación,! se! p oduce! en! los! lenguajes! de! p og amación! elegidos! el! sis ema!
so wa e!pa a!su!pos e io !in eg ación!y! es eo.!!
5. T ans e encia.!!
Se!implan a!el!sis ema!y!se!con igu a!en!un!en o no!ope a i o!pa a!deja lo!ejecu able!
pa a!el!usua io.!!
6. Ope ación!y!Man enimien o!
Una! ez!que!el!sis ema!se!encuen a!ope a i o!se!debe!moni o ea !pa a!comp oba !
su! co ec o! uncionamien o.! Si! se! de ec ase! cualquie ! e o ! o! pe dida! de!
endimien o,!es os!se!subsana ían!como!pa e!del!man enimien o.!!!!
!
!
!
Figu a!3.1:!Modelo!de!ciclo!de! ida!
!
23!
3.2.G!Recu sos!u ilizados!! ! !
3.2.1.G!Recu sos!ha dwa e!
!
Equipo!in o má ico:!
o P ocesado :!In el!co e!i5!–!3.1GHz!
o Memo ia!RAM:!4GB!
o Disco!du o:!1TB!
o Ta je a!g á ica:!AMD!Radeon!HD!6970M!1024MB!
o Pan alla:!27”!!
o Teclado!y! a ón.!
!
Disposi i os!mó iles:!
o iPod! ouch!4G!
§ Pan alla:!3,5”!
§ P ocesado :!Apple!A4!_!1GHz!
§ Memo ia!RAM:!256MB!
§ Memo ia! lash:!8GB!
§ Sis ema!ope a i o:!iOS6!
o iPhone!4s!
§ Pan alla:!3,5”!
§ P ocesado :!Apple!A5!_!1GHz!(doble!núcleo)!
§ Memo ia!RAM:!512MB!
§ Memo ia! lash:!16GB!
§ Sis ema!ope a i o:!iOS7!
o iPhone!5!
§ Pan alla:!4”!
§ P ocesado :!Apple!A6!–!1.3GHz!(doble!núcleo)!
§ Memo ia!RAM:!1GB!
§ Memo ia! lash:!16GB!
§ Sis ema!ope a i o:!iOS7!
!
3.2.2.G!Recu sos!so wa e!
!
o SO!–!Mac!OS!X!Ma e icks!( e sión!10.9)!
OS! X! Ma e icks! es! la! décima! e sión! p incipal! de! OS! X! pa a! o denado es,!
po á iles!y!se ido es!Mac.!Es e!es!un!sis ema!ope a i o!basado!en!Unix!que!ha!
sido!desa ollado!y!come cializado!po !Apple!Inc.!Como!ca ac e ís icas!p incipales!
se! puede! des aca ! el! aumen o! de! la! du ación! de! ba e ías! en! po á iles,! mayo !
endimien o! y! un! uso! más! e icien e!
de!la!memo ia!del!sis ema.!En!lo!que!
espec a! a! su! in e az,! es a! e sión!
ha! cambiado! conside ablemen e! al!
implemen a ! un! sis ema! de!
no i icaciones!simila !al!disponible!en!
iOS,! además! se! han! incluido!
!
24!
aplicaciones!p opias!de!iOS! ales!como:!“No as”,!“Mapas”,!e c.!!
!
!
!
o Xcode!5.1!
Xcode! es! el! en o no! de! desa ollo! que! o ece! las! lib e ías,!
he amien as! de! desa ollo,! compilación! y! es eo! que! se!
necesi an!pa a!desa olla !aplicaciones!pa a!iOS.!
!
!!!!!!!!!!!!!!!!!!!!!! !
!
!
!
o iOS!
iOS!es!un! sis ema! ope a i o! mó il!de!la! emp esa! Apple! Inc.!O iginalmen e! ue!
desa ollado!pa a!el!iPhone!!(iPhone!OS),!siendo!después!
usado! en! disposi i os! como! el! iPod! Touch,! iPad! y! el!
Apple! TV,! la! ins alación! de! es e! sis ema! ope a i o! no!
es a!pe mi ida!en!ha dwa e!de! e ce os.!
!
!
3.2.3.G!Tecnologías!u ilizadas!
o Objec i eGC:!Objec i e_C!es!un!lenguaje!de!p og amación!o ien ado!a!obje os!
c eado!como!un!supe conjun o!de!C!pa a!que!implemen ase!un!modelo!de!
obje os!pa ecido!al!de!Small alk.!O iginalmen e! ue!c eado!po !B ad!Cox!y!la!
co po ación! S epS one! en! 1980.! En! 1988! ue! adop ado! como! lenguaje! de!
p og amación!de!NEXTSTEP!y!en!1992! ue!libe ado!bajo!licencia!GPL!pa a!el!
compilado ! GCC.! Ac ualmen e! se! usa! como! lenguaje! p incipal! de!
p og amación!en!Mac!OS!X,!iOS!y!GNUs ep.!
!
o Cocoa! ouch:! Cocoa! ouch! es! un! amewo k! que! pe mi e! el! desa ollo! de!
aplicaciones! na i as! pa a! iOS,! es e! incluye! econocimien o! ges ual,!
animaciones!y!una!lib e ía!dis in a!pa a!la!in e az!de!usua io;!el!cual!se!usa!
en!disposi i os!Apple!como!el!iPhone,!el!iPod!Touch!y!el!iPad.!
!
P incipalmen e,! el! lenguaje! en! el! que! se! p og ama! con! es a! biblio eca! es!
Objec i e_C.!
!
!
31!
o Únicamen e!las!pe sonas! egis adas!pod án!hace !uso!del!sis ema.!
!
o La!aplicación!debe!desa olla se!pa a!disposi i os!iOS.!
!
o La!in e az!de!la!aplicación!debe!es a !en!inglés.!
!
o El!sis ema!debe!es a !disponible!24!ho as!al!día,!365!días!al!año.!!
!
!
4.2.G!La!pla a o ma!mó il.!
!¿Po !qué!iOS!y!no!And oid!o!Windows!Phone?!
En!es e!apa ado!no!se!ha!hecho!un!análisis!compa ando!las!di e en es!pla a o mas!y!
sus! en ajas! o! incon enien es,! se! ha! decidido! desa olla ! pa a! la! pla a o ma! iOS!
simplemen e!po que!se!disponían!de!los! ecu sos!necesa ios!pa a!pode !hace lo.!!
!
iOS! es! un! sis ema! ope a i o! mó il! de! la! emp esa! Apple! Inc.! O iginalmen e! ue!
desa ollado!pa a!el!iPhone!!(iPhone!OS),!siendo!después!usado!en!disposi i os!como!
el!iPod!Touch,!iPad!y!el!Apple!TV,!la!ins alación!de!es e!sis ema!ope a i o!no!es a!
pe mi ida!en!ha dwa e!de! e ce os.!
!
La!in e az!de!usua io!de!iOS!es á!basada!en!el!concep o!de!manipulación!di ec a,!
usando! ges os! mul i ác iles.! Los! elemen os! de! con ol! consis en! en! deslizado es,!
in e up o es!y!bo ones.!La! espues a!a!las!ó denes!del!usua io!es!inmedia a!y!p o ee!
de!una!in e az! luida.!La!in e acción!con!el!sis ema!ope a i o!incluye!ges os!como!
deslices,! oques,! pellizcos,! los! cuales!
ienen! de iniciones! di e en es!
dependiendo!del!con ex o!de!la!in e az.!
Se! u ilizan! acele óme os! in e nos! pa a!
hace ! que! algunas! aplicaciones!
espondan! a! sacudi ! el! disposi i o! (po !
ejemplo,! pa a! el! comando! deshace )! o!
o a lo! en! es! dimensiones! (un!
esul ado! común! es! cambia ! de! modo!
e ical!al!apaisado!u!ho izon al).!
!
iOS! se! de i a! del! sis ema! ope a i o! de!!
equipos!de!esc i o io!Mac!OS!X,!que!a!su! ez!es á!basado!en!Da win!BSD,!y!po !lo!
an o!es!un!sis ema!ope a i o!Unix.!
!
Pan alla!p incipal!
La!pan alla!p incipal!(llamada!«Sp ingBoa d»)!es!donde!se!ubican!los!iconos!de!las!
aplicaciones! y! el! Dock! en! la! pa e! in e io ! de! la! pan alla! donde! se! pueden! ancla !
aplicaciones!de!uso! ecuen e,!apa ece!al!desbloquea !el!disposi i o!o!p esiona !el!
bo ón! de! inicio.! La! pan alla! iene! una! ba a! de! es ado! en! la! pa e! supe io ! pa a!
mos a !da os,! ales!como!la!ho a,!el!ni el!de!ba e ía,!y!la!in ensidad!de!la!señal.!El!
es o!de!la!pan alla!es á!dedicado!a!la!aplicación!ac ual.!
!
!
32!
Mul i a ea!
An es! de! iOS! 4,! la! mul i a ea! es aba! ese ada! pa a! aplicaciones! po ! de ec o! del!
sis ema.! A! Apple! le! p eocupaba! los! p oblemas! de! ba e ía! y! endimien o! si! se!
pe mi iese!co e ! a ias!aplicaciones!de! e ce os!al!mismo! iempo.!A!pa i !de!iOS!4,!
disposi i os! de! e ce a! gene ación! y! pos e io es! pe mi en! el! uso! de! 7! APIs! pa a!
mul i a ea,!especí icamen e:!
- Audio!en!segundo!plano!
- Voz!IP!
- Localización!en!segundo!plano!
- No i icaciones!push!
- No i icaciones!locales!
- Comple ado!de! a eas!
- Cambio! ápido!de!aplicaciones!
!
Tecnologías!no!admi idas!
iOS! no! pe mi e! Adobe! Flash! ni! Ja a.! S e e! Jobs! esc ibió! una! ca a! abie a! donde!
c i ica! a! Flash! po ! se ! insegu o,! con! e o es,! consumi ! mucha! ba e ía,! se !
incompa ible! con! in e aces! mul i ouch! e! in e e i ! con! el! se icio! App! S o e.! En!
cambio!iOS!usa!HTML5!como!una!al e na i a!a!Flash.!Es a!ha!sido!una!ca ac e ís ica!
muy!c i icada! an o!en!su!momen o!como!la!ac ualidad.!
!
Aplicaciones!
Las!aplicaciones!deben!se !esc i as!y!compiladas!especí icamen e!pa a!la!a qui ec u a!
ARM,! po ! lo! que! las! desa olladas! pa a! Mac! OS! X! no! pueden! se ! usadas! en! iOS.!
Aplicaciones!na i as!de! e ce os!es án!disponibles!po !medio!de!la!App!S o e.!Pa a!
pode !publica !una!aplicación!en!la!AppS o e!y!que!cualquie !usua io!pueda!usa la,!
p e iamen e!!hay!que!paga !la!cuo a!del!iOS!De elope !P og am.!
!
Los!desa ollado es!pueden!pone !un!p ecio!po !encima!del!mínimo!($0.99!dóla es)!a!
sus! aplicaciones! pa a! dis ibui las! en! el! App! S o e,! de! donde! ecibi án! el! 70%! del!
dine o!que!p oduzca!la!aplicación.!En!al e na i a,!el!desa ollado !puede!op a !po !
lanza ! la! aplicación! g a is,! y! de! es a! o ma! no! paga ! ningún! cos o! po ! dis ibui ! la!
aplicación.!(excep o!po !la!cuo a!del!iOS!De elope !P og am).!
!
A qui ec u a!del!sis ema!ope a i o:!
La!a qui ec u a!del!sis ema!ope a i o!iOS! iene!4!capas!de inidas:!
!
!
Figu a!4.3:!A qui ec u a!del!SO!iOS!
!
33!
Co e!OS:!es a!es!la!capa!jus o!encima!del!ha dwa e!y!p opo ciona!una! a iedad!de!
se icios!que!incluyen!el!acceso!a!acceso ios!ex e nos,!!el!acceso!a! ed!de!bajo!ni el!
así! como! ambién! o ece! se icios! undamen ales! del! sis ema! ope a i o! como! el!
manejo!de!memo ia,!manejo!del!sis ema!de! iche os,!ges ión!de!hilos,!e c.!!
Co e! Se ices:" es a" capa" o ece" o ece" acceso" a" los" se icios" undamen ales" del"
sis ema' ope a i o,' den o' de' los' cuales' es án' SQLi e' Lib a y,' XML' Lib a ies,'
CFNe wo k! F amewo k,! Co e! Founda ion! F amewo k! y! Secu i y! F amewo k,! en e!
o os.!
!
Media:! es a! capa! maneja! los! a chi os! de! audio,! ídeo,! o os,! la! cáma a,! el!
ep oduc o !de!música,!e c.!También!maneja!las!biblio ecas!necesa ias!pa a!dibuja !
2D!y!3D.!Incluye!lo!necesa io!pa a!pode !p og ama !en!C!y!Objec i e_C,!con!sopo e!
de! ecnologías! como! openGL_ES,! Qua z! y! Co e! Audio.! También! con iene! una!
ecnología!llamada!Co e!Anima ion,!un!mo o !de!animación!basado!en!Objec i e_C.!!
!
Cocoa!Touch:"P o ee"las"clases"p ima ias"pa a"implemen a "un"e en o"g á ico;"cada"
aplicación!en!el!iPhone!usa!un! amewo k!pa a!implemen a !in e aces!de!usua io;!
ambién! incluye! o os! amewo ks! que! pe mi en! el! acceso! a! ca ac e ís icas! del!
disposi i o,! en e! los! cuales! es án! UIKi ,! Add ess! Book,! Co e! Loca ion,! Message! y!
Game!Ki ,!e c.!
!
4.3.G!El!se ido .!
Pa a!lle a !a!cabo!es e!p oyec o!se!necesi a!un!sis ema!se ido !de!in o mación,!pa a!
supli ! es a! necesidad! exis en! dos! opciones,! c ea ! el! se ido ! o! usa ! un! se icio!
exis en e!que!haga!las! eces!de!se ido !pa a!nues a!aplicación.!A!con inuación!se!
ha á! un! b e e! análisis,! y! se! selecciona á! la! opción! que! mas! se! adecue! a! las!
necesidades!y!ca ac e ís icas!de!es e!p oyec o.!
Se ido !de!da os!
Si! se! eligiese! la! ! opción! de! c ea ! el! se ido ,! es e! debe ía! hace se! usando!
ecnologías! como! PHP,! NodeJS,! MySQL,! Pos g eSQL,! e c.!!
Es o! implica ía! ene ! que! ap ende ! esas! ecnologías! así! como! ! ap ende ! a!
abaja !con! amewo ks!que!nos! acili en!la!labo ,!lo!cual! ep esen a ía! un!
gas o! impo an e! de! iempo! y! la! des iación! del! obje i o! p incipal! del!
p oyec o,! que! es! ap ende ! sob e! el! desa ollo! de! aplicaciones! mó iles! pa a!
disposi i os!iOS.!
!
En!cambio!si!se!op a!po !usa !algún!se icio!exis en e,!se!e i a ía!ese!gas o!de!
iempo.!Po !ello!se!ha!in es igado!ace ca!de!posibles!al e na i as,!las!cuales!
consis en!en!se icios!en!la!nube!que!p opo cionan!un!backend!(BaaS).!
!
¿Qué!es!BaaS?,!backend! as!a! se ice!es!un!modelo!pa a!p opo ciona !a!los!
desa ollado es! web! y! de! aplicaciones! mó iles! una! o ma! de! incula ! es as!
aplicaciones! al! almacenamien o! en! la! nube! ,! ! se icios! analí icos! y! o as!
ca ac e ís icas! ales! como! la! ges ión! de! usua ios,! la! posibilidad! de! en ia !
no i icaciones! push! y! la! in eg ación! con! se icios! de! edes! sociales.! Es os!
!
34!
se icios! se! p es an! a! a és! de! la! u ilización! de! ki s! pe sonalizados! de!
desa ollo!de!so wa e!(SDK)!y!las!in e aces!de!p og amación!de!aplicaciones!
(API).! BaaS! es! un! modelo! ela i amen e! ecien e! en! la! compu ación! en! la!
nube,!donde!la!mayo ía!de!emp esas!da an!del!2011!o!pos e io .!
!
El!uso!de!es e! ipo!de!sis emas!pe mi en!p escindi !de!un!sis ema!ges o !de!
base!de!da os!y!del!desa ollo!del!se icio!web!que!comuniquen!la!aplicación!
con! dicho! sis ema.! Con igu a ! y! desa olla ! es e! ipo! de! modelo! de!
pe sis encia!de!da os!suele! esul a !cos oso.!
!
¿Qué! en ajas!o ece!el!uso!de!backend!en!la!nube?!La! en aja!más!e iden e!
es!el!aho o!de! iempo,!ya!que!es e!sis ema!elimina!la!necesidad!de!cons ui !
un!backend!p opio.!O o!aspec o!impo an e!es!la!escalabilidad,!es e!aspec o!
es! anspa en e! al! desa ollado ! y! solo! epe cu e! en! el! p ecio! del! se icio.!
Apa e!de!lo!mencionado!an e io men e,!es os!se icios!cuen an!con!muchas!
uncionalidades!in eg adas!que! acili an!mucho!las!labo es!más!comunes!en!
las!aplicaciones,!como!puede!se !la!ges ión!de!usua ios,!in eg ación!con! edes!
sociales,!e c.!Po !úl imo! ambién!hay!que!des aca !que! ienen!un!al o!g ado!
de!pe sonalización!y!que!cuen an!con!se icios!analí icos!muy!ú iles!a!la!ho a!
de!segui !la!e olución!de!las!aplicaciones.!
!
Un! aspec o! muy! impo an e! es! el! p ecio! de! es os! se icios.! La! mayo ía! de!
BaaS!siguen!un!modelo! eemium,!po !lo!que!solo!se!paga!po !de e minadas!
ca ac e ís icas!o!si!se!supe an!cie os!umb ales!de!uso.!!
!
Exis en! a ios!BaaS!en!el!me cado!pe o!los!más!impo an es!son:!
• Pa se!
• Appcele a o !
!
!
¿Cuál!escoge ?!Pa a!da ! espues a!a!es a!cues ión!se!ha!in es igado!ace ca!de!
las!ca ac e ís icas!de!cada!uno!así!como!de!las! uncionalidades!que!o ecen,!
odo!es o!cen ándose!en!el!uso!de!una!cuen a!g a ui a.!
!
Pa se:!
Almacenamien o!de!a chi os:!20GB!
Tamaño!máximo!de!la!base!de!da os:!20GB!
T ans e encia!de!da os:!2TB!
Ta eas!concu en e!en!la!nube:!1!
Lími e!de!pe iciones!po !segundo!al!se ido :!30/s!
!
Appcele a o :!
Almacenamien o:!20GB!
Lími e!mensual!de!pe iciones!al!se ido :!5.000.000!
Lími e!dia io!de!pe iciones!:!250.000!!
!
A endiendo! a! las! ca ac e ís icas! que! o ecen,! Pa se! pa ece! se ! la! mejo !
!
35!
opción,!además!de!es o,!Pa se!cuen a!con!una!comunidad!de!desa ollado es!
impo an e! y! !sus! SDKs! pa a! las! di e en es! pla a o mas! es án! muy! bien!
documen ados.! Po ! odos! es os! mo i os! el! Baas! que! se! u iliza a! en! el!
desa ollo!de!es e!p oyec o!se á!Pa se.!
!
Se ido !de! ídeo!
Pa a!el!almacenamien o!de! ídeos!se!pod ía!u iliza !un!backend!en!la!nube!
como!los! is os!an e io men e,!el! p oblema! epe cu e! en!el! cos e!que!es o!
supond ía.!Las! a i as!de!es os!se icios! an!aco de!a!los! equisi os! eque idos,!
po !lo! an o,!a!mayo !demanda!de!espacio,!mayo !se á!el!impo e.!!
!
Apa e! del! p ecio! del! almacenamien o! hay! que! conside a ! o os! ac o es! al!
abaja !con! ídeos,!un!a chi o!de! ídeo!en!FHD!de!un!minu o!de!du ación!
suele!ocupa !en e!170MB!y!190MB,!una!can idad!muy!g ande!de!megaby es!
pa a! se ! ans e idos! de! una! sola! ez! y! más! eniendo! en! cuen a! las!
capacidades!de!las! edes!mó iles!ac uales!(3G!à!0.4!Mbps!,!3G+!à!7.2Mbps,!
4G!à!150Mbps).!!
!
La!solución!es!u iliza !un!se ido !de! ídeo!s eaming!adap a i o,!el!s eaming!
adap a i o! es! una! écnica! que! pe mi e! codi ica ! el! ídeo! o iginal! en! a ias!
calidades,! y! “se i le”! al! clien e! inal! aquella! que! mejo ! se! ajus e! a! su!
elocidad!de!conexión!a!in e ne .!El!se ido !de!s eaming!se!conec a!con!el!
ep oduc o ! de! ídeo,!!lee! de! o ma! dinámica! (du an e! odo! el! iempo! de!
isionado)!las!condiciones!de! elocidad!del!clien e!y!adecua!au omá icamen e!
la!calidad!pa a!op imiza !la!expe iencia!de! isualización!y!pa a!asegu a se!de!
que! incluso! aquellos! usua ios! con! conexión! muy! baja! (po ! ejemplo! equipos!
mó iles! con! 3G! en! zonas! de! poca! cobe u a)! puedan! ep oduci !
co ec amen e!la!señal.!
!
Al! igual! que! en! el! caso! del! se ido ! de! da os,! implemen a ! un! se ido ! de!
ídeo! p opio! equie e! mucho! iempo! y! conocimien o! écnicos! que! no! se!
poseen! po ! lo! que! se! ha! op ado! po ! busca ! una! solución! al e na i a,! es a!
solución!es,!u iliza !YouTube!como!se icio!de!almacenamien o!de! ídeo.!Se!
ha!escogido!YouTube!y!no!o os!sis emas!po que!YouTube!cuen a!con! odas!
las! ca ac e ís icas! necesa ias! y! además! es! un! se icio! muy! usado! en e! los!
a icionados! a! los! allyes,! es o! supone! una! lige a! en aja! ya! que! el! usua io!
conoce á! de! an emano! los! se icios! que! usa! y! es a á! amilia izado! con! su!
uncionamien o.!
!
!A!con inuación!se!mues an!unas!ilus aciones!y!una! abla!compa a i a!de!las!
opciones!con empladas!pa a!el!se ido !de! ídeo:!
!
!
36!
!
Figu a!4.4:!Se ido !de! ídeo!(p ime a!opción)!
!
Figu a!4.5:!Se ido !de! ídeo!(segunda!opción)!
!
!
37!
!
Figu a!4.6:!Se ido !de! ídeo!( e ce a!opción)!
!
!
!
! !
Encode /segmen e !
Opción!A!
Pa se/!
Opción!B!
YouTube/!
Opción!C!
Comienzo!de!la!
ep oducción!
Rápida!
Len a!
Rápida!
Consumo!de!da os!
Adecuado.!En! elación!
al! isionado!del! ídeo.!
Excesi o!( odo!
el! ídeo).!
Adecuado.!En! elación!al!
isionado!del! ídeo!y!a!la!
elocidad!de! ed!
disponible.!
Complejidad!de!
in eg ación!con!ios!
!
Al a!
!
Baja.!
!
Media.!
Complejidad!de!la!
Implemen ación!
del!sis ema!
!
Al a*!
!
Nula!
!
Nula!
!
*Exis en!sis emas!que!ya!lo!hacen!como!Amazon!Elas ic!T anscode ,!Zencode ,!e c.!
!
!
!
!
!
!
!
!
38!
5.G!Diseño!
! !
5.1.G!Diag ama!de!clases!del!sis ema.!
A! con inuación! se! p esen a! el! diag ama! de! clases! donde! se! modela! el! sis ema! de!
in o mación! que! se! u iliza á! pa a! el! desa ollo! de! es e! p oyec o,! en! el! se! pod án! e ! las!
elaciones!que!exis en!en es!los!di e en es!obje os.!
!
!
!
!
Figu a!5.1:!Diag ama!de!clases!
!
39!
5.2.G!Diag amas!de!secuencia.!
Los! diag amas! de! secuencia! es án! elabo ados! en! lenguaje! UML! y! ep esen an! de! o ma!
esquemá ica!las!acciones!que!debe!i ! ealizando!un! ol!en!el!sis ema!a!lo!la go!de!un!pe iodo!
de! iempo! pa a! comple a ! una! acción.! La! elabo ación! de! es os! diag amas! se! apoya! en! el!
desa ollo!p e io!de!los!diag amas!de!clases!y!los!casos!de!uso!que!son!elemen os! ípicos!en!
la!ingenie ía!del!so wa e.!
!
Inicia !sesión!en!el!sis ema!
Los!siguien es!diag amas!de!secuencia! ep esen an!las!dis in as!acciones!que!el!usua io!debe!
ealiza !pa a!inicia !sesión!en!el!sis ema:!
!
!
!
Figu a!5.2:!Diag ama!secuencia!(inicio!de!sesión!1)!
!
!
!
Figu a!5.3:!Diag ama!secuencia!(inicio!de!sesión!2)!
!
!
!
40!
!
Figu a!5.4:!Diag ama!secuencia!(inicio!de!sesión!3)!
!
!
!
El!ac o !de!es e!diag ama!es!un!usua io!que!no!se!encuen a! egis ado!en!el!sis ema,!es e!
ellena á! un! o mula io! donde! se! le! solici a! una! imagen,! un! nomb e! de! usua io,! una!
con aseña! y!un!email.! Una! ez! p opo cionados! los! da os! an e io es,!el!usua io!in en a á!
accede !pulsando!sob e!un!bo ón,!es a!acción!ha á!que!el!con olado !ejecu e!una!se ie!de!
comp obaciones,! es as,! se! enca ga án! de! comp oba ! que! el! email! iene! una! es uc u a!
co ec a!y!que!la!con aseña!cuen a!con!más!de!6!ca ac e es,!si!se!cumplen!es os! equisi os,!
el!con olado !en ía!la!in o mación!de! egis o!al!modelo,!con!el!obje i o!de!c ea !un!nue o!
usua io,!en!caso!con a io,!se!in o ma!al!usua io!de!que!alguno!de!los!da os!in oducidos!es!
e óneo.!Una! ez!ejecu ada!la!acción!de!“c ea !nue o!usua io”!en!el!modelo,!el!con olado !
ecibe!un!a iso!y!ejecu a!un!código!donde!se!comp oba á!si!ha!habido!algún!e o ,!en!caso!
a i ma i o,!se!mues a!un!mensaje!de!e o !al!usua io,!po !el!con a io,!si! odo!ha!ido!bien,!
se!mues a!la! is a!p incipal!de!la!aplicación.!
!
!
Publica !! ídeo!
A!con inuación!se!mues a!la!secuencia!de!acciones!que!un!usua io!debe!segui !pa a!publica !
un! ídeo!en!el!sis ema:!
!
!
47!
!
!
!
!
Vis a!de!comen a ios:!
!
!
!
Figu a!5.11:!P o o ipo!de!la! is a!de!comen a ios!
!
!
!
!
!
!
48!
!
!
!
!
Vis a!del!pe il!de!usua io:!
!
!
!
!
Figu a!5.12:!P o o ipo!de!la! is a!de!pe il!
!
49!
!
!
!
Vis a!de allada!de!un! allye:!
!
!
!
Figu a!5.13:!P o o ipo!de!la! is a!de allada!de!un! allye!
!
!
!
!
!
!
50!
!
!
!
!
5.4.G!Diag ama!en idad! elación.!
!
!
Figu a!5.14:!Diag ama!en idad! elación!
!
!
5.5.G!Diseño!a qui ec ónico.!!
!
A qui ec u a!de!N_Capas!donde!las!N_Capas!se!encuen an!encapsuladas!en!los!se icios!en!
la!nube!Pa se!+!You ube.!Es a!a qui ec u a!de!N_capas!p esen a!muchas! en ajas! en e!a!
o as! como! la! a qui ec u a! clien e_se ido ,! algunas! de! ! es as! en ajas! son! una! al a!
ole ancia!a! allos,!una!al a!disponibilidad,!una!al a!escalabilidad,!e c.!Desde!nues o!pun o!
de! is a,!se!pod ía!deci !que!la!a qui ec u a!es!una!especie!de!clien e!se ido ,!ya!que!la!
a qui ec u a!de!N_Capas!es! anspa en e!pa a!noso os!(usua ios!de!es os!se icios),!pe o!en!
el! ondo!somos!conocedo es!las! en ajas!que!supone.!
!
!
51!
!
Figu a!5.15:!A qui ec u a!del!sis ema!
!
!
!
5.5.1.G!Pa se!
La!a qui ec u a!de!un!se icio!de!es a!ca ac e ís icas!es!bas an e!compleja,!Pa se!u iliza!la!
in aes uc u a!de!Amazon!Web!Se ices!pa a!albe ga !su!sis ema.!
!
_Como! sis emas! de! ges ión! de! bases! de! da os,! Pa se! u iliza! Cassand a,! MySQL! y!
MongoDB.!!
!
_Pa a!pe mi i !ejecu a !código!en!la!nube,!Pa se!u iliza!la!máquina! i ual!V8,!la!cual!
pe mi e! ejecu a ! código! ja asc ip .! De! es a! mane a,! se! pe mi e! a! los! usua ios!
ejecu a !su!p opio!código!e!in e ac ua !con!los!obje os!almacenados!en!sus!bases!de!
da os.!
!
A!con inuación!se!mues a!un!diag ama!donde!se!puede!obse a !la!complejidad!del!sis ema!
que!se!encuen a!de ás!de!es e!backend:!
!
52!
!
!
Figu a!5.15:!A qui ec u a!de!Pa se!
!
!
6.G!Desa ollo!e!implemen ación.!
En!los!siguien es!apa ados!se!abo da á! odo!el!p oceso!de!desa ollo!de!nues o!sis ema!y!
se! explica á! el! po ! qué! de! algunas! decisiones! omadas.! Además! se! expond án! di e sos!
p oblemas!que!han!su gido!así!como!las!soluciones!adop adas.!!
6.1.G!Con igu ación!e!implemen ación!del!backend.!
En!es e!apa ado!se! a a á! odo!lo! elacionado!con!el!backend,! e emos!su!con igu ación!así!
como!pa e!del!código!que!se!ejecu a!en!él.!
!
Lo!p ime o!de! odo! ue!c ea !una!cuen a!en!www.pa se.com!!y!una! ez!den o!del!sis ema,!
c ea !una!“App”:!
!
!
Imagen!6.1:!C eación!de!una!nue a!“App”!en!Pa se!
!
!
53!
Una! ez!c eada!la!“App”!ya! enemos!acceso!al!en o no!de!con igu ación!y!pod emos!
comenza !con!la!con igu ación!el!nues o!sis ema.!
!6.1.1.G!La!base!de!da os.!
Pa se!u iliza!mongoDB!como!sis ema!de!bases!de!da os!y!una!de!sus!ca ac e ís icas!
más!impo an es!es!que!se! a a!de!un!sis ema!de!base!de!da os!NoSQL.!Den o!de!
las! bases! de! da o! NoSQL! se! dis inguen! a ios! ipos! dependiendo! de! la! o ma! de!
almacena ! la! in o mación! y! mongoDB! se! engloba! den o! de! las! bases! de! da os!
documen ales!ya!que!almacena!la!in o mación!como!un!documen o.!MongoDB!u iliza!
pa a! ello! una! es uc u a! simple! como! es! JSON! y! u iliza! una! cla e! única! pa a! cada!
egis o.!
!
Una! ez! conocido!el! ipo!de! base!de! da os!con! el!que!se! abaja á!pasamos!a! e !
como!ha!sido!el!p oceso!de!c eación!y!con igu ación:!
!
1. Lo!p ime o!de! odo!es!c ea !las!clases!(“ ablas”)!de!nues a!aplicación,!pa a!ello!solo!
hay!que!segui !una!se ie!de!pasos!muy!sencillos.!Pa se!p opo ciona!clases!con!sus!
es uc u as!ya!p ede inidas,!en e!ellas!la!clase!“Use ”,!la!cual!hemos!usado.!
!
!
Imagen!6.2:!C eación!de!una!nue a!clase!en!Pa se!
!
!
!
2. Una! ez!c eadas!las!clases!lo!siguien e!se á!de ini !la!es uc u a!(“columnas”)!de!cada!
clase:!
!
!
Imagen!6.3:!C eación!de!una!nue a!columna!en!Pa se!
!
!
54!
!
!
Una! ez!hecho!es o!ya! enemos!nues o!modelo!de!da os! e lejado!en!el!sis ema!de!
bases!de!da os.!A!con inuación!se!mues a!la!clase!“Use ”:!
!
!
!
Imagen!6.4:!Na egado !de!da os!de!Pa se!
!
!
{!
"objec Id":"s ing"!
"use name":"s ing"!
"bc yp Passwo d:"s ing"!
"email":"s ing"!
"emailVe i ied":"boolean"!
"p o ilePic u eMedium":" ile"!!
"p o ilePic u eSmall":" ile"!
"sessionToken":"s ing"!
"c ea edA ":"da e"!
"upda edA ":"da e"!
}!
!
!
!
¿Cómo!se! elacionan!los!obje os!en!nues a!base!de!da os?!
Al! especi ica ! la! es uc u a! de! una! clase,! se! nos! da! la! opción! de! indica ! que! un!
elemen o!sea!de! ipo!“Poin e ”,!de! ipo!“Rela ion”,!o!de! ipo!“A ay”.!
!
!
55!
!
Imagen!6.5:!Tipos!de! elaciones!
!
!
• Poin e !(adecuado!pa a!de ini ! elaciones!uno_a_uno!y!uno_a_muchos).!
• A ays!!(adecuado!pa a!de ini ! elaciones!uno_a_muchos!y!muchos_a_muchos).!
• Rela ion!(adecuado!pa a!de ini ! elaciones!muchos_a_muchos).!
!
Dependiendo!del! ipo!de! elación!que!que amos!modela !se!usa á!un! ipo!u!o o,!en!
nues o!caso!hemos!usado!únicamen e!el! ipo!“Poin e ”.!!Un!obje o!de! ipo!“poin e ”!
no! es! más! que! una! e e encia! a! un! obje o,! pudiendo! se ! es e! obje o! de! cualquie !
clase.!A! a és!de!esa! e e encia!(“poin e ”)!pod emos!na ega !y!ob ene !in o mación!
del!obje o! e e enciado!(es o!se! e á!de!mane a!más!cla a!en!el!código).!
!
56!
!
!
Figu a!6.1:!Obje os!de! ipo!pun e o!u ilizados!
! !
6.1.2.G!Cloud!code.!
El!concep o!de!Cloud! Code!pod ía! esumi se!básicamen e!como!código!de!nues a!
aplicación!que!se!ejecu a!en!la!nube.!
!
Es e! código! en! la! nube! puede! ejecu a se! o! bien! desde! el! código! de! nues a! app,!
median e!una!sencilla!llamada,!o!bien!po !la!pe sis encia!de!un!nue o! egis o!en!una!
abla!de!nues o!modelo!de!da os.!
!
En! nues o! caso! solo! usamos! el! código! en! la! nube! pa a! ejecu a ! acciones! an e!
cambios! en! nues a! base! de! da os,! a! con inuación! se! explica án! los! di e en es!
mé odos!que!se!ejecu an!y!an e!que!ci cuns ancias!se!ejecu an:!
!
Elimina !ac i idades! elacionadas!con!un! ídeo:!
Es e!mé odo!se!ejecu a!cuando!se!elimina!un! ídeo!de!la!base!de!da os,!lo!que!hace!
es!elimina ! odas!las!ac i idades! elacionadas!con!el! ídeo!ya!que!ca ecen!de!sen ido!
si!el! ídeo!ya!no!exis e.!
!
!
63!
La!clase!AppDelega e!cuen a!con!una!p opiedad!de! ipo!UIWindow,!es a!p opiedad!con iene!
la! en ana! usada! pa a! p esen a ! el! con enido! isual! en! la! pan alla! del! disposi i o.! Po ! lo!
an o!es a!clase!se á!la!base!sob e!la!que!se!mos a án!las!nue as! is as.!
! !
!
Figu a!6.3:!UIWindow!
!
!
Una! ez!conocidos!los! iche os!básicos!desde!donde!“a anca”!una!aplicación,! amos!a! e !
como!se!es uc u a:!!
!
!
Figu a!6.4:!iOS!G!MVC!
!
Como! emos!en!la! igu a!an e io ,!el!pa ón!seguido!es!el!Modelo!Vis a!Con ollado ,!es e!
!
64!
pa ón!p esen a!un!diseño!cla o!y! ácil,!a!la! ez!que!sepa a!de!mane a!cla a!las!
esponsabilidades!de!cada!pa e.!!
!
• El!modelo!son!los!da os,!independien es!de!su! o ma!de! ep esen ación.!
• La! is a!son!los!obje os!que!se!enca gan!de!la! ep esen ación!g á ica!del!modelo!y!de!
los!con oles!con!los!que!el!usua io!puede!in e ac ua .!
• El!con olado !!es!el!enca gado!de!media !en e!la! is a!y!el!modelo,!y!es!donde!se!
coo dina! odo!el! abajo.! Es e! se! enca ga!de!accede ! a! los! da os! del!modelo!y! de!
mos a los! en! la! is a,! ambién! escucha! e en os! y! manipula! los! da os! como! sea!
necesa io.!
!
Figu a!6.5:!iOS!G!MVC!
!
6.2.2.G!Con oles!y!lib e ías!ex e nas.!
!UIImageGCa ego ies!
Es a!es!una!lib e ía!pa a!el! a amien o!y!p ocesado!de!imágenes,! ue!c eada!en!2009!
po ! T e o ! Ha mon.! Dispone! de! a ias! unciones! y! mé odos! de! los! cuales! se!
u iliza án:!
!
Pa a! edondea !las!esquinas!de!una!imagen:!
-(UIImage*) oundedCo ne Image:(NSIn ege )co ne Size
bo de Size:(NSIn ege )bo de Size;
!
Pa a! edimensiona !una!imagen!y!ajus a !su!calidad:!
-(UIImage*) esizedImage:(CGSize)newSize
in e pola ionQuali y:(CGIn e pola ionQuali y)quali y;
!
!
65!
!
Imagen!6.6:!Resul ado!de!usa !la! unción!“ oundedCo ne Image”!
!
Reachabili y!
Es a!es!una!lib e ía!pa a!la!moni o ización!del!es ado!de!la! ed,!haciendo!uso!de!ella!
la!aplicación!puede!con ola !en! odo!momen o!cuando!dispone!o!no!de!conexión!a!
in e ne .!!
Fo ma e Ki !
Es!una!lib e ía!pa a!da ! o ma o!a!di e en es! ipos!de!da os!y!con e i los!en! is as!
legibles! y! en! lenguaje! na u al.! De! en e! la! g an! can idad! de! unciones! que! iene,!
noso os!únicamen e!u iliza emos!una! unción,!es a!nos!pe mi i á!exp esa !el! iempo!
anscu ido!en e!dos! echas!en!lenguaje!na u al.!
!
- (NSS ing *)s ingFo TimeIn e alF omDa e:(NSDa e *)s a ingDa e
oDa e:(NSDa e *)endingDa e!
! !
Imagen!6.7:!“!s ingFo TimeIn e alF omDa e:”!
!
JSQFla Bu on!
Es a!lib e ía!pe mi e!la!c eación!de!bo ones!de!mane a! ácil!y! ápida,!además!pe mi e!
una!mayo !pe sonalización!que!la!que!o ecen!la!clase!UIBu on!(clase!po !de ec o!
que!p opo ciona!Apple).!!
!
!!!!!!!!!! !
Imagen!6.8:!Ejemplo!de!un!bo ón!c eado!con!la!lib e ía!JSQFla Bu on!
!
!
!
66!
RMMul ipleViewsCon olle !
Es a!es!una!clase!que!nos!pe mi e!c ea !un!con ol!capaz!de!ges iona ! a ias! is as!y!
al e na ! en e! ellas! a! a és! de! un! pequeño! segmen o! si uado! en! la! ba a! de!
na egación.!Es!muy!ú il!a!la!ho a!de!ag upa ! is as!simila es.!!
!
!
!!! !
Imagen!6.9:!Ejemplo!del!con ol!“RMMul ipleViewsCon olle ”!
!
!
!
RMPicke ViewCon olle !
Es a!es!una!clase!que!nos!pe mi e!c ea !un!con ol! usionando!dos!elemen o!g á icos!
como!son!el!UIPicke View!y!el!UIAc ionShee .!
!
!
Imagen!6.10:!Ejemplo!del!con ol!“RMPicke ViewCon olle ”!
!
RMS epsCon olle !
Es a!es!una!clase!que!nos!pe mi e!c ea !una!ba a!de!na egación!po !pasos,!donde!
cada!paso!es!una!nue a! is a.!Es e!con ol!es!ideal!pa a!guia !a!los!usua ios!a! a és!
de!un!p oceso.!!
!!! !
Imagen!6.11:!Ejemplo!del!con ol!“RMS epsCon olle ”!
!
!
67!
!
GTSc ollNa iga ionBa !
Es a! es! una! clase! que! nos! pe mi e! c ea ! una! ba a! de! na egación! eplegable! en!
unción! de! los! mo imien os! de! sc oll.! Es! muy! ú il! cuando! se! abaja! con! pan allas!
pequeñas!ya!que!pe mi e!un!mejo !ap o echamien o!de!la!pan alla.!!
MBP og essHUD!
Es a! lib e ía! nos! pe mi e! c ea ! indicado es! de! ac i idad! pe sonalizados,! es! una!
al e na i a!a!los!indicado es!de!ac i idad!que!p opo ciona!Apple.!!
!
!!!!!!!!!!!!!!!! !
Imagen!6.12:!Ejemplo!del!con ol!“MBP og essHUD”!
!
!
XCDYouTubeVideoPlaye ViewCon olle !
!Es a!lib e ía!p opo ciona!un! ep oduc o !de! ídeos!de!YouTube.!Es!muy! ácil!de!usa !
y!hace!que!el!p oceso!de! isualización!sea!muy! anspa en e!al!usua io,!es!deci ,!el!
usua io!no!no a á!que!se!es a! isualizando!un! ídeo!p oceden e!de!YouTube.!
Facebook!SDK!pa a!iOS!
Es e!ki !de!desa ollo!cuen a!con! odas!la!he amien as!necesa ias!pa a!in e ac ua !
con! Facebook! desde! una! aplicación! iOS.! Haciendo! uso! de! sus! mé odos! se! puede!
hace !in inidad!de!cosas,!desde!publica !una! o o!en!el!mu o!has a!conoce ! oda!su!
lis a!de!amigos.!!
You ube!API!!
La!API!de!da os!de!YouTube!pe mi e!inco po a !la! uncionalidad!de!YouTube!en! u!
p opia! aplicación.! Puedes! u iliza ! la! API! pa a! ob ene ! esul ados! de! búsqueda! y!
ecupe a ,! inse a ,! ac ualiza ! y! elimina ! ecu sos! como! ídeos! o! lis as! de!
ep oducción.!
Pa se!SDK!pa a!iOS!
Es e!ki !p opo ciona! odo!lo!necesa io!pa a!conec a se!e!in e ac ua !con!los!se icios!
que! o ece! Pa se.! Además! abs ae! al! p og amado ! de! odo! lo! elacionado! con! las!
conexiones!y!pe mi e!cen a se!en!los!da os.!
!
68!
6.2.3.G!Conexión!con!el!backend!e!in e acción!con!el!mismo.!
Pa a! pode ! accede ! a! nues o! backend! debemos! hace lo! median e! la! API! que! nos!
p opo ciona! Pa se,! pa a! ello! debemos! inclui ! el! amewo k! de! Pa se! a! nues o!
p oyec o,!así!como!o os! amwo ks!y!lib e ías!de!los!que!es e!depende.!!
!
Cuando!c eamos!una!“App”!en!Pa se,!se!nos!p opo ciona!un!código!de!iden i icación!
y!unos!códigos!de!acceso.!Es os!códigos!son!los!que!nos!pe mi i án!conec a nos!al!
backend.!
!
!
!
Imagen!6.13:!Cla es!de!acceso!al!backend!
!
Pa a!con igu a !el!acceso!debemos!añadi !la!lib e ía!a!nues o!AppDelega e!e!inse a !
la! siguien e! línea! de! código! den o! de! la! unción!
applica ion:didFinishLaunchingWi hOp ions:.!Con!es a!línea!con igu a emos!el!
acceso!al!backend!indicando!cual!es!nues o!iden i icado !y!nues a!cla e:!
!
[Pa se se Applica ionId:@"8S8PoGsRT UK bB44ENCWQYqC8VNP ZV nKCK94D"
clien Key:@"X3wREz KOb wXT3WSpGH6mAyD4wNXzPlE WExPQd"];
!
Una! ez! hecho! es o! ya! podemos! conec a nos! a! nues o! backend! siemp e! que!
dispongamos!de!conexión.!!
!
A!con inuación! amos!a!mos a !unos!segmen os!de!códigos!ex aídos!de!la!aplicación!
pa a!en ende !como! uncionan!las!inse ciones,!consul as!y!demás:!
!
Regis o!de!un!usua io!
En!el!siguien e! agmen o!de!código!se!mues a!como!se! ealiza!la!c eación!y! egis o!
!
69!
de!un!nue o!usua io!en!nues o!sis ema.!Lo!p ime o!que!se!hace!es!c ea !un!obje o!de!
ipo!PFUse ,!luego,!se!cumplimen an!sus!p opiedades!a!pa i !de!los! alo es!inse ados!
po !el!usua io!en!los!di e en es!campos!de! ex o!del! o mula io!y!po !úl imo,!se!llama!
al! mé odo! signUpInBackg oundWi hBlock:,! el! cual! c ea á! el! nue o! usua io! en! la!
base!de!da os.!!
!
PFUse *use = [PFUse use ]; //Se c ea un obje o de ipo Use
use .use name = _nameTex Field. ex ;
use .passwo d = _passTex Field. ex ;
use .email = _emailTex Field. ex ;
//Regis o del usua io
[use signUpInBackg oundWi hBlock:^(BOOL succeeded, NSE o *e o ) {
i (!e o ) {
...
}else {
...
}
}];
!
Login!de!un!usua io!
El! login! de! un! usua io! se! ealiza! a! a és! del! mé odo!
logInWi hUse nameInBackg ound: passwo d: block:,! es e! se! enca ga! de!
es ablece ! conexión! con! la! base! de! da os! y! comp oba ! que! exis e! el! usua io!
especi icado!,!en!caso!con a io!de ol e á!un!e o !donde!se!indique!po !qué!no!se!ha!
podido! ealiza !login.!
!
[PFUse logInWi hUse nameInBackg ound:_nameTex Field. ex
passwo d:_passwo dTex Field. ex block:^(PFUse *use , NSE o *e o )
{
i (!e o && use ) {
...
} else {
...
}
}];
!
Consul a!de!los! allyes!que! o man!el!campeona o!
A! con inuación! podemos! e ! como! se! e ec úa! una! consul a,! lo! p ime o! de! odo! es!
especi ica !sob e!que!clase!que emos!hace !la!consul a!y!luego!se!pueden!especi ica !
pa áme os!opcionales!como!la!mane a!de!o dena !los! esul ados!e c.!!Una! ez!hecho!
es o! solo! nos! queda! en ia ! la! pe ición,! pa a! ello! se! u iliza! el! mé odo!!
indObjec sInBackg oundWi hBlock:,!el!cual!de uel e!un!obje o!de! ipo!NSA ay!
que!con end á! an os!obje os!como! allys!exis an!en!la!base!de!da os.!
!
PFQue y *que y = [PFQue y que yWi hClassName:@"Rallye"];
[que y o de ByAscending:@"iniDa e"];
[que y indObjec sInBackg oundWi hBlock:^(NSA ay *objec s, NSE o
*e o ) {
i (!e o ) {
...
} else {
...
}
}];
!
70!
Gua dando!un!nue o! ídeo!en!la!base!de!da os!
Una! ez!que!hemos!c eado!el! ídeo!que! amos!a!gua da !en!la!base!de!da os!lo!único!
que! hay! que! hace ! es! llama ! al! mé odo! sa eInBackg oundWi hBlock:,! el! cual! se!
enca ga á!de! gua da !el! ídeo! e!in o ma nos! si! odo!ha! ido!bien! o!ha!habido! algún!
e o .!
!
PFObjec * ídeo = [PFObjec objec Wi hClassName:@"Vídeo"];
[ ídeo se Objec :_ ídeo.ID o Key:@"you ubeID"];
[ ídeo se Objec :_ ídeo.nDay o Key:@"nDay"]
[ ídeo se Objec :_ ídeo. i le o Key:@" i le"];
[ ídeo se Objec :@0 o Key:@"nLikes"];
ídeo[@" allyId"] = [PFObjec objec Wi hou Da aWi hClassName:@"Rallye"
objec Id:_ ídeo.objec Id]; //Pun e o al allye
ídeo[@"owne "] = [PFObjec objec Wi hou Da aWi hClassName:@"_Use "
objec Id: [PFUse cu en Use ].objec Id ]; //Pun e o al p opie a io
[ ídeo sa eInBackg oundWi hBlock:^(BOOL succeeded, NSE o *e o ) {
i (!e o ) {
...
} else {
...
}
}];
!
!
Como! emos!es!muy!sencillo!in e ac ua !con!nues o!backend,! odo!se!limi a!a!usa !los!
di e en es!mé odos!que!nos!o ece!Pa se.!
!
En!cuan o!a!la!segu idad!de!las!conexiones,!es as!se! ealizan!a! a és!de!conexiones!
segu as!HTTPS!y!! las!con aseñas!se!almacenan!ci adas!haciendo!uso!del!algo i mo!
Bc yp .!
!
6.2.4.G!Vis as!e!implemen ación.!
En!es a!sección! e emos!como!ha!sido!implemen ada!la!
aplicación,!pa i emos!de!una! isión!global!e!i emos!
“desmenuzando”!alguna!de!las! is as!más!impo an es!así!
como!sus!con olado es.!
!
Comenza emos!po !la! is a!inicial!de!nues a!aplicación,!es!
en!es a! is a!donde!el!usua io!puede!elegi !el!mé odo!de!
inicio!de!sesión!que!p e ie a.!Pa a!una!mayo !comodidad!
del! usua io! se! han! p opo cionado! es! posibles! opciones!
de! inicio! de! sesión,! usando! Facebook,! usando! Twi e ! o!
median e!el!sis ema! adicional!de!usua io!y!con aseña.!!
!
Pa a! p opo ciona ! acceso! haciendo! uso! de! las! edes!
sociales! se! han! usado! las! clases! PFTwi e U ils! y!
PFFacebookU ils,! que! p opo ciona! Pa se! en! su! SDK.! Lo!
p ime o!de! odo! ue!c ea !la!aplicación!VidWRC! an o!en! Imagen!6.14:!Vis a!inicial!
de!la!aplicación!
!
71!
Facebook! como! en! Twi e ,! cuando! c eamos! la! aplicación! se! nos! p opo ciona! un!
iden i icado !así!como!o os!pa áme o!que!necesi a emos!pa a!pode !usa !es os!se icios!
desde!nues a!aplicación.!
!
!
!
!
Imagen!6.15:!Mosaico!!
!
!
72!
Cuando!dispongamos!de! odos!los!da os,!solo!hay!que!inse a los!en!nues a!aplicación!de!la!
o ma! especi icada! po ! la! documen ación! de! Pa se.! T as! con igu a ! a ios! pa áme os,! ya!
pod emos!hace !uso!de!los!se icios,!a!con inuación!se!mues a!el! agmen o!de!código!que!
se!u iliza!en!la!aplicación!pa a!conec a se!haciendo!uso!de!Facebook:!
!
!
_!( oid)connec Wi hFacebookBu on{!
!!!!!//!Es ablecemos! odos!los!pe misos!que!necesi amos!de!la!cuen a!de!Facebook!del!usua io!
!!!!NSA ay!*pe missionsA ay!=!@[@"use _abou _me"];!
!!!!!
!!!!i !(![[UIApplica ion!sha edApplica ion].delega e!pe o mSelec o :@selec o (isPa seReachable)])!{!
!!!!!!!...!
!!!!}else{!
!!!!!!!![PFFacebookU ils!logInWi hPe missions:pe missionsA ay!block:^(PFUse !*use ,!NSE o !*e o )!{!
!!!!!!!!!!!i !(!use )!{!
!!!!!!!!!!!!!!!!!!!i !(e o )!{!
!!!!!!!!!!!!!!!!!!!!!!NSLog(@"Se!ha!p oducido!un!e o :!%@",!e o );!
!!!!!!!!!!!!!!!!!!!!!!!UIAle View!*ale !=![[UIAle View!alloc]!ini Wi hTi le:@"Log!In!E o "!message:[e o !!
!!!!!!!!!!!!!!!!!!!!!!!!desc ip ion]!delega e:nil!cancelBu onTi le:nil!o he Bu onTi les:@"Accep ",!nil];!
!!!!!!!!!!!!!!!!!!!!!!![ale !show];!
!!!!!!!!!!!!!!!!!!!}!else!{!
!!!!!!!!!!!!!!!!!!!!!!!NSLog(@"El!usua io!ha!cancelado!el!inicio!de!sesión.");!
!!!!!!!!!!!!!!!!!!!!!!!UIAle View!*ale !=![[UIAle View!alloc]!ini Wi hTi le:@"Log!In!E o "!message:@"The!use !!
!!!!!!!!!!!!!!!!!!!!!!!cancelled! he!Facebook!login."!delega e:nil!cancelBu onTi le:nil!!!!!
!!!!!!!!!!!!!!!!!!!!!!!o he Bu onTi les:@"Accep ",!nil];!
!!!!!!!!!!!!!!!!!!!!!!![ale !show];!
!!!!!!!!!!!!!!!!!!!!}!
!!!!!!!!!!!}!else!i !(use .isNew)!{!
!!!!!!!!!!!!!!!!!!!NSLog(@"Usua io! egis ado!y!logeado!con!Facebook,!ope ación! inalizada!con!éxi o");!
!!!!!!!!!!!!!!!!!!![sel !upda eP o ileWi hFacebook];!//Ac ualiza !pe il!con!la!in o mación!de!Facebook.!
!!!!!!!!!!!!!!!!!!//Ce a !modalView!pa a!accede !a!la! is a!p incipal!de!la!app.!
!!!!!!!!!!!!!!!!!!![sel !dismissViewCon olle Anima ed:YES!comple ion:nil];!
!!!!!!!!!!!}!else!{!
!!!!!!!!!!!!!!!!!!!NSLog(@"Usua io!logeado!con!Facebook,!ope ación! inalizada!con!éxi o");!
!!!!!!!!!!!!!!!!!!![sel !upda eP o ileWi hFacebook];!//Ac ualiza !pe il!con!la!in o mación!de!Facebook.!
!!!!!!!!!!!!!!!!!!!//Ce a !modalView!pa a!accede !a!la! is a!p incipal!de!la!app.!
!!!!!!!!!!!!!!!!!!![sel !dismissViewCon olle Anima ed:YES!comple ion:nil];!
!!!!!!!!!!!}!
!!!!!!!}];!
!!!}!
}!
!
!
!
Una! ez! que! hayamos! iniciado! sesión,! pod emos! e ! las! di e en es! is as! que! componen!
nues a!aplicación.!Pa a!explica !las!di e en es!pa es!de!las!que!cons a!es a!aplicación,!se!
pa i á!de!la!explicación!de!los!con olado es!que!manejan!la!na egación!y!se!con inua á!con!
las! is as!que!manejan!es os!con olado es.!
!
Comenzando!con!los!elemen os!de!na egación,!mos a emos!en!p ime !luga !la!es uc u a!
básica! de! la! aplicación,! la! cual! es á! o mada! po ! un! UITabBa Con olle ! y! cinco!
UINa iga ionCon olle :!
!
79!
!
!
Una! ez!que!hayamos!habili ado!y!con igu ado!el!se icio!en!Google,!ya!podemos!hace !uso!
del!sis ema!OAu h2!pa a!conec a nos!e!inicia !una!sesión!en!YouTube.!La!ges ión!de!es a!
sesión! se! lle a! a! cabo! haciendo! uso! de! la! API! de! YouTube.! Pa a! mayo ! comodidad! del!
usua io,!se!almacenan!los! okens!de!acceso!a!YouTube!de! al!mane a!que!no!necesi e!inicia !
sesión!cada! ez!que!quie a!subi !un!nue o! ídeo.!A!con inuación!podemos! e !una!cap u a!
del!p oceso!de!au en icación/!au o ización!en!YouTube!po !pa e!del!usua io:!
!
!
Con! la! sesión! ya! iniciada,! el! siguien e! paso! se á! selecciona ! el! ídeo! a! subi ,! pa a! ello! se!
o ecen!dos!opciones,!usa !un! ídeo!ya!exis en e!o!u iliza !la!cáma a!pa a!c ea !un!nue o!
ídeo.! Pa a! p opo ciona ! acceso! an o! a! la! cáma a! como! a! la! biblio eca,! usamos! la! clase!
UIImagePicke Con olle ,!es a!clase! acili a!el!acceso!a!es os! ecu sos!y!pe mi e!pe sonaliza !
ín eg amen e! la! in e az.! Además! es! pa ame izable! y! pe mi e! con igu a ! di e sos!
pa áme os!del! ídeo!como!su!du ación,!calidad,!e c.!Cuando!se!selecciona!un! ídeo!de!la!
biblio eca,!es a!clase!se!enca ga!au omá icamen e!de!comp imi !el! ídeo,!pe o!cuando!se!
cap u a!un! ídeo!desde!la!cáma a,!es e!suele! ene !un!g an! amaño!debido!a!la!calidad!de!
g abación,! lo! cual! supone! un! p oblema! a! la! ho a! de! subi ! el! ídeo.! Pa a! sol en a ! es e!
p oblema!se!hace!uso!del! amewo k!AVFounda ion!en!cual!p opo ciona!una!g an!can idad!
de!mé odos!pa a! abaja !con!con enido!mul imedia.!Haciendo!uso!de!algunas! unciones!de!
es e! amewo k,!se! educe!el!bi a e!del! ídeo!y!podemos!pasa !de!un! ídeo!de!46Mb!a!un!
ídeo!de!14MB!,!el!cual!es!mucho!más!manejable!a!la!ho a!de!subi lo!a!YouTube.!
!
Después! de! selecciona ! el! ídeo,! el! siguien e! paso! se á! la! elección! del! humbnail! o! is a!
ep esen a i a! del! ídeo.! Pa a! ello! se! hace! uso! de! un! slide ,! que! se! debe á! desliza ! pa a!
a anza !a!lo!la go!del! ídeo!y!selecciona !es a!imagen.!
!
Imagen!6.20:!Con igu ación!de!las!cla es!de!acceso!pa a!YouTube!
!
80!
!
Imagen!6.21:!Vis a!de!selección!del! humbnail!
!
A!con inuación,!el!cua o!paso!consis e!en!clasi ica !el! ídeo,!es!aquí!donde!se!es ablece!el!
í ulo,!el! allye! al! que!pe enece! y! el!día;!además,!en! es a! is a! ambién!se! le!pe mi e!al!
usua io! elegi ! si! quie e! que! su! ídeo! sea! compa ido! en! Facebook! (a! a és! de! una!
publicación!en!su!mu o)!o!no.!
!!!!!!! !
Imagen!6.22:!Vis as!pa a!adjun a !in o mación!al! ídeo!
!
81!
Po !úl imo,!ya!en!el!quin o!paso!de!es e!p oceso!se!debe á!selecciona !si!el! ídeo!que! amos!
a!subi !es!público,!es!deci ,!que! odos!los!usua io!de!YouTube!puedan! e lo,!o!si!el! ídeo!es!
“ocul o”,! es! deci ! que! nadie! lo! puede! e ! sal o! que! conozca! su! di ección.! Una! ez!
seleccionada!la!opción!que!el!usua io!conside e!adecuada,!lo!que!queda!es!subi !y!publica !el!
ídeo.! La! publicación! del! ídeo! la! podemos! di idi ! en! es! e apas,! la! subida! del! ídeo! a!
YouTube,! la! c eación! de! un! nue o! obje o! en! la! base! de! da os,! y! la! publicación! de!
in o mación.!
!
!
• La!subida!del! ídeo!a!YouTube!es!el!p ime !paso!de!es e!p oceso.!Pa a!ello!lo!p ime o!
que! se! hace! es! “ ecolec a ”! in o mación! ace ca! del! ídeo! como! su! í ulo,! su!
desc ipción,!sus! ags!de!búsqueda,!e c.!A!con inuación,!ya!con! oda!la!in o mación!
disponible,!se!comp ueban!o os!pa áme os!y!se!comienza!con!la!subida!del! ídeo.!
Una! ez!que!el!p oceso!ha! inalizado!se!ob iene!la!in o mación!del! ídeo!en!YouTube,!
la!cual!necesi a emos!en!el!siguien e!paso.!
!
• El!siguien e!paso!después!de!subi !el! ídeo,!es!c ea !un!nue o!obje o!en!nues a!base!
de!da os,!es e!obje o!debe á! elaciona nos!de!alguna!mane a!con!ese! ídeo!subido!a!
YouTube.! Esa! o ma! de! elaciona nos! es! el! ID! del! ídeo,! es e! ID! es! el! que! nos!
p opo ciona! YouTube! al! inaliza ! a! subida! del! ídeo.! Po ! lo! an o! almacenando! la!
in o mación! elacionada!con!el! ídeo!y!su!ID! enemos!un!obje o!que! ep esen a!el!
ídeo!y! a és!del!cual!pod emos!accede !en!cualquie !momen o!al! ídeo!en!si.!!
!
• Una! ez! que! se! encuen a! oda! la! in o mación! almacenada! en! los! di e en es!
se ido es! que! con o man! nues o! backend,! ya! podemos! no i ica ! al! es o! de!
usua ios!que!exis e!un!nue o! ídeo,!pa a!ello!se!en ía!una!no i icación!al! es o!de!
usua io! indicando! que! hay! un! nue o! ídeo!disponible.! Además! es! en! es e! pun o!
donde!se!publica!el! ídeo!en!el!mu o!de!Facebook!del!usua io,!si!así!lo!había!decidido!
an e io men e.!!
!
!
Figu a!6.7:!Diag ama!de!secuencia!(almacenando!! ídeos!+!da os)!
!
82!
!
Aho a,!pasamos!a! e !la!sección!denominada!“Ac i i ies”,!es a!sección!de!subdi ide!en! es!
apa ados!dis in os:!
!
Imagen!6.23:!Vis as!de!la!sección!Ac i i ies!
!
• En!el!p ime !apa ado,!denominado!“News”,!es!donde!se!pueden! e !las!ac i idades!
elacionadas! con! los! ídeos! del! usua io,! así! como! con! su! pe il.! Exis en! es!
ac i idades!posibles:!
o O o!usua io!comienza!a!segui !al!usua io!ac ual.!
o Alguien!comen a!un! ídeo!del!usua io.!
o A!alguien!le!gus a!un! ídeo!del!usua io.!
• En!el!segundo!apa ado,!denominado!“Followings”,!es!donde!se!mos a án!los! ídeos!
que!les!gus a!a!nues os!“siguien es”.!
• Po !úl imo,!en!el!apa ado!denominado!“You !!likes!”,!se!pueden! e ! odos!los! ídeos!
que!han!gus ado!al!usua io!ac ual.!
!
El!con enido!de!cada!una!de!es as! is as!pod ía!se !muy!ex enso! as!cie o! iempo!de!uso!
po !lo!que!se!mues an!de! o ma!paginada,!es!deci !no!se! ae! oda!la!in o mación!de!una!
ez!sino!que!se!di ide!en! agmen o!y!se! an! ecupe ando!a!medida!que!el!usua io!la! a!
demandando.!Es a! écnica!e i a!un!consumo!excesi o!de!da os!así!como!la!sa u ación!de!la!
memo ia! del! sis ema.! Además! de! en! es a! sección,! es a! écnica! ambién! se! usa! en!
p ác icamen e! odos!los!apa ados!de!la!aplicación!donde!la!can idad!de!da os!a!mos a !sea!
muy!g ande.!
!
!
Como!úl ima!sección!de!la!aplicación! enemos!la!denominada!“P o ile”,!en!es a!sección!se!
mos a á!in o mación! elacionada!con!el!usua io!y!se!le!pe mi i á!ges iona !sus! ídeos.!
!
!
83!
!
Imagen!6.24:!Vis a!del!pe il!
!
Den o!de!la!sección!“P o ile”!el!usua io!puede!accede !a!los!ajus es,!desde!es a!nue a! is a,!
el! usua io! puede! ges iona ! aspec os! elacionados! con! su! cuen a! y! modi ica ! o os!
pa áme os! elacionados!con!la!aplicación!como!pueden!se !las!no i icaciones.!Es a! is a!se á!
di e en e!pa a!unos!u!o os!usua ios,! odo!depende!de!la! o ma!en!la!que!hallan!iniciado!
sesión.! A! los! usua io! que! usen! las! edes! sociales! pa a! inicia ! sesión! solo! se! les! pe mi i á!
cambia !su! o o!y!elimina !su!cuen a,!en!cambio,!a!los!usua ios!que!inicien!sesión!haciendo!
uso!de!un!nomb e!de!usua io!y!una!con aseña,!pod án!modi ica ! ambién!su!di ección!de!
co eo!y!cambia !su!con aseña.!
!
84!
!
Imagen!6.25:!Vis as!de!los!ajus es!
!
En! lo! e e en e! a! las! no i icaciones,! desde! es a! is a! podemos! decidi ! que! ipo! de!
no i icaciones! ecibi !y!cuales!no.!Es e! ema!se! a a á!en!mayo !p o undidad!en!el!siguien e!
apa ado!de!la!memo ia!(6.2.5).!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
85!
Vis as!de!uso!común:!
A!con inuación!se!expond án!una!se ie!de! is as!a!las!que!se!pueden!accede !desde!casi!
cualquie !luga !de!la!aplicación:!
!
Vis a!pa a!la! isualización!de!comen a ios:!
!!!!!!!!!!!!!!! !
Imagen!6.26:!Vis a!de!comen a ios!
!
Es a!es!una! is a!es ánda !y!se!u iliza!pa a! e !los!comen a ios!de!cualquie ! ídeo.!
!
Vis a!pa a!lis a !usua ios!(“me!gus a”,! ollowings,! ollowe s):!
!!!!!!!!!!!!! !
Imagen!6.27:!Vis a!de!usua ios!
!
86!
!
Al!igual!que!la! is a!an e io !es a!es!una! is a!es ánda !y!se!u iliza!pa a!mos a !lis as!de!
pe sonas.!Es e! ipo!de! is as!se!u iliza!cuando!se!quie e! e ,!po !ejemplo,!los!usua ios!que!le!
han!dado!a! “like”! en!algún! ídeo,! o! cuando!que emos! e ! quienes! son!los!seguido es! de!
algún!usua io.!Como!se!puede!ap ecia !en!la!imagen!supe io !,!apa ece!un!icono!con!un!ojo!a!
la!de echa!de!cada!usua io,!es e!icono!si!es!de!colo ! e de!indica!que!se!es á!siguiendo!a!ese!
usua io!y!en!caso!de!se !de!colo !g is!indica!que!no!se!es á!siguiendo.!Si!se!pulsa!sob e!es e!
icono!se!puede!comenza !a!segui !a!una!pe sona!o!se!puede!deja !de!segui !e!esa!pe sona.!!
!
Vis a!de allada!de!un! ídeo:!
!!!!!!!!!!!!! !
Imagen!6.28:!Vis a!de allada!de!un! ídeo!
!
Es a! is a!solo!es!accesible!desde!la!sección!denominada!“Ac i i ies”!y!se!usa!pa a!mos a !
un! ídeo!jun o!con!sus!comen a ios.!Además!desde!ella! ambién!se!pe mi e!inse a !nue os!
comen a ios!e!indica !que!nos!gus a!ese! ídeo.!
!
!
!
!
!
!
!
!
87!
In e az!de!búsqueda:!
!
Imagen!6.29:!In e az!de!búsqueda!
!
Es a!in e az!cons a!de!dos! is as,!una!pa a!la!búsqueda!de!usua ios!y!o a!pa a!la!búsqueda!
de! ídeos.!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
!
88!
¿Como!se!han!implemen ados!las!ac i idades?!
Una!ac i idad!es!una!obje o!de!la!clase!Ac i i y!el!cual! elaciona!dos!usua ios,!es a! elación!
puede!se !de!di e en es! ipos!y!puede,!o!no,!dispone !de!un!con enido.!A!con inuación!se!
mues a! una! desc ipción! de allada! de! lo! que! es! cada! campo! de! un! obje o! Ac i i y! y! su!
signi icado.!
!
Un!obje o!de!la!clase!Ac i i y!cuenda!con!5!campos! ele an es:!
!
o <poin e > omUse :!es e!campo!es!un!pun e o!hacia!un!obje o!de! ipo!Use ,!en!es e!
caso,!es e!campo!apun a ía!hacia!el!usua io!que!hace!la!acción.!
!
o <poin e > oUse :!es e!campo!es!exac amen e!igual!que!el!an e io !sal o!que!en! ez!
de!apun a !hacia!quien!hace!la!acción,!apun a!hacia!quien! a!di igida!la!acción.!
!
o <numbe > ype:!es e!campo!indica!el! ipo!de!acción!y!se!codi icación!es!la!siguien e:!
• 1:!like!
• 2:!commen !
• 3:!inapp op ia e! ídeo!
• 4:! ollow!
!
o <s ing>con en :!es e!campo!solo!es!ú il!cuando!la!ac i idad!es!de! ipo! 2,!es!deci !
cuando!se! a a!de!un!comen a io.!Es!aquí!donde!se!almacena!el!con enido!de!ese!
comen a io.!
!
o <da e>c ea edA :!po !úl imo!es e!campo!se!u iliza!pa a!gua da !la! echa!de!c eación!
del!obje o,!la!cual!se i á!pa a!mos a !en!el! iempo!cuando!se!p odujo!la!ac i idad.!
!
!
Es a!ha!sido!la! o ma!de!implemen a ! odas!las!ac i idades!de!nues o!sis ema.!!
!
!
O ien ación!de!la!in e az!
Es a! aplicación! ha! sido! diseñada! pa a! que! pueda! se ! usada! en! di e en es! o ien aciones,!
pe mi iendo!al!usua io! abaja !con!ella!de! o ma! e ical!como!ho izon al.!El!p oceso!pa a!
c ea !una!in e az! equie e!bas an e! abajo.!
!
Exis en!dos!mé odos!pa a!ajus a !el!con enido!de!una! is a!a!la!o ien ación!del!disposi i o:!
!
• Median e! código:! ! cuando! el! disposi i o! de ec a! un! cambio! de! o ien ación! se!
ejecu an!una!se ie!de!mé odos!donde!se!debe!cambia !la!posición!de!los!obje os!pa a!
que!se!adap en!a!la!nue a!o ien ación.!
• Median e! es icciones!(cons ain s):!es a!es!la!mane a!más! ácil!ya!que!se!hace!de!
o ma! isual!a! a és!del!in e ace!builde .!!
!
!
A!con inuación!se!mues a!como!hace !que!un!bo ón!pe manezca!en!el!cen o!de!la!pan alla!
independien emen e!de!la!o ien ación!de!la!in e az.!
!
95!
A!con inuación!se!mues a!una! abla!de!ejemplo:!
Usua io!:!objec Id!
Siguien es!
Canales!a!los!que!es a!
susc i o!
Pe e !:!xC !
Asimo!
- NewVideos!
- IN_xC !
- Ou _AcD!
Asimo!:!AcD!
Lisa!
Pe e !
- NewVideos!
- IN_AcD!
- OUT_Mkj!
- OUT_xCF!
Lisa!:!Mkj!
!
- NewVideos!
- IN_Mkj!
!
!
Una! ez!que!sabemos!como! uncionan!las!no i icaciones! amos!a! e !en!que!consis e!lo!de!
ac i a !o!desac i a !las!no i icaciones!desde!los!ajus es!de!la!aplicación.!
!
Imagen!6.33:!Ajus es!de!no i icaciones!
!
Como!se!puede! e !en!la!imagen!an e io ,!podemos!maneja ! es! ipos!de!no i icaciones,!la!
llamadas!“New! ídeos”,!las!llamadas!“My!ac i i ies”!y!las!llamadas!“Following!ac i i ies”.!!
!
• New! ídeos:!ac i a !o!desac i a !es as!no i icaciones!implican!susc ibi se!o!da se!de!
baja!en!el!canal!llamado!“NewVideos”!
!
• My!ac i i ies:!es e!caso!es!simila !al!an e io !lo!que!debemos!susc ibi nos!o!da nos!de!
baja !en!el!canal!llamado!“IN_”!+!objec ID!p opio.!
!
• Following!ac i i ies:!Es e!caso!es!un! an o!di e en e,!ya!que!aho a!no!solo!hay!que!
susc ibi se!o!da se!de!baja!en!un!canal,!si!no!que!hay!que!hace lo!en! an os!canales!
como! pe sonas! es emos! siguiendo.! Da se! de! baja! es! la! acción! más! ácil! ya! que!
únicamen e!hay!que!elimina ! odos!los!canales!excep o!los!llamados!“NewVideos”!y!
“IN_...”.! En! cambio! pa a! susc ibi nos! hay! que! sabe ! p ime o! quienes! son! esas!
!
96!
pe sonas!a!las!que!seguimos;! pa a!ello!hay!que! ealiza !una!consul a!a!la!base!de!
da os!y!luego,!una! ez!conocidos!esos!usua ios,!susc ibi nos!a!sus!canales!de!salida.!
!
!
!
!!!!Imagen!6.34:!Recepción!de!una!no i icación!
!
!
!
!
!
!
!
!
!
!
97!
7.G!Resul ados!y!conclusiones.!
!
La!elabo ación!de!es e!p oyec o!ha!supues o!un! e o!pa a!mí,!cuando!comencé!con! odo!
es o!no! enia!ni!idea!de!cómo!empeza !pe o!si! enia!cla o!lo!que!que ía!hace .!Lo!p ime o!de!
odo! ue! comenza ! a! hace ! pequeñas! aplicaciones! pa a! i ! amilia izándome! con! el! nue o!
lenguaje! de! p og amación! (Objec ice_C),! con! las! di e en es! lib e ías! y! con! su! en o no! de!
desa ollo!(Xcode).!Comp ende !como! uncionaba! odo!el!ecosis ema!iOS!me!lle ó!bas an e!
iempo,!en!p ime !luga ,!po que!!nunca!había! abajo!con!una! ecnología!como!es a!y!en!
segundo! luga ,! po que! es aba! acos umb ado! a! la! c eación! de! p og amas! de! meno !
complejidad.!!
!
Una! ez! que! dominaba! con! cie a! sol u a! las! he amien as! básicas,! empecé! a! ba aja ! las!
di e en es!opciones!pa a!supli !las!necesidades!de!un!se ido !donde!cen aliza ! odo.!T as!
unas!semanas!de! abajo!de!campo,!op é!po !usa !el!se icio!en!la!nube!Pa se.!Aho a! ocaba!
ap ende !a!usa !es e!backend!en!la!nube,!la!cu a!de!ap endizaje!no! ue!muy!du a!y!g acias!a!
su!buena!documen ación!en!unas!semanas!ya!e a!capaz!de!hace !p ác icamen e! odo!lo!que!
necesi aba.!!
!
Con! odas!las! uncionalidades!básicas!implemen adas,!e a!ho a!de!implemen a !los!de alles!
que!ha ía!que!la!aplicación! oma a!un!aspec o!más!p o esional,!es a! ue!sin!duda!una!de!las!
pa es!más! ediosas!de! odo!el!desa ollo,!ya!que!se!emplea!muchísimo! iempo!en!consegui !
deja ! odo!a!nues o!gus o.!
!
Como! esul ado! inal! de! odo! es e! p oceso,! se! ha! ob enido! una! ed! social! con! su!
co espondien e! clien e! pa a! disposi i os! mó iles! iOS.! Como! comen aba! an e io men e,!
pa iendo!desde!ce o,!se!ha!conseguido!c ea !una!aplicación! o almen e! uncional!y!con!un!
diseño!bas an e!log ado!aco de!a!los!conocimien os!de!diseño!con!los!que!con aba.!!
!
Apa e! del! esul ado! más! e iden e,! el! desa ollo! de! es e! p oyec o! me! ha! hecho! adqui i !
nue os!conocimien os!y!me!ha!ayudado!a!desa olla !nue as!habilidades!en!el!manejo!de!
he amien as.!Se!puede!deci !con! oda!ce eza,!que!el!obje o!p incipal!de!es e!p oyec o!se!
ha!cumplido.!
!
Como! p oblemas! su gidos! du an e! la! ealización! de! es e! p oyec o! cabe! des aca ! la!
po abilidad!de!la!aplicación!de!una! e sión!de!iOS!a!o a,!ya!que!comencé!el!desa ollo!en!
iOS!6!y!lo! inalice!en!iOS!7.!Es e!cambio!p o ocó!di e sos!e o es!ya!que! a ios!mé odos!que!
usaba!habían!quedado!en!desuso.!
!
Como! pa e! posi i a,! menciona ! las! acilidades! que! o ece! el! en o no! iOS! pa a! los!
desa ollado es,!hay!in inidad!de!lib e ías!y! odo!lo!que!se!nos!ocu a!hace !casi!segu o!que!
ya!alguien!lo!ha!hecho!an es.!Además!de!es o,!hay!mucha!in o mación!disponible!en!in e ne !
y!su!en o no!de!desa ollo!cuen a!con! odas!las!he amien as!necesa ias!pa a!la!c eación!de!
una!aplicación.!
!
98!
8.G!T abajo! u u o.!
Se!puede!segui ! abajando!en!muchos!aspec os!pa a!mejo a !la!aplicación!así!como! ambién!
se!pueden!c ea !nue os!clien es!pa a!la! ed!social!que!se!ha!implemen ado.!
!
¿Qué!mejo a !o!que!ca ac e ís icas!añadi !a!la!aplicación?!
- In e az!mul iGidioma:!hoy!en!día!es!algo!básico!pa a!cualquie !aplicación!ya!que!se!
dis ibuyen!en! iendas!que!ope an!a!ni el!mundial.!
- In e az!pa a! able s:! el!uso!de!las! able s!ha!aumen ado!signi ica i amen e!en!los!
úl imos! iempos!y!se!es á!con i iendo!en!un!sus i o!de!los!o denado es!ac uales,!es!
po !es o!que!se ía!in e esan e!c ea !una!in e az!pa a!es e! ipo!de!disposi i os!ya!que!
pe mi i ía!aumen a !el!público!de!des ino.!
- Mejo as!en!los!se icios!que!o ece:!apa e!de! ídeos! ambién!se!pod ían!o ece !las!
clasi icaciones!de!los! allyes!pa a!man ene !in o mados!a!los!usua ios.!
- Mejo a! de! sis ema! de! clasi icación! de! los! ídeos:! ac ualmen e,! los! ídeos!se!
clasi ican! según! el! ally! al! que! pe enecen! y! al! día! den o! del! ally,! es a! nue a!
p opues a! consis i ía! en! a ina ! aún! mas! el! sis ema! y! pe mi i ! a! los! usua ios!
geoposiciona !los! ídeos!den o!del!mapa!de! amos!que! o man!un! ally.!!
!
Imagen!8.1:!Geoposicionamien o!de! ídeos!
!
- Mejo a! pa a! inse a ! ídeos! que! ya! han! sido! subidos! a! YouTube:! es a! mejo a!
consis i ía!en!c ea !una!in e az!donde!el!usua io!pueda!publica ! ídeos!en!el!sis ema!
desde!su!lib e ía!de! ídeos!en!YouTube,!es!deci !el!usua io!puede!añadi ! ídeos!que!
no!han!sido!subidos!a! a és!de!la!in e az!que!p opo ciona!la!aplicación.!
!
!
Nue os!clien es!pa a!la! ed!social:!o o!aspec o!en!el!que! abaja !es!la!c eación!de!nue os!
clien es!pa a! dis in as! pla a o mas!mó iles,! como!pueden!se ! And oid!o!Windows! Phone.!
Además!se!pod ía!c ea !una! e sión!web! educida!y!pública,!donde!cualquie !pe sona!pueda!
e ! el! con enido! pe o! no! pueda! in e ac ua ,! es e! clien e! pod ía! añadi ! publicidad,! lo! que!
pod ía!signi ica !una! uen e!de!ing esos!y!una!mo i ación!pa a!que!el!usua io!se!ins ale!la!
aplicación!en!el!disposi i o!mó il.!
!
!
!
99!
9.G!Bibliog a ía!
• h ps://de elope .apple.com/lib a y/IOS/na iga ion/!
• h ps://si es.google.com/a/2code s.com/cu so_ios_iniciacion/!
• h p://objec i e_c.es!
• h p://www. aywende lich.com/es/!
• h p://www.manzanamagica.com/desa ollo/!
• h p://s acko e low.com!
• h p://www.s a capps.com/!
• h ps://pa se.com!
• h p://www.ja ie od iguez.com.es/blog/2011/10/24/s eaming_adap a i o_en_
in e ne _2/!
• h ps://de elope s. acebook.com!
• h ps://de . wi e .com!
• h ps://de elope s.google.com/?hl=es!
• h ps://gi hub.com/0xced/XCDYouTubeVideoPlaye ViewCon olle !
• h ps://gi hub.com/jdg/MBP og essHUD!
• h ps://gi hub.com/luugia huy/GTSc ollNa iga ionBa !
• h ps://gi hub.com/Coope RS/RMS epsCon olle !
• h ps://gi hub.com/Coope RS/RMPicke ViewCon olle .!
• h ps://gi hub.com/Coope RS/RMMul ipleViewsCon olle .!
• h ps://gi hub.com/jessesqui es/JSQFla Bu on.!
• h ps://gi hub.com/ma /Fo ma e Ki !
• h ps://gi hub.com/ onymillion/Reachabili y!
• h ps://gi hub.com/benilo j/UIImage_Ca ego ies!
• h p://www.di .upm.es/~san iago/docencia/ios/!
• h p://www. echo opia.com/index.php/The_iPhone_OS_A chi ec u e_and_F a
mewo ks!
• h p://e e-ingsis emas-u.blogspo .com.es/2012/04/sis emas-ope a i os-
mo iles-ios.h ml!
• h p://code. u splus.com/ u o ials/ios-succinc ly-hello-ios--mobile-18813!
!
!
!
!
!
!
!
!
!
!
100!
10.GAnexos!
Manual!de!usua io!
Inicio!de!sesión!y! egis o!
Exis en! a ias! o mas!de!inicia !sesión!en!el!sis ema,!bien!a! a és!de! edes!sociales!como!
Twi e !y!Facebook,!o!bien!a! a és!de!un!nomb e!de!usua io!y!una!con aseña.!Si!se!quie e!
accede !haciendo!uso!de!una! ed!social!hab á!que!pulsa !en!el!co espondien e!bo ón!y!si!se!
quie e!accede !median e!un!nomb e!de!usua io!y!con aseña,!pulsando!en!el!bo ón!“login”.!
Si!no!se!dispone!de!una!cuen a!de!usua io,!es a!se!puede!c ea !accediendo!a!un! o mula io!
de! egis o!a! a és!del!bo ón!“Sign!Up”.!
!
!
Imagen!10.1:!Inicio!de!sesión!
!
101!
!
Panel!p incipal!y!pes aña!Home!
Es a!es!la! is a! p incipal! de!la!aplicación! y! es! donde!se!encuen a! el! lis ado! comple o!de!
allyes!que! o man!el!campeona o.!Pa a!accede !los! ídeos!de!cada! allye!bas a!con!pulsa !
sob e!el! allye!deseado!y!selecciona !uno!de!los!días!en!los!que!se!di ide!el! allye.!
!
!
!
!
Imagen!10.2:!Pes aña!“Home”!
!
Como!se!ap ecia!en!las! ablas!an e io es!exis en!unos!símbolos!en!cada!uno!de!los! allyes!así!
como!en!cada!uno!de!los!días!que!componen!un! allye,!es os!símbolos!si en!pa a!indica !
di e en es!es ados:!
!
Simbología!
Signi icado!
!
Apa ado!inaccesible.!
!
Apa ado!accesible,! al a!menos!de!una!
semana!pa a!el!inicio!del! allye.!
!
Apa ado!accesible,! allye!dispu ándose!
ac ualmen e.!
!
Apa ado!accesible,! allye!dispu ado.!
!
!
!
!
!
102!
!
!
!
!
Búsquedas:!!
!
Imagen!10.3:!Búsquedas!
!
Vis a!de allada!de!un! ídeo:!
!
!
103!
!
!
!
!
!
!
!
!!!!!!!!!!!!!!!!!!!!!!!!!! !
Imagen!10.4:!Vídeo!
!
!
!
!
!
104!
Pes aña!Followings!
En!es a!pes aña!se!mues an!las!publicaciones!de!los!usua ios!a!los!que!el!usua io!ac ual!es á!
siguiendo,!así!como!sus!p opios! ídeos.!
!
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!Imagen!10.5:!Pes aña!“Followings”!
!
Pes aña!Came a!
En!es a!pes aña!es!donde!se!le!da!la!posibilidad!al!usua io!de!publica !un!nue o! ídeo,!pa a!
ello!debe!segui !una!secuencia!que!cons a!de!5!pasos:!
• El!p ime !paso!consis e!en!iden i ica se!con!una!cuen a!de!YouTube!pa a!pode !subi !
el! ídeo.!
• El! segundo! de! los! pasos! es! ob ene ! el! ídeo,! es e! se! pod á! selecciona ! de! la!
biblio eca! o! se! pod á! c ea ! en! ese! ins an e! haciendo! uso! de! la! cáma a! del!
disposi i o.!
• Lo! siguien e! es! selecciona ! el! o og ama! del! ídeo! que! se! mos a á! como!
p e isualización!del! ídeo.!
• El!en!cua o!paso!se!le!da á!un! í ulo!al! ídeo,!se!e ique a á!en!un! allye!y!día!y!se!
pod á!elegi !si!compa i !o!no!es e! ídeo!en!Facebook.!
• El! quin o! y! úl imo! paso! consis e! en! selecciona ! la! isibilidad! del! ídeo! den o! de!
YouTube!!e!inicia !la!publicación!del! ídeo.!
Bo ón! pa a! o dena !
los! ídeos! en! o den!
c onológico.!
Bo ón! pa a! o dena ! los!
ídeos,! p ime o! los! que!
engan! mayo ! can idad!
de!“me!gus a”.!