desarrollo de un sitio web para la gestiÓn de un...

Escu

ela

Polit

écnic

a S

upe

rio

r d

e J

aé

n

UNIVERSIDAD DE JAÉN

Escuela politécnica superior de Jaén

Trabajo Fin de Grado

DESARROLLO DE UN SITIO

WEB PARA LA GESTIÓN DE UN

LABORATORIO DE

INVESTIGACIÓN

Alumno: Esteban Castro Sola

Tutor: Dr. D. Juan Ruiz de Miras Dpto: Informática

Septiembre, 2016

Desarrollo de un sitio Web para la gestión de Esteban Castro Sola

un laboratorio de investigación

2



3

1. Introducción ....................................................................................................................... 9

1.1. Motivación ................................................................................................................... 9

1.2. Descripción del problema .............................................................................................10

1.3. Objetivos del proyecto .................................................................................................11

1.4. Restricciones técnicas y de rendimiento ........................................................................11

1.5. Descripción del sistema actual ......................................................................................12

1.6. Metodología .................................................................................................................12

1.7. Resultados a esperar ....................................................................................................13

1.8. Estructura del proyecto ................................................................................................14

2. Requisitos de software ........................................................................................................17

2.1. Especificación de requerimientos ..................................................................................17

2.1.1. Requisitos funcionales ............................................................................................17

2.1.2. Requisitos no funcionales .......................................................................................20

2.1.2.1. Rendimiento .....................................................................................................20

2.1.2.2. Seguridad .........................................................................................................20

2.1.2.3. Usabilidad ........................................................................................................20

2.1.2.4. Escalabilidad ....................................................................................................21

2.1.2.5. Facilidad para las pruebas ..................................................................................21

2.1.2.6. Mantenibilidad..................................................................................................21

2.1.2.7. Validación de la información ..............................................................................22

2.2. Perfiles de usuarios ......................................................................................................22

2.3. Estudio de posibles soluciones ......................................................................................24

2.3.1. CMS .....................................................................................................................24

2.3.1.1. Wordpress [4] .................................................................................................24

2.3.1.2. Joomla [5] .......................................................................................................25

2.3.1.3. Drupal [6] .......................................................................................................25

2.3.1.4. En resumen, los CMS: .....................................................................................26

2.3.2. Frameworks ..........................................................................................................27

2.3.2.1. ASP.NET MVC [7]: .........................................................................................27

2.3.2.2. Codeigniter [8]: ...............................................................................................28

2.3.2.3. Symfony [9]: ....................................................................................................28

2.3.2.4. Silex [10]: ........................................................................................................29



4

2.3.2.5. En resumen, los frameworks: ...........................................................................29

2.4. Casos de uso del proyecto. ............................................................................................30

2.4.1. Caso de uso: Iniciar sesión. ....................................................................................31

4.2.2. Crear miembro del equipo .....................................................................................32

4.2.3. Modifica miembro del equipo .................................................................................34

4.2.4. Modificar mi datos de perfil ...................................................................................36

4.2.5. Desactivar miembro del equipo ..............................................................................38

4.2.6. Crear contenido .....................................................................................................40

4.2.7. Modificar contenido ...............................................................................................42

4.2.8. Desactivar contenido ..............................................................................................43

4.2.9. Ver información equipo científico ...........................................................................45

4.2.10. Ver contenido ......................................................................................................47

4.2.11. Cerrar sesión .......................................................................................................49

4.2.12. Ver redes neuronales compartidas ........................................................................50

4.2.13. Compartir redes neuronales .................................................................................52

3. Plan del proyecto ...............................................................................................................55

3.1. Planificación temporal .................................................................................................55

3.1.1. Estimación de tiempos ...........................................................................................55

3.1.2. Diagrama de GANTT ............................................................................................57

3.2 Recursos y estimación de costes .....................................................................................58

3.2.1. Desarrollo .............................................................................................................58

3.2.1.1. Humanos .........................................................................................................58

3.2.1.2. Software ..........................................................................................................60

3.2.1.3. Hardware ........................................................................................................61

3.2.2. Instalación .............................................................................................................65

3.2.2.1. Software ..........................................................................................................65

3.2.2.2. Hardware ........................................................................................................66

3.2.2.3. Personal ..........................................................................................................67

3.2.3. Mantenimiento ......................................................................................................68

3.2.4. Otros gastos...........................................................................................................68

4. Diseño ...............................................................................................................................71

4.1. Diseño completo de la base de datos ..............................................................................71



5

4.1.1. Esquema conceptual ..............................................................................................71

4.1.2. Esquema lógico ......................................................................................................73

4.1.3. Normalización .......................................................................................................75

4.1.4. Diseño de seguridad ...............................................................................................76

4.1.5. Diseño físico ..........................................................................................................77

4.2. Diseño del software ......................................................................................................81

4.2.1. Estructura visual de la interfaz de la aplicación ......................................................81

4.2.2. Diseño de pantallas ................................................................................................86

4.2.2.1. Index ..............................................................................................................87

4.2.2.2. Login ..............................................................................................................88

4.2.2.3. Project ............................................................................................................89

4.2.2.4. Ver Project ......................................................................................................90

4.2.2.5. About us .........................................................................................................91

4.2.2.6. Neural Network ...............................................................................................92

4.2.2.7. Crear red neuronal ..........................................................................................93

4.2.2.8. Panel de usuario ..............................................................................................94

4.2.2.9. Crear/modificar project ...................................................................................96

4.2.2.10 Crear/modificar miembros ..............................................................................97

4.2.3. Storyboards ...........................................................................................................98

4.2.3.1. Login ..............................................................................................................98

4.2.3.2 Ver los proyectos ............................................................................................ 100

4.2.3.3. Ver el detalle de un proyecto .......................................................................... 101

4.2.3.4. Ver los miembros del equipo .......................................................................... 103

4.2.3.5. Ver las redes neuronales ................................................................................ 104

4.2.3.5. Crear una red neuronal ................................................................................. 106

4.2.3.6. Modificar mis datos de usuario ...................................................................... 108

4.2.3.7. Modificar / crear un proyecto ........................................................................ 110

4.2.3. Diagrama de clases .............................................................................................. 115

4.2.4. Diagramas de secuencia ....................................................................................... 117

5. Implementación ............................................................................................................... 123

5.1. Tecnologías usadas .................................................................................................... 123

5.2. Detalles de implementación del proyecto ..................................................................... 127



6

5.2.1. Método que comprueba si un usuario está registrado en el sistema. ....................... 127

5.2.2. Método que comprueba si un usuario está logado en el sistema. ............................. 128

5.2.3. Algoritmo que modifica los datos del usuario. ....................................................... 129

5.2.4. Algoritmos para crear o modificar proyectos. ....................................................... 129

5.2.5. Algoritmos para crear o modificar usuarios. ......................................................... 130

5.2.6. Algoritmo para crear una red neuronal ................................................................ 130

5.2.7. Método para hacer logout en el sistema. ............................................................... 131

6. Pruebas ........................................................................................................................... 133

6.1. Pruebas de validación ................................................................................................ 133

6.2. Pruebas de unidad ..................................................................................................... 140

6.3. Pruebas de de integración .......................................................................................... 143

7. Manual de usuario ........................................................................................................... 147

7.1. Acceso al sitio web ..................................................................................................... 147

7.2. Acceder a los proyectos publicados ............................................................................. 148

7.3. Acceder a la página de “Sobre nosotros” .................................................................... 149

7.4. Crear y visualizar redes neuronales ............................................................................ 149

7.5. Acceder al panel de usuario ........................................................................................ 151

7.6. Modificar los datos de usuario .................................................................................... 152

7.7. Crear y modificar tus proyectos ................................................................................. 153

7.8. Crear y modificar los usuarios .................................................................................... 153

7.9. Logout ....................................................................................................................... 154

8. Manual de instalación ...................................................................................................... 157

9. Conclusiones .................................................................................................................... 161

9.1. Propuestas de mejora ................................................................................................. 162

10. Bibliografía .................................................................................................................... 163



7



8



9

1. Introducción

En este primer capítulo introductorio se va hacer una introducción al proyecto que se

va a realizar comenzando por la motivación que ha llevado a realizarlo. Después se explicará

en profundidad el problema que se quiere resolver con este proyecto y se describirán los

objetivos principales a conseguir.

Se analizarán las restricciones técnicas y de rendimiento del hardware y software

proporcionado por el cliente en el que se realizará el proyecto a las que habrá que ajustarse a

la hora de desarrollarlo.

Se continuará describiendo el sistema actual que usa el cliente, se especificará la

metodología que se va a utilizar para elaborar el proyecto, se indicarán los resultados que se

esperan obtener a la conclusión del mismo y finalmente se definirá la estructura que seguirá

esta memoria del proyecto.

1.1. Motivación

Una red neuronal [1] es un conjunto de uniones de neuronas cuyo objetivo es el de

recibir y procesar información de otros sistemas nerviosos y devolver una respuesta de acción

efectiva. El estudio y comprensión de las redes neuronales puede ser clave para combatir

enfermedades como el Alzheimer, la epilepsia o el parkinson.

Los avances en el campo de la neurociencia y las redes neuronales avanza a pasos

agigantados tanto en la teoría como en la práctica, pero es difícil para el público acceder a los

artículos, investigaciones y noticias sobre este campo y mucho menos, poder ver de primera

mano los avances y hallazgos que los científicos descubren ya que esta ciencia requiere

principalmente del estudio de redes neuronales, redes que son difíciles encontrar en periódicos

o artículos de noticias en internet. Esta parte interactiva entre el público y los científicos es un



10

puente que hay que construir así como la cooperación y unión entre las distintas comunidades

que estudian las redes neuronales. A raíz de esta necesidad surge el proyecto que se va a

realizar. Este proyecto es necesario para que tanto la comunidad científica como el resto del

mundo pueda contemplar redes neuronales y compartir las suyas propias. Este proyecto quiere

ser el germen que consiga crear una comunidad científica en la que se compartan redes

neuronales desde cualquier parte del mundo, y que todos los demás puedan contemplarla.

Toda comunidad tiene que tener un punto de partida, y ese punto de partida será el

equipo de investigación del Doctor Jorge Sepulcre. En este proyecto que se va a realizar, este

equipo de investigación será el encargado de poner las primeras piedras de la comunidad

científica que se espera conseguir. Serán los encargados de subir artículos, noticias, y las

primeras redes neuronales para que cualquier persona del mundo pueda verlas, además de

explicar en qué consiste su trabajo, obtener una ficha de cada miembro del equipo, etc.

En definitiva, este proyecto viene motivado por la falta de conexión que hay entre los

equipos de investigadores y científicos que trabajan e investigan en redes neuronales y por la

poca interactividad que tienen estos estudios de cara al público. Para solucionar esto se quiere

crear una página web que disponga de medios para que todo el mundo pueda compartir y

visualizar redes neuronales creando así una comunidad online de esta rama de la ciencia.

1.2. Descripción del problema

El grupo de investigación del doctor Jorge Sepulcre desea realizar una página web en

la que se muestren los datos más relevantes de su laboratorio, como son los datos de los

miembros del equipo de investigación, información sobre sus proyectos, sus publicaciones y

documentos. Además, desea añadir una herramienta al portal en la que se puedan ver de una

forma interactiva redes neuronales, y en la que cualquier persona que lo desee pueda

compartir las suyas propias creando así una comunidad relacionada con la neurociencia.



11

1.3. Objetivos del proyecto

Para resolver el problema planteado por Jorge Sepulcre se especifican objetivos

específicos para la correcta realización del proyecto.

1. Creación de una página web informativa, de un equipo de investigación de laboratorio

en la cual queden reflejadas en ella las investigaciones, trabajos, escritos etc, de los

miembros del equipo así como los datos personales de cada miembro del equipo.

2. Debe de haber una sección interna de documentación en la que solo tendrán acceso

los miembros del equipo de investigación.

3. La página deberá de ser actualizable por los miembros del equipo de investigación sin

necesidad de disponer del personal técnico que actualice los contenidos.

4. Añadir una nueva funcionalidad que permita construir redes neuronales a partir de

unos parámetros de entrada y poder compartir estas redes neuronales.

5. Versión móvil de la página web con un diseño responsive.

6. Redacción de la memoria del proyecto junto con la documentación relacionada,

manuales de instalación y de usuario.

1.4. Restricciones técnicas y de rendimiento

En este capítulo se van a exponer las restricciones técnicas y de rendimiento de las

herramientas proporcionadas por el cliente Jorge Sepulcre para realizar el proyecto [2].

El servidor proporcionado por Jorge Sepulcre tiene un procesador de 2,4GHz, con 4

núcleos y posee una memoria Ram de 16 GB. Analizando las características de hardware del

servidor se deduce que tenemos más que suficiente para realizar nuestro proyecto, es decir, no

tenemos ninguna restricción técnica ni de rendimiento de hardware.



12

Pasamos a analizar las características de software. El servidor tiene instalado una

distribución linux de CentOs 6.4. Esta sistema operativo tiene la ventaja de ser seguro,

estable, eficaz y muy bien optimizado con Php, MySql y Apache, lo cual nos puede venir muy

bien si optamos por estas herramientas, pero tiene la ventaja de no tener demasiada

información y comunidad en internet. El servidor cuenta con una versión de PHP 5.3.3, y una

versión de Apache 2.2.15, las cuales son un poco bajas respecto a las últimas disponibles;

estas herramientas se convierten en una restricción técnica importante.

En resumen, analizando las características de hardware y de software del servidor,

comprendemos que no tendremos ninguna restricción de rendimiento para nuestro proyecto,

pero sí tendremos restricciones técnicas a la hora de desarrollarlo debido a versiones antiguas

de las herramientas necesarias para desarrollar el mismo.

1.5. Descripción del sistema actual

El equipo de investigación de Jorge Sepulcre no dispone de ninguna página web

propia, sino que utiliza la página web de la Escuela Médica de Harvard para mostrar

información sobre sus miembros y compartir algunas publicaciones.

1.6. Metodología

La metodología a seguir para llevar a cabo este proyecto consta de los siguientes

elementos:

1. A partir de la entrevista mantenida con el cliente Jorge Sepulcre se realizará un análisis

de los requisitos, y obtener de la idea abstracta del cliente, una lista de funciones que

tiene que satisfacer el software.



13

2. Se estudiarán los perfiles de los usuarios que usarán el software y se elaborarán los

distintos casos de uso del producto.

3. Se realizará un plan de proyecto en el que se elaborarán una planificación temporal del

desarrollo, un estudio de los recursos que se utilizarán, y una estimación de los costos

del proyecto.

4. Se llevará a cabo el diseño de la estructura de la base de datos y el diseño del software.

5. Se elegirán las herramientas más adecuadas para realizar el proyecto y se

implementará.

6. Una vez implementado se realizarán pruebas de validación.

7. Además, será necesario realizar una búsqueda y revisión bibliográfica durante el

desarrollo completo del proyecto.

1.7. Resultados a esperar

El resultado que se espera obtener es una plataforma que permita al equipo de

investigación de Jorge Sepulcre publicar información sobre sus miembros de equipo, publicar

noticias, investigaciones y experimentos que les permitan darse a conocer al resto del mundo.

Por otro lado se espera crear una aplicación web dentro de la plataforma que permita la

visualización de redes neuronales y cerebrales de una forma sencilla y que permita además a

cualquier usuario compartir su red neuronal para que los demás puedan visualizarla.

Además se realizará un informe en el que se detallen los siguientes aspectos:

● Documentación detallada sobre la metodología seguida para el diseño e

implementación del proyecto.

● Pruebas de dicho sistema.

● Redacción de la memoria y manual de usuario.



14

1.8. Estructura del proyecto

En este primer capítulo se hará una introducción de la memoria, donde se explicará la

motivación del proyecto, lo que se va a hacer, cuál será la metodología para llevar a cabo el

proyecto y por último se detallarán los resultados a obtener.

En el segundo capítulo se llevará a cabo un análisis de requisitos y se detallarán los

requerimientos funcionales y no funcionales del proyecto. Se expondrán los distintos perfiles

de los usuarios que usarán el software y se representarán los distintos casos de uso de la

aplicación. Además se estudiarán los distintas posibles soluciones que mejor se adapten al

proyecto que se va a realizar.

En el tercer capítulo se detallará el plan del proyecto, que estará compuesto por la

planificación temporal del desarrollo, la estimación de recursos y costes que necesitará el

proyecto.

En el cuarto capítulo se llevará a cabo el diseño de la base de datos y el diseño del

software. Además se realizará un storyboard con todas las pantallas que tendrá la aplicación y

los diagramas de secuencia.

En el quinto capítulo se describirán y justificarán todas las tecnologías usadas para

llevar a cabo el proyecto, además de comentar los principales algoritmos que usará el

programa.

En el sexto capítulo se describirán las pruebas a realizar (unidad, validación e

integración) una vez se haya completado la implementación. Además se mostrarán los errores

detectados así como la solución de los mismos.

En el siguiente capítulo se redactará el manual de usuario donde se detallarán los

distintos pasos a seguir para usar la aplicación.

En el octavo capítulo se incluirá el manual de instalación, y en el caso que sea una

