SEDE BELLAVISTA

FACULTAD DE INGENIERA Y TECNOLOGA

ESCUELA DE INGENIERIA CIVIL INFORMTICA

Aplicacin web para la bsqueda y creacin de grupos

musicales
Memoria para optar al ttulo de Ingeniero Civil Informtico

Alumno: Francisco Javier Gacita Maturana

SANTIAGO, CHILE
2016

DERECHOS DE AUTOR
Francisco Javier Gacita Maturana
Se autoriza la reproduccin parcial o total de esta obra, con fines acadmicos,
por cualquier forma, medio o procedimiento, siempre y cuando se incluya la cita
bibliogrfica del documento.

ii

AGRADECIMIENTOS

En primer lugar quiero agradecer a mis padres por darme apoyo constante a lo
largo de esta etapa como estudiante universitario. Por haberme brindado los
valores y enseanzas desde pequeo para poder creer en m y confiar en que
podr lograr todas las metas que me proponga.
En segundo lugar, agradecer a todos los docentes que estuvieron presente a lo
largo de esta carrera, por haberme enseado sus conocimientos e incluso
compartir y hablar de temas no relacionados a la educacin.
Imposible no mencionar a mis compaeros de carrera. Ellos fueron apoyo
constante e incondicional durante todo este periodo, ya que tenamos los mismos
problemas e inquietudes. La cercana que se gener con ellos permiti establecer
lazos de amistad que sin duda seguirn existiendo luego de este periodo.
Tambin quiero agradecer a mi profesor gua, Dagmar Pearce, quin deposit su
confianza en m y mi proyecto desde el primer momento en que le mencion que
quera trabajar con l. A la profesora Yudenia Ramrez por sus consejos y apoyo
durante todo este periodo y a Alicia Pedroso, directora de extensin y
comunicaciones de Projazz, quin deposit toda su confianza en mi proyecto
brindndome la ayuda necesaria para llegar a ms gente.
Finalmente, quiero agradecer a mi polola Grettel por haber estado siempre para
m en los momentos ms duros de la carrera, por haber aguantado la distancia y
la separacin que gener muchas veces el estudio y por brindarme ese amor
incondicional que da a da me hizo tener fuerzas para lograr este objetivo.

iii

Tabla de contenido
Captulo 1 Antecedentes del problema. .............................................................. 1
1.1 Formulacin del problema. ........................................................................ 1
1.2 Justificacin ............................................................................................... 2
1.3 Objetivos .................................................................................................... 3
1.3.1 Objetivo General ................................................................................. 3
1.3.2 Objetivos especficos........................................................................... 3
1.4 Alcances y limitaciones.............................................................................. 4
1.5 Situacin actual ......................................................................................... 5
Captulo 2: Marco terico y conceptual ............................................................... 6
2.1 Conceptualizacin del problema ................................................................ 6
2.2

Herramientas web y grabacin de audio................................................ 9

2.3 Proteccin de identidad y Seguridad ...................................................... 11

2.3.1 Proteccin de identidad ..................................................................... 11
2.3.2 Seguridad .......................................................................................... 12
Captulo 3: Metodologa .................................................................................... 14
1.1

Metodologa escogida .......................................................................... 14

3.1.1

Desarrollo incremental .................................................................. 15

3.1.2

Justificacin ................................................................................... 17

3.1.3

Primera iteracin ........................................................................... 18

1.2

Descripcin de las tcnicas e instrumentos ......................................... 19

3.2.1

Lenguajes de programacin ......................................................... 19

3.2.2

Lenguajes de maquetacin web .................................................... 21

3.2.3

Herramientas de software ............................................................. 22

3.2.3

UML (lenguaje unificado de modelado) ......................................... 23

3.3 Hitos importantes ..................................................................................... 23

Conclusiones ................................................................................................. 24
3.4 Alternativas de solucin ........................................................................... 27
Captulo 4: Diseo del sistema ......................................................................... 30
4.1 Funcionalidades....................................................................................... 30
4.2 Diagramas de casos de uso .................................................................... 35
4.3 Planillas de casos de uso ........................................................................ 42
iv

4.3 Diagrama Entidad-relacin ...................................................................... 47

Captulo 5: Implementacin .............................................................................. 50
5.1 Configuracin del dominio ....................................................................... 50
5.2 Servicio de Hosting .................................................................................. 50
5.3 Configuracin del servicio web ................................................................ 51
5.4 Instalacin de la base de datos ............................................................... 51
5.5 Pgina web .............................................................................................. 52
5.5.1 Estructuracin de la pgina web ....................................................... 52
5.5.2 Estructuracin de los archivos ........................................................... 58
5.5.3 Seguridad en PHP ............................................................................. 74
5.5.4 Grabacin de Audio ........................................................................... 76
Captulo 6: Discusin de los resultados ............................................................ 78
6.1 Funcionalidades Versin beta ................................................................. 78
6.2 Resultados ............................................................................................... 78
6.3 Fortalezas ................................................................................................ 92
6.4 Debilidades .............................................................................................. 92
Captulo 7: Conclusiones y Sugerencias .......................................................... 95
Referencias y bibliografa ................................................................................. 97
Referencias ....................................................................................................... 97
Anexos .............................................................................................................. 99
Anexo 1: Casos de Uso ................................................................................. 99
Anexo 2: Vistas del Sistema ........................................................................ 115

Tabla de ilustraciones
Estructura archivos 1 ........................................................................................ 58
Estructura archivos 2 Carpeta Admin ............................................................... 59
Estructura archivos 3 Carpeta Class................................................................. 60
Estructura archivos 4 Carpeta CSS .................................................................. 61
Estructura archivos 5 Carpeta fonts .................................................................. 62
Estructura archivos 6 Carpeta images .............................................................. 63
Estructura archivos 7 Carpeta includes ............................................................ 63
Estructura archivos 8 Carpeta js ....................................................................... 64
Estructura archivos 9 Carpeta user................................................................... 66

Sitemap sitio web .............................................................................................. 57

Estructura de Archivos ...................................................................................... 73
Resultados 1: Creacin de grupo ..79
Resultados 2: Insercin de grupo en la base de datos ..79
Resultados 3: Insercin de cupos en la base de datos ..................................... 79
Resultados 4: Reconocimiento de grupo creado .............................................. 80
Resultados 5: Recomendaciones del sistema .................................................. 80
Resultados 6: Integrantes de grupo .................................................................. 81
Resultados 7: Men de postulacin .................................................................. 81
Resultados 8: Mensaje de postulacipon exitosa ............................................... 82
Resultados 9: Insercin de solicitud en la base de datos ................................. 82
Resultados 10: Navigator.getUserMedia compatible con navegador................ 83
Resultados 11: Grabacin de audio .................................................................. 83
Resultados 12: Postulacin en la base de datos .............................................. 84
Resultados 13: Archivo de audio almacenado en el servidor ........................... 84
Resultados 14: Audio almacenado en la base de datos ................................... 85
Resultados 15: Postulaciones ........................................................................... 85
Resultados 16: Pgina de administracin de grupo .......................................... 86
Resultados 17: Postulacin con audio .............................................................. 86
vi

Resultados 18: Postulacin rechazada ............................................................. 87

Resultados 19: Grupo sin postulaciones ........................................................... 87
Resultados 20: Postulacin aceptada ............................................................... 87
Resultados 21: Solicitud aceptada ahora es integrante del grupo .................... 88
Resultados 22: Gestin del grupo ..................................................................... 88
Resultados 23: Situacin inicial de prueba ....................................................... 88
Resultados 24: Administracin del grupo, Expulsar integrante ......................... 89
Resultados 25: Cupo vaco ............................................................................... 89
Resultados 26: integrante expulsado ................................................................ 89
Resultados 27: Situacin inicial: lider 10 del grupo 19 ................................. 90
Resultados 28: Administracin de grupo, Promover a lder .............................. 90
Resultados 29: lder de grupo nuevo ................................................................ 90
Resultados 30: Usuario sin grupos en que es lder........................................... 91
Resultados 31: Nuevo lder adquiere privilegios ............................................... 91

vii

RESUMEN
El siguiente proyecto corresponde a una innovacin en el rea musical.
Su propsito consisti en ayudar a msicos amateurs a formar sus grupos
musicales de una forma rpida y sencilla, proporcionando herramientas para la
bsqueda y eleccin precisa de personas.
Para ello fue necesario el desarrollo de un Sistema para la creacin de un
grupo musical, luego, se estableci una forma de poder gestionar este grupo.
Uno de los aspectos ms importantes a la hora de gestionar los grupos musicales
es la forma de eleccin de los integrantes, con este fin se cre un sistema de
postulaciones a travs del envo de un audio. Por ltimo, se aadi un sistema
de bsqueda avanzada de personas, con el fin de que el lder del grupo pueda
invitar gente a que postulen a sus grupos.
El sistema fue realizado bajo la metodologa de desarrollo de software
Desarrollo incremental, debido a que posee la caracterstica de entregar un
prototipo funcional en la primera iteracin para recibir retroalimentacin de los
usuarios e ir mejorando y adaptando el sistema a los requerimientos de estos.
Finalmente, el sistema se abri al pblico la primera semana de Enero del
ao 2016, a la fecha cuenta con 100 usuarios y 8 grupos creados. Se espera que
los usuarios crezcan exponencialmente hasta alcanzar la meta propuesta de 500
cuentas creadas. El proyecto cumpli con entregar un sistema para la bsqueda
de msicos y creacin de grupos musicales, entregando herramientas para la
seleccin de los integrantes de manera objetiva.
Palabras claves: grupos musicales, bsqueda avanzada.

viii

ABSTRACT
The following project corresponds to an innovation in the musical area. Its
purpose consists in help amateurs musicians to form their own musical groups (or
bands) in a fast and easy way, giving them the tools for searching and the precise
choice of people. In order to achieve this goal, the creation of a system that forms
a musical group was essential, as well as the set up of its management.
A key feature to manage a musical group relies in the selection of its members.
Thats why the system enforced to select the new members consisted in the
submission of demos by the aspirant. Lastly, it was added an advanced searching
people system with the purpose to invite people to be part of the groups.
The system was made under the software development methodology
"Incremental development", because it has the feature of give a functional
prototype in the first iteration, to receive feedback from users, and keep improving
and adapting the system to their requeriments.
Finally, the system was opened to the public on the first week of january, 2016.
So far, it has 100 users and 8 created groups. It is expected that users continue
increasing to reach the proposed target of 500 accounts.
The project delivered successfully a system for searching and creating musical
groups (or bands), providing tools for selecting members objectively.
keywords: musical groups, advanced searching.

ix

Trminos y definiciones

Grupo: Grupo de msicos que cuenta con uno o ms cupos con un instrumento
asociado a cada cupo. Se decidi utilizar grupo en lugar de banda debido a que
ste ltimo trmino confunda a los futuros usuarios.
Cupo: Espacio dentro del grupo que debe ser ocupado por una persona.
Vacante: Cupo de un grupo asociado a un determinado instrumento musical, por
ejemplo: guitarrista, cantante, bajista, etc.
Integrante: Persona que ocupa una vacante de un grupo determinado.
Lder de grupo: Primeramente es quin crea el grupo y tendr acceso a editar
la informacin principal del grupo. Luego este mando puede ser delegado a otro
integrante del grupo.
rbol DOM: Document Object Model es un API creado por el W3C (World Wide
Web Consortium) que proporciona un conjunto estndar de objetos para
representar documentos XML y HTML mediante la cual se puede acceder, aadir
y cambiar dinmicamente contenido estructurado en este tipo de documentos a
travs de lenguajes como Javascript.
W3C: World Wide Web Consortium. Es un consorcio internacional que entrega
recomendaciones y estndares para la creacin de pginas web.
WhatWG: Web Hypertext Application Technology Working group. Comunidad
fundada por integrantes de Apple, Mozilla y Opera con el fin de apoyar el
crecimiento y evolucin de HTML.

Captulo 1 Antecedentes del problema.

1.1 Formulacin del problema.
La gran cantidad de sitios web que existe en la actualidad como
medio de difusin de noticias, contenido, avisos, entre otros, hace que la
informacin sea muy accesible pero al mismo tiempo genera repeticin de la
informacin, esto se puede ver claramente en los portales de noticias, donde
muchas veces el generador de contenido de la pgina replica la informacin
obtenida desde otra fuente lo ms rpido posible para as crear una imagen de
novedoso.
Con la ayuda de las redes sociales la informacin se viraliza rpidamente
y ms portales publican la misma noticia. El tiempo en que esta noticia es
novedad es muy limitado, por lo que este tipo de pginas son muy dinmicas, su
contenido va cambiando rpidamente y el xito de la pgina depende de los
generadores de contenido o publicistas. Sin embargo, qu pasa con aquella
informacin que no es tan dinmica como las noticias, sino que su tiempo de
vida puede prolongarse incluso meses? Este es el caso de avisos de trabajo,
ventas, arriendos, etc. Si se analiza la situacin de este tipo de informacin, se
llega a la conclusin que tiene una gran similitud con las noticias: su publicacin
en distintos medios. Sin embargo, ya no son varias personas de distintas pginas
quienes crean el contenido, sino una sola persona que busca hacer llegar su
aviso a la mayor cantidad de personas posible.
Este proyecto se desarrolla con el fin de dar solucin a los distintos
problemas que genera la publicacin de este tipo de informacin, en particular la
bsqueda de personas para conformar un grupo musical.

Los principales problemas que surgen a la hora de buscar personas para

incluir en un grupo musical son:

Mltiples sitios donde su foco de publicacin no es precisamente el mbito

musical: Existen varios portales en Internet dedicados a la publicacin de
ofertas laborales (por ejemplo: trovit, mitula, locanto); estos portales
muchas veces son utilizados por gente que busca msicos para publicar
su aviso.

Publicaciones desactualizadas: Las publicaciones quedan existiendo en el

sitio para siempre o hasta que el mismo usuario que la escribi o algn
administrador del sitio la borre, esto puede conllevar a que personas que
entran en este aviso se encuentren con una oferta obsoleta.

Repeticin de la misma publicacin en varios sitios distintos: Al existir

mltiples sitios con la misma funcionalidad, las personas publican su aviso
en cada una de ellas para as aumentar las posibilidades de xito en su
bsqueda de un integrante. Esto puede ser de gran ayuda para quien
busca integrar a alguien en su grupo, sin embargo, hace ms tedioso el
proceso de bsqueda para quien busca integrarse a algn grupo, debido
a que las publicaciones crecen exponencialmente y mientras ms sitios
visita, ms publicaciones repetidas se encontrar.

1.2 Justificacin
Los hechos expuestos en el punto 1.1 dejan en evidencia que no existe un
sitio central donde converjan todos los avisos de bsqueda de integrantes para
un grupo musical, lo que genera que la bsqueda de esa persona sea tediosa y
muchas veces no tenga xito. Debido a esta razn es que la creacin de una
pgina web dedicada especialmente a los msicos toma relevancia en este
mbito. Aqu los usuarios podrn encontrar todo tipo de perfiles de msicos en
slo unos minutos y evitarn los problemas existentes en la actualidad.
2

1.3 Objetivos
1.3.1 Objetivo General
El objetivo general de este proyecto es ayudar a msicos amateurs a
formar sus grupos musicales de una forma rpida y sencilla, proporcionando
herramientas para la bsqueda y eleccin precisa de personas con el perfil
requerido por el grupo.
1.3.2 Objetivos especficos
Para cumplir el objetivo general se desprenden los siguientes objetivos
especficos:

Realizar una encuesta a distintos msicos para determinar cules son los
principales problemas a la hora de formar un grupo musical; adems, de
ellos se podr obtener las funcionalidades bsicas e indispensables para
la aplicacin.

Conseguir el apoyo o patrocinio de alguna empresa o institucin

relacionada a la msica, con el fin de publicitar la aplicacin y darle mayor
seriedad al proyecto.

Disear el sistema y definir las funcionalidades que debern ser incluidas.

Seleccionar una metodologa de trabajo.

Seleccionar herramientas y tecnologas a utilizar.

Desarrollar el sistema.

Abrir el sistema al pblico en modo de versin beta para obtener

retroalimentacin.

1.4 Alcances y limitaciones

Alcances

El proyecto slo cubre las necesidades de bsqueda para personas

relacionadas con la msica.

El proyecto slo cubrir las funcionalidades fundamentales que forman el

ncleo del objetivo principal, es decir, aquellas funcionalidades que se
definan para la primera iteracin.

El proyecto se define como una aplicacin web similar a una red social,
aunque no cumpla con todas las caractersticas que ello requiere, slo las
fundamentales. Ejemplos de caractersticas que quedan fuera son:
agregar amigos, enviar mensaje privado a una persona, chat, entre otros.

El proyecto est pensado slo para msicos de habla hispana; futuros

idiomas se implementarn segn las necesidades que presenten los
usuarios.

Limitaciones: Las principales limitaciones que tiene el proyecto son:

Validacin del usuario despus de la primera iteracin queda fuera del

plazo de entrega del informe, por lo que los cambios post-entrega no
quedarn documentados en el presente documento.

El proyecto no contar con historial personal de imgenes o archivos

de audio subido, por lo cual no existir un lbum de fotos subido por el
usuario.

1.5 Situacin actual

El mtodo ms utilizado en la actualidad para la bsqueda de msicos es
a travs de Facebook. Esta red social permite a los usuarios crear grupos abiertos
donde cualquier persona puede unirse y publicar contenido. Sin embargo, este
mtodo no es del todo eficiente y el xito de la publicacin depende de distintas
variables.
Existen tambin algunas pginas dedicadas a msicos donde los usuarios
crean sus perfiles y tienen la oportunidad de buscar otros perfiles para obtener el
email de contacto de esta persona. Este tipo de pginas sirve bastante para
encontrar integrantes, sin embargo, carecen de filtros de bsqueda ms
especficos y de algn mtodo de seleccin. Por ltimo, estn los diversos foros
de internet cuyo objetivo es la publicacin de avisos, bsqueda de empleo,
artculos para comprar, y bsqueda de msicos, entre otros.