plataforma web, se indicará la URL donde esté todo instalado y funcionando correctamente.



15

En el noveno capítulo se detallarán las conclusiones obtenidas a partir de la realización

de este proyecto.

Y en el último capítulo se expondrá toda la bibliografía que se ha utilizado, tanto para

realizar la memoria como para realizar el proyecto.



16



17

2. Requisitos de software

Se va a pasar a explicar en más profundidad las funciones que el proyecto va a llevar a

cabo, desde la entrevista con el cliente, especificando cada uno de los requisitos que debe

cumplir el programa tanto funcionales como no funcionales, hasta el comportamiento y la

interacción del mismo con los usuarios y el tipo de perfil de los mismos.

También se hará un estudio de todas las posibles soluciones para desarrollar la

aplicación indicando las ventajas e inconvenientes de cada una de ellas.

2.1. Especificación de requerimientos

Se distinguen dos tipos de requisitos [3]:

1. Requisitos funcionales: Describen lo que el sistema debe hacer. Son todos los servicios

que sistema debe proporcionar. Se especifican indicando cómo debería reaccionar el

sistema a partir de unas entradas o soluciones particulares. En algunas ocasiones, los

requisitos funcionales también describen lo que el sistema no debe hacer.

2. Requisitos no funcionales: Son aquellos requerimientos que no se refieren

directamente a funciones específicas que proporciona el sistema, sino a propiedades de

éste como la fiabilidad, el tiempo de respuesta y la capacidad de almacenamiento.

2.1.1. Requisitos funcionales

En este apartado se van a detallar todos los requerimientos funcionales que debe

ofrecer nuestro sistema. Están divididos entre los requisitos funcionales generales del sistema

web, requisitos de la sección del administrador, requisitos de la sección del miembro del

equipo de investigación, requisitos del visitante de la web y requisitos de la aplicación de

visualización de redes neuronales.



18

1. Requisitos generales del sistema web.

Son las funcionalidades que debe cumplir todo el sistema en general.

1.1. RF 1.2. Debe ser posible iniciar sesión en el sistema como administrador o

como miembro del equipo de investigación.

2. Requisitos de la sección del administrador.

Se encargan de dar la funcionalidad necesaria para que el administrador pueda

controlar el sistema de una forma óptima. A continuación se describirán todas las

funciones que el administrador del sistema debe poder llevar a cabo.

2.1. Añadir miembros al equipo de investigación.

2.1.1. RF 2.1.1. Debe ser posible crear un nuevo miembro del equipo de

investigación.

2.1.2. RF 2.1.2. Debe ser posible modificar un miembro del equipo de

investigación.

2.1.3. RF 2.1.3. Debe ser posible desactivar un miembro del equipo de

investigación.

2.2. Crear, desactivar y modificar cualquier información de la web.

2.2.1. RF 2.2.1 Podrá crear cualquier tipo de contenido.

2.2.2. RF 2.2.2. Será el único que pueda desactivar cualquier noticia, artículo,

análisis etc del sistema.

2.2.3. RF 2.2.3. Será el único que pueda modificar cualquier noticia, artículo,

análisis etc del sistema.

3. Requisitos de la sección del miembro del equipo de investigación.



19

Se encargan de dar la funcionalidad necesaria para que los miembros del

equipo de investigación puedan compartir información a través del sistema: noticias,

análisis, investigaciones, etc.

3.1. Compartir noticias, análisis, investigaciones etc.

3.1.1. RF 3.1.1. Debe ser posible que el miembro del equipo pueda crear una

noticia, investigación, tesis, avance etc.

3.2. Desactivar y modificar noticias, análisis, investigaciones etc.

3.2.1. RF 3.2.1. Debe ser posible que el miembro del equipo pueda modificar

sus noticias, investigaciones, tesis, avances etc.

3.2.2. RF 3.2.2. Debe ser posible que el miembro del equipo pueda eliminar

sus noticias, investigaciones, tesis, avances etc.

3.3. Modificar su información personal.

3.3.1. RF 3.3.1. Debe ser posible que miembro del equipo pueda modificar su

información personal.

4. Requisitos de la aplicación de visualización de redes neuronales.

Se encargan de dar la funcionalidad necesaria para que se puedan visualizar y

compartir redes neuronales.

4.1. RF 4.1. Debe ser posible visualizar una red neuronal a través de un simple

formulario de entrada de datos.

4.2. RF 4.2. Debe ser posible compartir una red neuronal en el sistema.

4.3. RF 4.3. Debe ser posible visualizar redes neuronales que hayan compartidos

otros usuarios.



20

2.1.2. Requisitos no funcionales

Los requisitos no funcionales o atributos de calidad son restricciones de los servicios o

funciones ofrecidos por el sistema. Especifican criterios que pueden usarse para juzgar la

operación del sistema en lugar de sus comportamientos específicos. Es decir, se refieren a los

todos los requisitos que no describen información a guardar, ni funciones a realizar, sino a

características de funcionamiento.

A continuación se muestran los requisitos no funcionales que necesita el sistema.

2.1.2.1. Rendimiento

● Toda funcionalidad del sistema y transacción de la página web debe responder al

usuario en menos de 5 segundos.

● El sistema debe ser capaz de operar adecuadamente con hasta 100 usuarios con

sesiones concurrentes.

● Los datos modificados en la base de datos deben ser actualizados para todos los

usuarios que acceden en menos de 5 segundos.

2.1.2.2. Seguridad

● Los permisos de acceso al sistema podrán ser cambiados solamente por el

administrador de acceso a datos.

● El proyecto debe desarrollarse aplicando patrones y recomendaciones de programación

que incrementen la seguridad de datos.

● Todos los sistemas deben respaldarse (copia de seguridad) cada 1 semana.

● Todas las comunicaciones externas entre servidores de datos, aplicación y cliente del

sistema deben estar encriptadas utilizando el algoritmo RSA.

2.1.2.3. Usabilidad

● El tiempo de aprendizaje del sistema por un usuario deberá ser menor a 30 minutos.

● El tiempo de aprendizaje del sistema por un administrador deberá ser menor a 1 horas.



21

● La tasa de errores cometidos por el usuario deberá ser menor del 1% de las

transacciones totales ejecutadas en el sistema.

● El sistema debe contar con manuales de usuario estructurados adecuadamente.

● El sistema debe proporcionar mensajes de error que sean informativos y orientados a

usuario final.

● La aplicación web debe poseer un diseño “Responsive” a fin de garantizar la adecuada

visualización en múltiples ordenadores, teléfonos y tablets.

● El sistema debe estar en idioma inglés.

● El sistema debe poder ser administrado por el jefe del grupo de investigación sin

necesidad del desarrollador del proyecto.

2.1.2.4. Escalabilidad

● El sistema se desarrollará de forma que se visualice correctamente en cualquier

navegador.

● El sistema debe estar en capacidad de permitir en el futuro el desarrollo de nuevas

funcionalidades, modificar o eliminar funcionalidades después de su construcción y

puesta en marcha inicial.

2.1.2.5. Facilidad para las pruebas

● El sistema debe contar con facilidades para la identificación y la localización de los

errores durante la etapa de pruebas y de operación posterior.

2.1.2.6. Mantenibilidad

● Toda el sistema deberá estar completamente documentado, cada uno de los

componentes de software que forman parte de la solución propuesta deberán estar

debidamente documentados tanto en el código fuente como en los manuales de

administración y de usuario.

● El sistema debe estar en capacidad de permitir en el futuro su fácil mantenimiento con

respecto a los posibles errores que se puedan presentar durante la operación del

sistema.



22

2.1.2.7. Validación de la información

● El sistema debe validar automáticamente la información contenida en los formularios

de ingreso. En el proceso de validación de la información, se deben tener en cuenta

aspectos tales como obligatoriedad de campos, longitud de caracteres permitida por

campo, manejo de tipos de datos, etc.

2.2. Perfiles de usuarios

En la entrevista con el director del grupo de investigación, el doctor Jorge Sepulcre, se

establecieron todos los perfiles de usuario que pueden acceder al sistema, los cuales se van a

definir para aseguramos que no se pierde la referencia de los objetivos del proyecto

manteniendo las necesidades de los usuarios y por ende mejorar la calidad del producto.

Administrador: El director del grupo de investigación, Dr. Jorge Sepulcre.

Demografía: Grupo de edad: 30-50 años.

Background personal: Líder de un equipo de investigación científico sobre redes neuronales

y neurociencia. Se desenvuelve bien con las tecnologías. Posee grandes conocimientos sobre

las redes neuronales y la neurociencia.

Destreza tecnológica: Informática: alta. Dispositivos: media.

Necesidades: Ofrecer una página web de su equipo de investigación y ofrecer a la comunidad

científica una herramienta que una a los científicos de la rama de la neurociencia y

aficionados.

Motivación: Dar a conocer su equipo de investigación y crear una comunidad científica sobre

neurociencia.

Escenarios: Tiene acceso a todas las funcionalidades del sistema.



23

Miembro de equipo científico:.

Demografía: Grupo de edad: 25-60.

Background personal: Trabaja como científico e investigador en el área de las redes

neuronales y la neurociencia. Se desenvuelve bien con las tecnologías. Posee grandes

conocimientos sobre las redes neuronales y la neurociencia.

Destreza tecnológica: Informática: alta. Dispositivos: media.

Necesidades: Necesita una página web donde pueda comunicar sus principales resultados de

investigación y comunicar noticias y avances en el campo de la neurociencia y donde pueda

compartir redes neuronales con el resto de la comunidad científica y poder visualizar otras

redes.

Motivación: Comunicar sus resultados de investigación en el campo de la neurociencia y

compartir sus redes neuronales.

Escenarios: Tiene un rol muy parecido al del administrador, solo que sólo puede modificar su

perfil y sus contenidos.

Visitante:

Demografía: Grupo de edad: 20-60 años.

Background personal: Profesional o aficionado a la neurociencia y redes neuronales. Tiene

conocimientos altos sobre la neurociencia y redes neuronales.

Destreza tecnológica: Informática:media-alta, dispositivos: media.

Necesidades: Necesita una página web donde poder conocer los principales resultados de

investigación del grupo y poder visualizar redes neuronales.

Motivación: Consulta de información sobre neurociencia.



24

Escenarios: Tiene acceso a visualizar toda la información que se comparta en el sistema, pero

no podrá crear contenidos. Puede crear redes neuronales y compartirlas.

2.3. Estudio de posibles soluciones

A la hora de estudiar las posibles soluciones para desarrollar el proyecto se nos encontramos

con dos factibles. Usar CMS o usar Frameworks de programación. Se van a comparar las 2

soluciones y escoger una de ellas.

2.3.1. CMS

Un CMS (Gestor de Contenidos), es una plataforma que permite administrar el

contenido de tu web, gestionar usuarios y otras funciones, de una manera sencilla, rápida y

cómoda.

Esta plataforma ya está desarrollada, es de código libre, es decir cualquier persona puede

descargarla y con los conocimientos necesarios, implementarla. Algunas son gratis y otras de

pago.

Se van a analizar primero algunos CMS y después detallaremos las ventajas e inconvenientes

de una forma general.

2.3.1.1. Wordpress [4]

Wordpress es un sistema de generación de contenidos (CMS: Sistema que permite

crear una estructura para la creación y administración de contenidos) con el que se pueden

desarrollar cualquier sitio web, aunque está más enfocado a la creación de blogs. Usa lenguaje

PHP en un entorno MySQL y Apache. Actualmente es el CMS más popular.

Ventajas:



25

Es una herramienta gratuita ya que es un software libre y es muy sencilla de utilizar.

Ofrece muchos temas o plantillas de diseño con el que personalizar nuestra web. Ofrece

muchas extensiones con infinidad de funcionalidades. Su comunidad es bastante grande.

Inconvenientes:

El punto más negativo es su seguridad, ya que hay un historial bastante grande de

ataques a sitios webs que usan este entorno. Otro punto a tener en cuenta que genera mucho

código inservible en nuestra web. Es difícil programar funciones muy específicas.

2.3.1.2. Joomla [5]

Joomla es otro CMS, más potente que Wordpress aunque más complicado de usar.

Ventajas:

Sistema de administración bastante potente y organizado. Tiene muchas

actualizaciones gratuitas. Contiene una gran biblioteca de extensiones.

Inconvenientes:

Requiere altos conocimientos de programación. Debido a sus múltiples

actualizaciones, a veces hay conflictos entre unas y otras debido a que su comunidad no está

bien organizada.

2.3.1.3. Drupal [6]

Otro de los CMS más usado en la actualidad. Quizás se encuentra en un punto

intermedio entre los dos anteriores mostrando un equilibrio entre sencillez y potencia. Veamos

sus ventajas e inconvenientes.

Ventajas:



26

CMS muy completo con muchas funcionalidades instaladas por defecto. Posee una

edición gráfica muy sencilla y permite la reutilización del diseño en muchas vistas o landings.

Tiene mucha adaptabilidad a distintos tipos de webs de forma sencilla.

Inconvenientes:

No soporta mucho tráfico ni está preparado para gestionar grandes cantidades de datos.

Los módulos (o plugins) no son libres por lo que dificulta la mejora y evolución de los

mismos.

2.3.1.4. En resumen, los CMS:

Ventajas

1. Tiempo de desarrollo es menor.

2. Usa una plataforma que ya está desarrollada y probada. Es decir, minimiza

los problemas de encontrar errores.

3. Tiene muchas herramientas, utilidades y plugins instalados por defecto, que

nos ahorran trabajo, tiempo y costos. Por ejemplo: la mayoría vienen con:

Gestor de contenidos, gestor de usuarios, gestor de multimedias, etc.

4. Puedes escoger entre una gran librería de herramientas, para instalar a tu web.

Algunas son de pago y otras gratis.

5. La aplicación para administrar el contenido es amigable y en algunos CMS

fácil de aprender.

6. Si necesitas hacer un ajuste a la web,si usa un CMS popular, cualquier

desarrollador que conozca del CMS puede hacerlo.

7. Los costos de mantenimiento son menores.

Desventajas

1. Al ser código abierto o gratis, los hackers buscan vulnerabilidades de

seguridad, para ingresar e infectarlos. Por eso, los CMS se están actualizando

constantemente para corregir estos problemas. Aunque, también depende

mucho de la persona que lo trabaje,ya que se puede tomar medidas de

seguridad para evitar este problema.



27

2. Algunos CMS son muy difíciles de aprender e implementar.

3. Si no se saben trabajar el CMS, la web puede ser más lenta para cargar.

4. Aunque nos ofrece una gran variedad de herramientas gratis, las mejores son

de pago.

5. Si necesitamos hacer algo muy específico en nuestra web, podemos vernos

limitados porque algunas herramientas no lo hacen. Por tal razón, quizás se

necesite hacer un desarrollo adicional y esto puede incrementar el costo del

desarrollo.

2.3.2. Frameworks

Es hacer la web desde cero, pensar primero en la arquitectura de información, diseñar

la interfaz, desarrollar el proyecto y hacer un aplicación web, para que el que administra la

página, tenga acceso y cambie el contenido.

Primero se van a analizar algunos de los framework más populares para después analizar de

forma general esta posible solución.

2.3.2.1. ASP.NET MVC [7]:

ASP.NET es una herramienta de framework (esquema para el desarrollo e implementación de

una aplicación) desarrollada por Microsoft y basada en el patrón Modelo-Vista-Controlador.

Ventajas:

Se tiene mucho control sobre toda la aplicación y sobre todo lo que se genera. Está

todo muy desacoplado y esto permite una gran facilidad para hacer pruebas y aprendizaje.

Tiene mucha potencia.

Inconvenientes:



28

Es una herramienta de pago y por tanto su comunidad está más limitada. Requiere

muchos conocimientos de programación. Por estas razones se convierte en un framework

menos productivo que otros hasta que consigue dominarse del todo.

2.3.2.2. Codeigniter [8]:

Nos encontramos con otro framework basado en el patrón MVC que utiliza PHP como

lenguaje de programación. Se caracteriza por su rapidez con la que se desarrollan los entornos

web.

Ventajas:

Se crean webs muy ligeras y con mucho rendimiento. Apenas requiere configuración y

tiene muchísima documentación. Solo se necesita PHP para empezar a desarrollar tu página

web.

Inconvenientes:

Es una tecnología propietaria, por lo que no sabemos si el día de mañana dejará de

funcionar o pasará a ser de pago. Código muy acoplado por lo que no permite gran

reutilización de código o funcionalidades.

2.3.2.3. Symfony [9]:

Symfony es un framework de software libre que permite desarrollar aplicaciones

complejas, rápidas y seguras. Es uno de los proyectos PHP más activos lo cual garantiza

mucha documentación y futuro.

Ventajas:

Se adapta a cualquier proyecto web. Tiene infinidad de código ya programado.

Permite la creación de un proyecto seguro y flexible con gran capacidad de extensión. Es de

libre uso.

Inconvenientes:



29

Requiere mucho aprendizaje para llegar a dominarlo. Requiere mucha configuración y

la instalación de muchos componentes antes de empezar a desarrollar el proyecto.

2.3.2.4. Silex [10]:

Silex es un micro-framework desarrollado con PHP y se basa en los mismos principios

que Symfony. Está enfocado a proyectos pequeños donde no se necesitan gran cantidad de

componentes. Es muy sencillo de desarrollar pero no tiene tanta potencia como Symfony.

Ventajas:

No necesita mucha configuración para empezar a trabajar con ´él. Fácilmente

extensible. Buena relación calidad-facilidad de uso-rapidez de desarrollo. Posee todo lo bueno

de Symfony.

Inconvenientes:

No es tan amplio como Symfony.

2.3.2.5. En resumen, los frameworks:

Ventajas

1. Se hace a la medida del proyecto.

2. El diseño como la estructura de tu sitio web es único.

3. El desarrollo contará con mejor seguridad.

Desventajas

1. Siempre vas a depender del desarrollador o casa de desarrollo, para hacer

algún ajuste a tu web.

2. La plataforma para administrar el contenido, puede ser complicada para la

persona que no tiene conocimientos de lenguajes de programación.



30

3. El tiempo de desarrollo es más largo y puede llegar a tener muchos bugs o

errores.

4. Es más costoso.

Una vez hemos analizado las ventajas e inconvenientes de cada uno de las

posibilidades, se va a proceder a decantarse por una de ellas.

Debido a que nuestra página web va a requerir funcionalidades muy específicas como

son la creación y visualización de redes neuronales, va a necesitar mucha seguridad (más de la

que los CMS incorporan), se quiere que sea una página única, en la que no se van a escatimar

en tiempo de desarrollo, pero en la que no se pueden usar recursos económicos para comprar

plugins o funcionalidades, se va a realizar el proyecto usando frameworks de programación y

“haciéndola de cero”.

2.4. Casos de uso del proyecto.

En este capítulo se van a definir y representar el modelo de casos de uso de nuestro

proyecto. Un modelo de casos de uso [11] describe toda la funcionalidad del sistema mediante

interacciones entre el usuario (humano o máquina) y el sistema. En cada caso de uso se

describe la funcionalidad que se implementará en el sistema, además, se detallan cuáles serán

sus actores, requisitos, restricciones, los escenarios por los que el usuario pasará para realizar

el caso de uso y unas postcondiciones.

Para cada caso de uso se va a representar un diagrama de caso de uso [12].

Un diagrama de caso de uso es la representación gráfica de las relaciones entre los casos de

uso y sus actores. No es más que una forma general de representar un caso de uso que ayuda a

entenderlo e interpretarlo.

A continuación se detallan los casos de uso del sistema web que se va a desarrollar en

este proyecto.



31

2.4.1. Caso de uso: Iniciar sesión.

El sistema permitirá iniciar sesión al administrador y a los miembros del equipo de

investigación. Estos tendrán acceso a unas funciones o a otras dependiendo de su rol. Para

iniciar sesión, tendrán que introducir su “username” y su “password” que serán sus

credenciales.

Esquema 2.1. Caso de uso: Iniciar sesión.

Actor Principal:

Administrador y miembros del equipo de investigación.

Precondiciones:



32

Para que un miembro del equipo pueda entrar al sistema, el administrador tiene que

haberlo creado como miembro, asignándole un “username” y una “password”.

Camino principal:

1. El usuario introduce su “username” y su “password”.

2. El usuario pulsa en el botón de “Iniciar sesión”.

3.a. El sistema comprueba si el usuario está creado en el sistema y se inicia sesión.

Camino alternativo:

3.b.1. El sistema detecta que no se han introducido el “username” o el “password” y

avisa al usuario.

3.b.2. Repetir desde el paso 1.

3.c.3. El sistema detecta que el usuario introducido no es correcto y avisa al usuario.

3.c.4. Repetir desde el paso 1.

Postcondiciones:

El sistema redirige al usuario al panel de administrador o de miembro del equipo

según su rol.

4.2.2. Crear miembro del equipo

El sistema permite crear miembros del equipo de investigación para mostrar su

información personal y profesional de cada uno. Además, servirá para dar acceso al miembro

del equipo al sistema, y pueda crear contenido. Para crear a un usuario tiene que asignarle un

“username” y un “password” que serán las credenciales del usuario, además, podrá rellenar

información adicional, que luego el mismo usuario podrá completar o modificar.



33

Esquema 2.2. Caso de uso: Crear miembro de equipo.

Actor Principal:

Administrador.

Precondiciones:

El administrador tiene que haber iniciado sesión en el sistema.

Camino principal:

1. El administrador selecciona crear miembro de equipo.

2. El administrador introduce un “username” y un “password” para crear al usuario.

3. El administrador rellena datos personales y profesionales.

4. El administrador presiona el botón crear miembro de equipo.



34

5.a. El sistema comprueba que ese usuario no existe ya en el sistema, y confirma al

administrador que se ha creado al nuevo usuario.

Camino alternativo:

5.b.1. El sistema detecta que no se han introducido el “username” o el “password” y

avisa al administrador que faltan esos campos.

5.b.2. Repetir desde el punto 2.

5.c.1. El sistema detecta que el usuario ya existe en el sistema e informa al

administrador de ello.


Postcondiciones:

Ninguna.

4.2.3. Modifica miembro del equipo

El administrador puede modificar a los miembros del equipo de investigación. Para

ello deberá de rellenar el mismo formulario mostrado en el caso de uso anterior.



35

Esquema 2.3. Caso de uso: Modificar miembro de equipo..

Actor Principal:

Administrador.

Precondiciones:


Camino principal:

1. El administrador selecciona modificar miembro de equipo.

2. El administrador elige qué miembro del equipo modificar.

3. El administrador rellena el formulario de usuario.

4. El administrador presiona el botón modificar miembro de equipo.

5.a. El sistema comprueba que no hay errores en el formulario e informa al

administrador que el usuario se ha modificado correctamente.



36

Camino alternativo:

5.b.1. El sistema detecta que no se han cometido errores en el formulario y avisa al



5.c.1. El sistema detecta que el usuario ya existe en el sistema e informa al



Postcondiciones:

Ninguna.

4.2.4. Modificar mi datos de perfil

Tanto el administrador como los demás usuarios pueden modificar sus datos

personales. Para ello tienen que rellenar los datos del formulario de usuario de los dos casos

de uso anteriores.



37

Esquema 2.4. Caso de uso: Modificar mi perfil.

Actor Principal:

Administrador y miembro del equipo de investigación.

Precondiciones:

El usuario tiene que haber iniciado sesión en el sistema.

Camino principal:

1. El usuario selecciona modificar su perfil.

2. El usuario rellena el formulario de usuario.

3. El usuario presiona el botón modificar perfil.



38

4.a. El sistema comprueba que no hay errores en el formulario e informa al usuario que

el usuario se ha modificado correctamente.

Camino alternativo:




Postcondiciones:

Ninguna.

4.2.5. Desactivar miembro del equipo

El administrador puede desactivar el usuario de un miembro del equipo para que éste

no pueda acceder más al sistema. Aunque su información permanecerá en otra sección donde

se recojan todos los antiguos miembros que han trabajado en el equipo de investigación



39

Esquema 2.5. Caso de uso: Desactivar miembro de equipo.

Actor Principal:

Administrador.

Precondiciones:


Camino principal:

1. El administrador accede a su panel de usuario..

2. El administrador elige qué miembro del equipo desactivar.

3. El administrador modifica el usuario desactivandolo..

4. El administrador presiona el botón “confirmar”.

5.a. El sistema elimina correctamente al usuario e informa al administrador de ello.



40

Camino alternativo:

5.b.1. El sistema detecta que ha habido un error e informa al administrador.


Postcondiciones:

Ninguna.

4.2.6. Crear contenido

Una de las funcionalidades más importantes de la web es la de crear contenido para

compartir, ya sean noticias, investigaciones etc. Tanto el administrador como los miembros

del equipo podrán crear contenido simplemente rellenando un formulario.



41

Esquema 2.6. Caso de uso: Crear contenido.

Actor Principal:


Precondiciones:


Camino principal:

1. El usuario selecciona crear contenido.

2. El usuario rellena el formulario de contenido.

3. El usuario presiona el botón crear contenido.


se ha creado correctamente el contenido.

Camino alternativo:




Postcondiciones:

El sistema redirige al usuario al nuevo contenido que acaba de crear.



42

4.2.7. Modificar contenido

Una vez creado el contenido se puede modificar a través del mismo formulario que se

creó. Cada usuario solamente puede modificar el contenido creado por el, menos el

administrador que puede modificar todos los contenidos.

Esquema 2.7. Caso de uso: Modificar contenido..

Actor Principal:


Precondiciones:


Camino principal:

1. El usuario selecciona modificar contenido.



43

2. El usuario selecciona el contenido a modificar.

3. El usuario rellena el formulario de contenido.

4. El usuario presiona el botón modificar contenido.


se ha modificado correctamente el contenido.

Camino alternativo:

5.b.1. El sistema detecta que se han cometido errores en el formulario y avisa al

usuario de ello.


Postcondiciones:

El sistema redirige al usuario al nuevo contenido que acaba de modificar.

4.2.8. Desactivar contenido

Todo contenido se puede desactivar igual que modificar. Cada usuario solamente

puede desactivar su contenido menos el administrador que puede desactivar cualquier



44

contenido.

Esquema 2.8. Caso de uso: Desactivar contenido.

Actor Principal:


Precondiciones:


Camino principal:

1. El usuario selecciona eliminar contenido a desactivar .

2. El usuario desactiva el contenido.

3. El usuario presiona el botón desactivar contenido.

4.a. El sistema elimina correctamente el contenido e informa al usuario.



45

Camino alternativo:

4.b.1. El sistema detecta que se ha producido un error y avisa al administrador de ello.


Postcondiciones:

Ninguna.

4.2.9. Ver información equipo científico

Otra funcionalidad básica del sistema a desarrollar es la de poder ver información

sobre el equipo de investigación. Todo usuario de internet puede ver esta información.



46

Esquema 2.9. Caso de uso: Ver información equipo científico.

Actor Principal:

Administrador, miembro del equipo de investigación y visitante.

Precondiciones:

Ninguna.

Camino principal:



47

1. El usuario navega por la información del equipo de investigación y sus miembros.

Camino alternativo:

Ninguno.

Postcondiciones:

Ninguna.

4.2.10. Ver contenido

Además de poder ver información del equipo de investigación, se puede visualizar el

contenido que compartan los usuarios del sistema. Todo usuario web puede visualizar el

contenido compartido.



48

Esquema 2.10. Caso de uso: Ver contenido.

Actor Principal:


Precondiciones:

Ninguna.

Camino principal:

1. El usuario selecciona ver contenidos de la web.



49

2. El usuario selecciona el contenido a visualizar.

3. Repetir desde el punto 1.

Camino alternativo:

Ninguno.

Postcondiciones:

Ninguna.

4.2.11. Cerrar sesión

Todos los usuarios que hayan iniciado sesión en el sistema pueden cerrar su sesión del

sistema.



50

Esquema 2.11. Caso de uso: Cerrar sesión.

Actor Principal:


Precondiciones:


Camino principal:

1. El usuario selecciona cerrar sesión.

Camino alternativo:

Ninguno.

Postcondiciones:

El sistema redirigirá al usuario a la página de visitante de la web.

4.2.12. Ver redes neuronales compartidas

Además de crear redes neuronales también se pueden ver las que los usuarios

comparten. Todas las redes neuronales se guardan en el sistema y cualquier usuario puede ver

las redes neuronales que han compartido otros usuarios.



51

Esquema 2.12. Caso de uso: Ver redes neuronales compartidas.

Actor Principal:


Precondiciones:

Ninguna.

Camino principal:

1. El usuario selecciona ver redes neuronales.



52

2. El usuario selecciona la red neuronal que quiere visualizar.

3.a. El sistema muestra la red neuronal al usuario.

Camino alternativo:

3.b.1. El sistema detecta que se ha producido un error al crear la red neuronal e

informa al usuario.


Postcondiciones:

Ninguna.

4.2.13. Compartir redes neuronales

Se pueden compartir redes neuronales en el sistema simplemente rellenando un

pequeño formulario en el que se introduce un nickname, un título, y se adjunta un fichero que

contenga cualquier grafo. Todos los usuarios web pueden utilizar esta funcionalidad.



53

Esquema 2.1. Caso de uso:Compartir red neuronal.

Actor Principal:


Precondiciones:

Ninguna.

Camino principal:

1. El usuario selecciona crear red neuronal.



54

2. El usuario introduce rellena el formulario

3. El usuario adjunta un fichero de tipo grafo en el formulario.

3.a. La red neuronal se guarda en el sistema para que los demás usuarios web puedan

visualizarla.

Camino alternativo:

3.b.1. El sistema detecta que se ha producido un error al guardar la red neuronal e

informa al usuario.


Postcondiciones:

Ninguna.



55

3. Plan del proyecto

En este capítulo se va a desarrollar el plan del proyecto, que consistirá primero en

planificar en el tiempo todas las tareas que van a componer el desarrollo del proyecto y

segundo en estimar todos los recursos necesarios para poder llevarlo a cabo, junto a los costes

que nos va a suponer realizarlo.

3.1. Planificación temporal

En este apartado se va a exponer la planificación temporal del proyecto.

Primero detallaremos todas las tareas que se van a realizar desde el inicio del proyecto hasta

su final, indicando en cada una la duración estimada que conlleva realizarla y después

representaremos esta planificación mediante un diagrama de GANTT.

3.1.1. Estimación de tiempos

A continuación se muestran la estimación de tiempos de las tareas que

se van a desarrollar para llevar a cabo el proyecto.

Actividad ROL Duración

estimada

Actividad

precedente

A Entrevista con el director del

grupo de investigación

Analista 3 horas -

B Análisis de requisitos Analista 6 horas A

C Requerimientos de aplicación Analista 6 horas B



56

D Estudio de posibles herramientas Analista 6 horas C

E Estudio perfiles de usuario Analista 6 horas A

F Casos de uso Analista 9 horas D,E

G Planificación temporal Analista 6 horas F

H Estimación de recursos y costes Analista 6 horas G

I Diseño base de datos Programador 15 horas F

J Diseño del software Programador 15 horas I

K Implementación primera parte:

Página informativa del equipo

Programador 60 horas J

L Implementación segunda parte:

Aplicación visualizar redes

neuronales

Programador 60 horas K

M Pruebas Programador 60 horas L

N Realización de memoria. Analista 240 horas L

Tabla 3.1. Estimación de tiempos.



57

3.1.2. Diagrama de GANTT



58

Esquema 3.1.Diagrama de Gantt.

3.2 Recursos y estimación de costes

En este apartado se van a detallar los recursos que van a ser necesarios para poder

llevar a cabo el proyecto, acompañados de una estimación de sus costes. Este apartado se va a

dividir en cuatro bloques: se van a presentar primero los recursos y costes necesarios para el

desarrollo, después para la instalación, seguidos de los relacionados con el mantenimiento, y

por último otros gastos que no entrarían dentro de los demás bloques.

3.2.1. Desarrollo

Se va a comenzar realizando una estimación de los recursos y costes relacionados con

el desarrollo del proyecto.

3.2.1.1. Humanos

Los recursos humanos que se van a necesitar para desarrollar el proyecto serán los de

un analista y de un programador. En este caso se va a contar con una sola persona que será

analista y programador a la vez, cambiando su rol en función de la actividad concreta a

desarrollar.



59

Ahora se van a calcular los costes que nos supone contratar a esta persona. Se va a

tener en cuenta que va a trabajar a media jornada (4 horas) y que va a cumplir los plazos de la

planificación temporal.

El sueldo [13] de un Analista es de 9,78€/h y el sueldo de un programador es de

6,71€/h. Sabiendo estas cifras podemos calcular el coste humano asociado al desarrollo del

proyecto.

Actividad ROL Duración

estimada

Coste

Entrevista con el director del

grupo de investigación

Analista 3 horas 29,34€

Análisis de requisitos Analista 6 horas 58,68€

Requerimientos de aplicación Analista 6 horas 58,68€

Estudio de posibles herramientas Analista 6 horas 58,68€

Estudio perfiles de usuario Analista 6 horas 58,68€

Casos de uso Analista 9 horas 88,02€

Planificación temporal Analista 6 horas 58,68€

Estimación de recursos y costes Analista 6 horas 58,68€

Diseño base de datos Programador 15 horas 100,65€

Diseño del software Programador 15 horas 100,65€

Implementación primera parte:

Página informativa del equipo

Programador 60 horas 402,6€



60

Implementación segunda parte:

Aplicación visualizar redes

neuronales

Programador 60 horas 402,6€

Pruebas Programador 60 horas 402,6€

Realización de memoria. Analista 240 horas 2347,2€

Total 4225,75€

Tabla 3.2. Estimación costes de desarrollo: Gastos humanos.

4225,75€ es el gasto aproximado de recursos humanos asociado al desarrollo del

proyecto.

3.2.1.2. Software

Ahora se va detallar el software que se va a necesitar para desarrollar el proyecto. Para

calcular la estimación del coste del software se va a utilizar el cálculo de la amortización.

Teniendo en cuenta que un producto software tiene un periodo de amortización de 6 años (72

meses) podemos calcular el coste del software los meses que va a ser usado en el proyecto.

Software Coste software Coste amortizado