Captulo 2: Marco terico y conceptual

Este proyecto es una innovacin creada con el fin de ayudar a jvenes
msicos para encontrar personas que cumplan con el perfil requerido para ocupar
alguna vacante en su grupo musical. Segn entrevistas realizadas a distintos
msicos el modo en que se forman los grupos regularmente sigue la siguiente
estructura:
1. La primera forma de creacin de grupo es con el crculo de amigos,
muchas veces las amistades estn formadas en base a los gustos
musicales y de aqu se crea un grupo musical entre ellos.
2. Cuando la primera forma no es suficiente, se busca gente cercana a ellos
que estn en el mundo de la msica, gente del coro al que asisten,
alumnos del mismo colegio o universidad, etc.
3. Cuando no hay suficientes personas para formar el grupo musical en el
entorno, acuden a internet para publicar avisos en Facebook o buscar a
travs de los distintos foros.

Son muchos los problemas por los que las personas no pueden llenar todas
las vacantes de un grupo musical con gente cercana, esto es una de las
principales causas por las que se ha desarrollado este proyecto.

2.1 Conceptualizacin del problema

Al analizar ms de fondo el problema y las entrevistas realizadas, se

determin que son dos los factores ms importantes a tomar en cuenta dentro de
este proyecto.

El primer factor tiene que ver con la bsqueda. Si se considera la

situacin actual, las bsquedas pueden ser muy tediosas tanto en los
grupos de Facebook como en los foros de internet, por lo que la
aplicacin debe procurar que la bsqueda sea lo ms rpida, sencilla
y eficiente para el usuario, esto es: Que con unos pocos clics y rellenar
6

unos campos de filtros sea suficiente para cumplir con la bsqueda y

que esta sea lo ms exacta posible, con el fin de evitar ver perfiles de
personas que no cumplen con sus criterios de bsqueda.

El segundo factor importante tiene que ver con el proceso de

aceptacin de las vacantes. Una vacante de un grupo puede tener ms
de una postulacin, aqu es el lder de grupo quien decidir a qu
persona aceptar. Qu criterios utilizar el lder del grupo para elegir
entre dos o ms personas? En las entrevistas se consult a los distintos
msicos qu criterio utilizaran ellos, entre las respuestas ms
repetidas estuvieron: cantidad de aos que domina el instrumento,
afinidad social, disposicin de instrumentos y tiempo. Todos estos
criterios son vlidos, sin embargo se les plante la siguiente pregunta
Y si el criterio de seleccin de los distintos postulantes de una vacante
es un audio del instrumento requerido? La respuesta fue unnime:
todos prefirieron ste mtodo de seleccin a los que haban
mencionado anteriormente; por lo que en cada postulacin existir la
opcin de grabar un audio con el fin de sorprender al lder del grupo y
ser aceptado en la vacante.

A continuacin se explicar el proceso que los usuarios debern realizar

dentro de la aplicacin para llegar a cumplir con sus necesidades, primero se
explicar el proceso para la bsqueda de una persona y luego, todo el proceso
requerido para armar un grupo.
Bsqueda de persona: Esta bsqueda es uno de los aspectos ms
indispensables dentro de la aplicacin, los usuarios requieren que sta sea
especfica, rpida y fcil de utilizar. El proceso que debern seguir para la
bsqueda es:
1. Creacin de cuenta y autenticacin: Los usuarios debern registrarse en

la base de datos de la aplicacin para luego loguearse, aqu podrn

modificar su perfil para seleccionar la informacin que desean dar a
conocer a la comunidad.
7

2. Bsqueda: Los usuarios, una vez logueados debern dirigirse a la seccin

Buscar persona, aqu se encontrarn con una serie de filtros de

bsqueda, los cuales deben manipular para hacer una bsqueda
especfica segn sus requerimientos.

Creacin de Grupo: Una de las caractersticas que distingue a este proyecto de

otros, es la facultad de que los usuarios puedan crear sus grupos dentro de la
aplicacin e invitar a gente que se una a ste, con el fin de poder promocionar su
grupo.
El proceso que se debe llevar a cabo es el siguiente:

Creacin de
cuenta y
Autenticacin

Los usuarios debern registrarse en

la base de datos para poder acceder
a la pgina de usuarios.

Creacin de
grupo

Los usuarios debern dirigirse a la

seccin Crear grupo, aqu debern
elegir una serie de parmetros como
el nmero de integrantes, el tipo de
msica que el grupo tocar, y las
vacantes que habrn disponibles.

Aceptar
solicitud o
invitar personas

Una vez que el grupo est creado, habrn

distintas vacantes segn el nmero que el
lder del grupo haya creado. Para llenar
estas vacantes existen dos opciones:

La primera es que otro usuario haya

encontrado el grupo mediante el
buscador de grupos y haya postulado a
una vacante.
La segunda opcin es que el lder del
grupo busque personas, acceda a su
perfil y los invite a ocupar la vacante del
grupo.

2.2 Herramientas web y grabacin de audio

Se ha descrito anteriormente que una de las funcionalidades principales y que

distinguir este proyecto de otros similares, es la posibilidad de grabar un audio
al momento de enviar una postulacin a algn grupo. Debido a esta caracterstica
es que se debe estudiar las distintas alternativas existentes para poder grabar
audio desde los computadores de los usuarios.
Durante muchos aos para poder realizar este tipo de tareas se ha tenido que
recurrir a herramientas como Flash o Silverlight. Sin embargo, el mismo dueo
de Silverlight, Microsoft recomienda a sus usuarios no utilizarlo, ya que considera
que fue una excelente herramienta, pero en la actualidad est obsoleta debido
principalmente a riesgos de seguridad. (Popa, 2015). Flash tambin se considera
obsoleto en el desarrollo web 2.0, debido a falencias como: mal posicionamiento,
reducida integracin con otros servicios web, escasa navegabilidad para el
usuario final, elevado tiempo de carga, ausencia de estadsticas. (Gorrn, 2011).
La solucin para este problema es la utilizacin de una API llamada
navigator.getUserMedia. Desde la aparicin de HTML, se ha producido un gran
aumento del acceso a dispositivos de Hardware. Ejemplos claros de esto es la
geolocalizacin (GPS), el API de orientacin (acelermetro), entre otros. Sin
embargo el camino hacia esta API ha sido complicado, tanto que la W3C decidi
poner un poco de orden a esta situacin y en 2011 el grupo de trabajo de la
poltica de API de dispositivos, recibi la tarea de consolidar y estandarizar un
gran nmero de propuestas creadas por distintos desarrolladores.
Primer intento: Captura multimedia HTML
Fue el primer intento de la poltica de API de dispositivos para estandarizar la
captura multimedia en Internet, la cual utiliza la etiqueta <input> de HTML y le
agrega nuevos valores al parmetro accept. Las desventajas de esta API son que
no tiene la capacidad de aplicar efectos en tiempo real y su compatibilidad es
bastante reducida: Navegador Android 3.0 y Chrome para Android 0.16.

Segundo intento: Elemento de dispositivo

Tras la baja compatibilidad de la captura multimedia HTML, surgi una
nueva especificacin compatible con cualquier tipo de dispositivo, y con ella naci
un nuevo elemento HTML, <device>, el cual se convirti en el predecesor de
getUserMedia. Opera fue el primer navegador en implementar capturas de video
basadas en el elemento <device>, poco despus el WhatWG decidi eliminar la
etiqueta

<device>

en

favor

de

un

API

de

Javascript

llamado

navigator.getUserMedia. Luego, Microsoft lanz una implementacin para

Internet Explorer 9 compatible con la nueva especificacin. Tras esto, se pudo
observar un intento de estandarizacin por parte de varias empresas para el tema
de obtener archivos multimedia.
Tercer intento: WebRTC
La etiqueta <device> finalmente qued obsoleta. La carrera por encontrar
un API de captura adecuado se aceler bastante debido a un proyecto llamado
WebRTC (Web Real Time Communication o Comunicacin web en tiempo real),
la cual est supervisada por el grupo de trabajo WebRTC de W3C. Actualmente
Google, Opera y Mozilla estn trabajando para incorporar implementaciones en
sus navegadores correspondientes. getUserMedia proporciona la forma de
acceder al flujo de datos de la cmara web y del micrfono del usuario.
Finalmente, getUserMedia es slo el primer eslabn de esta carrera por
acceder a nuevos tipos de dispositivos desde las pginas web. Por ahora es la
solucin ms factible para cumplir el propsito y es la que se va a utilizar en este
proyecto. Una de las limitaciones es la compatibilidad. (Bidelman, 2012)
GetUserMedia es compatible con los navegadores web Google Chrome
21 en adelante, Mozilla Firefox 20 en adelante y Opera 12 en adelante. No es
compatible con Internet Explorer ni con Safari. Adicionalmente tampoco es
compatible con navegadores Android, Firefox Mobile, IE Phone y Safari Mobile.
El nico navegador mvil que soporta getUserMedia es Opera. Se cree que esta
10

API est en camino a ser un estndar de internet y las empresas dueas de estos
navegadores tendrn que adaptarse para incorporar las funcionalidades de ste.
(Mozilla Developers, 2015)
Navegador Web
Chrome
IExplorer
Firefox
Opera
Safari

Versin
21 en adelante
incompatible
20 en adelante
12 en adelante
incompatible

Navegador mvil
Android
Firefox mobile
IE Phone
Safari Mobile
Opera

Compatibilidad con Navegadores web

incompatible
incompatible
incompatible
incompatible
compatible

Compatibilidad con navegadores mviles

2.3 Proteccin de identidad y Seguridad

2.3.1 Proteccin de identidad

Proteger la identidad de las personas que utilicen esta herramienta, es sin

duda una tarea necesaria e importante a la hora de desarrollar las
funcionalidades que presentar el sistema; esto es, velar que las cuentas creadas
sean administradas precisamente por quin dice haberla creado.
Una de las funcionalidades que se tendr presente en el sistema es la
posibilidad de contactar a las distintas personas que se hayan registrado en el
sistema. Para ello es sumamente necesario verificar el correo electrnico de las
cuentas para evitar el envo de correos desde un correo falso, por ejemplo: una
persona cualquiera puede crearse un perfil con un correo que no le corresponde
y contactar a otra persona que se haya registrado, el mensaje llegar al buzn
de entrada de la persona contactada y su remitente ser el correo falso (o
suplantado). Es debido a esto que todas las personas que se registren en el
sistema, debern activar su cuenta desde un enlace que se enviar a su correo
electrnico y no podrn acceder al sistema hasta que hayan activado su cuenta.

11

Es sabido que los usuarios quieren registrarse en una pgina lo ms rpido

posible y el proceso de activar la cuenta es un proceso tedioso para ellos, sin
embargo es algo con lo que se tendr que saber lidiar debido a su carcter de
obligatorio.

2.3.2 Seguridad

El tema de seguridad de la informacin es un tpico que debe tenerse en

cuenta independiente de la tecnologa a utilizar. El poder garantizar la
confidencialidad, integridad y disponibilidad de la informacin, es una tarea vital
en

cualquier

proyecto

de

tecnologas

de

la

informacin.

La confidencialidad es asegurar que la informacin sea accesible slo a aquellas

personas que cuenten con la autorizacin de acceder a ella.
Dentro del proyecto se realizaron varias acciones preventivas para que los
usuarios puedan acceder slo aquello a lo que estn autorizados, por ejemplo, el
lder de un grupo tendr privilegios dentro del grupo a los cuales los dems
integrantes no podrn acceder. Adems se crearn dos perfiles de cuenta
distinto: el primero ser perfil usuario, este perfil es el que tendrn todas las
personas que se creen una cuenta dentro del sistema; el otro perfil ser el perfil
de administrador, las cuentas creadas como administrador sern manejadas por
el desarrollador y stas contarn con ciertos privilegios como poder eliminar
cuentas, crear noticias, entre otras.
La integridad de la informacin es mantener con exactitud la informacin
que se ha generado, sin alteraciones o manipulaciones por parte de terceros. Se
realizaron bastantes pruebas para garantizar la integridad de la informacin. Los
procesos slo alteran aquella informacin para la que fueron destinados, no se
generan cambios no autorizados. Sin embargo, la informacin pudiera ser
modificada por un tercero mediante ataques al sistema.

12

La disponibilidad garantiza que la informacin sea accesible a las

personas o sistemas en el momento que lo requieran. Lamentablemente no se
pudo contar con un servidor propio, por lo que este proyecto, est sujeto a la
disponibilidad del proveedor de hosting.

13

Captulo 3: Metodologa
1.1 Metodologa escogida

La realizacin de un proyecto de TI es un tema complejo, debido a que es una

rama relativamente nueva, no existe un consenso del modo de trabajo que se
debe emplear para llevarlo a cabo, es por esto que los resultados son
cuestionados debido a 3 factores:

Los sistemas no cumplen las expectativas del usuario.

Los costes del software son difciles de prever y normalmente superan

los costos previamente definidos.

Modificar el software es una tarea costosa y difcil.

Debido a estos factores es que la tendencia en los ltimos aos sea

mejorar las metodologas y procesos en la construccin de software o en su
defecto, crear nuevas metodologas e incentivar a la comunidad a utilizarlas.
Gestionar correctamente el diseo y planificacin de un proyecto es una de
las partes ms importantes en el ciclo de vida de ste, es la mala planificacin la
responsable de muchos fracasos de proyectos de tecnologas de la informacin.
Pocas veces los fracasos son originados por fallas tcnicas.
A continuacin se presentan algunos estudios estadsticos sobre el porcentaje
de proyectos de informtica fallidos o fracasados, aunque algunos resultados
difieren, su conclusin es la misma: la cantidad de proyectos TI fracasados es
muy elevada comparado con los fracasos en otra industria.

McKinsey & Company, en conjunto con la universidad de Oxford

publicaron un estudio en Octubre de 2012 enfocado a grandes proyectos
TI, se consultaron ms de 5400 proyectos de los cuales el 45% excedi el
presupuesto, 7% excedieron el cronograma y 56% entregaron menos valor
que el predicho. (Bloch, 2012)

International Data Corporation (IDC) public en junio del 2009 un estudio

llamado improving IT Project Outcomes by systematically managing and
14

hedging risk. Donde los resultados indican que el 25% de los proyectos
de TI fracasan. De ellos, del 20 a 25% no proporcionan retorno de la
inversin, y un 50% del total de proyectos requieren reelaboracin. (Gulla,
2012)

En enero del 2011 Gartner publica un artculo llamado How to increase

your IT Project success rate por Susan Tan. Este artculo entrega
recomendaciones sobre cmo aumentar el xito de un proyecto TI, basado
en la investigacin de 845 proyectos donde se requiri de un proveedor
de servicios externo a la compaa. De estos proyectos, el 42,5% no
entreg todos los beneficios esperados, el 44% se entreg por encima del
presupuesto y el 42% no fueron entregados a tiempo. (Tan, 2011)

Un estudio realizado por John McManus y Trevor Wood-Harper examin

214 proyectos de TI entre 1998 y 2005, los resultados arrojaron que 23,8%
de los proyectos fueron cancelados despus de la etapa de factibilidad, y
de los proyectos terminados,

1 de cada 3 estaban excedidos en el

cronograma y/o en el presupuesto. (McManus, 2007)

La lista puede seguir extendindose y los resultados siempre sern los
mismos, el porcentaje de fracaso de los proyectos de TI an es muy elevado, por
lo que se requiere que la planificacin y la metodologa de trabajo sea la ms
adecuada para cumplir con los tiempos, presupuesto y expectativas.
Este proyecto al tratarse de un proyecto de innovacin, no cuenta con
requerimientos previamente establecidos por un tercero, esto tiene ventajas y
desventajas, no obstante siempre se debe aplicar una metodologa de trabajo, la
escogida para este proyecto es el desarrollo incremental.
3.1.1 Desarrollo incremental

Consiste en un conjunto de iteraciones en la que cada una cuenta como un

incremento del software final, de forma que quien lo utilice reciba beneficios de
este proyecto de manera creciente. Lo que se busca es que con cada iteracin
los componentes logren evolucionar el software agregando ms opciones y
logrando un mejoramiento ms completo.
15

El proceso iterativo incremental requiere que haya un modelo funcional al

finalizar la primera iteracin. Para lograr esto se deben priorizar los objetivos y
requerimientos en funcin del valor que ofrece el cliente.
3.1.1.1 Ciclo de vida

La principal idea del mejoramiento iterativo es desarrollar un sistema de

programas de manera incremental, dndole al desarrollador la ventaja de poder
utilizar en las nuevas iteraciones los conocimientos adquiridos en las iteraciones
anteriores. Se basa en dos premisas:
1. Los usuarios nunca saben bien que es lo que necesitan para satisfacer
sus necesidades
2. En el desarrollo, los procesos tienden a cambiar.
3.1.1.2 Ventajas del desarrollo incremental

Los usuarios no deben esperar a que el sistema est completo para poder
utilizarlo, ya que la primera iteracin cumple con los requerimientos ms
importantes con el fin de que se pueda utilizar al instante.

Existe una baja probabilidad de riesgo en el sistema, aunque se puede

encontrar problemas en algunas iteraciones, lo normal es que el sistema
se entregue sin inconvenientes.

Ya que el funcionamiento principal se entrega en la primera iteracin, es

menos probable que los usuarios encuentren fallas en los aspectos ms
importantes del sistema.

Se recibe retroalimentacin por parte del usuario en un momento muy

temprano, lo que permite planificar las nuevas iteraciones de una mejor
manera

Permite separar la complejidad del proyecto.

Se obtiene un aprendizaje en cada iteracin el cul es aplicado en futuras