Windows 7 Profesional 64 bits 29,90€ 2,07€

OpenOffice 4

0,00 0,00€

Sublime text 2 61,64€ 4,28€

Microsoft office proyect 2007 90,00€ 6,25€



61

Visual Paradigm CE 13.1 0,00€ 0,00€

PHP Storm 2016.1 1200,00€ 83,33€

XAMPP 5.6.15 0,00€ 0,00€

SourceTree 1.7.0 0,00€ 0,00€

Google Chrome 50.0 0,00€ 0,00€

Total 1381,54€ 95,93€

Tabla 3.3. Estimación costes de desarrollo: Gastos de software

.

La estimación del coste del software necesario para desarrollar el proyecto, teniendo

en cuenta que la planificación temporal que indica que el proyecto se va a desarrollar el

aproximadamente 5 meses, es de 95,93€.

3.2.1.3. Hardware

Ahora se va detallar el hardware que se va a necesitar para desarrollar el proyecto.

Para calcular la estimación del coste del hardware se va a utilizar el cálculo de la

amortización. Teniendo en cuenta que un producto hardware tiene un periodo de amortización

de 8 años (96 meses) podemos calcular el coste del software los meses que va a ser usado en

el proyecto [14].

Hardware Modelo Coste hardware Coste amortizado

Procesador Amd Fx Series Fx-

4300 3.8ghz 4x

67,95€ 3,70€



62

Placa base Asrock 980de3/u3s3

Rev 2.0

57,95€ 3,15€

Memoria RAM Corsair Vengeance

Lpx Ddr4 3000 Pc-

24000 16gb 2x8gb

Cl15

84€ 4,57€

Ventilador Cooler Master Seidon

120v R2

49,95€ 2,71€

Disco duro Crucial Mx200 250gb

Ssd

91,95€ 5,00€

Caja Antec Performance

One P100 Usb 3.0

81,95€ 4,45€

Fuente de

alimentación

Corsair Cx600m 600w

80 Plus Bronce

Modular

82€ 4,46€

Tarjeta gráfica Asus Geforce Gtx 750

Ti Oc 2gb Gddr5

126€ 6,85€



63

Tarjeta de sonido Asus Xonar Essence

Stx Ii 5.1 Pcie

183€ 9,95€

Lector de tarjetas Thermaltake

Commander Ft

Reacondicionado

32,55€ 1,77€

Grabadora de dvd Asus Bc-12d2ht Blu-

ray Combo Negro

65€ 3,53€

Monitor Acer K242hql 24" Led

119€ 6,67€

Teclado B-move Set Free Kit

Teclado Y Ratón

Wireless

16,95€ 0,92€

Ratón Gamdias Ourea

Gms5500 óptico 2500

Dpi

23,95€ 1,30€

Altavoces Brigmton Bamp-611

Altavoz Bluetooth

24,95€ 1,36€



64

Negro

Adaptador WIFI D-link Dwa-121

Wireless Micro

Adaptador Usb N150

15,95€ 0,87€

Total 1123,1€ 61,26€

Tabla 3.4. Estimación costes de desarrollo: Gastos de hardware

.

La estimación del coste del hardware necesario para desarrollar el proyecto, teniendo

en cuenta que la planificación temporal que indica que el proyecto se va a desarrollar el

aproximadamente 5 meses, es de 61,26€.

En resumen, después de detallar todos los recursos necesarios para desarrollar el

proyecto podemos obtener una estimación del coste en el proceso de desarrollo.

Concepto Coste

Recursos humanos 4225,75€

Recursos software 95,93€.

Recursos hardware 61,26€

Total 4382,94€

Tabla 3.5. Estimación costes de desarrollo: Totales.



65

Después de sumar todos las estimaciones de coste se obtiene una estimación total de coste de

4441,95€.

3.2.2. Instalación

En este capítulo se detallarán los recursos y los costes asociados para instalar la

aplicación. Como el proyecto es un portal web se van a detallar los recursos y costes

asociados a la instalación del proyecto en un servidor web.

3.2.2.1. Software

El servidor web proporcionado por el equipo de investigación de Jorge Sepulcre tiene

los siguientes recursos software, que, llevan un coste asociado no imputable a la estimación de

costes del proyecto, debido a la propiedad del mismo.

Software Coste

Sistema operativo CentOS 6.4. 0,00€

Servidor HTTP Apache 2.2.15 0,00€

MySQL Server 0,00€

PHP 5.3.3 0,00€

Total 0,00€

Tabla 3.6. Estimación costes de instalación: Gastos de software.

Como se ve en la tabla anterior todos los recursos software para poder alojar la

aplicación en el servidor son gratuitos.



66

3.2.2.2. Hardware

Ahora se van a detallar los recursos hardware y sus costes asociados al hardware que

tiene el servidor en el que se va a alojar la aplicación.

El servidor donde va a estar alojada la aplicación forma parte de los recursos del grupo

de investigación, así que el coste de hardware asociado a la instalación del proyecto no es

imputable a la estimación de costes del mismo.

A modo de ejemplo, se van a detallar los costes del servidor donde alojar la aplicación

si no nos lo proporcionase el equipo de investigación.

Hardware Modelo Coste hardware

Procesador Intel Celeron G1840 2.8ghz

Box

36,95€

Memoria RAM G.skill Trident X Ddr3 1866

Pc3-14900 16gb 2x8gb Cl8

115€

Fuente de alimentación Antec Vpf 550 Ec 550w 80

Plus Bronze

63’95€

Tarjeta red/WIFI D-link Dwm-221 Módem 4g 77,35€



67

Lte Reacondicionado

Total 293,25€

Tabla 3.7. Estimación costes de instalación: Gastos de hardware.

Como vemos en la tabla anterior, un servidor donde se alojar la página web tendría un

coste de 293’25€, pero en el caso actual será de 0€ ya que nos lo proporciona el cliente.

3.2.2.3. Personal

Para instalar la aplicación se necesita a un técnico en sistemas que instale y configure

el software e instale el proyecto en el servidor. Esto tendrá un tiempo estimado de 5 horas. El

precio por contratar un técnico durante el proceso de instalación será de 20€ la hora, lo que

harían sumarle al coste de instalación 100€.

El resumen de los gastos de instalación es:

Concepto Coste

Recursos humanos 100,00€

Recursos software 0,00€.

Recursos hardware 0,00€

Total 100,00€

Tabla 3.8. Estimación costes de instalación: Gastos totales.



68

3.2.3. Mantenimiento

La aplicación puede presentar fallos o que el cliente quiera mejorarla o modificarla en

el futuro. El equipo de desarrollo se ofrece a modificarla o trabajar en la aplicación después de

la entrega final por un precio de 20€ la hora.

También hay que mantener el servidor por si este falla o hay que configurar algún

parámetro del mismo. Como hemos comentado en el apartado anterior, el servidor nos lo

proporciona el equipo de investigación y tienen su propio técnico de sistemas, por este motivo

en este caso el coste asociado al mantenimiento del servidor es de 0€. Si no tuvieran un

técnico de sistemas personal se tendría que contratar a uno con un precio de 20€ la hora.

3.2.4. Otros gastos

En este apartado añadiremos otros recursos necesarios para llevar a cabo el proyecto

como son la conexión a internet del analista-programador encargado de desarrollar el proyecto

o la compra de un libro de documentación de Silex.

Gasto Coste

Alta conexión Jazztel 0,00€

Conexión Jazztel 5 meses 215,00€

Suministro de luz ordenador 5 meses 30,00€

Libro Silex 60,00€

Total 305,00€

Tabla 3.8. Estimación costes: Otros gastos.

Como vemos en la tabla anterior, los gastos incluidos en la categoría de “Otros gastos”

ascienden a 305,00€.



69

Una vez tenemos desglosados todos los gastos podemos calcular el coste final

aproximado del proyecto.

Concepto Coste

Desarrollo 4382,94€

Instalación 100,00€

Otros gastos 305,00€

Total 4787,94€

Tabla 3.9. Estimación costes: Gastos totales.

El coste final aproximado del proyecto sin tener en cuenta el mantenimiento posterior

es de 4787,94€.



70



71

4. Diseño

En este capítulo se va a detallar el diseño de la base de datos y del software del

proyecto.

4.1. Diseño completo de la base de datos

En este apartado se expondrá el diseño completo de la base de datos del proyecto [25]

es decir, nos centraremos primero en el esquema conceptual, después abordaremos el diseño

lógico de la base de datos, pasaremos después al diseño normalizado de entidad-relación y por

último, nos ocuparemos de la seguridad de la base de datos y obtendremos una estimación del

volumen que puede llegar a generar la base de datos en un periodo de 5 años.

4.1.1. Esquema conceptual

En este apartado mostraremos la implementación hemos llevado a cabo para nuestro

proyecto, mostrando los diagramas conceptuales y explicando las circunstancias que nos han

llevado a adoptar determinadas decisiones. Pasaremos por alto la descripción detallada de la

base de datos (tipos de datos, restricciones, código SQL de consultas, etc.). Es decir, la

información que determina la funcionalidad de nuestra base de datos.

Mediante la entrevista llevada a cabo con Jorge Sepulcre se han sacado las siguientes

conclusiones que definen el modelo conceptual de nuestra base de datos.

La aplicación será usada por un número bajo de usuarios, que serán los miembros del

equipo de Jorge Sepulcre, que accederán al sistema mediante un correo electrónico y una

contraseña. Además, el sistema deberá de almacenar algunos datos personales que serán

mostrados en la web. Estos datos serán, su nombre, apellidos, su puesto o cargo dentro del

equipo, una pequeña descripción de su trabajo, un enlace web a una imagen personal, un

enlace web a su facebook personal, un enlace web a su instagram personal y un enlace web a



72

su twitter personal. Además guardaremos si el usuario está actualmente en el equipo o si ya no

lo está.

Los usuarios crearán y editarán noticias (o proyectos) que se mostrarán en la web.

Estos proyectos contendrán un título, una fecha de creación, un autor, y un cuerpo explicando

el proyecto.

Un usuario puede crear muchas noticias, pero una noticia solamente puede ser creada

por un usuario, aunque puede ser editada por varios (lo explicaremos en la sección de

seguridad y permisos).

Por último, cualquier usuario que acceda a la página web podrá crear redes neuronales,

que se guardarán en el sistema para que se muestren en la web. Estas redes neuronales

guardan un nickname del usuario creador, un título, y un nombre del fichero donde se

encuentra el grafo de la red.

Las redes no tienen relación con las demás tablas ya que no se guarda la información

de quien la crea.

A partir de la información se obtiene el siguiente esquema conceptual, donde se

muestran las entidades y sus relaciones. Las entidades están representadas por rectángulos, sus

relaciones como rombos y los atributos de las relaciones como elipses.



73

Esquema 4.1. Esquema conceptual de la base de datos.

Como se puede ver en el anterior diagrama, correspondiente al esquema conceptual de

la base de datos, tenemos 3 tipos de relaciones.

User: Contiene el nombre, apellidos, email, password, info, puesto, imagen, urlFacebook,

urlTwitter, urlInstagram.

Project: Contiene un título y un cuerpo.

Redes: Contiene un nick y un filename.

A partir de estas entidades tenemos una relación:

R1: Es una relación 1 a n. Un usuario puede crear una noticia o proyecto, estableciéndose una

fecha de creación, pero una noticia solo puede ser creada por un usuario.

4.1.2. Esquema lógico

Una vez hemos desarrollado el esquema conceptual pasamos al desarrollo del esquema

lógico. En el esquema lógico se detallan las claves de cada entidad, convirtiendo cada entidad

en una tabla, y resuelve las relaciones entre ellas. Para transformar el esquema conceptual al

esquema lógico hay que seguir 3 reglas:

1. Todo tipo de entidad se convierte en una tabla o relación: La tabla o relación

toma el nombre de la entidad. Los atributos de la entidad serán las columnas de

la tabla, y el atributo identificador principal será la clave primaria.

2. Toda relación N a M se convierte en una tabla o relación: Las interrelaciones

N a M se transforman en una tabla cuya clave primaria será la concatenación

de los atributos principales de las entidades que se asocia; estos atributos serán

claves foráneas que referencian a las respectivas tablas donde son claves

primarias. Los atributos de la interrelación serán columnas de la tabla.



74

3. Para todo tipo de relación 1 a N se realiza lo que se denomina propagación de

la clave, o se crea una nueva relación: Las relaciones 1 a N o 1 a 1 se

transforman propagando el atributo identificador principal de la entidad que

tiene cardinalidad máxima 1 a la que tiene cardinalidad máxima a N. Si la

relación fuese de 1 a 1 la propagación podría hacerse en cualquier sentido. El

atributo propagado es una clave foránea que referencia a la tabla con

cardinalidad máxima de 1.

Siguiendo estas reglas el esquema lógico de la base de datos es el siguiente:

Esquema 4.2. Esquema lógicode la base de datos.

Como vemos en el anterior esquema, nuestra base de datos tendrá 3 tablas:

User: La clave primaria de esta tabla será “email”, además tendrá otros atributos: hemos

añadido el atributo “id” que será autoincremental, que lo usaremos para enumerar

internamente a los usuarios; nombre, apellidos, password, info, puesto, imagen, urlFacebook,

urlInstagram, urlTwitter y activo.

Project: La clave primaria de esta tabla será “id”, y “id_user”. Además tiene otros atributos:

título, cuerpo y fecha.



75

Redes: La clave primaria es “id” y contiene otros atributos: nick, titulo y filename.

4.1.3. Normalización

Una vez hemos detallado el esquema lógico se va a desarrollar el normalizado de las tablas.

La normalización [16] es el proceso de aplicar una serie de reglas a las tablas y relaciones

obtenidas en el esquema lógico de la base de datos con el fin de eliminar redundancia de datos,

proteger la integridad de los datos y evitar problemas de actualización.

Para que nuestra base de datos esté bien construida debe de cumplir las siguientes formas

normales:

Primera forma normal (1FN)

Una tabla está en 1FN si sus atributos contienen valores atómicos, la clave primaria

sea no nula, y que identifique al resto de los campos.

Como podemos comprobar en nuestro esquema lógico, todas las claves primarias son

correctas e identifican al resto de los campos.

Segunda forma normal (2FN)

Un esquema está en 2FN si:

● Está en 1FN.

● Todos sus atributos que no son de la clave principal tienen dependencia

funcional completa respecto de todas las claves existentes en el esquema. En

otras palabras, para determinar cada atributo no clave se necesita la clave

primaria completa, no vale con una subclave.

Como podemos comprobar en nuestro esquema lógico, todos los atributos no clave de

las tablas dependen únicamente de las claves primarias completas, por tanto, nuestra base de

datos cumple la 2FN.



76

Tercera forma normal (3FN)

Una relación está en tercera forma normal si, y sólo si:

Está en 2FN y, además, cada atributo que no está incluido en la clave primaria no

depende transitivamente de la clave primaria.

Por lo tanto, a partir de un esquema en 2FN, tenemos que buscar dependencias

funcionales entre atributos que no estén en la clave.

Como observamos en el esquema lógico, ningún atributo no clave depende de otro

atributo no clave, por tanto, cumple también la 3FN.

4.1.4. Diseño de seguridad

En este capítulo se va a detallar el diseño de seguridad de nuestra base de datos [17].

El diseño de seguridad tiene como objetivo cumplir los siguientes tres aspectos:

● Confidencialidad de la información: Solo los usuarios autorizados pueden

acceder al sistema.

● Integridad de la información: Solo los usuarios con los privilegios adecuados

pueden modificar o borrar información.

● Confidencialidad de la información: Los usuarios autorizados pueden acceder a

tiempo a la información.

Para garantizar la seguridad de nuestra base de datos, no podemos permitir que nuestra

aplicación se conecte a la base de datos con una cuenta de propietario o de administrador, ya

que si alguien consigue las credenciales de acceso, tendría acceso a todas las funciones. Para

evitar esto, hay que crear un usuario que no solo tenga acceso a las funciones no críticas, para

en el caso que alguien consiguiera las credenciales, no pudiera llevar a cabo ninguna acción

destructiva.

El servidor PHPMyAdmin que se nos ha proporcionado ya contiene una estructura de

usuarios con distintos privilegios cada uno. El usuario que se nos ha proporcionado tiene



77

privilegios de administrador, es decir, puede crear bases de datos, modificar su estructura y

puede hacer todo tipo de operaciones, pero no puede crear otros usuarios, así que para lograr

una base de datos segura lo que se ha hecho es dotar de seguridad a la base de datos a nivel de

aplicación.

La aplicación se ha diseñado a partir de dos tipos de usuarios, el usuario con rol

Administrador, y el usuario con el rol de miembro de equipo de investigación, cada uno con

unos privilegios a nivel de aplicación distintos. Así que para conseguir esto se ha añadido un

campo más a la tabla usuario, “ROLES”, que guardará el rol de cada usuario, restringiendo su

acceso a distintas funcionalidades e información.

De modo que nuestro diagrama lógico después de aplicar las modificaciones para

lograr la seguridad requerida es el siguiente:

Esquema 4.3. Esquema de seguridad de la base de datos.

4.1.5. Diseño físico

El esquema físico de una base de datos es una descripción de la implementación de

una base de datos en memoria secundaria, escribiendo las estructuras de almacenamiento y los

métodos de acceso a esos datos.



78

Esquema 4.4. Esquema físico de la base de datos.

En el diagrama anterior hemos definido los tipos de datos para cada atributo de las

tablas. Pasamos a detallar cada uno de los atributos indicando su tamaño en bytes.

● Int: Número que puede ser desde -2^31 a 2^31 -1. Tiene un tamaño de 4 bytes.

● Varchar: cadena de texto de longitud máxima "x". Tendrá un tamaño de "x" + 1 bytes.

● Longtext: Cadena de texto con una longitud máxima muy grande hasta 16 Mb. Tendrá

un tamaño variable de longitud+4bytes

● TinyInt: número entero diminuto de longitud 1 con valores 0-255. Tendrá un tamaño

de 1 byte.

● DateTime: fecha con formato "yyyy-mm-dd hh:ii:ss". Tendrá un tamaño de 8 bytes.

Una vez tenemos el diseño físico podemos calcular el tamaño aproximado que tendrá

nuestra base de datos a lo largo del tiempo.

Se va a calcular cuánto crecerá nuestra base de datos a lo largo de 5 años.

● Se estiman un equipo aproximado de 15 miembros, contando los que se quedan como

miembros activos como los que no. Serán 15 usuarios en la base de datos.

● Cada usuario creará de media 10 proyectos al año.

● Se crearán una media de 100 redes neuronales al año.



79

Con estos datos pasamos a calcular el volumen que tendrá nuestra base de datos en 5

años.

Tabla Users.

Atributo Tamaño

id 4 bytes

nombre 101 bytes

apellidos 101 bytes

email 101 bytes

password 256 bytes

puesto 101 bytes

info 256 bytes

imagen 256 bytes

urlFacebook 256 bytes

urlTwitter 256 bytes

urlInstagram 256 bytes

activo 4 bytes

roles 256 bytes

Total 2204 bytes X 15 = 33060 bytes

Tabla 4.1. Volumen tabla User.

Tabla Project



80

Atributo Tamaño

id 4 bytes

id_user 4 bytes

titulo 256

cuerpo 2001 bytes (de media)

fecha 8 bytes

Total 2273 bytes X 10 X 15 X 5 = 1704750 bytes

Tabla 4.2. Volumen tabla Project.

Tabla Redes

Atributo Tamaño

id 4 bytes

nick 101 bytes

titulo 151 bytes

filename 156 bytes

Total 412 bytes * 100 * 5 = 206000 bytes

Tabla 4.3. Volumen tabla Redes.

Sumando el total de todas las tablas obtenemos:

Tabla Tamaño

Users 33060 bytes



81

Project 1704750 bytes

Redes 206000 bytes

Total 1943810 bytes

total (MB) 1,94 MB

Tabla 4.4. Volumen total.

Como vemos en la tabla anterior, el tamaño estimado para nuestra base de datos es de

1,94 MG, a esto le tenemos que sumar un 40% más para el tamaño que puedan necesitar los

índices. Así que finalmente obtenemos una previsión de tamaño a lo largo de 5 años de: 2,71

MG. Tenemos por tanto, una base de datos muy optimizada y con poco tamaño gracias a la

elección de tipos de datos adecuados para cada uno de los atributos.

4.2. Diseño del software

En este capítulo de la memoria se va a detallar el diseño que tendrá la página web,

exponiendo cómo será su estructura visual primero, analizando los storyboards, y creando sus

diagramas de clase y de secuencia.

4.2.1. Estructura visual de la interfaz de la aplicación

En este apartado se va a detallar la estructura visual que seguirá la página web, que

seguirá el mismo patrón en todas sus pantallas, consiguiendo con ello una web fácil de utilizar

para los usuarios, con poco tiempo de aprendizaje, y con un nivel de usabilidad alto.

Para representar la estructura se van a usar plantillas html sin funcionalidad (sólamente

la parte gráfica).



82

La página web se va a estructurar de la siguiente manera:

● Header: Todas las pantallas van a tener en su parte superior un header o encabezado

que será el menú de opciones de la web. En el estarán los botones con los que navegar

por la página en todo momento. Además del logo del equipo de investigación de Jorge

Sepulcre.

Imagen 4.1. Header.

Diseño responsive: Dado que nuestra página web debe de tener un diseño que se adapte a todo

tipo de plantillas incluyendo tablets y móviles hemos diseñado también como sería nuestro header en

pantallas pequeñas.



83

Imagen 4.2. Header responsive.

● Footer: Al igual que el header, todas las pantallas de la página web van a tener un

footer o pie de página, que contendrá información de contacto con el equipo de Jorge

Sepulcre, además de otro menú igual que el header para poder navegar por la web sin

tener que desplazarnos al header.



84

Imagen 4.3. Footer.

Footer responsive: El footer también se adaptará a pantallas pequeñas:



85

Imagen 4.4. Footer responsive.

● Contenido: Entre el header y el footer irá el contenido de cada pantalla o sección, que

detallaremos en el siguiente apartado.

Con esta estructura conseguiremos que nuestra página tenga armonía y que sobretodo

sea fácil navegar por ella.



86

4.2.2. Diseño de pantallas

En este apartado detallaremos el diseño que se ha seguido para cada una de las

pantallas de la página web. Las pantallas son plantillas html sin los textos ni imágenes finales,

solo contienen el diseño y la estructura que tendrán una vez finalizado el proyecto.



87

4.2.2.1. Index

Imagen 4.5. Index.

Esta es la página principal de la web, la que se muestra cuando se entra por primera vez. Es

una página de introducción a la web en la que se explicarán a grandes rasgos que podemos

encontrar en la web, a quién pertenece, y qué acciones podemos llevar a cabo en ella. Está

dividida en tres bloques de contenido que pueden ser más si se necesitaran.



88

4.2.2.2. Login

Imagen 4.6. Login.

Esta es la ventana de login con la que los usuarios autorizados podrán entrar a la web. Hay

que introducir el email y la contraseña para poder entrar al panel de usuario.



89

4.2.2.3. Project

Imagen 4.7. Project.

Esta imágen corresponde a la pantalla de proyectos, donde los miembros del equipo pueden

crear contenido y mostrarlo al resto de los usuarios de la web. Aquí se muestra el título, la

fecha y el auto de cada uno de los proyectos.



90

4.2.2.4. Ver Project

Imagen 4.8. Project details.

Esta imagen corresponde a la pantalla de detalle del proyecto. Al seleccionar un proyecto de la

imagen anterior podemos ver el cuerpo del mismo.



91

4.2.2.5. About us

Imagen 4.9. About us.

Esta es la pantalla de About us, donde se explica más detalladamente a qué se dedica el equipo

de investigación. Además se presentan a los miembros del equipo, tanto los que están

actualmente trabajando en él como los que ya lo estuvieron.



92

4.2.2.6. Neural Network

Imagen 4.10. Ver red.

Aquí podemos ver la pantalla de redes neuronales. Es la pantalla donde se verán las redes

neuronales que crean los usuarios de la web y donde se podrán crear las nuestras propias.

Como vemos está dividida en dos, a la izquierda se muestran las redes que hay creadas y a la

derecha la visualización de la red escogida.



93

4.2.2.7. Crear red neuronal

Imagen 4.11. Crear red.

Esta imagen corresponde a la pantalla de creación de la red neuronal. Tan solo hay que elegir

un nick, un título a red, y elegir un fichero que contenga un grafo de la red que deseamos subir

a la web.



94

4.2.2.8. Panel de usuario

Imagen 4.12. Panel de usuario.

Este es el panel de usuario al que sólo tienen acceso los usuario registrados. Está dividido en 3

partes. La primera parte o bloque está dedicada a los datos del usuario logado en el sistema y a



95

su modificación. En la segunda parte el usuario podrá ver sus proyectos y podrá modificarlos.

Y en la tercera parte (solo visible para el administrador) el administrador podrá crear

miembros/usuarios para su equipo.



96

4.2.2.9. Crear/modificar project

Imagen 4.13. Crear/modificar contenido.

Esta es la pantalla de creación de proyectos. Todos los usuarios autorizados podrán crear

contenido a través de este formulario, que automáticamente estará disponible para todos los

usuarios de la web.



97

4.2.2.10 Crear/modificar miembros

Imagen 4.14. Crear/modificar usuarios.

A través de este formulario el administrador de la web podrá crear a los miembros de su

equipo de investigación, dotándolos de un email y contraseña que utilizarán para poder entrar

al sistema.



98

4.2.3. Storyboards

Una vez tenemos las pantallas bien definidas se va a detallar el ciclo para

realizar las distintas acciones del programa.

4.2.3.1. Login

Para hacer login, primero debemos de pulsar en el botón del header “Panel de

usuario”.

Imagen 4.15.1. Iniciar sesión.



99

Se nos abrirá una ventana en la que introducir nuestros datos, email y contraseña. Si no

son correctos, el sistema nos indicará que el usuario no pertenece al sistema o que ha habido

un error en el formulario. Si son correctos nos llevará a la página del panel de usuario.

Imagen 4.15.2. Iniciar sesión.



100

4.2.3.2 Ver los proyectos

Imagen 4.16.1. Ver los proyectos.

Para ver los proyectos creados por los miembros del equipo de Jorge Sepulcre tenemos

que hacer click en Projects en los menús.

Imagen 4.16.2. Ver los proyectos.



101

4.2.3.3. Ver el detalle de un proyecto

Imagen 4.17.1. Ver detalles de un proyecto.

Para ver los detalles de un proyecto, hay que hacer click en alguno de los proyectos

creados en la pestaña de Projects.



102

Imagen 4.17.2. Ver detalles de un proyecto.



103

4.2.3.4. Ver los miembros del equipo

Imagen 4.18.1. Ver los miembros del equipo.

Para ver los miembros que componen el equipo de investigación de Jorge Sepulcre hay

que hacer click en “About us” en los menús.



104

Imagen 4.18.2. Ver los miembros del equipo.

4.2.3.5. Ver las redes neuronales

Imagen 4.19.1. Ver redes neuronales.

Para ver las redes neuronales que hay creadas en el sistema hay que hacer click en

“Redes neuronales” en los menús.



105

Imagen 4.19.2. Ver redes neuronales.

Ahora elegimos una de entre todas las que hay, y se nos mostrará la red neuronal a la derecha.



106

4.2.3.5. Crear una red neuronal

Imagen 4.20.1. Crear red neuronal.

Para crear una red neuronal, hay que pinchar en crear nueva red, desde la pestaña de

Redes neuronales.

Imagen 4.20.2. Crear red neuronal.

Se nos abrirá la siguiente pestaña en la que introduciremos los datos necesarios para crear la

red. Si está todo correcto, el sistema recargará la página de redes neuronales mostrándonos



107

que nuestra red ha sido creada con éxito. Si los datos no son correctos el sistema nos avisará

de ello.



108

4.2.3.6. Modificar mis datos de usuario

Imagen 4.21.1. Modificar mis datos.



109

Para modificar los datos del usuario, simplemente hay que modificarlos en la pantalla del

panel de usuario y pulsar modificar. El sistema nos avisará que la modificación ha sido

correcta o fallida.



110

4.2.3.7. Modificar / crear un proyecto

Imagen 4.22.1. Crear/modificar proyectos.

Para modificar un proyecto que hayamos creado, tenemos que pulsar en cualquiera de

nuestros proyectos en la ventana del panel de usuario.

Para crear un nuevo contenido pulsamos en Crear nueva noticia / proyecto.

Imagen 4.22.2. Crear/modificar proyectos.



111

Las dos acciones nos llevarán a esta ventana que será el formulario para crear un nuevo

contenido o modificar alguno que ya exista. Después de darle a “Guardar” el sistema nos

avisará que todo se ha guardado correctamente o si por el contrario ha habido algún error.



112

4.2.3.8. Modificar / crear un miembro del equipo

Imagen 4.23.1. Crear/modificar usuarios.

Para crear nuevos miembros y usuarios de nuestro sistema, el administrador tiene que

pinchar en “Crear nuevo miembro” en el panel de usuario.

Para modificar alguno que ya exista el administrador tiene que pinchar en cualquier

miembro desde el panel de usuario.



113

Imagen 4.23.2. Crear/modificar usuarios.

Tras realizar cualquiera de las dos acciones, nos aparecerá este formulario con el que

podremos crear un nuevo usuario o modificar alguno que ya exista.

Si todo es correcto el sistema nos informará que se ha guardado correctamente la información

o si por el contrario ha habido algún error.



114

4.2.3.9. LogOut

Imagen 4.24.1. LogOut.

Para deslogueranos del sistema si hemos entrado, tenemos que pulsar en un nuevo botón que nos

aparecerá en el menú del panel de usuario. Una vez pulsado el botón nos llevará a la página de inicio.



115

4.2.3. Diagrama de clases

En este capítulo se va a mostrar el diagrama de clases del proyecto y se

explicará en detalle cómo interaccionan las clases de este.



116

Diagrama 4.1. Diagrama de clases.



117

Como se puede observar del diagrama de clases anterior, el proyecto se estructura

siguiendo el modelo Modelo-Vista-Controlador. En este modelo, tenemos un usuario que

interactúa con las diferentes vistas de la página web; este usuario puede ser el administrador

del sitio, un miembro del equipo de investigación o un visitante sin registrar en el programa.

Los usuarios se relacionarán con la vista, que les permitirá realizar las distintas

acciones del sistema, tales como, moverse por las distintas páginas de la web, solicitar datos e

introducirlos.

La vista será la encargada de gestionar todas las peticiones de los usuarios, y llevarlas

a cabo mediante el controlador además de devolver al usuario los resultados de los procesos

que realiza este.

El controlador será el que realice las operaciones y ejecute los diferentes métodos y

algoritmos del sistema, como son, crear sesiones de usuario, procesar los datos que envían los

usuarios enviándolos a la base de datos o realizar consultas a esta y devolver los resultados a

la vista.

Por último, la base de datos, será la clase que introduzca los datos en el sistema y

consulte los que el controlador solicite.

4.2.4. Diagramas de secuencia

Los diagramas de secuencia [18] describen la interacción entre los objetos de una

aplicación y los mensajes recibidos y enviados por los cada uno de los objetos.

En este capítulo se van a mostrar los diagramas de secuencia de cada una de las posibles

acciones de la aplicación.

● Primero se va a mostrar ver cómo interactúa el usuario con la página index.



118

Diagrama 4.2. Acceder a Index.

● Ahora se va a mostrar cómo interactúa el usuario con la página de proyectos y como a

su vez interactúa el servidor con la base de datos. También observaremos la

representación de la interacción de un usuario con los detalles de cada uno de los

proyectos.



119

Diagrama 4.3. Acceder a los proyectos.

● A continuación, se va a detallar cómo interactúa el usuario con la página de redes

neuronales, cómo las visualiza y cómo las crea. Además observamos la interacción del

servidor con la base de datos.



120

Diagrama 4.4. Visualizar/crear redes neuronales.

● Ahora se va a mostrar en detalle cómo interactúa el usuario con el servidor al hacer

login,al modificar sus datos personales y al hacer logout.



121

Diagrama 4.5. Panel de usuario.

● A continuación veremos cómo interactúa el usuario autorizado con el servidor para

crear y modificar sus proyectos.



122

Diagrama 4.6.Crear/modificar proyectos.

● Por último, se va a mostrar cómo interactúa el administrador con el servidor y la base

de datos para crear y modificar usuarios y miembros para su equipo.



123

Diagrama 4.7.Crear/modificar usuarios.

5. Implementación

En el siguiente capítulo se detallarán las distintas tecnologías usadas para desarrollar el

proyecto, indicando sus ventajas, desventajas y por qué se han usado. También se mostrarán

los algoritmos más importantes que se han desarrollado en el proyecto.

5.1. Tecnologías usadas

El siguiente punto es elegir las herramientas en las que se va a desarrollar el proyecto.

Partimos de la base que hay que desarrollar una sistema web que aloje el proyecto. Este



124

sistema web alojará por un lado el sitio informativo del equipo de investigación y por otro

lado la herramienta para visualizar redes neuronales.

HTML 5 [19]:

HTML es un lenguaje usado para estructurar y presentar el contenido para la web. Está

compuesto por etiquetas que el navegador interpreta y da forma en pantalla. No se trata de un

lenguaje de programación, sino que permite visualizar la información generada por otros

lenguajes de programación.

Ventajas:

Es muy sencillo de aprender y funciona en todos los navegadores. Permite la creación

de páginas webs muy rápidas. Tiene mucha documentación.

Inconvenientes:

El coste de mantenimiento de páginas creadas con html es muy alto. No tiene un

lenguaje semántico. No es muy completo, es muy básico y no tiene muchas opciones.

JavaScript [20]:

Es un lenguaje de programación del lado del cliente que permite crear acciones en la

página web. Es un lenguaje con muchas posibilidades, desde crear pequeños programas en

introducirlos en una página web, o usarlo en proyectos más grandes y más complejos.

Ventajas:

Es un lenguaje sencillo y liviano, que utiliza poca memoria y permite un fácil manejo

de datos. Es fácil de integrar y tiene mucha versatilidad.