iteraciones y aumenta la experiencia para futuros proyectos.

16

3.1.1.3 Debilidades del desarrollo incremental

La entrega temprana del proyecto produce la sensacin de sistemas

demasiado simples para el usuario

La mayora de los incrementos se hacen en base a las necesidades de los

usuarios, sin embargo los incrementos en si ya deben estar definidos
antes de la entrega del proyecto, el problema es saber cmo manejar el
producto para ver si necesita otros cambios.

Los incrementos no deben contar con muchas lneas de cdigo, ya que la

idea es agregar accesorios al programa principal.

Requiere de un cliente involucrado durante todo el curso del proyecto. Hay

clientes que simplemente no estarn dispuestos a invertir el tiempo
necesario.

La entrega parcial del software funcional puede hacer vulnerable al

programa debido a la falta de robustez.

3.1.2

Justificacin

Una vez expuestas las caractersticas del desarrollo incremental se concluye

que es la metodologa correcta a utilizar, principalmente por su carcter iterativo.
Desde un comienzo la idea del proyecto era crear una versin demo para que un
grupo de personas lo utilizara y diera la retroalimentacin correspondiente para
poder ir mejorando el sistema paulatinamente. Se cumple con la caracterstica
del prototipo de la primera iteracin, donde el sistema tendr las caractersticas
fundamentales

que debe

cumplir, para con el tiempo ir agregando

funcionalidades y mejorando los diseos previamente establecidos en la primera

iteracin. Adems, al no contar con un cliente especfico, los requerimientos se
han definido previamente por el desarrollador, y las iteraciones respetan estos
requerimientos, dejando las principales funciones para la primera iteracin y otras
funciones que agreguen valor en las posteriores.

17

3.1.3

Primera iteracin

El presente informe abarca slo la primera iteracin del proyecto. Esta primera
iteracin tiene como objetivo crear un prototipo funcional de la aplicacin que
actuar como versin beta.
A continuacin se presenta la lista de control del proyecto de esta primera
iteracin.
Lista de control de proyecto
Nombre
1
2
3
4
5
6
7
8
9
10
11
12

Creacin de base de datos

Conexin de aplicacin con la base de datos
Creacin de sesiones
Negar accesos indebidos
Seguridad PHP
Creacin pgina principal
Creacin de cuentas de administrador

Inicio de sesin a men propio

Creacin de noticia

Creacin de cuenta
Verificacin de email
Login
Cambiar foto de perfil

13 Editar perfil

Editar informacin personal

Aadir redes sociales
Aadir archivo sound cloud
Aadir video youtube

14
15
16
17
18
19
20
21
22
23
24
25

Verificar existencia de usuario

Verificar si es perfil propio

Eliminar cuenta
Cambiar contrasea
Buscar persona
Buscar grupo
Invitar a grupo
Visitar perfil de usuario
Contactar usuario
Postular a grupo
Enviar audio
Crear grupo
Editar grupo

Editar informacin de grupo

18

Eliminar grupo
Publicar grupo
26 Aadir vacante
Promover a lder
Verificar si es lder de grupo
Expulsar miembro
Dejar vacante
Ocupar vacante
Aceptar postulante
Rechazar postulante

27 Administrar grupo

28 Administrar postulaciones
29 Notificaciones

3.2 Descripcin de las tcnicas e instrumentos

En este punto se describirn las tcnicas e instrumentos que se utilizaron para

desarrollar el proyecto, incluyendo los aspectos grficos, de diseo y
programacin.
3.2.1

Lenguajes de programacin

3.2.1.1 PHP

Es un lenguaje de programacin interpretado del lado del servidor, se

utiliza principalmente para el desarrollo web de contenido dinmico. El cdigo es
interpretado por un servidor web que genera la pgina web resultante. Fue creado
originalmente en 1995 por Rasmus Lerdorf, pero hasta el da de hoy se siguen
desarrollando nuevas funciones y versiones. Entre las pginas ms conocidas
que utilizan PHP estn: Facebook, Wikipedia y el CMS Wordpress.
Dentro del proyecto, PHP cumple la funcin ms importante, es la que da
vida a la gran mayora de las funcionalidades de ste y es el encargado de
realizar la conexin con la base de datos. Se utiliz la versin 5.2.12 y para la
conexin a la base de datos se utiliz MySQLi ya que MSQL est obsoleta para
la versin de PHP utilizada.

19

Entre las varias funciones creadas, algunas de las ms importantes son: mostrar
perfil, mostrar grupos, mostrar postulaciones, etc. La mayora de estas funciones
se encuentran en un archivo llamado users.php. Por ejemplo, la siguiente funcin
retorna el nmero de grupos que un usuario ha creado

1 cdigo php

3.2.1.2 Javascript

Es un lenguaje de programacin interpretado, a diferencia de PHP se

utiliza en el lado del cliente, permite mejoras en la interfaz de usuario y pginas
web dinmicas. Todos los navegadores web modernos interpretan Javascript a
menos que el usuario lo desactive manualmente.
Javascript se utiliz dentro del proyecto principalmente para crear efectos
en las visualizaciones y de los elementos HTML, adems se utiliz para la
validacin de los campos de formularios. Con el fin de obtener mejores efectos
se utiliz adems la librera JQuery, la cual permite manipular el rbol DOM,
manejar eventos, desarrollar animaciones y agregar interaccin con Ajax. Por
ejemplo, el siguiente cdigo agrega y quita una clase a la etiqueta HTML header
segn el movimiento del scroll del mouse.

20

2 cdigo Javascript

3.2.2 Lenguajes de maquetacin web

3.2.2.1 HTML

Hypertext markup language, o simplemente HTML es un lenguaje de

marcado para la elaboracin de pginas web. Es un estndar que define una
estructura bsica y un cdigo para la definicin de contenido de una pgina web,
como texto, imgenes, videos, entre otros.
Dentro del proyecto, se encarga de crear la maquetacin principal del
diseo de la pgina web, aadiendo tambin los vnculos a otros archivos CSS o
JS.
3.2.2.2 CSS

Cascade Style Sheets es un lenguaje usado para definir y crear la

presentacin de un documento escrito en HTML o XML.
Dentro del proyecto y al igual que en todas las pginas web existentes,
cumple el papel de dar el diseo visual a la pgina, adems de adaptar estos
diseos a los distintos dispositivos (Responsive Design) como tablets,
smartphones, etc.
21

3.2.2.3 Ajax

Asynchronous Javascript and XML es una tcnica de desarrollo web para

crear aplicaciones interactivas, las cuales se ejecutan en el cliente, es decir, en
el navegador de los usuarios mientras se mantiene la comunicacin asncrona
con la base de datos, en otras palabras, permite comunicar las acciones del
cliente con una respuesta del servidor sin refrescar la pgina.
Dentro del proyecto se utiliz para dar continuidad a la pgina, es decir,
que sta no tenga que recargarse para mostrar cierta informacin; Se utiliz en
las funciones que muestran los grupos creados, los usuarios y tambin para
cambiar la imagen de perfil de los usuarios sin la necesidad de recargar la pgina.
3.2.3 Herramientas de software
3.2.3.1 WAMP

WAMP es el acrnimo que describe un sistema de infraestructura de internet que

usa las siguientes herramientas: W (Windows, como sistema operativo), A
(Apache, como servidor web), M (MySQL, como gestor de base de datos) y P
(PHP, Perl o Python, como lenguaje de programacin). El uso de WAMP permite
subir pginas web html a internet, adems de poder gestionar datos en ellas.
Dentro del proyecto se utiliz para el proceso de desarrollo de manera
local. Antes de subir el proyecto a un servidor web, se debieron realizar todas las
pruebas localmente.
3.2.3.2 Photoshop

Photoshop es un editor de grficos rasterizados desarrollado por adobe

Systems incorporated. Se utiliza principalmente para el retoque de fotografas y
es el lder mundial del mercado de las aplicaciones de edicin de imgenes.
Para el proyecto fue utilizado principalmente para mejorar el diseo de la
pgina. Con esta herramienta se cre el logo que se utiliz, se modificaron
algunas imgenes que estn en la pgina y tambin se crearon algunos diseos
de las pginas principales.

22

3.2.3.3 Sublime Text 2

Es un editor de cdigo y texto, est escrito en C++ y Python. Desarrollado

principalmente como una extensin de Vim, pero con el paso del tiempo fue
creando su propia identidad. Se distribuye de forma gratuita, pero no es software
libre o de cdigo abierto.
Se utiliz en el proyecto para todo el cdigo escrito, tanto html, css, php y
javascript, fue de gran ayuda para minimizar los tiempos de programacin debido
a ciertos atajos o macros que presenta esta herramienta..
3.2.3 UML (lenguaje unificado de modelado)
Es el lenguaje de modelado de sistemas de software ms conocido y
utilizado en la actualidad. Sirve para visualizar, especificar, construir y
documentar un sistema. UML cuenta con varios tipos de diagrama, los cuales
muestran diferentes aspectos de las entidades representadas.
Desde el ao 2005 UML es un estndar aprobado por la ISO como
ISO/IEC 19501:2005 Information Technology Open Distributed Processing
Unified Modeling Language (UML) Version 1.4.2.
3.3 Hitos importantes
Previamente y durante la realizacin del proyecto se debieron hacer ciertas
tareas que fueron indispensables para el correcto funcionamiento y xito del
sistema Arma tu grupo musical. Siguiendo un poco las fases del proceso de
desarrollo de software, se explicarn ciertos hitos importantes que debieron
realizarse.
Anlisis de Requisitos: Al ser un proyecto de innovacin los requisitos fueron
obtenidos de la propia experiencia y de entrevistas que se realizaron con distintos
msicos. El objetivo principal de estas entrevistas era obtener cierta informacin
valiosa para el proyecto, y as tambin tener algunos requisitos base. Para lograr
esto se debi seguir una estrategia de conversacin, si bien no fueron pasos
marcados, debido a las diferentes experiencias de los msicos, se trat de seguir
23

el siguiente patrn:
1. Preguntar sobre su experiencia formando un grupo musical: aqu se
preguntaba si con anterioridad haban formado o haban intentado formar un
grupo musical, se pregunt por su experiencia a la hora de formarlo, si lo hacan
con amigos, por contactos o por bsqueda por internet.
2. Preguntar sobre la ventaja de ocupar un sistema dedicado a la creacin
de grupos: Independientemente de la respuesta del paso anterior, se trataba de
que el entrevistado entendiera la necesidad de buscar gente externa. Frente a
esto se le pregunt si pensaba que la utilizacin de un sistema le resultara ms
fcil y/o rpido para este proceso.
3. Frente a la pregunta anterior, la totalidad de los msicos entrevistados
expres que sin duda un sistema facilitara el proceso de creacin de un grupo
musical, entonces se les pregunt cmo se imaginaban ese sistema, qu
elementos imprescindibles debiesen estar presentes.
4. Luego de que los entrevistados contaran cmo se imaginaban el
sistema, se procedi a explicarles de qu se trataba el proyecto.
5. Finalmente se pidi a los entrevistados que dieran su opinin acerca del
sistema, si faltaba o cambiaran alguna funcionalidad. La mayora

de los

entrevistados concordaron en que no le falta nada, est muy bien ese sistema.
Sin embargo hubo tres personas que expresaron comentarios bastante
acertados, entre ellos, el criterio de seleccin de un postulante.
Conclusiones

1. En un comienzo el proyecto tendra el nombre de Arma tu banda musical,

sin embargo, luego de estas entrevistas se concluy que al utilizar la
palabra

banda muchos malinterpretaban la verdadera finalidad del

proyecto, ya que esta palabra los llevaba a pensar que era para formar
bandas de slo instrumentos u orquestas. Por lo que se decidi cambiar
el nombre del proyecto a arma tu grupo musical.
24

2. El 100% de los entrevistados concord en que un sistema dedicado es

necesario a la hora de buscar personas para el grupo musical, ya que las
bsquedas eran muy tediosas; encontraban gente con el mismo gusto
musical, pero de distinta regin.
3. Uno de los entrevistados mencion un dato muy importante dentro de las
caractersticas de los msicos; los aos de experiencia con el instrumento
que toca. Esta variable se haba pasado totalmente por alto dentro de los
requerimientos y es una variable que puede influir a la hora de tomar una
decisin

sobre

qu

solicitud

aceptar.

Para resolver este problema se dio origen a 2 nuevos campos: instrumento

principal e instrumento secundario.
Si hubo un cambio importante reflejado en la planificacin del software a partir
de estas entrevistas fue el siguiente: uno de los entrevistados mencion: el estilo
musical sera un gran filtro. Que diga cules son las tendencias que tenga; algo
como para poner algn demo. Esta frase hizo que se planteara la siguiente
interrogante: si llega ms de una postulacin a una vacante de un grupo, qu
criterio usar el lder del grupo para seleccionar a uno de ellos? Se decidi
preguntrselo

los

entrevistados.

Uno de ellos mencion que se basara en los aos de experiencia, lo cual no

siempre indica el nivel de habilidad que tiene la persona; otra persona dijo que l
se reunira con ellos, ya que ms que el nivel de msico le importaba el nivel de
persona

que

fuera.

Hubo diversas respuestas, pero al momento de preguntarles sera mejor si en

la postulacin pudieran mandar un audio?, todos concordaron en que sera una
muy buena idea y que ese puede ser el criterio decisivo a la hora de elegir entre
varios postulantes; Para aquellos que realicen varias postulaciones y no quieran
volver a grabar una y otra vez, se habilitar la opcin de subir un video o audio a
su perfil.

25

Otro hito importante fue la obtencin de un sponsor para dar credibilidad y

seriedad al proyecto. El sponsor obtenido es el Instituto Profesional de Msica
Projazz. Luego de una primera conversacin, Projazz se vio bastante interesado
en participar de este proyecto, sin embargo, para poder concretar una alianza,
demandaban el proyecto terminado, o al menos el diseo de la pgina. Este hito
hizo que rpidamente comenzara la fase de programacin.
Diseo y arquitectura: En esta fase se cont con el apoyo de Projazz,
especficamente con la Directora de Extensin y Comunicaciones Alicia Pedroso,
ella brind varios tips en cunto a la imagen que se quiere proyectar a los
usuarios, e hizo especial nfasis en el rediseo del logo de la pgina. Tras esto,
la decisin fue buscar asesoramiento con un diseador, el cual proporcion ideas
para el logo, colores que debiera tener la pgina y el tipo de fuente que se debera
utilizar.
Programacin: Una vez que se finaliz con las funcionalidades principales del
sistema, se present nuevamente el proyecto a Projazz. Luego de esta reunin,
se acept la alianza entre Projazz y este proyecto. Las condiciones para ambas
partes fueron las siguientes: Arma tu grupo musical se compromete a publicitar
anuncios para Projazz en la pgina principal, mientras tanto Projazz se
comprometi a enviar correos a sus alumnos de primer ao para motivarlos a la
utilizacin del sistema y adems autoriz la distribucin de afiches a lo largo de
todas sus sedes.

26

3.4 Alternativas de solucin

1. Framework Yii: Es un Framework de software libre, orientado a objetos

y basado en componentes PHP. Est bajo la licencia BSD y entre sus
principales caractersticas estn:

Patrn de diseo MVC

Database Acces Objects, query builder, migracin de base de

datos.

Integracin con Jquery

Entradas de formulario y validacin

Widgets de Ajax

Generacin automtica de cdigo para el esqueleto de la

aplicacin, aplicaciones CRUD.

Dadas estas caractersticas, Yii es ideal para el desarrollo de

aplicaciones web empresariales, aplicaciones de redes sociales, SaaS
y mucho ms.
2. ELGG: Es un motor de redes sociales altamente configurable en
trminos de funcionalidad y esttica. Es de cdigo abierto y fue
nombrado en 2008 como la mejor plataforma social de trabajo en red
de cdigo abierto por InfoWorld. Entre sus principales caractersticas
estn:

Perfiles: Aqu se muestra la informacin principal que cada

usuario har pblico. Se pueden configurar fcilmente los
campos siendo bastante adaptable a las necesidades de cada
proyecto.

Actividades: Elgg provee y brinda la posibilidad al usuario de ver

qu actividades se han realizado en la web.

Grupos: Elgg permite crear grupos pblicos o privados donde se

puede exponer un tema en particular y debatir con otros
usuarios sobre ese tema.

27

Blogs: Permite crear contenido tipo blog donde se puede

embeber videos y fotos.

Notificaciones: Son un medio para que el usuario se encuentre

actualizado de lo que ha pasado en la red.

(santamaria, 2006)
3. BuddyPress: Es un plugin creado para Wordpress. En un principio se
cre como una red de blogs, sin embargo con el tiempo se fueron
aadiendo funcionalidades como perfiles de usuario, amigos, lbumes,
mensajera privada, entre otros.
4. Desarrollo a medida: Las tres opciones anteriores son muy buenas
alternativas para el desarrollo del proyecto, ya que facilitan bastante la
creacin de algunos mdulos y funcionalidades que ste requiere, sin
embargo se ha decidido realizar un desarrollo a medida desde cero con
PHP nativo. Esta decisin est basada en las siguientes razones:
a. Mayor control sobre las funcionalidades: La opcin que ms se
acercaba a los requerimientos era ELGG, sin embargo no
cumpla cabalmente con las funcionalidades especficas con las
que cuenta este proyecto, por lo que se tendra que modificar el
cdigo y antes de esto, analizarlo y entenderlo. Adems, al ser
un proyecto que va a ir creciendo con el tiempo, se necesita que
sea fcilmente adaptable a cambios estructurales o de flujo del
sistema. Por lo que un desarrollo a medida, mediante el cual se
tenga el control y entendimiento total del sistema y sus
funcionalidades,

permitira

escalar

ms

fcilmente

que

utilizando cualquier tipo de framework.

b. Optimizacin de los recursos: Las opciones descritas y otros
frameworks

de

cdigo