Inconvenientes:

Los usuarios pueden desactivar javascript en sus navegadores y pueden provocar

muchos errores en aplicaciones básicas. Es un código visible para todo el mundo.



125

Jquery [21]:

Jquery es un framework de Javascript usado para facilitar el acceso a los distintos

elementos de la página web, manejar eventos, efectos o utilizar la herramienta Ajax.

Ventajas:

Es muy sencillo de utilizar, mejora la velocidad y prestaciones de nuestra web, es de

código abierto y tiene una gran cantidad de componentes ya desarrollados.

Inconvenientes:

Es difícil de proteger, necesita conocer otras tecnologías como CSS y no es muy

productivo a la hora de gestionar proyectos grandes.

Gestores de bases de datos.

MySql [22]:

MySQL es una herramienta de administración y gestión de bases de datos relacionales

de código abierto basado en lenguaje de consulta estructurado (SQL)

Ventajas:

Se ejecuta prácticamente en todas las plataformas. Es open source. Tiene una gran

velocidad al ejecutar operaciones. Facilidad de configuración e instalación. Baja probabilidad

de corromper los datos.

Inconvenientes:

No es intuitivo y no tiene mucha documentación.

Lenguajes de programación del lado del servidor.



126

PHP [23]:

Es un lenguaje de programación del lado del servidor que se utiliza para la generación

de páginas webs de forma dinámica.

Ventajas:

Código abierto, gratuito, multiplataforma y fácil de aprender.

Inconvenientes:

Difícil de mantener y poco seguro. Depende mucho del servidor y su rendimiento

puede verse afectado si este tiene muchas peticiones.

A la vista de los requisitos funcionales y no funcionales antes descritos y de las

características, ventajas e inconvenientes sobre los lenguajes y herramientas para el desarrollo

de la aplicación, se considera que las herramientas más adecuadas para el desarrollo del

proyecto son las siguientes.

Se vaa utilizar el microframework de Symfony Silex debido a que el proyecto que se

va a realizar es un proyecto de tamaño pequeño, por lo que este microframework se adaptará

mejor a nuestras necesidades ya que además permite con facilidad extender sus componentes

si se necesitaran y no necesitamos tanta potencia como la que ofrece Symfony. Del mismo

modo se ha descartado trabajar con ASP.NET debido a su coste y a su gran curva de

aprendizaje, y CodeIgniter debido a su dificultad para reutilizar código o ampliar y mejorar

funcionalidades en el futuro. Con Silex se va a programar con PHP debido a su potencia y su

facilidad de uso.

Para administrador de bases de datos se va a elegir MySQL porque es gratuito, fácil de

utilizar y fácil de configurar.

Para crear todas las vistas del proyecto se va a utilizar HTML debido a su facilidad de

uso y porque es una herramienta plataforma.



127

En el lado del cliente se va a utilizar Jquery, debido a su potencia y su facilidad de uso,

combinado con AJAX para conectar la parte del servidor con la parte del cliente.

5.2. Detalles de implementación del proyecto

En este apartado se van a detallar los distintos algoritmos y métodos desarrollados para

las distintas funciones del proyecto.

5.2.1. Método que comprueba si un usuario está registrado en el

sistema.

Para poder acceder al panel de usuario y poder crear contenido (proyectos) hay que

ingresar en el sistema un email y una contraseña. Con este método se va a comprobar si los

datos que ingresa un usuario de la web corresponden con algún usuario registrado en el

sistema. Si son correctos, el sistema guardará en una variable de sesión la id del usuario, para

que no haga falta introducir los datos si se quiere acceder de nuevo al panel de usuario. Este

método se llamará a través AJAX por el formulario de login que se encuentra en el header de

todas las páginas.

FUNCION CHECK_LOGIN(parametroEmail, parameteroPassword)

INICIO

email = parametroEmail

password = parametroPassword

consulta = “SELECT FROM User WHERE User.email = email and

User.password = password”

usuario = ejecutar(consulta)

Si (existe(usuario))

Variable_sesion_id = usuario.id

devolver exito



128

Fin si

devolver fracaso

FIN

Algoritmo 5.1.Check login.

5.2.2. Método que comprueba si un usuario está logado en el

sistema.

Si se quiere acceder manualmente al panel de usuario accediendo directamente desde

la dirección url de la página, el sistema tiene que tener la seguridad suficiente como para que

un usuario no registrado acceda. Para lograr esto, hemos creado este método que comprueba si

ya hay un usuario logado en el sistema mediante la variable de sesión, si lo hay se el sistema

devolverá la página solicitada pero si no lo hay el sistema redirigirá al usuario a la página

principal.

ALGORITMO COMPRUEBA_USUARIO_LOGADO

INICIO

Si (existe(Variable_sesion_id))

idUsuario = Variable_sesion_id

user = “SELECT * FROM User WHERE User.id = idUsuario”

//

// obtenerRestoDeDatos()

//

devolver página_panel_de_usuario

Si no

devolver página_principal

Fin Si

FIN

Algoritmo 5.2.Comprueba usuario logado.



129

5.2.3. Algoritmo que modifica los datos del usuario.

Este método es el que modifica los datos de usuario. Se llama desde el panel de

usuario mediante el formulario de modificar datos.

FUNCION Modificar_datos_user(parámetroUser)

INICIO

usuario = parametroUser

consulta = “UPDATE FROM User SET User.parametro = usuario.parametro

WHERE User.id = usuario.id”

ejecutar(consulta)

FIN

Algoritmo 5.3.Modificar datos user.

5.2.4. Algoritmos para crear o modificar proyectos.

Desde el panel de usuario, los usuarios registrados en el sistema podrán crear y

modificar sus contenidos. Tanto a crear como a modificar el contenido, se llama desde el

formulario de contenidos en el panel de usuario. El sistema reconocerá si tiene que crear o

modificar según los parámetros que se le pasa el formulario.

FUNCION modificar_crear_project(parámetroProject)

INICIO

project = parametroProject

Si (project.id == 0)

consulta = “INSERT INTO Project project”

ejecutar consulta

Si no



130

consulta = “UPDATE Project SET Project.parametros =

project.parametros WHERE Project.id == project.id”

Fin Si

FIN

Algoritmo 5.4. Modificar/crear proyectos.

5.2.5. Algoritmos para crear o modificar usuarios.

Desde el panel de usuario, los usuarios con rol de administrador podrán crear y

modificar todos los usuarios registrados en el sistema. Tanto a crear como a modificar los

usuarios, se llama desde el formulario de usaurios en el panel de usuario. El sistema

reconocerá si tiene que crear o modificar según los parámetros que se le pasa el formulario.

FUNCION modificar_crear_usuario(parámetroUsuario)

INICIO

usuario = parametroUsuario

Si (usuario .id == 0)

consulta = “INSERT INTO User usuario ”

ejecutar consulta

Si no

consulta = “UPDATE User SET User.parametros = usuario .parametros

WHERE User.id == usuario .id”

Fin Si

FIN

Algoritmo 5.5. Modificar/crear usuarios.

5.2.6. Algoritmo para crear una red neuronal

Desde la página de redes neuronales cualquier usuario de la web puede crear redes

neuronales mediante un formulario. Veamos el método que crea estas redes en el sistema.



131

FUNCION CREAR_RED(parametroNick, parameteroTitulo, parameteroFichero)

INICIO

nick = parametroNick

titulo = parametroTitulo

fichero = parámetroFichero

Si fichero.extension = “gexf”

nombreFichero = copiarFicheroToServer()

consulta = “INSERT INTO redes red”

devolver éxito

fin Si

devolver fracaso

FIN

Algoritmo 5.6. Crear red neuronal.

5.2.7. Método para hacer logout en el sistema.

Una vez estamos logados en el sistema, podemos borrar nuestra sesión de login y

hacer un logOut. Esto se hace desde la pantalla de panel de usuario. Lo único que hace el

algoritmo es borrar la variable de sesión Variable_sesion_id y redirige al usuario a la página

principal.



132



133

6. Pruebas

En este capítulo se va a hablar de las pruebas que se han realizado al proyecto durante

su desarrollo [23]. Se han realizado pruebas de tres tipos, de validación, de unidad y

desarrollo que detallaremos a continuación.

Durante el desarrollo del proyecto es necesaria la ejecución de estas pruebas, para,

primero, garantizar que se cumplan los objetivos del proyecto, y segundo, corregir los

distintos errores que pueden ir surgiendo.

Mediante el tutor del proyecto se han llevado a cabo las pruebas de validación. Se ha

comprobado que el sistema cumplía los requisitos iniciales del proyecto además de dar

feedback como usuario de la página web y localizar posibles errores. Estas modificaciones se

han ido corrigiendo durante el desarrollo del proyecto y también al finalizar el mismo.

Las pruebas de unidad se han realizado durante el desarrollo del proyecto con el

framework Jasmine, y nos han servido para comprobar que no existan errores de código.

Por último las pruebas de integración se han realizado al final del proyecto y nos han

permitido comprobar que el sistema funciona tal y como lo habíamos diseñado tanto en los

diagramas de uso, de secuencia y storyboards.

6.1. Pruebas de validación

En este apartado se va a detallar las pruebas de validación realizadas durante el

desarrollo del proyecto como las decisiones tomadas para solucionarlas con el fin de que la

aplicación cumpla con los requisitos funcionales y no funcionales especificados al inicio del

mismo.

1. Requisitos funcionales

a. Requisitos generales del sistema web.



134

Requisito necesario: Debe ser posible logearse al sistema como administrador

o como miembro del equipo.

Solución del sistema: En el sistema es posible logearse en el sistema mediante

un formulario de acceso introduciendo un email y una contraseña. Hay 2 roles de

usuarios, el rol de administrador, que lo tiene Jorge Sepulcre, y el rol de miembro, que

lo tienen todos aquellos usuarios dados de alta por el administrador.

b. Requisitos de la sección del administrador.

i. Añadir miembros al equipo de investigación.

Requisito necesario: El administrador debe poder añadir, modificar y

desactivar miembros.

Solución del sistema: Desde el panel de usuario, el administrador y solo

él. puede crear nuevos miembros, modificar los que ya hay, y desactivarlos, y

todo desde el mismo formulario de usuarios.

ii. Crear, desactivar y modificar cualquier información de la web.

Requisito necesario: El administrador debe poder crear, modificar y

desactivar cualquier contenido de la web.

Solución del sistema: Desde el panel de usuario, el administrador puede

crear, modificar y desactivar cualquier contenido de la web, y todo desde el

mismo formulario de contenido.

c. Requisitos de la sección del miembro del equipo de investigación.

i. Compartir, modificar y desactivar noticias, análisis, investigaciones

etc.

Requisito necesario: Cualquier miembro del equipo de

investigación de Jorge Sepulcre puede crear contenido, modificarlo y

desactivarlo.

Solución del sistema: Desde el panel de usuario, cualquier

miembro autorizado puede crear, modificar y desactivar su propio

contenido a través de un formulario.



135

ii. Modificar su información personal.

Requisito necesario: Todos los usuarios del sistema deben poder

modificar sus datos personales y profesionales.

Solución del sistema: Desde el panel de usuario, cualquier

miembro puede modificar sus datos a través de un formulario.

d. Requisitos de la aplicación de visualización de redes neuronales.

Requisito necesario: Deben de poder visualizarse redes neuronales compartidas

por los usuarios de la web y se deben de poder crear.

Solución del sistema: Desde la pantalla de “neural networks” se pueden

visualizar redes de otros usuarios web con tan solo pinchar en ellas. Además se pueden

compartir redes neuronales a través de un formulario añadiendo un fichero de grafo

“.gexf”.

2. Requisitos no funcionales

a. Rendimiento

Requisito necesario: Toda funcionalidad del sistema y transacción de la

página web debe responder al usuario en menos de 5 segundos.

Solución del sistema: Se ha conseguido que cualquier funcionalidad y

transacción de la página esté disponible en menos de 3 segundos.

Requisito necesario: El sistema debe ser capaz de operar

adecuadamente con hasta 100 usuarios con sesiones concurrentes.

Solución del sistema: No se ha podido probar este requisito. Se podrá

comprobar una web la página web tenga un funcionamiento normal.

Requisito necesario: Los datos modificados en la base de datos deben

ser actualizados para todos los usuarios que acceden en menos de 5 segundos



136

Solución del sistema: Todos los datos se encuentran actualizados en

tiempo real.

b. Seguridad

Requisito necesario: Los permisos de acceso al sistema podrán ser

cambiados solamente por el administrador de acceso a datos.

Solución del sistema: Ningún miembro en el sistema

puede modificar sus permisos o roles, solamente puede hacerlo el

administrador de la base de datos.

Requisito necesario: El proyecto debe desarrollarse aplicando patrones

y recomendaciones de programación que incrementen la seguridad de datos.

Solución del sistema: Todos los accesos de los usuarios se han

controlado mediante roles y permisos para incrementar la seguridad en la base

de datos.

Requisito necesario: Todos los sistemas deben respaldarse (copia de

seguridad) cada 1 semana.

Solución del sistema: Esta funcionalidad tiene que ser llevada a cabo

por el administrador del servidor proporcionado por Jorge Sepulcre.

Requisito necesario: Todas las comunicaciones externas entre

servidores de datos, aplicación y cliente del sistema deben estar encriptadas

utilizando el algoritmo RSA.

Solución del sistema: Esta funcionalidad tiene que ser llevada a cabo

por el administrador del servidor proporcionado por Jorge Sepulcre.

c. Usabilidad



137

Requisito necesario: El tiempo de aprendizaje del sistema por un

usuario deberá ser menor a 30 minutos.

Solución del sistema: Tras realizar algunas pruebas se ha estimado un

tiempo de menos de 10 minutos de aprendizaje.

Requisito necesario: El tiempo de aprendizaje del sistema por un

administrador deberá ser menor a 1 horas.

Solución del sistema: Tras realizar algunas pruebas se ha estimado un

tiempo de menos de 10 minutos de aprendizaje.

Requisito necesario: La tasa de errores cometidos por el usuario deberá

ser menor del 1% de las transacciones totales ejecutadas en el sistema.

Solución del sistema: Tras el periodo de aprendizaje, la tasa de errores

del usuario se encuentra entre un 1% y un 5%.

Requisito necesario: El sistema debe contar con manuales de usuario

estructurados adecuadamente.

Solución del sistema: Se ha creado un manual de usuario explicando

todas las funcionalidades y posibles acciones del sistema.

Requisito necesario: El sistema debe proporcionar mensajes de error

que sean informativos y orientados a usuario final.

Solución del sistema: Todas las transiciones y acciones de los usuarios

tiene un feedback por parte del servidor, notificando o informando al usuario

de la resolución de la acción desempeñada.



138

Requisito necesario: La aplicación web debe poseer un diseño

“Responsive” a fin de garantizar la adecuada visualización en múltiples

ordenadores, teléfonos y tablets.

Solución del sistema: Se ha diseñado la web un diseño responsive para

garantizar la adecuada visualización en móviles y tabletas.

Requisito necesario: El sistema debe poseer interfaces gráficas bien

formadas.

Solución del sistema: El sistema tiene un diseño gráfico entendible,

bien estructurado y de fácil compresión.

Requisito necesario: El sistema debe estar en idioma inglés.

Solución del sistema: Todo el sistema y textos están en inglés.

Requisito necesario: El sistema debe poder ser administrado por el jefe

del grupo de investigación sin necesidad del desarrollador del proyecto.

Solución del sistema: Todos los contenidos y usuarios del sistema son

controlados por el administrador del sitio web a excepción del contenido

estático de las páginas.

d. Escalabilidad

Requisito necesario: El sistema se desarrollará de forma que se

visualice correctamente en cualquier navegador.

Solución del sistema: El sistema se visualiza correctamente en

cualquier navegador o dispositivo.



139

Requisito necesario: El sistema debe estar en capacidad de permitir en

el futuro el desarrollo de nuevas funcionalidades, modificar o eliminar

funcionalidades después de su construcción y puesta en marcha inicial.

Solución del sistema: El sistema permitirá su modificación o añadido

de funcionalidades en cualquier momento debido a su programación limpia y

estructurada de forma que cualquier desarrollador pueda continuar el proyecto

en un futuro.

e. Facilidad para las pruebas

Requisito necesario: El sistema debe contar con facilidades para la

identificación y la localización de los errores durante la etapa de pruebas y de

operación posterior.

Solución del sistema: A través de los ficheros de errores se ha podido

validar el sistema permitiendo la fácil corrección de errores.

f. Mantenibilidad

Requisito necesario: Toda el sistema deberá estar completamente

documentado, cada uno de los componentes de software que forman parte de la

solución propuesta deberán estar debidamente documentados tanto en el código

fuente como en los manuales de administración y de usuario.

Solución del sistema: Tanto el código como el manual de usuario

detallan completamente todas las funcionalidades del sistema.

Requisito necesario: El sistema debe estar en capacidad de permitir en

el futuro su fácil mantenimiento con respecto a los posibles errores que se

puedan presentar durante la operación del sistema.

Solución del sistema: El sistema contiene un log, que informará de

cualquier error que se produzca.

g. Validación de la información



140

Requisito necesario: El sistema debe validar automáticamente la