libre

existentes

traen

algunas

funcionalidades que no interesa tener en la aplicacin y muchas

veces estn relacionadas a otras funcionalidades, por lo que
eliminarlas creara errores de los cuales se tendra que hacer
28

una modificacin al cdigo para evitarlos; en caso de dejar estas

funcionalidades

intactas,

el

sistema

ocupara

espacio

innecesario en el servidor, el cual debe estar optimizado para

almacenar los archivos de audio que los usuarios enviarn en
sus postulaciones.

29

Captulo 4: Diseo del sistema

4.1 Funcionalidades
1. Creacin de perfil: Todos los usuarios que visiten la pgina podrn
registrarse en ella de forma gratuita, slo los usuarios registrados podrn
hacer uso de los buscadores y tendrn la opcin de crear un grupo. La
creacin de perfil contiene varios campos que los usuarios debern
rellenar:

Nombre y apellido: Estos datos sern importantes para las

bsquedas de personas, con este nombre el usuario podr
distinguirse de los dems.

E-mail: El e-mail servir para loguearse, adems el usuario podr

recibir mensajes de otros usuarios que visiten su perfil.

Fecha de nacimiento: Es un filtro importante para aquellas personas

que andan buscando personas dentro de un rango de edad.

Instrumento principal y secundario: Los usuarios tienen la opcin de

elegir entre dos instrumentos principales, en el caso de que
dominen ms de dos instrumentos, se aadi una seccin donde el
usuario podr escribir su biografa y especificar datos adicionales.
Son importantes tambin para los filtros de bsqueda y
sugerencias.

Gustos musicales: Dentro de los foros que se usan comnmente,

hay algunos que son slo de cierto estilo musical y a las personas
que publican avisos con otros gustos musicales no son bien
recibidos. Este proyecto contempla la gran mayora de estilos
musicales para as poder integrar ms gente. Tambin son
importantes para los filtros de bsqueda.

Usuario y contrasea: Con ellos el usuario podr loguearse en la

pgina web y acceder a todos los beneficios que tienen los usuarios
registrados.

Pas y ciudad: Son datos muy importantes para los filtros de

bsqueda y recomendaciones.
30

2. Editar perfil: Los usuarios podrn modificar los datos de su perfil cuando
les sea conveniente, para ello cuentan con un botn Editar en la pgina
de su perfil, aqu pueden modificar los datos principales de su cuenta.

3. Cambiar contrasea: En la misma pgina donde el usuario tiene acceso a

cambiar los datos de su perfil, existe la opcin de cambiar la contrasea
de la cuenta. Aqu el usuario deber introducir su contrasea actual y dos
veces la nueva contrasea.

4. Eliminar cuenta: Tambin los usuarios pueden eliminar su cuenta en el

momento que estimen conveniente. El usuario no podr loguearse en la
pgina web, sin embargo sus datos no sern borrados de la base de datos.

5. Subir video: los usuarios podrn subir un video a su perfil para mostrar el
nivel de experiencia que tiene con el instrumento que usa, este video debe
ser una URL de youtube.

6. Crear grupo: Cualquier usuario registrado tendr la opcin de crear un

grupo, para ello deber seleccionar el nombre del grupo, el nmero de
integrantes, estilo musical y luego para cada cupo, asignar el instrumento
que desempear.

7. Postular a grupo: Un usuario interesado en pertenecer a un grupo musical

podr ingresar al perfil de este y mandar una solicitud al lder. Aqu hay
dos opciones: la primera es enviar una solicitud normal, donde el lder del
grupo podr ver la postulacin con un enlace al perfil del postulante; la
segunda opcin es enviar una postulacin con un audio adjunto.

31

8. Enviar demo: Los postulantes a una vacante podrn enviar un audio junto
a su postulacin a modo de hacer ms fcil la eleccin por parte del lder
del grupo. Esta grabacin tendr una duracin mxima de 30 segundos y
slo se podr enviar una grabacin por postulacin. Se requiere que el
postulante tenga un micrfono incorporado en su computador y que utilice
uno de los navegadores compatibles con el API getUserMedia.

9. Aceptar postulante: El creador del grupo podr aceptar una solicitud de

algn usuario que quiere tomar una vacante del grupo.

10. Rechazar postulante: El creador del grupo tambin podr rechazar

postulaciones para un cupo de sta. Esta opcin y la anterior estar
disponible en la pgina de postulaciones, a la cual se accede mediante un
enlace proporcionado en la pgina de administracin del grupo.

11. Expulsar integrante: El creador del grupo podr expulsar a un integrante

para abrir el cupo a otros posibles participantes. Esto se podr hacer
desde la pgina de administracin del grupo.

12. Registrar grupo: Cuando todos los cupos del grupo musical estn
cubiertos, aparecer la opcin especial de registrar grupo. Esta opcin
har que el grupo pase a un estado de creado y pueda ser mostrado en
la pgina web principal.

13. Eliminar grupo: Por cualquier motivo, el creador del grupo podr eliminarlo
de los registros por completo. Una vez eliminado, se borrarn todos los
cupos y solicitudes que estn relacionadas con ste. Sus miembros
pasarn a estar sin grupo.

32

14. Dejar grupo: Un usuario aceptado en un grupo tambin tendr la opcin

de dejarlo en cualquier momento, en ese momento la vacante estar
disponible para que otro usuario pueda postular.

15. Buscar personas: el filtro de bsqueda de personas contar con:

instrumento que utiliza, pas, estilo musical, e-mail, sexo, nombre y rango
de edad. Combinando estos filtros se podr hacer una bsqueda muy
precisa que cumpla con todas la caractersticas que el usuario requiera.

16. Buscar vacantes: Todos los usuarios podrn buscar el listado de todos los
grupos que an les falten vacantes por completar. Cuando un grupo est
con todas sus vacantes listas, y el lder del grupo haya registrado el grupo,
ste no estar disponible en las bsquedas.

17. Cambiar informacin del grupo: una vez se ha creado el grupo, el lder de
ste podr editar la informacin principal, esto con el fin de dar a conocer
el grupo desde la pgina web.

18. Agregar video de grupo: El creador del grupo podr subir un video al perfil
de ste con el fin de promocionarse.

19. Ver notificaciones: El usuario una vez logueado podr ver el historial de
notificaciones en la pgina principal, las notificaciones mostrarn
informacin con respecto a los grupos y otras notificaciones personales,
por ejemplo: el usuario X ha aceptado unirse a tu grupo; el usuario X1 ha
abandonado tu grupo; tienes una invitacin pendiente, etc.

20. Seleccionar y cambiar imagen de perfil: El usuario podr seleccionar y

cambiar cuando lo desee su imagen de perfil.

33

21. Agregar archivo de soundcloud: SoundCloud es una plataforma donde los

usuarios pueden subir sus audios y compartirlos en las redes sociales.
Adems tiene un mtodo de cdigo embebido. Dada esta caracterstica,
el usuario podr embeber las canciones que tenga en su cuenta de
Soundcloud en su perfil.

22. Invitar a grupo: Un usuario podr revisar el perfil de otro usuario e invitarlo
a que se una a uno de los grupos creados. El usuario invitado recibir una
notificacin con un enlace al grupo al que ha sido invitado, desde ah este
podr postular a algn cupo del grupo.

23. Contactar a Usuario: Un usuario que visite el perfil de otro, podr enviarle
un correo de contacto a travs de la pgina de su perfil. Este mensaje
llegar directamente al mail con que el usuario se registr.

24. Editar redes sociales del grupo: El lder podr agregar redes sociales al
grupo, actualmente se puede agregar Facebook, Twitter, SoundCloud y
Youtube.

25. Gestionar grupo: El lder podr gestionar su grupo, agregando o

eliminando cupos. Tambin podr expulsar a alguien de su grupo o
promoverlo a lder.

26. Mostrar recomendaciones: Cuando un usuario ingrese, recibir en la

pgina principal una serie de grupos recomendados segn sus
caractersticas, estas recomendaciones estn clasificadas segn la
exactitud de la recomendacin, las categoras son:

Excelente: estas recomendaciones muestran grupos que coinciden

con el pas, ciudad, estilo de msica y vacante para uno de los
instrumentos que domina el usuario, al ser las menos probables de

34

aparecer y las ms importantes, estn limitadas a aparecer las

primeras 6.

Buena: Esta recomendacin coincide con el pas, ciudad y vacante

de instrumento que utiliza el usuario, al ser la segunda en calidad
de bsqueda, se han limitado el nmero de recomendaciones a 4.

Media: Esta recomendacin muestra los grupos que coinciden en

pas y regin; al ser recomendaciones de calidad media se han
limitado a 2.

Baja: Esta recomendacin muestra los grupos que coinciden slo

en el pas de residencia del usuario; al ser las recomendaciones de
ms baja calidad se ha limitado slo a 1.

4.2 Diagramas de casos de uso

1. Login: A travs de este caso de uso se puede observar el proceso de login
en el sistema. Este comienza con el actor usuario que realiza el caso de
uso registrarse, este caso de uso incluye el validar usuario, es decir,
siempre que se quiera registrar se valida que no est creado el usuario o
haya algn error en los campos requeridos. Aqu pueden darse dos casos,
el primero es que pase la validacin y entonces se registra en la base de
datos, el segundo caso es que el registro no sea vlido, por lo que se
volver al caso de uso de registrarse. Otra opcin que tiene el usuario es
iniciar sesin, este caso de uso incluye tambin la validacin de usuario y
contrasea.

35

Caso de Uso 1

2. Usuario registrado: El siguiente diagrama de casos de uso es vlido para

usuarios que estn registrados.
a. Crear grupo: Una vez logeados, podrn crear un grupo, este caso
de uso extiende a 3 ms que son indispensables para la formacin
del grupo, seleccionar el tamao del grupo, el estilo musical que
tendr el grupo y los roles que cumplir cada integrante.
b. Asignar tamao de grupo: El usuario que est creando el grupo
deber elegir el nombre y el nmero de integrantes que tendr este.
c. Asignar estilo de msica: Adems deber seleccionar el estilo
musical que el grupo tocar.
d. Asignar rol de miembros: Una vez elegida la cantidad de
integrantes se debe asignar el rol que desempear cada cupo, por
ejemplo, si se crean 3 cupos de integrantes, en esta etapa se puede
asignar por ejemplo: un guitarrista, un cantante y un pianista.

36

e. Asignar rol propio: Adems el creador del grupo deber

seleccionar el cupo que l ocupar dentro del grupo, por ejemplo,
cantante.
f. Validar: ste y el siguiente caso de uso son realizados por el
sistema. Aqu se valida que los datos ingresados para la creacin
del grupo musical sean vlidos.
g. Registrar grupo: Si los datos son vlidos, el sistema registra el
grupo en la base de datos.
h. Buscar grupo: Una vez logeado, el usuario podr acceder a una
bsqueda de grupos, contar con una serie de filtros para hacer
una bsqueda ms precisa, de lo contrario podr ver todos los
usuarios registrados.
i. Postular a grupo: es un extend del caso de uso anterior, cuando
el usuario busca un grupo, puede acceder a la pgina de perfil de
ste y desde all postular a alguna vacante disponible.
j. Abandonar grupo: Un usuario que pertenece a un grupo, puede
abandonarlo en el momento que lo desee.
k. Enviar demo: En la postulacin al grupo el usuario podr enviar
un audio a modo de audicin.
l. Editar perfil: Cualquier usuario tendr la opcin de editar su
informacin personal como sus gustos musicales, los instrumentos
que toca, mail, etc.
m. Modificar contrasea: Tambin podr modificar su contrasea.
n. Eliminar cuenta: El usuario puede eliminar su cuenta.
o. Buscar persona: El usuario podr acceder a la bsqueda de
personas, aqu puede encontrar el perfil de todas las personas, o
bien acceder a los distintos filtros que se dispusieron para facilitar y
hacer la bsqueda ms precisa. Cuando los resultados son
arrojados el usuario puede visitar el perfil de las personas
encontradas.

37

p. Invitar a grupo: Cuando se visita el perfil de otra persona, aparece

la opcin de invitar a grupo, donde el usuario podr elegir entre
sus grupos creados para enviarle una invitacin a la persona para
visitar su perfil, esto como una invitacin a postular a alguna
vacante disponible.

38

Caso de Uso 2

39

3. Lder de grupo: El Lder de grupo es quin lo cre. Como lder tendr

privilegios dentro de ste, estos privilegios se reflejan en los siguientes
casos de uso:
a. Aceptar solicitud: Cuando un usuario registrado postule a una
vacante del grupo, el lder de ste podr aceptar esta solicitud para
que el usuario que postul pertenezca al grupo.
b. Rechazar solicitud: En contraparte del caso anterior, el lder
puede rechazar la solicitud del postulante.
c. Eliminar miembro: El lder del grupo puede eliminar a un miembro
de ste que haya aceptado previamente. Esta opcin existe debido
a que un usuario puede no estar activo o no participar del grupo,
por lo que el lder puede re abrir esa vacante.
d. Promover a lder: El lder puede delegar su cargo y pasarlo a otro
integrante, con esta accin pierde los privilegios dentro del grupo.
e. Registrar grupo: Cuando todas las vacantes estn ocupadas el
lder del grupo puede registrarlo como creado; este registro es
distinto al de Crear grupo, el Registro de la creacin de grupo
solamente registra la existencia de ste en un estado en
formacin, mientras que ste registrar grupo pasa el grupo a un
estado de formado.
f. Eliminar grupo: El lder del grupo puede en cualquier minuto
decidir eliminarlo.
g. Editar informacin de grupo: El lder podr editar la informacin
del grupo, como descripcin, aadir pgina de Facebook, aadir
videos o tracks de soundcloud.

40

Caso de Uso 3

41

4.3 Planillas de casos de uso

Se seleccionaron los casos de uso ms importantes debido a la gran
cantidad existente, con el fin de dar a entender los procesos fundamentales que
cumple el sistema. El resto de las planillas estn disponibles en el Anexo 1.

CU06

Crear grupo

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados

CU07, CU08, CU09

Luego de que el usuario est logueado tendr la opcin de

Descripcin

poder crear un grupo musical y elegir los parmetros bsicos

de sta como: nombre, nmero de integrantes, etc.

Precondicin

El usuario debe estar registrado y logueado en el sistema

Paso Accin
1 El usuario se dirige a la opcin de crear grupo
2

Secuencia

3.a

El sistema verifica el nmero de grupos que ha

creado el usuario
Si el usuario ya ha creado 2 grupos, avanza al paso
3.a; Si ha creado menos de 2 grupos, avanza a 3.b
Se imprime un mensaje "no puedes crear ms de dos
grupos". Se niega el acceso al formulario de creacin

3.b Se imprime el formulario de creacin de grupo.

Postcondicin
Frecuencia
esperada

El sistema agrega la nueva banda a la base de datos

Frecuencia media

42

Importancia

Importante
Necesaria, la creacin de bandas es fundamental en el

Urgencia

proceso, sin bandas no existiran bsquedas ni

postulaciones.

Comentarios

Por el momento un mismo usuario no podr crear dos

bandas a la vez

CU07

Asignar tamao

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Descripcin

Precondicin

CU06, CU09
Todo grupo musical debe contar con una cierta cantidad de
integrantes.
El usuario debe haber ido a la seccin crear grupo.
Paso

Secuencia

Accin
1 Se muestra el campo de slo nmeros
2 El usuario ingresa la cantidad de integrantes

Postcondicin El usuario debe llenar otros campos del formulario

Frecuencia
esperada

Frecuencia media

Importancia
Urgencia

Importante
Necesaria, Si un grupo no tiene integrantes, no existe.

43

Comentarios

No hay un tamao mximo de integrantes por grupo. El

mnimo es 1.

CU09

Asignar rol de miembros

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Descripcin
Precondicin

CU7, CU8, CU10

Se debe definir el rol que ocuparan los integrantes del grupo
El usuario debe haber enviado el formulario anterior que
consiste en los casos de uso 7 y 8
Paso Accin

Secuencia

El sistema recibe como parmetro la cantidad de

integrantes ingresados en el CU07
El sistema crea tantos campos select como nmero de
integrantes se hayan recibido como parmetros

3 El usuario debe elegir un rol para cada cupo creado.

Postcondicin El usuario debe proceder con el CU10

Frecuencia
esperada

Frecuencia media

Importancia

Importante
Necesaria, sin roles dentro del grupo no existiran las

Urgencia

funciones de postulacin ni los filtros de bsqueda ms

precisos

44

Obligatoriamente se debe elegir un rol para cada cupo. Las

Comentarios

alternativas de seleccin son entre otras: cantante,

guitarrista, bajista, pianista, etc.

CU10

Asignar rol propio

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Descripcin

CU09, CU11
El usuario que crea el grupo debe definir qu rol ocupar l
dentro del grupo.
El usuario debe haber enviado el formulario anterior que

Precondicin

consiste en los casos de uso 7 y 8 y haber seleccionado un rol

para cada cupo (CU09)
Paso

Secuencia

Accin
1

El sistema recibe como parmetro la cantidad de

integrantes ingresados en el CU07

2 El sistema crea radiobuttons al lado de cada cupo.

3
Postcondicin
Frecuencia
esperada
Importancia
Urgencia

El

usuario

debe

elegir

un

radioButton

que

corresponder al rol que l ocupar.

El usuario debe enviar el formulario
Frecuencia media
sin importancia

Puede esperar. El usuario podr cambiar su rol cuando el

grupo est creado

Comentarios

45

CU15

Enviar demo

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados

CU14
El criterio ms importante a la hora de seleccionar entre varios

Descripcin

usuarios que postulan a un cupo es la habilidad. Es por esto

que el sistema permite el envo de un audio para cada
postulacin.

Precondicin

El usuario debe haber entrado al perfil de un grupo y haber

hecho clic en postular.
Paso Accin
1

Secuencia