información contenida en los formularios de ingreso. En el proceso de

validación de la información, se deben tener en cuenta aspectos tales como

obligatoriedad de campos, longitud de caracteres permitida por campo, manejo

de tipos de datos, etc.

Solución del sistema: Todos los formularios del sistema están validados

de forma que que no se produzcan errores o inconsistencias en la base de datos.

6.2. Pruebas de unidad

En este apartado se van a detallar las pruebas de unidad que hemos realizado durante

el desarrollo del proyecto. Las pruebas unitarias nos proporcionan La capacidad de encontrar

errores a tiempo, minimizar los comportamientos programáticos anómalos, corregirlos sin

que se produzca efecto bola de nieve en nuestro desarrollo, aumentar la calidad en nuestros

programas y así maximizar la satisfacción del cliente.

En nuestro caso, las pruebas unitarias nos han servido para controlar el flujo de datos

entre la parte del cliente y el servidor y entre el servidor y la base de datos, es decir, los

intercambios de datos entre los formularios y los controladores, los controladores con las

vistas y los controladores con la base de datos.

Cada una de las funciones de flujo de datos ha sido analizada y validada por separado,

buscando cualquier tipo de error, bug o mal funcionamiento mediante pruebas de caja blanca,

es decir, pruebas que pondrán a prueba cada una de las funciones en situaciones extremas y no

corrientes verificando la integridad y consistencia de las mismas.

● ChekLogin

En este formulario de login se han realizado las siguientes pruebas:



141

● Introducir algún campo vacío, o los 2 vacíos, y enviar los datos: El sistema nos

indica que no es posible enviar los datos ya que faltan campos del formulario

sin rellenar.

● Introducir una cadena de texto que no sea email en el campo email: El sistema

nos indica que que no es posible enviar los datos ya que el campo email no

tiene el formato de un email.

También se ha analizado las respuestas de la base de datos:

● Si el usuario no se encuentra en la base de datos: El sistema informa al usuario

que ha introducido unos datos que no corresponden con ningún usuario

registrado.

● Comprueba usuario logado

Es posible introducir la dirección url del panel de usuario directamente en el

navegador, por esto se desea que usuarios que no se han logado previamente en el sistema

accedan a esta pantalla.

Se ha probado:

● Logarse y en otra ventana del navegador poner la url de la página del panel de

usuario a mano: El sistema reconoce que el usuario está logado, y muestra el

contenido de la página solicitada.

● No logarse y entrar directamente a la página del panel de usuario: El sistema

detecta que no se ha logado previamente y redirige a la página de login.

● Visualizar redes neuronales

Lo que se ha probado en esta función es qué pasaría si un fichero de grafo se eliminara

del servidor y se intentara visualizar el grafo desde la web. El resultado de la prueba es que el

sistema no muestra nada, pero no informa de la inconsistencia de datos.

Solución: Si el fichero que intenta leer el sistema no se encuentra en el servidor el

sistema debe de informar al usuario.

● Crear redes neuronales

En el formulario de crear redes neuronales se han realizado las siguientes pruebas:



142

● Introducir algún campo en blanco: El sistema te avisa que faltan campos

obligatorios por rellenar.

● Introducir un fichero que no tenga extensión correcta: El sistema te avisa que

no se ha podido enviar el formulario porque los datos son erróneos.

● Modificar datos de usuario

En este formulario de modificar los datos del usuario del panel de usuario se han

realizado las siguientes pruebas:

● Se han introducido los campos obligatorios vacíos: El sistema te avisa que no

se ha podido enviar el formulario porque los datos son erróneos.

● Se han introducido cadenas de texto que no son direcciones web en los campos

que lo pide: El sistema te avisa que no se ha podido enviar el formulario

porque los datos no tienen el formato deseado.

● Crear/modificar users

En este formulario disponible solo para el administrador desde su panel de usuario se

han realizado las siguientes pruebas:



● Introducir una cadena de texto que no sea email en el campo email: El sistema

nos indica que que no es posible enviar los datos ya que el campo email no

tiene el formato de un email.

● Crear/modificar projects

En este formulario se ha comprobado:



● LogOut



143

En esta función se va a comprobar si una vez hecho un cierre de sesión, podemos

entrar al panel de usuario mediante su dirección url: El sistema nos redirige a la página

principal.

6.3. Pruebas de de integración

Las pruebas de integración nos permite validar que todo el sistema funciona tal y

como esperamos. Estas pruebas se han realizado una vez finalizado el desarrollo del proyecto.

A continuación se detallan todas las pruebas de integración que se han realizado en el

sistema.

● Login

Paso 1: Pinchar en “Panel de usuario” en el header de la página.

Resultado esperado: Aparece el formulario de login.

Resultado obtenido: Se obtiene el resultado esperado.

Paso 2: Introducir los datos en el formulario y pinchar en enviar.

Resultado esperado: Si hemos introducido los datos correctamente nos redirige a la

pantalla de panel de usuario, si no, el sistema nos indica el error.


● Visualizar projects

Paso 1: Pinchar en “Projects” en el header de la página.

Resultado esperado: El sistema muestra la página de proyectos.


Paso 2: Seleccionar un proyecto.

Resultado esperado: El sistema redirige a la página de detalles del proyecto

seleccionado.




144

● Visualizar página about us

Paso 1: Seleccionar “About us” en el header de la página.

Resultado esperado: El sistema redirige a la página “About us”.


● Visualizar redes neuronales

Paso 1: Seleccionar “Redes neuronales” en el header de la página.

Resultado esperado: El sistema redirige a la página de redes neuronales


Paso 2: Seleccionar una red neuronal.

Resultado esperado: El sistema muestra el grafo de la red neuronal seleccionada.


● Crear redes neuronales

Paso 1: Seleccionar “Redes neuronales” en el header de la página.

Resultado esperado: El sistema redirige a la página de redes neuronales


Paso 2: Pinchar en “Crear red neuronal”.

Resultado esperado: El sistema muestra el formulario para crear red neuronal.


Paso 3: Rellenar los datos y pinchar en enviar.

Resultado esperado: Si hemos introducido los datos correctamente el sistema nos

recargará la página y nos mostrará de nuevo las redes neuronales, si no, el sistema nos

indica el error.


● Modificar datos de usuario

Paso 1: Rellenar el formulario de modificar datos de usuario del panel de usuario y pinchar en

enviar.



145

Resultado esperado: Si hemos introducido los datos correctamente el sistema nos

indicará que se han modificado los datos con éxito, si no, el sistema nos indica el error.


● Crear/modificar users

Paso 1: Pinchar en un usuario para modificarlo o en “crear nuevo usuario” para crear uno

nuevo.

Resultado esperado: El sistema muestra el formulario de usuarios.


Paso 2: Rellenar los datos del formulario y pinchar en enviar.

Resultado esperado: Si se han rellenado los campos correctos el sistema nos indicará

que el usuario se ha guardado correctamente, si no, nos indicará que se ha producido

un error.


● Crear/modificar projects

Paso 1: Pinchar en un proyecto para modificarlo o en “crear nuevo proyecto” para crear uno

nuevo.

Resultado esperado: El sistema muestra el formulario de proyectos.


Paso 2: Rellenar los datos del formulario y pinchar en enviar.

Resultado esperado: Si se han rellenado los campos correctos el sistema nos indicará

que el usuario se ha guardado correctamente, si no, nos indicará que se ha producido

un error.


● LogOut

Paso 1: Pinchar el logout en el panel de usuario.

Resultado esperado: El sistema nos redirigirá a la página principal de la web.




146



147

7. Manual de usuario

En este capítulo describiremos el manual de usuario centrándonos en cada una de las

distintas funcionalidades y pantallas del programa.

7.1. Acceso al sitio web

Para acceder al sitio web hay que introducir en el navegador la siguiente dirección

URL:

http://gcmiweb.mgh.harvard.edu/jorge/Proyecto/tfg/tfg/web/index.php

Una vez hemos accedido al sitio, la estructura de sus páginas y pantallas será similar:

Arriba tenemos el menú donde cambiar de distintas páginas, abajo tenemos el footer donde

encontraremos información de contacto del centro y otro menú.

Imagen 7.1. Acceder al sitio web.

http://gcmiweb.mgh.harvard.edu/jorge/Proyecto/tfg/tfg/web/index.php



148

7.2. Acceder a los proyectos publicados

Para acceder a los proyectos que hay disponibles en la web, hay que pulsar en el menú

en el apartado de “Project”. El sistema nos cargará todos los proyectos que hay disponibles

hasta el momento. Para poder visualizar en detalle cualquiera de los proyectos, hay que clickar

sobre uno de ellos. Después de seleccionar algún proyecto, el sistema nos redirigirá a la

pantalla de detalle del proyecto.

Imagen 7.2. Acceder a los proyectos publicados.



149

7.3. Acceder a la página de “Sobre nosotros”

Para acceder a la página de “Sobre nosotros” hay que hacer click en cualquiera de los

menús en el apartado de “About us”. El sistema nos redirigirá a la página de “About us”. Para

consultar información personal de cualquiera de los miembros del equipo de investigación, tan

solo hay que desplazar el ratón encima de ellos, y el sistema nos mostrará alguna información

personal de ellos, como su página de facebook o twitter.

Imagen 7.3. Acceder a la página Sobre nosotros.

7.4. Crear y visualizar redes neuronales

Para acceder a la sección de redes neuronales, hay que hacer click en cualquiera de los

menús en el apartado de “Neural Networks”. El sistema nos redirigirá a la página de redes

neuronales, donde podremos visualizar redes neuronales compartidas por otros usuarios como

crear las nuestras propias.



150

Para visualizar una red neuronal, hay que hacer click sobre una de las de la lista que el

sistema nos ofrece. Una vez hecho click, el sistema nos mostrará la red a la derecha de la

pantalla. Podemos hacer zoom y movernos por la red usando el ratón.

Imagen 7.4. Visualizar redes neuronales.

Para crear una red neuronal, hay que hacer click en el primer elemento de la

lista de redes “Create neural network”. El sistema nos mostrará un formulario de

creación de la red. En este formulario debemos de introducir un Nick que será el

nombre que se mostrará como autor de la red neuronal, un título que será el título de

nuestra red, y debemos de adjuntar un archivo con la extensión .GEXF que es el

formato que lee el sistema para representar redes neuronales.



151

Imagen 7.5. Crear redes neuronales.

7.5. Acceder al panel de usuario

Para acceder al panel de usuario hay que hacer click en cualquiera de los menús en el

apartado de “User panel”. El sistema nos mostrará el formulario de acceso al panel de usuario.

En este formulario hay que introducir nuestro email y nuestra contraseña, y presionar en

enviar. Si los datos son correctos el sistema nos redirigirá al panel de usuario.



152

Imagen 7.6. Acceder a la página de usuario.

7.6. Modificar los datos de usuario

Para modificar nuestros datos de usuario, primero debemos de hacer login en el

sistema. En la página del panel de usuario, nos muestra primer nuestros datos de usuario en un

formulario, pudiendo cambiar cualquiera de ellos simplemente modificándolos directamente y

pulsar en “Save data”. El sistema nos notificará si se han guardado bien los datos o si por el

contrario hay algún error en el formulario.

Imagen 7.7. Modificar datos de usuario.



153

7.7. Crear y modificar tus proyectos

Para crear nuevo contenido y modificar el que ya tienes creado, hay que hacerlo desde

el panel de usuario. Una vez en el panel de usuario buscamos el bloque de nuestros proyectos.

Para crear nuevo contenido tenemos que pulsar en “Create new project”. El sistema nos

mostrará el formulario de proyectos. Para terminar el proceso de creación del proyecto

tenemos que rellenar el formulario y pulsar en “Save project”. Para modificar un proyecto que

ya tenemos creado, hay que pulsar en el proyecto que queremos modificar. El sistema nos

abrirá el formulario de modificación de proyectos. Para terminar de modificar el proyecto,

tenemos que modificar los campos del formulario y finalmente pulsar en “Save project”.

Imagen 7.8. Modificar/crear proyecto.

7.8. Crear y modificar los usuarios

Para crear nuevo usuario y modificar el que ya tienes creado, hay que hacerlo desde el

panel de usuario y solo si somos administradores del sitio web. Una vez en el panel de usuario

buscamos el bloque de los usuarios del sistema. Para crear un nuevo usuario tenemos que

pulsar en “Create new user”. El sistema nos mostrará el formulario de usuarios. Para terminar

el proceso de creación del usuario tenemos que rellenar el formulario y pulsar en “Save user”.



154

Para modificar un usuario que ya tenemos creado, hay que pulsar en el usuario que queremos

modificar. El sistema nos abrirá el formulario de modificación de usuario . Para terminar de

modificar el usuario , tenemos que modificar los campos del formulario y finalmente pulsar en

“Save user”.

Imagen 7.9. Modificar/crear usuario.

7.9. Logout

Para cerrar la sesión actual, hay que hacer click en “LogOut” desde el panel de usuario.



155

Imagen 7.10. LogOut.



156



157

8. Manual de instalación

En este capítulo se va a detallar el contenido del pen drive, que contiene toda la

documentación relativa al proyecto, así como todos los archivos necesarios para instalar el

proyecto en cualquier servidor. Además se explicará como instalar la página web en un

servidor local.

En el cd se encuentra el siguiente contenido:

● Carpeta Documentación: contiene la memoria del proyecto en formato PDF, con el

nombre “Memoria.pdf”. Se incluyen también varias carpetas:

○ Casos de uso:

○ Diagrama de secuencia:

○ Diseño de la Base de datos:

○ Pantallas:

○ StoryBoards:

● Carpeta “Desarrollo”: Incluye una subcarpeta llamada “WebLaboratorioInvestigacion”

que contiene las siguientes carpetas:

○ Los ficheros HTML de la aplicación.

○ En la carpeta “Web” se encuentran los archivos JS y las imágenes de la

misma.

○ En la carpeta “src” se encuentran los ficheros PHP de la parte servidor de la

aplicación.

○ La carpeta “.git” contiene la configuración del repositorio Git utilizado durante

el desarrollo de la aplicación con SourceTree.

Además se incluye otra subcarpeta “Base de Datos” dentro de la carpeta “Desarrollo”

que contiene el fichero de creación de la base de datos con la información necesaria para

testear la aplicación.



158

Para instalar la página web en un servidor local hay que seguir los pasos:

1. Necesitamos descargar Xampp, que contiene todo el software necesario para

crear un servidor local donde poder alojar nuestro proyecto. Podemos

descargar Xampp desde el siguiente enlace:

https://www.apachefriends.org/es/index.html

2. Una vez descargado e instalado Xampp, copiamos la carpeta

“WebLaboratorioInvestigación” del pen drive en la carpeta “htdocs” de

Xampp.

3. Ejecutamos el programa Xampp, e iniciamos los servicios “Apache” y

“MySql” como se muestra en la siguiente imagen.

Imagen 8.1. Iniciar Xampp.

4. Por último, necesitamos crear nuestra base de datos en el servidor de SQL.

Para ello vamos a la siguiente dirección URL:

localhost/phpmyadmin/

https://www.apachefriends.org/es/index.html



159

e importamos el archivo de creación de base de datos que se encuentra en el

pen drive, tal y como se muestra en la siguiente imágen.

Imagen 8.2. Importar base de datos.

La base de datos se creará con un administrador para poder acceder a la

aplicación cuyo email es [email protected] y contraseña “123132e”. Con este

administrador se podrá añadir nuevos miembros desde la aplicación.

5. Después tenemos que configurar el archivo de los parámetros de conexión de

la base de datos con nuestros datos. El archivo es

WebLaboratorioInvestigacion/config/parameters.yml y tenemos que cambiar

los parámetros:

○ user: El usuario de nuestra base de datos

○ password: La contraseña del usuario.

Con esto tendríamos finalizada la instalación del proyecto en nuestro servidor local.

Para ver nuestra web tenemos que dirigirnos a la siguiente URL:

localhost/WebLaboratorioInvestigacion/web/index.php

mailto:[email protected]



160



161

9. Conclusiones

Después de realizar el proyecto y analizando tanto los requisitos iniciales del mismo

como las pruebas de validación, se puede decir que se han cumplido todos los propósitos que

planteamos en el primer capítulo. Hemos logrado crear un sitio web para el equipo de

investigación de Jorge Sepulcre, en el que pueden darse a conocer a todo el mundo a través de

sus proyectos. Además hemos creado un portal en el que usuarios de todo el mundo pueden

compartir sus redes neuronales, poniendo en contacto tanto a científicos como a aficionados.

La principal dificultad que ha planteado el proyecto ha sido la creación y visualización

de redes neuronales. Por una parte, ha supuesto un problema decidir los datos de entrada y en

qué formato deben de estar esto para la creación de redes neuronales, y por otra parte, ha

supuesto mucho tiempo el desarrollo y uso de las tecnologías [24] para visualizar estas redes

neuronales en la página web, ya que se ha necesitado mucho tiempo para documentarse en

tales tecnologías y aprender su funcionamiento.

Otra dificultad que se ha presentado se encuentra en el servidor que nos ha facilitado el

equipo de investigación de Jorge Sepulcre, que tiene sus recursos muy desactualizados, lo que