El sistema abre una interfaz donde pregunta si desea

grabar un audio.

2 El usuario debe aceptar(2.a) o rechazar(2.b)

2.a Se inicia la grabacin.
2.b Se enva la postulacin al grupo.

Postcondicin
Frecuencia
esperada
Importancia

La postulacin llega al lder del grupo con el audio en caso de

haber sido enviado.
Frecuencia media.
Baja importancia.
Puede esperar. Si bien es una caracterstica distintiva del

Urgencia

proyecto, no es urgente, hay otros medios por los que el

usuario puede dar a conocer sus habilidades dentro del
proyecto.

Comentarios

El audio tendr una duracin mxima de 30 segundos.

46

4.3 Diagrama Entidad-relacin

El diagrama entidad relacin que se utiliz para crear la base de datos del
proyecto es el siguiente:

Como se puede ver en la imagen, existen 6 entidades, 2 fuertes (persona y grupo)

y 4 dbiles (soundcloud_file, foto, solicitud, cupo) cada una de ellas cuenta con
sus atributos que van a permitir todas las funcionalidades del proyecto.
Persona: Esta entidad fuerte puede existir por s sola. Tiene un conjunto amplio
de atributos que van a servir para mostrar el perfil de cada persona y ayudarn
en los mtodos de bsqueda. Tiene 3 relaciones: la primera es una relacin de
uno a muchos con la entidad soundcloud_file, la cual se puede leer de la siguiente
47

forma: la entidad persona puede o no tener cero o ms registros de la entidad

soundcloud_file. La entidad soundcloud_file debe tener un registro de la entidad
persona. La segunda relacin es parecida a la anterior, pero en este caso es una
relacin uno a uno. Como se mencion en los alcances del proyecto, no se
contar con un historial o lbum de imgenes, por lo que una persona slo tendr
una fotografa; esta relacin puede leerse como: Una persona puede o no tener
una foto. Una foto debe pertenecer a una persona. La ltima relacin de la
entidad persona es con la entidad solicitud; es una relacin uno a muchos y se
lee de la siguiente forma: Un registro de la entidad persona puede o no tener
cero o ms registros de la entidad solicitud. Un registro de la entidad solicitud
debe tener un registro de la entidad persona.
Grupo: Esta entidad fuerte tiene una relacin de uno a muchos con la entidad
dbil cupo y puede leerse como sigue: Un registro de la entidad grupo debe
tener cero o ms registros de la entidad cupo. Un registro de la entidad cupo debe
tener asociado un registro de la entidad grupo.
Cupo: Esta entidad dbil adems de su relacin con la entidad grupo, tiene una
relacin con la entidad solicitud, mediante la cual crea el puente entre Persona y
grupo. Dado que una persona puede tener uno o ms grupos, y un grupo puede
tener una o ms personas, se crea una relacin muchos a muchos, por lo que se
debe agregar una tabla intermedia, en este caso, la tabla cupo y solicitud. Esta
relacin puede leerse de la siguiente forma: Un registro de la entidad cupo puede
o no tener cero o ms registros de la entidad solicitud. Un registro de la entidad
solicitud debe tener un registro de cupo. Esta relacin se puede explicar de la
siguiente manera: Al ya existir un registro de la entidad fuerte grupo,
GrupoUno por ejemplo, este debe tener al menos un registro de la entidad cupo,
supongamos que GrupoUno tiene 4 registros de cupo, los cules se identifican
por un ID nico, el ID del grupo, un nombre y un estado. Para que exista la
relacin entre cupo y solicitud, debe existir previamente un registro de la entidad
persona, llammoslo PersonaUno. PersonaUno crea una solicitud con un ID
propio, la clave fornea que hace referencia a su ID nico de persona, la clave
48

fornea del ID del cupo al cul quiere unirse y un estado de la solicitud. Como se
dijo anteriormente, un registro de solicitud pertenece a un registro de la entidad
cupo, es decir, esta solicitud existe slo para una persona y un cupo especfico.
Sin embargo, ese mismo cupo puede tener muchas solicitudes de personas
distintas. Este es el modo en que funciona la creacin de grupos del presente
proyecto.

49

Captulo 5: Implementacin
5.1 Configuracin del dominio

El dominio escogido ser armatugrupomusical.com, el cual se compr

por medio de la misma transaccin del hosting en la empresa inc.cl. La compra
se realiz por un ao a un costo de $8500 clp.
Para que el dominio pueda ser interpretado por los navegadores se requiere del
uso de DNS (Domain Name System). Adems este hosting debe apuntar a esos
DNS. Este proceso lo realiza automticamente el proveedor de dominio y hosting.
Los DNS del servidor son: ns01.inc.cl y ns02.inc.cl
5.2 Servicio de Hosting

El hosting que alojar el proyecto debe contar con al menos 1 base de

datos. Adems como ser implementada la versin beta no se requiere de mucho
espacio, por lo que se concentr la bsqueda en un servicio estable y econmico.
El servicio elegido fue el plan hosting econmico de la empresa inc.cl, el cual
est diseado para sitios con gran cantidad de visitas y transferencia de datos.
Ideal para tiendas virtuales, tiendas online y portales con utilizacin de archivos
multimedia. Adems cuenta con instalacin automtica de scripts. El plan hosting
econmico cuenta con las siguientes especificaciones:
HOSTING ECONMICO
Precio
Espacio
Cuenta de email
Bases de datos
Transferencia
Cpanel
Respaldos diarios
Uptime enlace

50

$15.990 anual
1 GB
10
2
20 GB
soporte 24/7
soporte 24/7
99,60%

5.3 Configuracin del servicio web

El hosting escogido incorporaba Cpanel, desde all se debi crear una

cuenta ftp para poder acceder al hosting y subir los archivos necesarios para que
el sistema funcione. El software utilizado para subir los archivos va FTP fue
FileZilla, en l se debe ingresar los datos de conexin y este mostrar el directorio
donde se debe subir los archivos.

Implementacin 1 Filezilla como FTP

5.4 Instalacin de la base de datos

En el mismo Cpanel que incorpor inc.cl en la compra del hosting, hay una
seccin de base de datos, desde aqu se pudo acceder a phpMyAdmin y crear la
base de datos que aloj toda la informacin del proyecto.

51

Implementacin 2 phpMyAdmin

Luego de crear la base de datos, el siguiente paso es obtener el script SQL

que se utiliz localmente en WAMP Server. Una vez obtenido el archivo se debi
importar al gestor de base de datos alojado en el servidor.
5.5 Pgina web
5.5.1 Estructuracin de la pgina web

Cuando el usuario ingresa por medio de un navegador a la pgina web del

proyecto, la primera pantalla que se muestra es la pgina principal, la cual cuenta
con un formulario de ingreso al sistema. Este formulario pide un usuario y
contrasea, al enviarlo, hay un archivo llamado sesin_init.php el cual valida que
la conexin sea exitosa. Si el nombre de usuario y contrasea son consistentes
con la base de datos, se redirigir al usuario a la pantalla principal de usuario, si
no se validan los datos aparecer un mensaje de error.
Sin embargo, antes de poder acceder al sistema el usuario debe crear una
cuenta, por lo que dentro de la pantalla principal habr un botn para que el
usuario pueda crear su cuenta.
En la pantalla de creacin de cuentas el usuario debe ingresar todos los
datos solicitados y enviar el formulario. Su cuenta ser creada y el usuario recibir
un mail de confirmacin de cuenta en su correo. Luego de que haya aceptado el
enlace se redirigir a la pgina principal donde el usuario ya podr autenticarse
en

el

sistema

acceder

la

pgina

principal

de

usuario.

En esta pantalla se mostrarn noticias creadas por los administradores del

52

sistema y por Projazz. Tambin habr una seccin donde el sistema recomienda
algunos grupos de acuerdo al perfil del usuario.
La siguiente pestaa que el usuario puede acceder es Mi perfil. Aqu se
mostrar la informacin principal del usuario, como nombre, edad, pas e
instrumentos que toca, a la derecha existe una seccin que se deber rellenar
accediendo a la pantalla de edicin de perfil. Esta seccin permite al usuario
escribir una pequea descripcin de l, su experiencia en el mbito de la msica,
sus influencias y el equipamiento con el que cuenta. Existe tambin una seccin
en la que los usuarios podrn subir sus archivos de soundcloud para ser visibles.
Por ltimo est la administracin de grupos y postulaciones, aqu se muestra la
siguiente informacin:

Mis grupos creados: Se muestran todos los grupos que el usuario crea,
por ahora estn limitados a dos, adems les proporciona un enlace de
acceso a la pantalla de edicin de grupo.

Grupos a los que pertenezco: En esta seccin se mostrarn todos los

grupos en los que el usuario ha sido aceptado (Se excluyen los grupos
en que es lder).

Mis postulaciones: En esta seccin se presentan todas las postulaciones

que el usuario ha hecho, el nombre del grupo al que postul y el estado
de la postulacin.

Al momento de la creacin de la cuenta, todos los usuarios tendrn una

imagen de perfil por defecto, la cual puede cambiarla en cualquier momento, sin
embargo no existe un lbum del historial de fotos subidas.
En la pantalla de edicin de perfil existen 5 secciones:

Detalles y redes sociales: Aqu el usuario puede modificar la informacin

que aparece en el costado derecho de su perfil y adems aadir sus redes
sociales, las cuales aparecern en el perfil segn las aada, es decir, si
slo sube Facebook, el logo de Facebook aparecer en el perfil.
53

Informacin personal: Aqu podr cambiar su informacin personal como

su nombre, apellido, pas, regin e instrumentos que utiliza.

Archivos de soundcloud: Esta seccin est creada para subir los archivos
de soundcloud, adems cuenta con un instructivo de cmo hacerlo.

Modificar contrasea: Esta seccin est creada para que el usuario pueda
modificar su contrasea.

Eliminar cuenta: Si el usuario desea eliminar su cuenta podr hacerlo

desde aqu.

La siguiente seccin a la que puede acceder el usuario es a Crear grupo. Desde

aqu podr crear como mximo dos grupos siguiendo dos simples pasos:
1. Primero, el usuario debe ingresar los datos bsicos del grupo como el
nombre, el estilo musical y el nmero de integrantes.
2. Segn el nmero de integrantes, el sistema crea los cupos, los cuales
el usuario debe asignarle un rol y adems debe elegir el rol que l
utilizar dentro del grupo, al dar clic en siguiente, el grupo y los cupos
se crearn en la base de datos.
Ahora este grupo podr ser visible desde la seccin de grupos y postulaciones
en la pgina de perfil de usuario. Si se entra en el enlace el usuario ser redirigido
a la pantalla de administracin del grupo, esta es bastante similar a las pginas
de perfiles, salvo por la existencia de una tabla, la cual imprime todos los cupos
que hay en el grupo con el respectivo integrante si es que lo hay y las acciones
de gestin que puede realizar el lder. En caso de que otro usuario postule a una
vacante, en la columna Postulaciones aparecer un enlace que lo redirigir a una
ventana donde aparecen todos los usuarios que han postulado a esa vacante.
Entre las acciones de administracin estn:

Eliminar cupo: esta opcin elimina el cupo seleccionado y con l elimina

todos los registros de ese cupo, es decir, si algn usuario estaba
ocupando ese cupo, es eliminado y el usuario ya no pertenece al grupo.

54

Expulsar: Esta opcin aparece slo cuando ya se ha aceptado a alguien

en un cupo. Si se selecciona, expulsar al integrante del grupo y el cupo
quedar disponible para otras personas.

Promover a lder: Esta opcin aparece slo cuando ya se ha aceptado a

alguien en un cupo. Su funcin es delegar el liderato del grupo a otro
integrante, con lo que traspasar todos los privilegios de lder.

Tomar cupo: Aparece cuando hay un cupo vaco. Al seleccionarlo, el

lder del grupo pasa a ocupar ese cupo.

Dejar cupo: Aparece cuando el lder de grupo tiene asignado un cupo

dentro del grupo. Al seleccionarlo, el lder del grupo dejar ese cupo
disponible.

Las dos siguientes opciones donde el usuario puede acceder son las
bsquedas, tanto de grupo como de personas. Ambas tienen apariencia y
funcionalidad similar: a travs de una serie de filtros buscan en la base de datos
las coincidencias y las muestran en la pantalla con un enlace de referencia al
perfil de la persona o el grupo encontrado. Si no se selecciona ningn filtro, la
bsqueda por defecto arrojar todos los resultados.
Cuando un usuario encuentra una persona con el perfil que anda buscando
puede visitar su perfil para ver su informacin, videos o escuchar sus archivos de
soundcloud. La apariencia es bastante similar a Mi perfil, la gran diferencia est
en que en vez de aparecer el botn Editar, aparece un botn Invitar, mediante
el cual se podr enviar una notificacin a este usuario de que visite alguno de los
grupos creados, para que en caso de que le guste la propuesta, pueda enviar
una postulacin al grupo. Tambin existe la opcin de enviar un correo a esta
persona.
Si el usuario quiere visitar la pgina de perfil de un grupo, debe hacer click en
el resultado arrojado por la bsqueda, este lo redirigir al perfil del grupo, el cual
tiene un aspecto bastante similar a los perfiles de las personas, con la diferencia
que aqu se podr observar a los integrantes del grupo o las vacantes disponibles.

55

Si el usuario desea postular a la vacante de ese grupo debe hacer click en el

botn que aparece a la derecha del cupo. Una vez haga click, se redirigir a una
nueva ventana donde habr dos opciones: la primera es postular con un audio y
la segunda postular sin audio.
Lo primero que se nota al entrar a esta pgina, es que el navegador (si es que
lo

soporta)

pedir

permiso

al

usuario

para

utilizar

su

micrfono.

Si el usuario permite el uso del micrfono podr grabar un audio de 30 segundos

como mximo para adjuntar en la postulacin. Si bloquea el uso del micrfono
slo podr postular a la vacante con una postulacin normal.
Las postulaciones slo puede verlas (y orlas) el lder del grupo, a travs de
la tabla existente en la pgina de administracin del grupo.

56

3 Sitemap sitio web

57

5.5.2 Estructuracin de los archivos

Los archivos dentro del servidor ocupan la estructura que muestra la

imagen Estructura archivos 1. Se proceder a explicar cada uno de los archivos
que aparecen en la imagen y tambin se mostrar la estructura y archivos que
contienen las carpetas.

Estructura archivos 1

5.5.2.1 Archivos

crearCuenta.php: Este archivo PHP contiene el formulario de creacin de

cuenta para los usuarios. Es re-direccionado desde la pgina principal y los datos
del formulario son procesados en un archivo ubicado en la carpeta admin.
footer:php: Este archivo es el footer de la pgina principal, en este archivo se
encuentra principalmente la informacin de contacto.
.htaccess: Conocido como archivo de configuracin distribuida. Es un fichero
popularizado por Apache que permite definir diferentes directivas de
configuracin para los directorios del servidor sin cambiar el archivo de

58

configuracin principal de Apache. Este archivo contiene instrucciones para que

el servidor no despliegue la lista de archivos contenidos dentro de una ruta.
header.php: Es la cabecera de la pgina web, aqu se encuentran los enlaces a
los archivos CSS, Javascript y la meta informacin de la pgina web. Tambin se
encuentran algunos scripts que aaden aspectos visuales a la pgina.
index.php: Es el contenido principal de la pgina web, aqu se encuentra el
formulario de ingreso a la seccin de usuarios, la promocin al Sponsor, cuentas
destacadas y ltimos perfiles creados.
sendMail.php: Este archivo contiene el formulario de contacto que los usuarios
podrn utilizar para contactarse con el desarrollador del proyecto.
sesin_init.php: Este archivo contiene el script que valida o niega el acceso al
rea de usuarios. En ambos casos, se lleva un registro en la base de datos de
todos los intentos de logueo en la pgina principal, esto con el fin de detectar
posibles ataques de fuerza bruta.
Style.css: Es el archivo CSS principal. Aqu se encuentran la mayora de los
estilos del sistema.
5.5.2.2 Carpetas

ADMIN:
En esta carpeta se encuentran algunos archivos de administracin de
arma tu grupo musical.

Estructura archivos 2 Carpeta Admin

59

activateAccount.php: Este archivo se encarga de activar las cuentas de

usuario. Una vez que se ha enviado una nueva solicitud de creacin de cuenta,
se enva al correo de la persona que acaba de crearla con un enlace de
activacin. Este enlace redirige al usuario a este archivo, el cual se encarga de
modificar la base de datos para permitir el acceso al rea de usuario.
crearNoticia.php: Este archivo se encarga de crear el formulario para que algn
perfil de administrador cree una noticia. Este formulario se procesa en el archivo
createNew.php
createNew.php: Se encarga de almacenar la noticia en la base de datos
index.php: Es una pgina en blanco, la cual tiene la importancia de prevenir que
los usuarios puedan acceder a los archivos de la carpeta admin.
logout.php: Este archivo maneja el fin de una sesin de usuario.
process_newAccount.php: Este archivo toma los datos obtenidos desde el
archivo de creacin de cuenta y los inserta en la base de datos luego de hacer
algunas verificaciones. Si el proceso es exitoso, se enva el correo de
confirmacin de cuenta al mail del nuevo usuario.
CLASS:
En esta carpeta se encuentran clases del proyecto, las cuales tienen
alguna de las funcionalidades ms importantes.

Estructura archivos 3 Carpeta Class

Dbactions.php: Este archivo contiene funciones para acelerar el proceso de

ejecucin de querys.

60

Sessions.php: Este archivo maneja las sesiones, las inicializa luego de verificar
los datos de conexin, y las destruye cuando el usuario hace click en logout.
Users.php: Este es uno de los archivos ms importantes dentro del proyecto,
aqu se encuentra la mayora de las funcionalidades que dan vida al sistema.
Cabe destacar que las funciones de este archivo reciben los parmetros desde
otros archivos presentes en la carpeta user y los utiliza para almacenar datos en
la base de datos. Adems imprime la estructura HTML que se requiere en cada
aspecto del proyecto.
CSS:
Esta carpeta contiene algunos archivos CSS que agregan efectos y
transiciones a los distintos elementos HTML.