nos ha impedido poder usar las últimas tecnologías webs y esto nos ha lastrado a la hora de

configurar y usar estas.

El uso de buenas prácticas y de tecnologías apropiadas nos ha facilitado mucho la

tarea de crear un sitio web responsive adaptado a todo tipo de dispositivos, además de la

creación de una web usable, fácil de usar, rápida y con total seguridad interna de datos. Por

otra parte el uso del framework Silex ha sido un acierto, debido a la rapidez con la que el

equipo de desarrollo ha adquirido los conocimientos para dominarlo y configurarlo y la fácil

puesta a punto del proyecto que presenta.

Por último, todas las pruebas que se han realizado han servido para detectar todos los

errores de desarrollo y han permitido comprobar que se iban cumpliendo cada uno de los

requisitos propuestos.



162

9.1. Propuestas de mejora

En este capítulo se van a proponer posibles mejoras del sitio web.

● Una posible mejora sería dar la posibilidad de que el administrador pueda modificar

completamente los textos estáticos de todas las páginas de la web.

● Dar la posibilidad a los usuarios de resetear sus contraseñas en caso de pérdida sería

otras propuesta de mejora.

● Otra posible mejora sería estructurar los contenidos según su temática o crear un

sistema de búsqueda de contenido por tags.

● La traducción del sitio web a otros idiomas sería una gran idea para mejorar la web.

● Se puede mejorar y optimizar la creación de redes neuronales permitiendo que se

puedan importar ficheros de más formatos, no solo el “.gexf”.



163

10. Bibliografía

[1] Red Neuronal

http://www.monografias.com/trabajos38/redes-neuronales/redes-neuronales.shtml

https://es.wikipedia.org/wiki/Red_neuronal_artificial

[2] Comando para conocer el hardware de tu equipo

http://blog.desdelinux.net/comandos-para-conocer-el-sistema-identificar-hardware-y-algunas-

configuraciones-de-software/

http://www.azanweb.com/es/como-saber-cuantos-procesadores-y-nucleos-tiene-una-maquina-

linux/

[3] Requerimientos funcionales y no funcionales

http://www.pmoinformatica.com/2015/05/requerimientos-no-funcionales-ejemplos.html

https://es.scribd.com/doc/37187866/Requerimientos-funcionales-y-no-funcionales

[4] Wordpress

http://aukera.es/blog/ventajas-e-inconvenientes-de-usar-wordpress-para-mi-sitio-web/

https://es.wikipedia.org/wiki/Sistema_de_gesti%C3%B3n_de_contenidos

https://es.wikipedia.org/wiki/WordPress

[5] Joomla

http://www.monografias.com/trabajos38/redes-neuronales/redes-neuronales.shtml

https://es.wikipedia.org/wiki/Red_neuronal_artificial

http://blog.desdelinux.net/comandos-para-conocer-el-sistema-identificar-hardware-y-algunas-configuraciones-de-software/

http://blog.desdelinux.net/comandos-para-conocer-el-sistema-identificar-hardware-y-algunas-configuraciones-de-software/

http://www.azanweb.com/es/como-saber-cuantos-procesadores-y-nucleos-tiene-una-maquina-linux/

http://www.azanweb.com/es/como-saber-cuantos-procesadores-y-nucleos-tiene-una-maquina-linux/

http://www.pmoinformatica.com/2015/05/requerimientos-no-funcionales-ejemplos.html

https://es.scribd.com/doc/37187866/Requerimientos-funcionales-y-no-funcionales

http://aukera.es/blog/ventajas-e-inconvenientes-de-usar-wordpress-para-mi-sitio-web/

https://es.wikipedia.org/wiki/Sistema_de_gesti%C3%B3n_de_contenidos

https://es.wikipedia.org/wiki/WordPress



164

http://www.pymenetworks.es/blog/ventajas-y-desventajas-de-los-cms-i-joomla

http://www.epoint.es/web/categoria/web/pub/cuales-son-ventajas-y-desventajas-de-joomla-y-

de-wordpress/

http://www.webdesigncuba.net/ventajas-y-desventajas-de-joomla


[6] Drupal

http://www.acmservitec.com/ventajas-y-desventajas-de-drupal/

http://www.catrian.com/drupal-pros-y-contras/

http://infogutierrez26.bligoo.com/ventajas-y-desventajas-de-drupal#.V0ypGfmLSM8

[7] ASP.NET

http://jordisan.net/blog/2006/que-es-un-framework/

https://www.youtube.com/watch?v=HBANJh1cNPw

https://highscalability.wordpress.com/2010/02/03/cuando-usar-asp-net-mvc/

[8] Codeigniter

http://www.adwe.es/codigo/codeigniter-framework-php-desarrollo-aplicaciones-web

http://blogs.ua.es/jorgeparent/2009/11/24/que-nos-ofrece-codeigniter-frente-a-otros-

frameworks/

http://www.blogdephp.com/5-razones-para-programar-con-el-framework-php-codeigniter/

[9] Symfony

http://www.pymenetworks.es/blog/ventajas-y-desventajas-de-los-cms-i-joomla

http://www.epoint.es/web/categoria/web/pub/cuales-son-ventajas-y-desventajas-de-joomla-y-de-wordpress/

http://www.epoint.es/web/categoria/web/pub/cuales-son-ventajas-y-desventajas-de-joomla-y-de-wordpress/



http://www.acmservitec.com/ventajas-y-desventajas-de-drupal/

http://www.catrian.com/drupal-pros-y-contras/

http://infogutierrez26.bligoo.com/ventajas-y-desventajas-de-drupal#.V0ypGfmLSM8

http://jordisan.net/blog/2006/que-es-un-framework/

https://www.youtube.com/watch?v=HBANJh1cNPw

https://highscalability.wordpress.com/2010/02/03/cuando-usar-asp-net-mvc/

http://www.adwe.es/codigo/codeigniter-framework-php-desarrollo-aplicaciones-web

http://blogs.ua.es/jorgeparent/2009/11/24/que-nos-ofrece-codeigniter-frente-a-otros-frameworks/

http://blogs.ua.es/jorgeparent/2009/11/24/que-nos-ofrece-codeigniter-frente-a-otros-frameworks/



165

http://symfony.es/pagina/que-es-symfony/

http://javiernegreira.com/blog/2014/09/por-que-symfony/

http://www.ferruiz.com/wp-content/uploads/2008/04/sym.pdf

[10] Silex

http://librosweb.es/libro/silex/capitulo_1.html

[11] Casos de uso

http://www.sparxsystems.com.ar/resources/tutorial/use_case_model.html

http://www.ctr.unican.es/asignaturas/mc_oo/doc/casos_de_uso.pdf

[12] Diagramas de caso de uso

http://www.slideshare.net/jpincay/diagramas-de-caso-de-uso-ejemplos

[13] BOE

https://www.boe.es/boe/dias/2015/02/11/pdfs/BOE-A-2015-1343.pdf

[14] PC Componentes

http://www.pccomponentes.com/configurador.php

http://symfony.es/pagina/que-es-symfony/

http://javiernegreira.com/blog/2014/09/por-que-symfony/

http://www.ferruiz.com/wp-content/uploads/2008/04/sym.pdf

http://librosweb.es/libro/silex/capitulo_1.html

http://www.sparxsystems.com.ar/resources/tutorial/use_case_model.html

http://www.ctr.unican.es/asignaturas/mc_oo/doc/casos_de_uso.pdf

http://www.slideshare.net/jpincay/diagramas-de-caso-de-uso-ejemplos

http://www.pccomponentes.com/configurador.php



166

[15] Esquemas conceptual, físico y lógico de la base de datos

https://msdn.microsoft.com/es-es/library/dd207005.aspx

https://es.wikipedia.org/wiki/Esquema_de_una_base_de_datos

http://www.slideshare.net/claudiachiri/base-de-datos-diseo-conceptuallogico-y-fisico

http://elies.rediris.es/elies9/5-2.htm

http://www.alegsa.com.ar/Dic/esquema%20conceptual%20de%20base%20de%20datos.php

http://elvex.ugr.es/idbis/db/docs/design/5-logical.pdf

http://www3.uji.es/~mmarques/f47/teoria/tema7.pdf

https://www.youtube.com/watch?v=_SADhrQD5bY

http://www.alegsa.com.ar/Dic/dise%C3%B1o%20fisico%20de%20bases%20de%20datos.php

http://adimen.si.ehu.es/~rigau/teaching/EHU/ABD/Altres%20cursos/mjortin/bd_t10_df.pdf

http://www.ati.es/spip.php?article1105

http://www.mitoledo.com/dai/Recursos/Te0511Transformaci%F3n%20de%20esquemas.pdf

http://www.slideshare.net/josecuartas/transformar-modelo-entidad-relacion-a-modelo-logico

[16] Normalización Base de datos

https://es.wikipedia.org/wiki/Normalizaci%C3%B3n_de_bases_de_datos

https://support.microsoft.com/es-es/kb/283878

http://cnx.org/contents/qtZsLi-X@1/Un-ejemplo-simple-de-normaliza

http://www.slideshare.net/MARORISY/bases-de-datos-normalizacion


https://es.wikipedia.org/wiki/Esquema_de_una_base_de_datos

http://www.slideshare.net/claudiachiri/base-de-datos-diseo-conceptuallogico-y-fisico

http://elies.rediris.es/elies9/5-2.htm

http://www.alegsa.com.ar/Dic/esquema%20conceptual%20de%20base%20de%20datos.php

http://elvex.ugr.es/idbis/db/docs/design/5-logical.pdf

http://www3.uji.es/~mmarques/f47/teoria/tema7.pdf

https://www.youtube.com/watch?v=_SADhrQD5bY

http://www.alegsa.com.ar/Dic/dise%C3%B1o%20fisico%20de%20bases%20de%20datos.php

http://adimen.si.ehu.es/~rigau/teaching/EHU/ABD/Altres%20cursos/mjortin/bd_t10_df.pdf

http://www.ati.es/spip.php?article1105

http://www.mitoledo.com/dai/Recursos/Te0511Transformaci%F3n%20de%20esquemas.pdf

http://www.slideshare.net/josecuartas/transformar-modelo-entidad-relacion-a-modelo-logico

https://es.wikipedia.org/wiki/Normalizaci%C3%B3n_de_bases_de_datos

https://support.microsoft.com/es-es/kb/283878

http://cnx.org/contents/qtZsLi-X@1/Un-ejemplo-simple-de-normaliza

http://www.slideshare.net/MARORISY/bases-de-datos-normalizacion



167

[17] Diseño de seguridad bbdd

http://www.slideshare.net/Drakonis11/integridad-y-seguridad-en-las-bases-de-datos-

presentation

http://php.net/manual/es/security.database.design.php

[18] Diagrama de secuencia

http://www.slideshare.net/FABIANGARCIA/diagramas-de-secuencia-presentation

https://es.wikipedia.org/wiki/Diagrama_de_secuencia


http://www.slideshare.net/buster_blader99/diagrama-de-secuencia-uml

[19] HTML

http://hipertextual.com/archivo/2013/05/entendiendo-html5-guia-para-principiantes/

https://prezi.com/p3ihxxn6isb-/ventajas-y-desventajas-de-html-5/

[20] JavaSrcipt

https://es.wikipedia.org/wiki/JavaScript

http://www.maestrosdelweb.com/que-es-javascript/

http://blog.capacityacademy.com/2012/10/19/que-es-javascript-ventajas-y-desventajas/

https://www.clubensayos.com/Temas-Variados/JAVA-SCRIPT-VENTAJAS-Y-

DESVENTAJAS/222066.html

http://www.slideshare.net/Drakonis11/integridad-y-seguridad-en-las-bases-de-datos-presentation

http://www.slideshare.net/Drakonis11/integridad-y-seguridad-en-las-bases-de-datos-presentation

http://php.net/manual/es/security.database.design.php

http://www.slideshare.net/FABIANGARCIA/diagramas-de-secuencia-presentation

https://es.wikipedia.org/wiki/Diagrama_de_secuencia


http://www.slideshare.net/buster_blader99/diagrama-de-secuencia-uml

https://prezi.com/p3ihxxn6isb-/ventajas-y-desventajas-de-html-5/



168

[21] JQuery

http://elanalistasistema.blogspot.com.es/2014/08/que-es-y-para-que-sirve-jquery.html

http://blog.capacityacademy.com/2013/03/16/jquery-que-es-origenes-ventajas-desventajas/

https://nxnethosting.com/blog/jquery-que-es-que-ventajas-y-desventajas-tiene/

[22] MySql

http://www.esepestudio.com/noticias/que-es-mysql

https://mysqldaniel.wordpress.com/ventajas-y-desventajas/

https://prezi.com/nlltzpkd4jx8/ventajas-y-desventajas-de-mysql/

[23] PHP

http://www.ibrugor.com/blog/que-es-php-para-que-sirve/

http://klarimartinezbenjumea.blogspot.com.es/2011/04/ventajas-y-desventajas.html

[23] Pruebas de Software

https://es.wikipedia.org/wiki/Pruebas_de_validaci%C3%B3n

http://www.slideshare.net/cliceduca/pruebas-de-software-2420588

https://www.fing.edu.uy/tecnoinf/mvd/cursos/ingsoft/material/teorico/is09-Verificacion-

Validacion.pdf

https://www.etsisi.upm.es/node/830

http://www.ctr.unican.es/asignaturas/Ingenieria_Software_4_F/Doc/M7_09_VerificacionVali

dacion-2011.pdf

https://es.wikipedia.org/wiki/Pruebas_de_validaci%C3%B3n

http://www.slideshare.net/cliceduca/pruebas-de-software-2420588

https://www.fing.edu.uy/tecnoinf/mvd/cursos/ingsoft/material/teorico/is09-Verificacion-Validacion.pdf

https://www.fing.edu.uy/tecnoinf/mvd/cursos/ingsoft/material/teorico/is09-Verificacion-Validacion.pdf

https://www.etsisi.upm.es/node/830

http://www.ctr.unican.es/asignaturas/Ingenieria_Software_4_F/Doc/M7_09_VerificacionValidacion-2011.pdf

http://www.ctr.unican.es/asignaturas/Ingenieria_Software_4_F/Doc/M7_09_VerificacionValidacion-2011.pdf



169

http://yarelisgonzalez.blogcindario.com/2012/01/00003-tipos-de-pruebas-y-validacion-del-

software.html

https://es.wikipedia.org/wiki/Prueba_unitaria

http://www.slideshare.net/carlblakc/estrategias-de-aplicacin-de-prueba-de-unidad-integracin-

sistema-y-de-aceptacin

http://www.inf-cr.uclm.es/www/mpolo/asig/is4/madumSistema.pdf

http://www.calidadysoftware.com/testing/pruebas_unitarias1.php

http://si.ua.es/es/documentacion/c-sharp/documentos/pruebas/07pruebasunitarias.pdf

https://es.wikipedia.org/wiki/Pruebas_de_integraci%C3%B3n

https://blackpentsoft.wordpress.com/2013/02/04/test-de-integracion-vs-test-unitarios/

http://www.juntadeandalucia.es/servicios/madeja/contenido/recurso/461

http://www.slideshare.net/pablis001/estrategias-de-aplicaciones-para-las-pruebas-de-

integracin

[24] Sigma.js

http://sigmajs.org/

https://github.com/jacomyal/sigma.js/blob/master/plugins/sigma.parsers.gexf/gexf-parser.js

http://www.lexmath.com/grafos/sigma/ejemplos/gexf_example.html

https://github.com/jacomyal/sigma.js/blob/master/examples/load-external-gexf.html

https://github.com/jacomyal/sigma.js/releases/

https://marketplace.gephi.org/

http://yarelisgonzalez.blogcindario.com/2012/01/00003-tipos-de-pruebas-y-validacion-del-software.html

http://yarelisgonzalez.blogcindario.com/2012/01/00003-tipos-de-pruebas-y-validacion-del-software.html

https://es.wikipedia.org/wiki/Prueba_unitaria

http://www.slideshare.net/carlblakc/estrategias-de-aplicacin-de-prueba-de-unidad-integracin-sistema-y-de-aceptacin

http://www.slideshare.net/carlblakc/estrategias-de-aplicacin-de-prueba-de-unidad-integracin-sistema-y-de-aceptacin

http://www.inf-cr.uclm.es/www/mpolo/asig/is4/madumSistema.pdf

http://www.calidadysoftware.com/testing/pruebas_unitarias1.php

http://si.ua.es/es/documentacion/c-sharp/documentos/pruebas/07pruebasunitarias.pdf

https://es.wikipedia.org/wiki/Pruebas_de_integraci%C3%B3n

https://blackpentsoft.wordpress.com/2013/02/04/test-de-integracion-vs-test-unitarios/

http://www.juntadeandalucia.es/servicios/madeja/contenido/recurso/461

http://www.slideshare.net/pablis001/estrategias-de-aplicaciones-para-las-pruebas-de-integracin

http://www.slideshare.net/pablis001/estrategias-de-aplicaciones-para-las-pruebas-de-integracin



170

http://www.vpascual.org/blog/visualization/visualize-the-link-structure-of-your-website-

using-free-tools/



171

desarrollo de un sitio web para la gestiÓn de un...

Documents