Estructura archivos 4 Carpeta CSS

Anmate.css: Este archivo contiene efectos de transicin para los distintos

elementos HTML. Su uso es bastante sencillo, basta con colocar una clase al
elemento y la transicin se ejecutar cuando el documento est listo.
Hover.css: Este archivo contiene una lista de muchos efectos que se aplican al
pasar el mouse por encima de algn elemento HTML.
Responsive.css: Este archivo se encarga de dar los estilos a los elementos
segn el ancho de la ventana. Lo que hace que la pgina se adapte a los distintos
dispositivos:

tablets,

smartphones,

61

etc.

FONTS
Esta carpeta contiene todas las fuentes utilizadas en el sistema, desde las
ocupadas en el logo, hasta algunas fuentes especiales ocupadas para mostrar
instrumentos musicales. Cabe destacar la presencia de Font-awesome. Esta
fuente permite utilizar diversos iconos y tratarlos como una fuente cualquiera.
Estos iconos se pueden manipular para cambiar su color, tamao, agregar
sombras, etc. Su uso reduce considerablemente el espacio que habra que
utilizar al guardar todos los iconos que se ocupan en la aplicacin.

Estructura archivos 5 Carpeta fonts

62

IMAGES
Esta carpeta contiene las imgenes que se utilizaron dentro de la pgina
web, como el logo, gif de carga, favicon, imgenes de fondo, entre otras.

Estructura archivos 6 Carpeta images

INCLUDES
Incluye algunos archivos php que son incluidos dentro de otros archivos,
entre ellos est el header, el footer y algunos mens.

Estructura archivos 7 Carpeta includes

63

JS
Contiene algunos archivos Javascript que aaden efectos y otras
funcionalidades a la pgina. A continuacin se explicarn algunos de los ms
llamativos e importantes.

Estructura archivos 8 Carpeta js

countries.js: Contiene arrays con todos los pases y sus ciudades respectivas,
estos valores son cargados a un elemento <select> de los formularios
correspondientes.
scrollflow.js: Este archivo contiene distintas animaciones que se aplican en el
momento en que el elemento HTML es visible dentro de la pantalla. Se Utiliz
para simplificar la tarea que no cumple anmate.css por defecto: Las animaciones
cargan instantneamente cuando la pgina ha cargado, por lo que las
animaciones que estn fuera del campo de visin no sern visibles para los
usuarios.

64

simplemodal.js: Crea una ventana modal al dar click en un enlace. Esta ventana
modal se aadi al momento de cambiar la foto de perfil, lo que junto a Ajax, crea
un efecto de continuidad en la pgina.
parallax.js: Parrallax es un efecto aplicado en las pginas web que crea una
ilusin bastante llamativa. Mueve el background de algn contenedor cuando el
usuario hace scroll en la pantalla.
USER
Esta es la carpeta donde se contienen todos los archivos del rea de
usuario. Aqu se encuentran muchas pginas las cules obtienen datos desde
formularios o datos de sesin para enviarlos al archivo users.php dentro de la
carpeta admin para que se produzca la conexin a la base de datos y dar vida al
proyecto.

65

Las 3 subcarpetas contienen: Las

fotos de perfil que los usuarios
cargan al servidor. Los audios
grabados en las postulaciones a
los grupos y algunos archivos JS
que se aplican solamente dentro
del

rea

de

principalmente
utilizados

para

usuario,
archivos

la

subida

transformacin de formato del

audio.

Estructura archivos 9 Carpeta user

addCupo.php: Este archivo contiene el formulario para la creacin de nuevos

cupos dentro de un grupo ya creado. Enva el parmetro numb_cupos que es
la cantidad de cupos nuevos a agregar al archivo typeCupo.php.
addSoundCloudFile.php: Este archivo recibe los parmetros enviados desde el
formulario para agregar un archivo de soundCloud desde la pgina de edicin de
perfil y los enva a la funcin addSound() que se encuentra en el archivo
users.php dentro de la carpeta class. Esta funcin almacena en la base de datos
la URL y el nombre del archivo subido por el usuario y le asigna el id de usuario
correspondiente.
band.php: Este archivo se encarga de mostrar la pgina de perfil de un grupo
determinado. Obtiene el id del grupo desde la URL con el mtodo GET, luego

66

enva este ID a la funcin showBandProfile(), la cual se encarga de mostrar el

contenido del grupo requerido.
buscarGrupo.php: Este archivo acta como la pgina de bsqueda de grupos,
hace un llamado al archivo filtroGrupo.php para mostrar el contenido.
filtroGrupo.php: Este archivo contiene el formulario con los filtros de bsqueda
de

grupo.

Enva

los

datos

introducidos

por

el

usuario

al

archivo

buscarGrupo_exe.php mediante Ajax, Luego imprime todos los resultados en la

pgina buscarGrupo.php
buscarGrupo_exe.php: Obtiene los parmetros enviados por Ajax desde el
archivo filtroGrupo.php, los procesa y hace una consulta a la base de datos con
los filtros seleccionados. Estos resultados son mostrados en un slider creado con
Javascript.
buscarPersona.php: Este archivo acta como la pgina de bsqueda de
personas, hace un llamado al archivo filtroPersona.php para mostrar el
contenido.
filtroPersona.php: Este archivo contiene el formulario con los filtros de
bsqueda de personas. Enva los datos introducidos por el usuario al archivo
buscarPersona_exe.php mediante Ajax, luego imprime todos los resultados en la
pgina buscarPersona.php.
buscarPersona_exe.php: Obtiene los parmetros enviados por Ajax desde el
archivo filtroPersona.php, los procesa y hace una consulta a la base de datos con
los filtros seleccionados. Estos resultados son mostrados en un slider creado con
Javascript.
cambiar_foto_exe.php: Este archivo maneja las condiciones de subida de foto
de perfil de los usuarios. Si no se ha seleccionado ningn archivo arroja un error,
por el contrario si el usuario ha subido un archivo, a este se le verifica la extensin

67

y el tamao. Si todo est bien, se sube la imagen al servidor y se hace referencia

en la base de datos.
crearGrupo.php: Este archivo acta como la pgina principal para la creacin
de grupos. Contiene una restriccin de un mximo de dos grupos creados por
persona y un formulario que contiene tres campos: Nombre del grupo, nmero de
integrantes y estilo musical. Al hacer click en siguiente, se re direcciona a la
pgina crearGrupo_exe.php.
crearGrupo_exe.php: Este archivo recibe los parmetros del archivo
crearGrupo.php y los almacena en variables globales que sern utilizadas
posteriormente.
ingreso.php: Segn el nmero de integrantes ingresado en el formulario del
archivo crearGrupo.php, se crea igual nmero de elementos select de HTML.
Estos elementos tienen la funcin de actuar como los cupos del grupo y en cada
select el usuario deber elegir el rol a desempear.
ingreso_exe.php: Este archivo se encarga de validar los datos de creacin de
grupo, si todo est bien, crea un registro en la tabla banda y tantos registros
como nmero de integrantes tenga el grupo, en la tabla cupos.
dejarGrupo.php: Recibe el valor idCupo desde la URL a travs del mtodo
GET y lo utiliza como parmetro de la funcin dejarGrupo(). Esta funcin ejecuta
una query que cambia el estado del cupo de ocupado a vaco.
deleteGroupProfile.php: Recibe el valor groupName desde la URL a travs
del mtodo GET y lo utiliza como parmetro de la funcin deleteGroup(). Esta
funcin borra el grupo desde la base de datos.
deletePostulation.php: Recibe el valor idPost desde la URL a travs del
mtodo GET y lo utiliza como parmetro de la funcin deletePostulation(). Esta
funcin borra el registro de la tabla solicitud con el id especificado.

68

deleteSoundFile.php: Recibe el valor idFile desde la URL a travs del mtodo

GET y lo utiliza como parmetro de la funcin deleteSound(). Esta funcin borra
el registro de la tabla soundcloud_file con el id especificado.
deleteUser.php: Este archivo se ejecuta cuando el usuario hace click en Eliminar
cuenta desde el men de edicin de perfil. Llama a la funcin deleteUser(), la
cual toma la variable global PHP id_persona y elimina el registro de la tabla
persona correspondiente a ese ID.
editGroupNetworks.php: Este archivo se ejecuta cuando el usuario hace click
en el botn enviar desde el men de edicin de grupo, obtiene la variable ID con
el mtodo GET, y 4 variables con el mtodo POST. Estas variables son las URL
de las redes sociales del grupo. Estos 5 parmetros son enviados a la funcin
modifyGroupNetworks(), la cual crea o modifica un registro de la base de datos.
editGroupProfile.php: Este archivo obtiene el valor groupName por el mtodo
GET y lo enva como parmetro de la funcin editGroupInformation(), esta
funcin despliega la pgina de administracin de grupo, la cual contiene distintos
formularios con los que se puede modificar la informacin del grupo, aadir redes
sociales e incluso borrar el grupo de la base de datos.
editGroupProfile_exe.php: Se ejecuta cuando el usuario hace click en el botn
Enviar del primer formulario de la pgina de edicin de grupo. Obtiene los valores
de 4 campos a travs del mtodo POST y los enva como parmetros de la
funcin updateGroupInfo(), esta funcin actualiza la informacin bsica de los
grupos.
editInfo.php: Este archivo contiene una llamada a la funcin editInfo(), la cual
imprime todos los formularios de edicin de perfil de personas. Desde
informacin bsica, redes sociales, archivos de soundCloud, modificacin de
contrasea y eliminar cuenta.
groupAdminAction.php: Este archivo se ejecuta segn la accin que realice el
lder de grupo con respecto a la administracin de los cupos. Recibe 5 parmetros
69

de la funcin AdminShowBandProfile() y los enva como parmetros de la funcin

groupAdminAction(), esta funcin contiene 5 querys distintas, una para cada
accin: Expulsar, Promover a lder, Eliminar cupo, Dejar cupo y Tomar cupo.
groupFooter.php: Este archivo es similar a footer.php con la diferencia de que
cambian algunas rutas.
groupHeader.php: Similar a header.php. Cambian algunas rutas y se agregan
algunos archivos javascript y css adicionales.
index.php: Este archivo es la pgina principal de los usuarios. Luego de haberse
logueado en la pgina principal son re dirigidos aqu. Contiene una seccin de
noticias y otra de recomendaciones de grupo.
logout.php: Este archivo se activa cuando el usuario hace click en el botn
Salir. Ejecuta la funcin destroy() que est presente en el archivo sessions.php
dentro de la carpeta class. Esta funcin destruye la sesin de usuario.
modifyNetworks.php: Este archivo se encarga de recibir mediante el mtodo
POST algunos parmetros de un formulario presente en la pgina de edicin de
perfil de usuario. Utiliza estos datos en la funcin updateUserNetworks(), la cual
aade o actualiza las redes sociales del usuario y tambin cierta descripcin,
como las influencias musicales, su experiencia y equipamiento.
myGroup.php: Este archivo contiene una serie de mensajes de servidor que se
lanzan segn la accin que el lder de un grupo realice. Recibe desde la URL el
campo groupName y lo utiliza como parmetro en la funcin MyBandProfile(),
esta funcin verifica que el usuario que accede a la pgina es el lder del grupo,
si esto se cumple, imprime en pantalla las opciones de administracin de grupo.
myProfile.php: Este archivo es la pgina de Perfil de los usuarios. Utiliza la
funcin getMyProfile() y le pasa como parmetro la variable global id_persona.
La funcin imprime el perfil de la persona segn el ID introducido.

70

postulacin.php: Este archivo es utilizado cuando un usuario postula a un cupo

de un grupo de forma normal, es decir, sin envo de audio. Utiliza la funcin
createRequest() pasando como parmetros la variable global id_persona y
id_cupo mediante el mtodo GET. La funcin verifica que el usuario no haya
mandado una solicitud anteriormente para ese cupo, si esto se cumple, crea un
registro en la tabla solicitud.
postulacionAudio.php: Este archivo es utilizado cuando un usuario postula a
un cupo de un grupo aadiendo un audio. Utiliza la funcin addAudioPostulation()
para crear un registro de la solicitud y del audio guardado en el servidor.
postulaciones.php: Este archivo se ejecuta cuando el lder del grupo hace click
en el enlace Ver postulaciones en la pgina de administracin de grupo. Utiliza
la funcin showPostulations() enviando como parmetro id_cupo, el cual
obtiene de la URL mediante el mtodo GET. Esta funcin imprime en pantalla
todas las postulaciones que hay para ese cupo e incluye, si es que corresponde,
el audio de postulacin.
postular.php: Este archivo se ejecuta cuando el usuario da click en postular en
alguna vacante de un grupo. Se imprime una pgina con dos opciones: postular
con audio o sin l. Es en este archivo donde se detecta si el navegador del usuario
soporta el API getUserMedia().
processPostulation.php: Este archivo maneja las distintas opciones que el lder
del

grupo

puede

realizar

con

una

postulacin.

Utiliza

la

funcin

PostulationAction(), pasando como parmetros la opcin escogida (Aceptar o

Rechazar), el id del postulante y el id del cupo.
profile.php: Este archivo es el encargado de mostrar las pginas de perfil de los
usuarios. Utiliza la funcin showUserProfile() recibiendo id_persona como
parmetro desde la URL, segn el ID la funcin muestra el contenido del perfil
requerido.

71

Recordmp3.js: Este archivo contiene distintas funciones que se ejecutan cuando

el usuario requiere grabar un audio para la postulacin. Tambin se encarga de
subir el audio grabado al servidor.
sendMailUser.php: Este archivo se encarga de enviar un correo electrnico al
mail de un usuario. Utiliza la funcin sendMailToUser() y utiliza como parmetros
el asunto, el mensaje, el ID del emisor del mensaje y el ID del receptor.
typeCupo.php: Este archivo recibe por el mtodo GET el nombre del grupo y por
el mtodo POST el nmero de cupos. Se ejecuta cuando el usuario quiere
agregar cupos a una banda, desplegando elementos Select de HTML segn la
variable obtenida del formulario anterior. Enva los datos al archivo
typeCupo_exe.php.
typeCupo_exe.php: Recibe los datos del formulario anterior y mediante la
funcin addCupo() crea tantos registros en la tabla cupo como nmero de cupos
se hayan ingresado.
updateInfo.php: Este archivo se ejecuta cuando el usuario modifica su
informacin personal en la pgina de edicin de perfil. Recibe 10 datos mediante
el mtodo POST y los procesa con la funcin updateUserInfo().
updatePass.php: Este archivo se ejecuta cuando el usuario modifica su
contrasea

en

la

pgina

de

edicin

de

perfil.

Utiliza

la

funcin

updateUserPassword() y pasa como parmetros: la nueva contrasea, la

contrasea anterior y la confirmacin de la nueva contrasea.

72

4 Estructura de Archivos

73

5.5.3 Seguridad en PHP

Para garantizar la confidencialidad, integridad y disponibilidad de la

informacin tanto para el lado del usuario, como el lado del desarrollador, se debe
tomar ciertas acciones preventivas contra posibles ataques al sistema. Uno de
los temas ms simples es la complejidad de las contraseas, muchas personas
no toman en cuenta este tema y ponen contraseas que son muy predecibles.
La ingeniera social utiliza estos descuidos para tratar de obtener acceso a
cuentas mediante introduccin de contraseas relacionadas con la informacin
personal de las personas, es por eso, que el primer paso en seguridad de las
cuentas de administrador y acceso al Cpanel es la creacin de contraseas
complejas. Tambin existen otros tipos de ataques que se intentar prevenir
mediante la utilizacin de ciertas funciones, scripts o tcnicas para que los
atacantes no puedan alterar ni tener acceso al cdigo. Una de las principales
reglas que debemos considerar es que nunca se debe confiar en los datos que
obtengamos de los usuarios y adems se debe considerar que ningn sistema
informtico es 100% seguro.
Ataques XXS: Cross-Site Scripting, este tipo de ataques son inyecciones de
cdigo que actan por una mala validacin de los datos, generalmente se hacen
en pginas con formularios. Es por esto que los datos deben sanearse para
asegurarse que slo se guarda lo que interesa. Esto se puede realizar en PHP
utilizando la funcin strip_tags(), la cual retira las etiquetas HTML y PHP de
cualquier String. Al utilizar esta funcin en todos los campos de formulario, se
asegura de sanear toda la informacin que haya sido introducida por los usuarios.
El modo de utilizacin es el siguiente: (cdigo obtenido del cdigo fuente del
proyecto).

Lo que se hizo fue obtener los campos nombre y apellido del formulario de
creacin de cuentas y se aplic la funcin strip_tags para asegurarse de sanear
74

la informacin, luego se utiliz la funcin strtolower() para estandarizar la

informacin y almacenar estos campos en minsculas.
Validar subida de archivos: Se debe validar que todos los archivos que puedan
subirse al servidor tengan extensiones permitidas, con el fin de evitar que los
usuarios suban algn archivo con una extensin que pueda ejecutar algn script
dentro del servidor y as tener acceso a ste, o a cambiar algunas propiedades
del sistema. Dentro del proyecto, el usuario puede cambiar su imagen de perfil,
por lo que se validar que cualquier archivo que sea subido al servidor tenga las
extensiones .jpg, .png, .jpeg o .gif, adems no se permitir la carga de
imgenes que superen cierta cantidad de memoria, ya que no se cuenta con un
almacenamiento

lo

suficientemente

grande

an.

Los archivos de audio que se generarn dentro del sistema se subirn

automticamente al servidor, por lo que (en teora) un atacante no tiene la
posibilidad de cambiar la extensin de estos archivos (su extensin es .mp3) por
otra que pueda ejecutar algn script.
Inyeccin SQL: El primer paso es utilizar libreras actualizadas. Hasta hace poco
se permita el uso de la librera mysql para las aplicaciones realizadas en PHP,
de hecho muchas aplicaciones utilizaban esta librera, hoy en da mysql est
obsoleto, por lo que se debi ocupar otras libreras ms avanzadas y con soporte
como lo son mysqli y PDO.
El siguiente paso que se debi realizar fue escapar o preparar los datos. Esto se
logra con una funcin nativa de mysqli llamada mysqli_real_escape_string() la
cual escapa los caracteres especiales de una cadena de texto para poder usarla
en una sentencia SQL.

75

5.5.4 Grabacin de Audio

La grabacin de audio es una de las caractersticas que diferencia a este

proyecto de otros similares. Para llegar al correcto funcionamiento se requiri de
una investigacin de las distintas alternativas para lograr el objetivo. Finalmente
se decidi utilizar el API navigator.getUserMedia, el cual an no est
estandarizado y por consiguiente, no es compatible con todos los navegadores.
A continuacin se explicar el funcionamiento de esta capacidad del sistema.
Cabe destacar que es una modificacin a un proyecto

del usuario Remus

publicado el 13 de marzo de 2014.

El proceso comienza cuando un usuario desea enviar un audio en su postulacin
al cupo de un grupo. Para poder capturar el audio se necesita utilizar la librera
Recorder.js, esta librera fue creada por Matt Diamond y est bajo la licencia MIT.
La pgina postular.php utiliza este archivo detectando si el navegador actual
soporta el API, si lo hace, imprime los botones de inicio de grabacin, de lo
contrario muestra un mensaje de error y no muestra los botones necesarios.
Cuando el usuario hace click en el botn Grabar, se ejecuta la funcin
startRecording(), esta funcin inicia un contador, el cual se detendr a los 30
segundos o cuando el usuario haga click en el botn stop.

76

El botn stop ejecuta la funcin stopRecording(), la cual llama a la funcin

createDownloadLink(). Esta ltima funcin crea un archivo de audio de formato
.wav; este formato tiene un tamao demasiado grande. La mejor solucin es
convertir el archivo a un formato .mp3. Esto se logra con la utilizacin de otra
librera Javascript llamada libmp3lame.js

Finalmente, Se ha creado una funcin con Jquery que ejecuta la funcin

uploadAudio() al hacer click en Enviar, una vez que el audio ha sido grabado. A
travs de Ajax se cre una funcin que sube el archivo al servidor de forma
asncrona a travs del archivo upload.php.

77

Captulo 6: Discusin de los resultados

6.1 Funcionalidades Versin beta

Para poder mostrar las funcionalidades ms importantes del sistema se

han creado un par de cuentas de prueba y algunos grupos. Para justificar el
funcionamiento de las funcionalidades se mostrarn los resultados visuales y los
correspondientes registros en la base de datos. Las funcionalidades que se
sometern a prueba son las siguientes:

Crear grupo

Enviar postulacin

Enviar postulacin con audio

Ver postulaciones

Aceptar y rechazar postulacin

Expulsar miembro

Promover a Lder

6.2 Resultados

Crear grupo: El proceso para crear grupo consta de los siguientes pasos:
1. Asignar nombre del grupo
2. Escoger nmero de integrantes
3. Escoger estilo musical
4. Asignar instrumento para cada cupo
5. Seleccionar cupo a utilizar
El sistema adems de crear el grupo, debe crear inmediatamente los cupos
pertenecientes a ese grupo. Los datos de prueba ingresados son los siguientes:

78

Resultados 1: Creacin de grupo

Los resultados esperados son: Insercin en la tabla grupo del grupo llamado
grupo de prueba. Insercin de 2 nuevos registros en la tabla cupo. Y adems
de forma visual, el grupo creado debiera aparecer en la pgina de perfil.

Resultados 2: Insercin de grupo en la base de datos

Se puede ver que el grupo grupo de prueba Se ha creado en la base de datos

con el id 25, adems el lder del grupo tiene el id 11. Si se observa la tabla cupo,
sta debiera tener dos nuevos registros, donde el campo cupo_id_grupo debiera
tener el id del grupo recientemente creado, es decir, 25 y ser cupos para
guitarrista y pianista respectivamente. Adems, el cupo de guitarrista debe estar
ocupado por el lder del grupo, ya que fue la opcin que este escogi.

Resultados 3: Insercin de cupos en la base de datos

Se puede corroborar que los dos cupos han sido creados con los id 59 y 60
correspondientemente. Estos cupos pertenecen al grupo de id 25 y el cupo de
guitarrista est ocupado por la persona de id 11, que es efectivamente, el lder
del grupo de id 25. Al revisar el perfil, el grupo tambin ha sido aadido
visualmente.
79

Resultados 4: Reconocimiento de grupo creado

Enviar postulacin: Para poder comprobar los resultados de esta postulacin,

se utilizar otra cuenta para poder visualizar el grupo creado. A primera vista se
puede observar que el grupo existe y est dentro de las recomendaciones que
da el sistema.

Resultados 5: Recomendaciones del sistema

Si se hace click en cualquiera de los cuadros, se re-direccionar a la ventana de

perfil del grupo correspondiente, ms abajo en esta misma pgina se puede
encontrar la seccin de integrantes.

80

Resultados 6: Integrantes de grupo

Aqu se puede visualizar que el cupo de guitarrista ya est siendo ocupado

por el lder del grupo, y el otro cupo que se haba creado est vaco, por lo que
la opcin de postular est disponible. Si se hace clic en el boton Postular, se re
dirigir a la ventana de postulacin. Las pruebas actuales son para postulacin
sin audio, por lo que se seleccionar el botn de la derecha.

Resultados 7: Men de postulacin

Una vez se hace clic, el sistema avisar que se ha enviado la solicitud.

81

Resultados 8: Mensaje de postulacipon exitosa

Si se observa la ilustracin nmero 3, se puede ver que el cupo para

pianista tiene el id 60. Ahora se debe confirmar los resultados en la tabla
solicitud, la imagen 9 muestra que efectivamente se ha creado la solicitud para
unirse al grupo que tiene el cupo de id 60.

Resultados 9: Insercin de solicitud en la base de datos

El id de la solicitud es el 24, mientras que el id de la cuenta con la que se

ingres es el 13 y el estado es pendiente, luego se ver cmo este estado cambia
cuando se acepta o rechaza la solicitud.

Enviar postulacin con audio

Para comprobar esta funcionalidad se seguirn los mismos pasos
anteriores, con la diferencia que en este caso se postular con la grabacin de
un audio. Al hacer clic en Postular (ilustracin 6) el sistema re direccionar al
men de postulaciones y el navegador pedir permiso para utilizar el micrfono
del dispositivo que se est utilizando. Si se acepta, en la seccin de Log
aparecer el siguiente mensaje:

82

Resultados 10: Navigator.getUserMedia compatible con navegador

Una vez se ha detectado la compatibilidad del navegador con el API

getUserMedia, aparecer el botn Grabar y el sistema comenzar a grabar con
un cronmetro que se detendr al llegar al segundo 30, que es el lmite de tiempo
que se ha establecido para las grabaciones. La grabacin puede detenerse antes
de los 30 segundos haciendo clic en el botn Parar. Cuando se detenga la
grabacin, el sistema comenzar a convertir el audio capturado a formato .mp3 y
lo mostrar en pantalla para que el usuario pueda escucharlo y enviar la
postulacin si es de su gusto, o volver a grabar otro audio.

Resultados 11: Grabacin de audio

Si el usuario da click en Enviar, se debe esperar lo siguiente:

83

La postulacin se ha guardado en la base de datos.

El archivo de audio se ha almacenado en el servidor.

La grabacin se ha almacenado en la base de datos.

Se revisar por parte, primero se debe recordar que el cupo al que se est
enviando una postulacin es el de id 60 y que el perfil actual tiene el id 13.

Resultados 12: Postulacin en la base de datos

Si se observa la base de datos, se puede observar que la solicitud ha sido

creada satisfactoriamente con el id 25. Cabe destacar que se debi eliminar la
solicitud anterior, ya que el sistema detecta si el usuario ya ha enviado una
solicitud a esa vacante. Lo siguiente que se debe comprobar es si el archivo de
audio se ha almacenado en la base de datos, para ello se debe acceder al
servidor va ftp y dirigirse a la carpeta recordings.

Resultados 13: Archivo de audio almacenado en el servidor

Se puede visualizar que la postulacin en audio ha sido almacenada con

formato mp3 en el servidor. El ltimo paso que queda por comprobar es ver la
tabla audio para confirmar si el registro fue exitoso.

84

Resultados 14: Audio almacenado en la base de datos

Se puede comprobar que el audio se guard con la id nmero 3, hace

referencia a la solicitud con id 25 y a la persona con id 13, adems el campo
archivo coincide con el archivo que se ha guardado en el servidor.
Ahora, la postulacin podr ser visualizada desde el perfil del usuario.

Resultados 15: Postulaciones

Ver Postulaciones
Para comprobar esta funcionalidad, se debe volver al perfil anterior, con el
cual se cre el grupo y se debe acceder a la pgina de administracin de ste.

85

Resultados 16: Pgina de administracin de grupo

Se puede observar que en la vacante de pianista, en la seccin de

postulaciones aparece un enlace ver postulaciones, si se accede en l se re
dirigir a la pestaa de postulaciones, donde aparecern todas las postulaciones
que se hayan enviado para este cupo. Por ahora slo debiera aparecer la
postulacin con audio que se envi en el paso anterior.

Resultados 17: Postulacin con audio

86

Se puede observar que la postulacin se visualiza correctamente y

conjuntamente con l, aparece el archivo de audio, por lo que el lder del grupo
ahora se le har mucho ms sencillo el elegir entre varios postulantes.
Aceptar y rechazar postulacin
Si se observa la ilustracin 12, se sabe que el estado de la solicitud es
pendiente. Si el lder del grupo entra en la seccin de administracin del grupo y
hace click Rechazar en la ilustracin anterior (17), el estado debiera cambiar a
rechazado.

Resultados 18: Postulacin rechazada

Ahora en la ventana de administracin de grupos, no aparecer ninguna

postulacin en la vacante de pianista.

Resultados 19: Grupo sin postulaciones

Para poder aceptar una solicitud se enviar una nueva postulacin a la

vacante. En este caso si se acepta la solicitud, se esperar lo siguiente:

El estado de la solicitud en la base de datos cambia a aceptado.

Resultados 20: Postulacin aceptada

87

El usuario aceptado ahora pertenecer al grupo y saldr como integrante

Resultados 21: Solicitud aceptada ahora es integrante del grupo

Aparecern nuevas opciones de administracin.

Resultados 22: Gestin del grupo

Expulsar miembro
A continuacin se realizar la prueba de expulsin para el siguiente caso:
La persona de id 9 est ocupando el cupo de id 47 del grupo de id 19.

Resultados 23: Situacin inicial de prueba

Si el lder del grupo va hacia el men de administracin de su grupo tendr

3 opciones, entre ellas, expulsar al usuario.
88

Resultados 24: Administracin del grupo, Expulsar integrante

Una vez pulsado el botn, el sistema arrojar un mensaje de expulsin

exitosa. En la base de datos se espera que el cupo de id 47 cambie su estado a
vaco y el cupo_id_persona a NULL:

Resultados 25: Cupo vaco

Finalmente, si se observa nuevamente la pgina de administracin del

grupo, se confirma que el cupo se encuentra vaco.

Resultados 26: integrante expulsado

Promover a Lder
Cuando un usuario es lder de un grupo, tiene la opcin de poder
administrar este grupo, esto es: Cambiar la informacin, agregar cupos, aceptar
postulaciones. Sin embargo un usuario slo puede ser lder de 2 grupos
simultneamente. Si por algn motivo desea crear un nuevo grupo tiene dos
opciones: la primera es eliminar el grupo. Con esto el grupo se elimina de la base
89

de datos y sus integrantes quedan sin grupo. La segunda opcin es promover a

alguno de los integrantes a lder. Con esto el nuevo lder tendr la opcin de
administrar el grupo y el antiguo lder podr crear un nuevo grupo.

Resultados 27: Situacin inicial: lider 10 del grupo 19

En la imagen 27 se puede observar que el grupo de id 19 es liderado por

el usuario de id 10. Si el lder del grupo promueve a otro usuario a lder, el campo
lder_grupo cambiara al id del nuevo lder.

Resultados 28: Administracin de grupo, Promover a lder

Resultados 29: lder de grupo nuevo

Se observa que el lder de grupo ha cambiado, por lo tanto, el antiguo lder

(de id 10) ya no debiera tener grupos en los que l es lder:

90

Resultados 30: Usuario sin grupos en que es lder

Adems, ahora el usuario de id 9 podr administrar el grupo y acceder a

todas las opciones adquiridas por ser lder.

Resultados 31: Nuevo lder adquiere privilegios

91

6.3 Fortalezas

De acuerdo a los resultados obtenidos en el punto anterior se pueden

extraer las principales fortalezas con que cuenta el sistema. Estas fortalezas
estn basadas en la experiencia de la realizacin de pruebas al sistema para
probar su funcionamiento. Entre las principales caractersticas que destacan del
sistema estn: Primero, la sencillez de la interfaz. El sistema cuenta con un
diseo amigable al usuario y fcil de entender, lo que permite que el usuario no
deje de utilizar el sistema debido a su complejidad, sin embargo se han
incorporado algunos mensajes de informacin en varias pantallas del sistema los
cules entregan informacin sobre el funcionamiento o los valores esperados
para un campo de cierto formulario; estos mensajes de informacin tienen la
finalidad de facilitar an ms la visita del usuario a travs de la pgina haciendo
que su experiencia de usuario sea lo ms grata posible. Otra fortaleza del sistema
es la facilidad y rapidez que con se puede obtener resultados de bsqueda. Si se
compara el tiempo utilizado por un usuario para encontrar un integrante por los
distintos foros de internet con el tiempo utilizado en encontrarlo haciendo uso de
Arma tu grupo musical, la diferencia es notoria. Se realiz una prueba de
bsqueda en google con parmetros de perfil aleatorios, luego de entre 5 a 10
minutos de bsqueda se lleg a un posible integrante. Lamentablemente el
anuncio era del ao 2010. Si se realiza la misma bsqueda en este proyecto, este
mostrar todos los perfiles que coinciden con los parmetros de bsqueda en
menos de 10 segundos.
6.4 Debilidades

Las principales debilidades con que cuenta el sistema Arma tu grupo

musical son:

Almacenamiento limitado para las postulaciones con audio: De momento

se contrat un hosting con 1 GB de almacenamiento, si bien los archivos
de audio estn optimizados y convertidos en formato mp3 para as reducir
su tamao, llegar un punto en que el sistema tendr muchos usuarios,
nuevos grupos, cupos y solicitudes. Junto con las solicitudes se crearn
92

nuevos archivos de audio y el almacenamiento del sistema se ir

reduciendo progresivamente. Sin embargo al ser una versin de prueba el
almacenamiento es suficiente. Se espera llegar a una cantidad de 500
usuarios al mes de marzo. Se sabe que cada usuario puede tener 5
postulaciones simultneas, si se da el caso de que cada una de las
postulaciones tienen asociado un audio, se estara hablando de 2500
postulaciones, es decir, 2500 archivos de audio. Cada archivo de audio
tiene un peso aproximado de 120 kilobytes si se graban los 30 segundos
mximos permitidos. Es decir, en el peor (o mejor) de los casos se estaran
ocupando 300000 kilobytes, o 0,3 Gigabytes en los audios.

Incompatibilidad del API de grabacin con todos los navegadores:

getUserMedia es una tecnologa relativamente nueva y an no
estandarizada, por este motivo es que no todos los navegadores soportan
la grabacin de audio, el tema ms sensible es la incompatibilidad con los
navegadores mviles, La incompatibilidad del API no se ha notado hasta
el momento, ya que lamentablemente an no se ha podido probar el
sistema completamente, debido a que no existen postulaciones a ningn
grupo ,y por consiguiente, ningn audio grabado. Sin embargo, como lo
muestra la siguiente tabla obtenida desde Google Analytics, se puede
observar que de todas las sesiones, el 73,63% se hace a travs del
navegador Google Chrome, el 8,96% a travs de Firefox y el 1,49% a
travs de Opera. Esto hace que del total de sesiones, el 84.08% se hacen

93

travs de un navegador compatible con el API getUserMedia.

Gran cantidad de parmetros necesarios para la creacin de cuenta: La

tendencia de los clientes hoy en da es la creacin de cuentas lo ms
rpido posible para cualquier tipo de sistema. Para que Arma Tu grupo
musical funcione bien, se necesita que cada perfil tenga un mnimo de
parmetros definidos, esta cantidad de parmetros puede que sea tediosa
de rellenar por parte de los usuarios, lo que podra generar la prdida de
nuevos usuarios. De acuerdo a datos obtenidos de Google Analytics, el
58.71% de las visitas a la pgina son rebotes, es decir, usuarios que
cierran la pgina sin visitar otras pginas dentro de la misma aplicacin.

Verificacin de cuenta: Actualmente el 26% del total de cuentas creadas

no ha sido activada. Este problema se poda prever con facilidad debido a
que los usuarios buscan el mximo de comodidad y rapidez a la hora de
crearse una cuenta.

94

Captulo 7: Conclusiones y Sugerencias

Se ha podido lograr el cumplimiento de los objetivos especficos del
proyecto y por consiguiente, la realizacin del objetivo principal, si se considera
el objetivo general: ayudar a msicos amateurs a formar sus grupos musicales
de una forma rpida y sencilla, proporcionando herramientas para la bsqueda
precisa de personas con el perfil requerido por el grupo, la parte de creacin de
grupo musical se ha logrado satisfactoriamente, el proceso de creacin no
debera durar ms de 2 minutos, sin embargo hay algunos pasos que pueden no
ser muy intuitivos para el usuario, es por esto que se han introducido mensajes
de informacin en algunas pginas. Se proporcionaron las herramientas de
bsqueda, especficamente las bsquedas de personas y de grupos, ambas
bsquedas cuentan con un conjunto de filtros que permiten a los usuarios realizar
bsquedas muy especficas y con gran rapidez. Al mismo tiempo se logra
satisfacer que los grupos tengan integrantes con el perfil requerido, ya que es el
lder del grupo, quien a travs de un proceso de seleccin arbitraria mediante la
visita de perfil o reproduccin del audio de la postulacin, el que acepta los
integrantes para cada cupo.
El desarrollo a medida fue una buena decisin por sobre otras
alternativas como algunos frameworks de PHP. Esto permiti tener un mejor
control sobre los cambios y modificaciones que se debieron ir haciendo durante
el desarrollo, tanto en la base de datos como en el cdigo. Sin embargo la
utilizacin de un framework hubiese sido una buena alternativa, ya que trae
consigo pre-configurado muchas funcionalidades que se debi programar desde
cero en el desarrollo a medida, las cules hubiesen ahorrado tiempo de
codificacin.
El sistema fue realizado para ayudar a muchos msicos amateurs a formar su
grupo musical, y son los msicos precisamente quienes dan vida y validan este
proyecto. Al no haber contado con un cliente directo no se puede saber si se ha
95

cumplido con todos los requerimientos que los usuarios finales esperaran de un
proyecto de estas caractersticas, es debido a estas circunstancias que para la
segunda iteracin del proyecto se tomar en cuenta la retroalimentacin que se
reciba a travs del mail de contacto o de las redes sociales para mejorar el
sistema. Los objetivos para la segunda iteracin estn relacionados directamente
con la resolucin de las debilidades encontradas en este proyecto. Las tareas a
realizar para esta segunda iteracin son:

Login a travs de la cuenta de Facebook.

Sistema de amigos y envo de mensajes privados.

Visualizacin de perfiles sin necesidad de crear cuenta.

Adicin de un foro para publicar ofertas.

Modificaciones obtenidas a travs de la retroalimentacin.

96

Referencias y bibliografa

Referencias
Bidelman,

E.

(22

de

Febrero

de

2012).

html5rocks.

Obtenido

de

http://www.html5rocks.com/en/tutorials/getusermedia/intro/
Bloch,

M.

(Octubre

de

2012).

mckinsey.

Obtenido

de

http://www.mckinsey.com/business-functions/business-technology/ourinsights/delivering-large-scale-it-projects-on-time-on-budget-and-on-value
Gorrn, A. H. (19 de Noviembre de 2011). economiatic.com. Obtenido de
http://www.economiatic.com/flash-es-un-formato-obsoleto-en-la-web-2-0/
Gulla,

J.

(Febrero

de

2012).

ibmsystemsmag.

Obtenido

de

http://www.ibmsystemsmag.com/power/Systems-Management/WorkloadManagement/project_pitfalls/
McManus,

J.

(2007).

ims-productivity.

Obtenido

de

http://www.ims-

productivity.com/user/custom/journal/2007/autumn/IMSaut07pg38-43.pdf
Mozilla Developers. (10 de Febrero de 2015). developer.mozilla. Obtenido de
https://developer.mozilla.org/es/docs/Web/API/Navigator/getUserMedia
Popa,

B.

(3

de

Julio

de

2015).

softpedia.

Obtenido

de

http://news.softpedia.com/news/microsoft-moves-to-kill-silverlight-tellseveryone-to-stop-using-it-485970.shtml
santamaria, f. (18 de Agosto de 2006). fernandosantamaria. Obtenido de
http://fernandosantamaria.com/blog/2006/08/elgg-software-para-redessociales-en-educacion/

97

Tan,

S.

(27

de

Enero

de

2011).

https://www.gartner.com/doc/1531025
70.shtml

98

gartner.

Obtenido

de

Anexos
Anexo 1: Casos de Uso

CU01

Registrarse

Versin

1.0 18 Noviembre 2015

Autores

Francisco Gacita

Objetivos
asociados

CU03
Dentro de la pgina habr una seccin donde cualquier

Descripcin

usuario podr crear su cuenta para acceder a las

funcionalidades de la aplicacin.

Precondicin
Secuencia
Normal

El usuario debe haber ingresado a la pgina web y haber

hecho clic en el hiper vnculo crear cuenta
Paso Accin
1 El usuario ingresa al sistema
2 El usuario va a la seccin de crear cuenta
3 El sistema despliega el formulario
4 El usuario rellena los campos y enva los datos
Si los datos se ingresan correctamente
5 a. Se registra el usuario
b. Si no se valida, ir al paso 1
El sistema agrega el nuevo usuario a la base de datos

Postcondicin

Frecuencia
esperada
Importancia
Urgencia

Frecuencia alta
Importante
Necesaria, la gran parte de las funcionalidades del sistema
se realizan a cabo cuando el usuario est registrado

99

Comentarios

En la segunda iteracin del proyecto se implementar acceso

con la cuenta de Facebook

CU02

Iniciar sesin

Versin

1.0 18 Noviembre 2015

Autores

Francisco Gacita

Objetivos
asociados

CU03
En la pantalla principal de la pgina web estar el formulario

Descripcin

de acceso para que los usuarios puedan hacer uso de las

funcionalidades del proyecto.

Precondicin

El usuario debe haberse registrado previamente.

Secuencia

Paso

Normal

Accin
1 El usuario ingresa al sistema
2 El usuario ingresa sus credenciales en el formulario
3 El sistema valida las credenciales

Postcondicin
Frecuencia
esperada
Importancia

El usuario inicia sesin y es dirigido a la pgina principal de

la aplicacin.
Frecuencia alta
Importante

100

Necesaria, la gran parte de las funcionalidades del sistema

Urgencia

se realizan a cabo cuando el usuario est registrado e inicia

sesin

Comentarios

CU03

Validar usuario

Versin

1.0 18 Noviembre 2015

Autores

Francisco Gacita

Objetivos
asociados

CU04, CU05
El sistema debe comparar los datos ingresados por el usuario

Descripcin

con los registrados en la base de datos y asegurarse que

cumplan las validaciones correspondientes

Precondicin

El usuario ingres informacin en algn formulario de registro

o inicio de sesin.
Paso

Accin
Si se valida el registro
1

2
Secuencia

comprueba que todos los campos

estn correctos
Se registran los datos en la base de
datos
2.1.2. Se redirecciona al usuario a la
pgina principal
2.1.3. El sistema arroja un mensaje
de "cuenta creada"

Si se valida el inicio de sesin

5 se comprueba usuario y contrasea
6 se realiza el inicio de sesin

101

Postcondicin Los datos validados son procesados

Frecuencia
esperada
Importancia
Urgencia

Comentarios

Frecuencia alta
Importante
Necesaria, si no se validan los datos no se hara un correcto
inicio de sesin y los datos no estaran estandarizados
El loguin podr realizarse tanto con nombre de usuario como
con el correo de registro.

CU04

Invalidar usuario

Versin

1.0 18 Noviembre 2015

Autores

Francisco Gacita

Objetivos
asociados

CU03
Los datos ingresados en los formularios no cumplen las

Descripcin

validaciones correspondientes o no son consistentes con la

base de datos.

Precondicin

El usuario envi datos en un formulario.

Paso

Accin
Si se invalida el registro

1 Mensaje de advertencia de campo erroneo

Secuencia

2 Se muestra el mismo formulario

Si se invalida el inicio de sesin
3 Se niega el inicio de sesin
4 mensaje de "usuario o contrasea invlido"

102

Postcondicin Se vuelve al estado inicial

Frecuencia
esperada
Importancia
Urgencia

Frecuencia alta
Importante
Necesaria, cuando los datos estn incorrectos hay que
gestionarlos

Comentarios

CU05

Registrar

Versin

1.0 18 Noviembre 2015

Autores

Francisco Gacita

Objetivos
asociados
Descripcin

Precondicin

CU03
Si los datos en un formulario son correctos, se procede a
registrarlos en la base de datos
El usuario envi datos en un formulario y stos fueron
validados
Paso

Secuencia

Postcondicin
Frecuencia
esperada
Importancia
Urgencia

Accin
1

Una query se encarga de guardar los datos en la

base de datos

Los datos quedan guardados y estandarizados en la base de

datos
Frecuencia alta
Importante
Necesaria, Si los datos no quedan almacenados en la base
de datos, las sesiones seran imposibles

103

Comentarios

CU12

Registrar grupo

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Descripcin

Precondicin

CU11
El grupo creado debe registrarse en la base de datos para que
pueda ser buscado por los dems usuarios.
El usuario debe haber enviado el formulario de creacin de
grupo y ste debe haber sido validado
Paso

Accin
1 El sistema genera una conexin con la base de datos.

Secuencia

El sistema ingresa los datos correspondientes a la

tabla "grupos".

3 Se redirecciona al usuario a la pantalla principal

3.a

Se imprime un mensaje "su grupo ha sido creado

satisfactoriamente"

Postcondicin
Frecuencia
esperada

Frecuencia media

Importancia
Urgencia

Importante
Necesaria. Los grupos deben quedar registrados en la base
de datos para poder ser accedidos.

Comentarios

104

CU13

Buscar grupo

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados

CU14
El usuario podr buscar las bandas que estn creadas

Descripcin

mediante filtros de bsqueda para hacer el proceso ms

simple

Precondicin

El usuario debe estar registrado y logueado en el sistema

Secuencia

Paso

Normal

Accin
1 El usuario se dirige a la opcin de bsqueda
2

el sistema despliega un cuadro de bsqueda y los

filtros posibles
Se realiza la bsqueda en la base de datos segn los
filtros seleccionados

4 Se despliegan los resultados

Postcondicin
Frecuencia
esperada

El usuario puede entrar a ver el perfil de la banda y postular

a sta
Frecuencia alta

Importancia

Importante
Necesaria, sin una bsqueda de las bandas, nadie podr

Urgencia

acceder a la opcin de postular a la banda, por lo que el ciclo

no se cumplira y ninguna banda llegara a formarse

Comentarios

La bsqueda por defecto (sin seleccionar ningn filtro)

desplegar todas las bandas creadas.

105

CU14

Postular a grupo

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Descripcin

Precondicin

CU13
El usuario puede mandar una postulacin a alguna banda que
coincida con sus preferencias.
El usuario debe estar registrado y logueado en el sistema y
tiene que acceder al perfil del grupo luego de haberlo buscado.
Paso

Accin
1 El usuario entra al perfil de la banda

Secuencia
2

Normal

Postcondicin
Frecuencia
esperada
Importancia
Urgencia

Comentarios

El sistema despliega la informacin de la banda y un

botn de postulacin
El sistema despliega un aviso de que la postulacin
ha sido enviada

Una notificacin es enviada el lder de la banda y se crea un

aviso de postulacin en el perfil del usuario.
Frecuencia alta
Alta
Necesaria, si no hay postulaciones a las vacantes de una
banda, la banda no se podr registrar como creada.
Un usuario puede tener un mximo de 5 postulaciones
simultneas.

106

CU16

Editar perfil

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados

CU17, CU18
Todos los usuarios tienen acceso a modificar la informacin de

Descripcin

su perfil, como el nombre, los instrumentos que utiliza, los

gustos musicales, descripcin, etc.

Precondicin

El usuario accede a la pestaa "Mi perfil" y luego hace clic en

el botn editar.
Paso

Accin
1

Secuencia
2

El sistema imprime el formulario con la informacin de

la cuenta
El usuario puede modificar cualquiera de estos
campos

3 El usuario debe hacer clic en modificar

Postcondicin

El sistema modifica los campos en la base de datos.

Frecuencia

Frecuencia media

esperada
Importancia

baja importancia

Urgencia

Puede esperar.

Comentarios

CU19

Abandonar grupo

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
107

Descripcin
Precondicin

Un usuario que ha sido aceptado en una banda puede

abandonarla en cualquier momento
El usuario debe pertenecer a una banda
Paso

Accin
1 El usuario ingresa a su perfil
El sistema despliega la informacin de perfil, entre
2 ellas los grupos a los que pertenece con un enlace
hacia el perfil del grupo.
3 El usuario ingresa al perfil del grupo.

Secuencia
Normal

Se despliega la informacin del grupo y un botn

para abandonar el cupo.
Si hace clic en el botn
a. Aparecer una advertencia de abandono de

grupo
b. El usuario acepta
c. Se elimina al usuario del grupo

Postcondicin
Frecuencia
esperada
Importancia
Urgencia

El usuario es eliminado del grupo y su vacante queda

disponible.
Frecuencia media
Alta
Necesaria, el usuario debe ser libre de poder elegir cundo
abandonar la banda

Comentarios

108

CU22

Aceptar Solicitud

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Descripcin

Precondicin

Un lder de grupo tendr distintas opciones para administra su

banda, entre ellas el caso de uso actual
El usuario debe haber creado una banda y otro usuario debe
haber mandado una solicitud para una vacante
Paso Accin
1 Llega una notificacin.

Secuencia
2 El usuario ingresa a la administracin de la banda

Normal

3 Se despliegan los roles de la banda y las solicitudes

4 El lder acepta una solicitud
Postcondicin
Frecuencia
esperada
Importancia
Urgencia

Comentarios

El usuario que envi la solicitud ahora pertenece a la banda

Frecuencia alta
Alta
Necesaria, Aceptar las solicitudes es indispensable para
formar la banda
Cuando hay ms de una postulacin a una vacante y el lder
acepta una, las dems postulaciones desaparecern.

109

CU23

Rechazar Solicitud

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Un lder de grupo tendr distintas opciones para administra su
Descripcin

banda, entre ellas el caso de uso actual: rechazar una solicitud

de postulante

Precondicin

El usuario debe haber creado una banda y otro usuario debe

haber mandado una solicitud para una vacante
Paso Accin
1 Llega una notificacin.
2 El usuario ingresa a la administracin de la banda

Secuencia
Normal

3 Se despliegan los roles de la banda y las solicitudes

4 El lder rechaza la solicitud

Postcondicin
Frecuencia
esperada
Importancia

El usuario que envi la solicitud recibir una notificacin de

rechazo
Frecuencia media
Baja
Baja, Si hay solicitudes que al lider de la banda no le interesan

Urgencia

puede ignorarlas, dado que cuando acepte una solicitud para

se

rol,

las

dems

automticamente
Comentarios

110

solicitudes

desaparecern

CU24

Eliminar miembro

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Un lder de grupo tendr distintas opciones para administra su
Descripcin

banda, entre ellas el caso de uso actual: eliminar un miembro

de la banda

Precondicin

El usuario debe haber creado una banda y haber aceptado la

solicitud para un rol de su banda
Paso

Accin
1 El lder entra a la administracin del grupo
2

En los integrante del grupo aparecer la opcin de

eliminarlo

Secuencia
Si se aprieta el boton de eliminacin

Normal
3

a. Se elimina al integrante de la banda

b. Se enva una notificacin al ahora ex integrante
de la banda

Postcondicin La vacante queda abierta y puede recibir nuevas postulaciones

Frecuencia
esperada
Importancia

Frecuencia media
Alta

111

Urgencia

Necesaria, si un miembro no participa activamente, el lider

querr sustituirlo

Comentarios

CU26

Registrar grupo

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Un lder de grupo tendr distintas opciones para administra su
Descripcin

banda, entre ellas el caso de uso actual: registrar la banda

como formada

Precondicin

El usuario debe haber creado una banda y haber aceptado

todas las vacantes de su grupo
Paso

Accin
1 El lder entra a la administracin de banda

Secuencia
2

Normal

El sistema verifica que todas las vacantes estn

ocupadas

3 El sistema despliega un botn para registrar la banda

Postcondicin
Frecuencia
esperada
Importancia

Urgencia

La banda pasa a un estado de creada y ahora aparecer como

destacada en la pgina web
Frecuencia alta
media
media, quiz a los usuarios no les importe aparecer en la
pgina web y slo les baste con encontrar gente para la banda.

112

Comentarios

CU27

Eliminar grupo

Versin

1.0 19 de junio de 2015

Autores

Francisco Gacita

Objetivos
asociados
Descripcin

Precondicin

Un lder de banda tendr distintas opciones para administra su

banda, entre ellas el caso de uso actual: elimnar la banda
El usuario debe haber creado una banda.
Paso

Accin
1 El lider entra a la administracin de banda

Secuencia
2

Normal

El

sistema

despliega

las

opciones

de

administracin

3 El lider elimina la banda

Postcondicin
Frecuencia
esperada
Importancia

Urgencia

Se elimina la banda y los integrantes que tena pasan a estar

sin banda y pueden enviar nuevas solicitudes
Frecuencia alta
alta
Necesaria, el usuario puede querer formar otra banda, por lo
que se hace necesaria la eliminacin de la actual.

113

Comentarios

Los lderes de banda podrn enviar solicitudes a otras bandas.

114

Anexo 2: Vistas del Sistema

Vista 1: Pgina principal

Vista 2: Error de conexin

Vista 3: Creacin de cuenta

115

Vista 4: Pgina principal de usuario

Vista 5: perfil de usuario

116

Vista 6: Cambio de imagen de perfil

117

Vista 7: Edicin de perfil

118

Vista 8: Perfil modificado

119

Vista 9: Creacin de grupo

Vista 10: Vacantes del grupo

120

Vista 11: Reconocimiento de grupo creado

Vista 12: Perfil de grupo

121

Vista 13: Bsqueda de grupo

Vista 14: Bsqueda de persona

122

Vista 15: Integrantes del grupo

Vista 16: Postulacin a cupo

123

Vista 17: Permiso para utilizar micrfono

124