32
2014/2015 Sergio Santos Gil & Julio Hontangas Proyecto SOJI

SOJI - Documentación

Embed Size (px)

Citation preview

2014/2015

Sergio Santos Gil & Julio Hontangas

Proyecto SOJI

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

II

DEDICATORIAS

De Sergio Santos

Dedicárselo a mis padres por darme ideas y ser mis “conejillos de

indias”.

Quiero agradecérselo a mi pareja, Laura Rodríguez Casas, por su

aportación moral, sus consejos e ideas para que el proyecto sea más

adaptable a cualquier usuario y, sobre todo, por dar su voz a nuestro

vídeo introductorio.

Dar las gracias a mi compañero de prácticas, Sergio Barón, ya que nos

hemos estado dando ideas y ayudas constantes para el proyecto y por

animarme a aprender sobre el posicionamiento de la web.

También dar las gracias a nuestro tutor, José Luis Gallego, por su

aportación en el proyecto y ayudarnos en problemas que nos han ido

surgiendo durante el proyecto.

Por último, y no menos importante, quiero agradecer a mi compañero de

proyecto, Julio Hontangas, ya que los dos hemos formado un gran

equipo y espero poder celebrar con él la buena nota, tomándonos un par

de cervezas.

De Julio Hontangas

Al finalizar este proyecto de Desarrollo de aplicaciones Web y el trabajo

en equipo quiero agradecer primeramente a Dios por habernos permitido

tener un año más de vida y darnos las capacidades necesarias para

desarrollar este proyecto académico.

También, quiero darle mi profundo agradecimiento a mis padres por

apoyarnos en cada meta que nos proponemos y brindarnos su amor, y

también darnos la oportunidad de llevar un proceso académico.

Quiero expresar mi especial y sincero agradecimiento al profesor Jose

Luis Gallego por brindarnos su conocimiento, apoyo, atención a las ideas

que nosotros proponemos en este proyecto, confianza para presentar este

trabajo y también por habernos facilitado los medios necesarios durante

el desarrollo del mismo.

Agradecer a Sergio Santos Gil por el apoyo, dedicación y tiempo al

realizar este proyecto y llegar a la culminación de esta meta propuesta

por nosotros.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

III

Proyecto SOJI

Índice

INTRODUCCIÓN ........................................................................................................................ 1

¿Por qué SOJI? ............................................................................................................................ 1

Idea ............................................................................................................................................ 1

ALCANCE DEL PROYECTO .......................................................................................................... 2

ESTUDIO DE VIABILIDAD ........................................................................................................... 3

Estado actual del sistema .......................................................................................................... 3

Requisitos del cliente .................................................................................................................. 3

Posibles soluciones ..................................................................................................................... 4

Solución elegida ......................................................................................................................... 4

Planificación temporal del proyecto SOJI ................................................................................... 5

Planificación de los recursos a utilizar ....................................................................................... 6

ANÁLISIS ................................................................................................................................... 8

Diagrama de caso de uso ........................................................................................................... 8

Modelo de datos ........................................................................................................................ 9

Modelo Entidad-Relación ...................................................................................................... 9

Modelo de Dominio ............................................................................................................... 9

Estructura de las tablas ....................................................................................................... 10

Requisitos funcionales .............................................................................................................. 12

Requisitos a corto plazo ....................................................................................................... 12

Requisitos a largo plazo ....................................................................................................... 12

Requisitos no funcionales ......................................................................................................... 13

Casos de uso ............................................................................................................................. 14

DISEÑO ................................................................................................................................... 16

Estructura de la web ................................................................................................................ 16

Arquitectura de la aplicación ................................................................................................... 17

Herramientas ........................................................................................................................... 17

Árbol estructural de la aplicación ........................................................................................ 18

PRUEBAS ................................................................................................................................ 19

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

IV

CONCLUSIONES ...................................................................................................................... 27

LICENCIA DE USO .................................................................................................................... 28

BIBLIOGRAFÍA ......................................................................................................................... 28

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

1

INTRODUCCIÓN

¿Por qué SOJI? El título del proyecto le pensamos una vez tenida la idea. SOJI es acrónimo de

Seeker Optimal Jobs IT [Information Technology] (Búsqueda Optimizada de Empleos

de la tecnología de la información).

Idea Durante este proyecto se pretende realizar una página web que ponga en

contacto a clientes (pequeñas empresas y/o personas), con informáticos freelance o

empresas, registrados en nuestra página, que ofrecen sus servicios a domicilio. Se

dispone de 3 tipos de usuario:

Anónimo – Es un usuario no registrado en la web, que dispondrá de acceso

limitado a ver las ofertas de los informáticos (no podrá ver métodos de contacto).

Clientes – Cualquier persona o empresa que desee contactar con un informático

o una empresa informática cercana a su vivienda o local donde necesita sus servicios.

Informáticos – Se trata de autónomos o empresas que ofrecen sus servicios

(reparación de equipos, formateos, limpieza de virus, recuperación de datos, desarrollo

de aplicaciones…) a los clientes que entran en la web.

Administrador – Usuario único que irá revisando los distintos usuarios, tanto

informáticos como clientes, así como todas las ofertas con la posibilidad de poder

eliminarlas y editarlas.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

2

ALCANCE DEL PROYECTO

El proyecto va destinado a usuarios domésticos o empresas que requieren la

contratación de un informático para una materia en concreto, y a informáticos que

deseen realizar trabajos por cuenta propia o ampliar su salario con un extra realizando

pequeños trabajos.

Los usuarios realizarían ofertas (trabajos que necesitan que se realicen para

ellos) y los informáticos se registrarían en las que deseen y mejor se adapten a sus

conocimientos. Después de entre todos los informáticos que se hayan inscrito los

usuarios elegirían al que desean que les realice la tarea.

La web tiene que ser lo más sencilla y adaptable posible a los usuarios, ya que

no necesitarán de conocimientos previos para poder navegar por ella. Está centrado para

aquellos clientes que no tengan un buen conocimiento de la informática.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

3

ESTUDIO DE VIABILIDAD

Estado actual del sistema Actualmente en el mercado no hemos encontrado ninguna web o sistema que

ofrezca lo que pretende conseguir nuestro proyecto. Hay

páginas similares de ofertas de empleo tipo InfoJobs pero

ninguna centrada en poner en contacto a Informáticos o

pequeñas empresas con potenciales clientes que necesitan a

alguien para que les resuelva pequeñas tareas de una duración

corta o media, como por ejemplo el reparar un ordenador,

ayudar a configurar la conexión a internet de casa… Estas

tareas se suelen llevar a cabo por conocidos con poca

experiencia en el mundo de la informática, o desplazándote a

una tienda.

Requisitos del cliente Se necesita una página web para poner en contacto a informáticos o pequeñas

empresas de informática con usuarios que requieran servicios de una duración corta o

media (entre un día y unos meses).

El cliente tiene dos tipos de objetivos: a corto plazo, en un tiempo aproximado

de entre 2 y 3 meses; y a largo plazo, en un tiempo de 6 meses aproximadamente.

A corto plazo el cliente desea:

Un formulario de registro tanto para usuarios como para informáticos,

que se puedan verificar las cuentas por emails, para que no se registren

personas reales.

Permitir a los usuarios editar y eliminar su cuenta una vez que han

iniciado sesión.

Un formulario para la creación de ofertas, con la posibilidad de dar al

cliente libertad para documentarlo.

Poder visualizar las ofertas limitando el número para poder realizar

paginaciones. Y en cada oferta, mostrar todas sus características.

Posibilidad de registrarse en una oferta si te has registrado como

informático.

Posibilidad de ver los perfiles de los informáticos inscritos en una

oferta por el usuario que la ha publicado.

Una página de contacto para que los usuarios se puedan poner en

contacto con ellos cuando tengan problemas.

Usuario administrador que puede modificar toda la página web.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

4

A largo plazo el cliente desea:

Poder filtrar las ofertas registradas a través de las provincias, por

palabras clave, experiencia y fecha de publicación.

Creación de un chat para que el cliente se ponga en contacto

inmediatamente con los informáticos que han solicitado su oferta.

Adaptar la web para todos los dispositivos.

Crear un servidor de email propio para el cliente.

Incluir la web en los distintos buscadores para darse a conocer con las

herramientas necesarias de posicionamiento.

Posibles soluciones Realizar el Proyecto mediante un CMS (Content Management System)

tipo Wordpress o Joomla.

Realizar el Proyecto mediante applets de Java con un servidor Tomcat.

Realizar el Proyecto utilizando un framework tipo CodeIgniter en php.

Solución elegida Se ha decidido realizar el proyecto en php con ayuda del framework

CodeIgniter debido a su versatilidad para poder abarcar cualquier tipo de proyecto, y

tiene una curva de aprendizaje pequeña.

Se ha descartado la opción del CMS ya que el cliente propone demasiado estilo

propio y configuraciones personalizadas, por lo que en el CMS son bastantes más

complicadas de cambiar.

La opción de utilizar applets de java se descartó debido a que es más fácil

encontrar servicios de hosting en internet con soporte para php, y los precios son más

bajos.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

5

Planificación temporal del proyecto SOJI El proyecto en sí tendrá un tiempo aproximado de 6 meses como máximo, ya

que el cliente lo desea en ese plazo con todas las

características especificadas. Se intentará dividir el

trabajo en los primeros 3 meses para poder

presentar al cliente sus objetivos a corto plazo, ya

que con dichos requisitos tienen pensado subirlo a

su servidor para que vaya funcionando.

Llevará bastante tiempo ya que hay que

documentarse con los lenguajes a utilizar y los

posibles errores que transcurrirán a lo largo del

proyecto debido a que se trata de una web desde

cero.

Se necesitará el siguiente personal:

Un diseñador gráfico para poder dar un estilo amigable a la web, que le

otorgue atractivo y sencillez para el usuario.

Un maquetador para la creación de los estilos diseñados por el

diseñador. También diseñará y realizará las distintas animaciones de la

web.

Dos programadores expertos para realizar el código fuente de la

aplicación para su correcto funcionamiento. Se dividirán el trabajo para

su rápido funcionamiento y compartirán el proyecto en un repositorio

para que puedan trabajar a la par.

Un analista, encargado de monitorizar el tráfico, controlar las campañas

online y proponer mejoras para optimizar el sitio web.

Un community manager una vez que el proyecto esté terminado, que

posicione la web en los principales buscadores, publique las novedades

en redes sociales, gestione y administre la comunidad online, cree una

idea de marca en internet…

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

6

Planificación de los recursos a

utilizar

La programación del servidor se hará a través del lenguaje PHP.

Se empelará el framework CodeIgniter, ya que es fácil su uso y ha sido

rápido el aprendizaje gracias a su guía gratuita.

Para la evaluación de los formularios y la comprobación de datos

introducidos por el cliente se empleará el lenguaje JavaScript.

Para la web se usará HTML5 y para su diseño CSS3, con animaciones y

transiciones, así como para que la web se pueda visualizar en cualquier

dispositivo.

El almacenamiento de datos se realizará gracias a la herramienta de

phpMyAdmin para la creación de la base de datos con MySQL.

El diseño y estructura de la base de datos se realizará con el software de

Workbench.

Se empleará el estilo externo de la web

http://fortawesome.github.io/Font-Awesome/ para la utilización de

sencillos iconos.

Se empleará el formato de texto de Google para que no haya problemas

a la hora de visualizar el contenido de la web por el usuario.

También se usará la librería JQuery que ayuda las sentencias del lado

cliente y la obtención de los distintos elementos de la web. Se empleará

también para las distintas animaciones de la web. Utilizaremos dos

librerías externas:

o NnicEdit que transforma las etiquetas textarea con una vista

agradable para el usuario, así como la libertad de introducir todo

el texto que desee y darle formato.

o Prefixr añade los prefijos CSS del navegador usado por el

cliente, por lo que ayuda al maquetador a no estar añadiéndolos

manualmente.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

7

Se descargará una librería de JQuery UI personalizada con el estilo de la

web para que sea más atractiva hacia el usuario.

Para la creación de logos e imágenes de la web se empleará el programa

gratuito GIMP.

Se empleará el repositorio Git para que el personal comparta el código y

puedan trabajar a la par. Para su uso se empleará el software de GitHub.

Se utilizará un hosting gratuito para realizar las distintas pruebas y

comprobar su correcto funcionamiento, para ello se empleará el servicio

de http://www.hostinger.es/.

Para que el usuario sepa de qué trata la web, se realizará un vídeo

explicativo que se mostrará una vez que el usuario acceda por primera

vez al sitio. Para ello se realizará un vídeo a través de la web

http://www.powtoon.com que se editará posteriormente con el editor

Avidemux y el sonido con Audacity.

Se usará los microdatos de https://schema.org/ que ayudará a posicionar

la web en los primeros puestos de búsqueda de los buscadores. Así como

las herramientas de posicionamiento de Google Search Console y de

Google Analytics para llevar un control de las visitas al sitio web,

Se empleará un servidor propio una vez terminado el proyecto para la

hora de crear distintos servidores como de email, DNS,…

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

8

ANÁLISIS

Diagrama de caso de uso

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

9

Modelo de datos

Modelo Entidad-Relación

Modelo de Dominio

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

10

Estructura de las tablas

INFORMÁTICOS

Nombre del campo Tipo Descripción Tamaño Obligatorio Único

idInformatico Numérico Identificador del informático 2 SI SI

codigoVerificarEmail Texto Código para verificar el registro 45 SI SI

codigoActivacion Letra Activación de la cuenta 1 SI -

usuario Texto Usuario 45 SI SI

password Texto Contraseña 150 SI -

nombre Texto Nombre 45 SI -

apellidos Texto Apellidos 50 SI -

slug Texto Título del informático (URL) 150 SI SI

foto Texto Foto de perfil 50 SI SI

fecha Fecha Fecha de nacimiento - SI -

direccion Texto Dirección 50 SI -

telefono Numérico Teléfono de contacto 9 SI -

sexo Letra Sexo 1 SI -

email Texto Correo electrónico 50 SI -

provincia Numérico Provincia 2 SI -

ciudad Texto Ciudad 50 SI -

codigoPostal Numérico Código postal 5 SI -

curriculum Texto Currículum en PDF 50 SI SI

experiencia Texto Experiencia - SI -

idiomas Texto Idiomas 50 SI -

fechaRegistro Fecha Fecha de registro - SI -

CLIENTES Nombre del campo Tipo Descripción Tamaño Obligatorio Único

idCliente Numérico Identificador del informático 2 SI SI

codigoVerificarEmail Texto Código para verificar el registro 45 SI SI

codigoActivacion Letra Activación de la cuenta 1 SI -

tipoCliente Letra Si es una empresa o particular 1 SI -

usuario Texto Usuario 45 SI SI

password Texto Contraseña 150 SI -

nombre Texto Nombre 45 SI -

apellidos Texto Apellidos 50 - -

foto Texto Foto de perfil 50 SI SI

fecha Fecha Fecha de nacimiento / fundación - SI -

direccion Texto Dirección 50 SI -

telefono Numérico Teléfono de contacto 9 SI -

sexo Letra Sexo 1 - -

email Texto Correo electrónico 50 SI -

provincia Numérico Provincia 2 SI -

ciudad Texto Ciudad 50 SI -

codigoPostal Numérico Código postal 5 SI -

fechaRegistro Fecha Fecha de registro - SI -

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

11

OFERTAS

Nombre del campo Tipo Descripción Tamaño Obligatorio Único

idOferta Numérico Identificador del informático 2 SI SI

idCliente Numérico Identificador del Cliente 2 SI SI

titulo Letra Título de la oferta 100 SI -

slug Texto Título de la oferta (URL) 200 SI SI

descripcion Texto Descripción de la oferta - SI -

fecha Fecha Fecha de creación - SI -

salario Texto Salario 50 - -

idiomas Texto Idiomas requeridos 50 - -

experiencia Numérico Experiencia requerida 2 - -

provincia Numérico Provincia 2 SI -

PROVINCIAS

Nombre del campo Tipo Descripción Tamaño Obligatorio Único

idProvincia Numérico Identificador de la provincia 2 SI SI

nombre Texto Nombre de la provincia 50 SI SI

SOLICITUDES

Nombre del campo Tipo Descripción Tamaño Obligatorio Único

idInformatico Numérico Identificador del informático 2 SI -

idOferta Numérico Identificador de la oferta 2 SI -

comentario Texto Carta de motivación

del informático

- - -

CONVERSACIONES

Nombre del campo Tipo Descripción Tamaño Obligatorio Único

idConversaciones Numérico Identificador de la conversación 2 SI SI

idCliente Numérico Identificador del cliente 2 SI -

idInformatico Numérico Identificador del informático 2 SI -

textoCliente Texto Texto del cliente - - -

textoInformatico Texto Texto del informático - - -

Claves Primarias Claves Ajenas

Informático idInformatico Informático idProvincia (Borrado restringido)

Clientes idCliente Clientes idProvincia (Borrado restringido)

Ofertas idOferta Ofertas idCliente (Borrado en cascada)

Provincias idProvincia Provincias -

Solicitudes idInformatico + idOferta Solicitudes idOferta, idInformatico (Borrados en cascada)

Conversaciones idConversaciones Conversaciones idCliente, idInformatico (Borrados en cascada)

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

12

Requisitos funcionales

Requisitos a corto plazo:

El sistema ofrecerá la posibilidad de registro a los usuarios, en los que se

diferencian dos tipos: registro de cliente y registro de informático. Una

vez registrado, podrá iniciar sesión con sus datos.

Permitirá la edición de datos del perfil una vez iniciado la sesión, así

como la posibilidad de darse de baja y eliminar su cuenta.

Para el perfil de cliente, se le ofrecerá la función de crear una oferta de

trabajo, la cual será visible para los demás usuarios.

También tendrá la posibilidad de editar las ofertas y la posibilidad de

eliminarlas una vez que hayan encontrado a un informático.

Los informáticos tendrán la oportunidad de solicitar las ofertas que más

les atraigan, con la posibilidad de enviar una carta de motivación.

Los clientes podrán revisar sus ofertas publicadas y, si la oferta ha

recibido solicitudes de informáticos, podrá visualizarlos y ver los

perfiles de los informáticos. Podrán contactar con ellos con un mensaje

que se enviará a la cuenta de correo del informático especificado.

Cuando un usuario ha perdido u olvidado su contraseña, tiene la

oportunidad de recuperar su contraseña, de forma que la aplicación

generará una cadena aleatoria para la modificación de la contraseña y

notificará al usuario con un email con la nueva contraseña.

Cualquier usuario podrá enviar un mensaje de contacto a los

propietarios de la web para cualquier duda, inflación, consulta…

Y también un mensaje en la parte de poder publicitarse con ellos

Requisitos a largo plazo:

Se podrán filtrar las ofertas a la hora de visualizarlas: por provincia,

fecha de creación, palabras claves y por experiencia.

El cliente podrá iniciar una conversación por chat con los informáticos,

que han solicitado sus ofertas. Así podrán hablar entre ellos sin necesidad

de comunicarse por otro método.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

13

Requisitos no funcionales

Diseño atractivo y fácil para que el usuario le resulte cómodo de usar.

El color principal será el verde, ya que representa a la web por ser el

color de la suerte y representar asuntos económicos.

Tiene que ser óptima para que sea una aplicación rápida para el cliente,

por lo que se intentará ahorrar líneas de código y optimizar el material

multimedia así como los distintos ficheros.

Importará la seguridad del sitio para que distintos usuarios no puedan

acceder a espacios propios de otros usuarios. También se bloqueará el

acceso a ficheros que los usuarios no tienen conocer que existen.

La web se hará portable para todos los dispositivos, así se expandirá

hacia todos los usuarios sin discriminar que dispositivo suele usar, y así

permitir que pueda acceder cuando y como quieran.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

14

Casos de uso

Nombre: Registro en la Web

Descripción: Permite registrarse en la en la página web y verificar el E-Mail

Actores: Usuario

Precondiciones: El usuario no se ha registrado antes.

Flujo Normal: 1. El usuario pulsa sobre el botón “acceder”. 2. El sistema muestra una ventana para iniciar sesión, con un tooltip en la derecha

para registrarse. 3. El usuario pulsa el tooltip. 4. El sistema muestra un primer formulario de registro con datos básicos a rellenar: Si

buscas trabajo o lo ofreces, usuario, contraseña, correo electrónico. 5. El usuario rellena los datos y pulsa en “Registrarse”. 6. El sistema muestra otro formulario con los datos ya insertados rellenados, y otros

para rellenar en función de si se busca trabajo o se ofrece. 7. El usuario rellena todos los campos, marca el check “He leído y acepto las

condiciones de uso” y pulsa sobre “Registrarse”. 8. El sistema comprueba los datos introducidos y los almacena. 9. El sistema envía un correo al usuario para confirmar su E-mail con un enlace para

activar el usuario, muestra una ventana de confirmación y pide al usuario que revise su bandeja de entrada de correo.

10. El usuario entra en su correo y abre el email mandado por el sistema. 11. El usuario hace clic en el enlace del E-mail. 12. El sistema reconoce la ruta del enlace y activa al usuario para que pueda iniciar

sesión.

Flujo Alternativo: 8.A El sistema comprueba la validez de los datos, si los datos no son correctos, se avisa al usuario de ello permitiéndole que lo corrija.

Postcondiciones: El usuario se ha registrado y puede iniciar sesión en la web.

Nombre: Contacto mediante formulario

Descripción: Envío E-mail a los administradores del sitio

Actores: Usuario

Precondiciones: El usuario se encuentra en la página principal y desea ponerse en contacto con los administradores.

Flujo Normal: 1. El usuario pulsa sobre el botón “contacto”. 2. El sistema muestra la dirección, tlf, fax, correo, mapa con información de donde se

encuentran las oficinas y un formulario de contacto. 3. El usuario rellena los campos: Nombre, E-mail, y comentarios, poniendo en este

último todo lo que desee expresar a los administradores de la web. 4. El usuario hará clic en el checkbox “no soy un robot”. 5. El sistema abre una ventana con grupos de imágenes y pedirá al usuario que

marque algunas según su criterio. 6. El usuario selecciona las imágenes y hace clic en verificar.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

15

7. El sistema comprueba la validez y cierra el cuadro de imágenes. 8. El usuario hace clic en “enviar”. 9. El sistema verifica la validez de los datos, envía un email a los administradores y

recarga la página de contacto con un mensaje de “E-mail enviado correctamente”.

Flujo Alternativo: 7.A El usuario selecciona las imágenes de forma incorrecta, el sistema muestra otro grupo de imágenes con otra condición. 9.B El sistema comprueba la validez de los datos, si los datos no son correctos, se avisa.

Postcondiciones: El usuario ha enviado un E-mail a los administradores.

Nombre: Recuperar Contraseña

Descripción: Generar nueva contrasea con la que el usuario pueda entrar y enviársela.

Actores: Usuario / Sistema

Precondiciones: El usuario se encuentra en la página principal y desea ponerse en contacto con los administradores.

Flujo Normal: 1. El usuario pulsa sobre el botón “acceder”. 2. El sistema muestra una ventana para iniciar sesión, con un mensaje en la parte

inferior “¿Olvidaste tu contraseña?” 3. El usuario pulsa el mensaje. 4. El sistema muestra un formulario donde rellenar la dirección de E-mail de la cuenta. 5. El usuario rellena el campo con su E-mail y pulsa el botón “Recuperar”. 6. El sistema comprueba la validez del E-mail insertado, que es de un usuario

existente, y le envía un correo electrónico con una contraseña nueva aleatoria.

Flujo Alternativo: 6.A Si el E-mail insertado no es válido, se informa al usuario.

Postcondiciones: El sistema ha generado una nueva contraseña para el usuario, ha guardado los

cambios en la base de datos, y ha enviado un email al usuario.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

16

DISEÑO

Estructura de la web

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

17

Arquitectura de la aplicación

Herramientas

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

18

Árbol estructural de la aplicación

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

19

PRUEBAS Fecha: 10/05/2015

Autor: Julio Hontangas Berrio

Caso de prueba: CRON

Descripción:

Un CRON es una tarea programada que se ejecuta cada cierto tiempo en un

servidor para llevar a cabo unas tareas predeterminadas.

En este caso se ha decidido crear una tarea que busque en las tablas informáticos

y clientes, los usuarios que se han registrado en la web pero no han verificado el e-mail

en siete días. Los datos de estos usuarios serán borrados automáticamente si ha

transcurrido más de una semana desde su registro.

Este cron ha sido programado para que se ejecute una vez todos los días de la

semana.

Resultado: Se ha probado a crear un usuario y cambiarle la fecha de registro a

una semana antes.

Al día siguiente dicho usuario había sido eliminado de la base de datos.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

20

Fecha: 5/06/2015

Autor: Julio Hontangas Berrio

Caso de prueba: CAPTCHA

Descripción:

Captcha es un método de seguridad para comprobar que los formularios no son

rellenados por máquinas, si no, por personas.

Pueden consistir en imágenes con caracteres que introducir o como en nuestro

caso, un grupo de imágenes de las que se deben seleccionar algunas en concreto que se

pidan.

El captcha utilizado en SOJI ha sido desarrollado por google y se ha decidido

por este ya que la mayoría de las opciones contenían un campo oculto en el formulario

con el texto del captcha a introducir y se consideraron poco seguros.

Este método se ha implementado en los formularios de publicidad y contacto

para evitar que se sature el buzón de correo de la empresa con spam.

Resultado: Una vez implementado en SOJI se procedió al envio de un E-mail a

través de los formularios, y se comprobó que existía un erroren la configuración ya que

siempre enviaba el E-mail aunque el captcha se hubiese rellenado incorrectamente.

Corrección: Para repararlo se vió que el problema era en la validación del

captcha en el controlador, se corrigió el problema, que consistía en que no se enviaban

correctamente los datos de la validación a google (faltaba la cadena secreta de

verificación).

$response=file_get_contents("https://www.google.com/recaptcha/api/siteverify?

secret=".$recaptcha_secret."&response=".$_POST['g-recaptcha-response']);

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

21

Fecha: 5/06/2015

Autor: Julio Hontangas Berrio

Caso de prueba: SUBIR IMÁGENES Y PDF´S AL SERVIDOR

Descripción:

Durante el registro es necesario que los usuarios puedan subir al servidor su

imagen de perfil y en el caso de que se registren como Informáticos, el Curriculum

Vitae en pdf.

Resultado: Se ha decidido realizar mediante la librería upload de codeigniter.

Los usuarios pueden subir los archivos que deseen como imagen en formato jpg o png,

verificado mediante javascript y además en el lado servidor mediante php. Los

Curriculum Vitae solo pueden ser enviados con formato pdf al servidor.

Se ha creado una carpeta donde se guardarán las imágenes de perfil con el

nombre del usuario al que pertenecen y el curriculum igual.

Corrección: Una vez probado y funcionando vimos que se podían subir

ficheros de cualquier tamaño, por lo que se procedión a limitar las imágenes a 1024x768

y 1Mb como máximo, y los Curriculum Vitae a 1Mb como máximo para almacenarlos

en el servidor.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

22

Fecha: 20/05/2015

Autor: Julio Hontangas Berrio

Caso de prueba: ACTIVAR USUARIO

Descripción:

Una vez que un usuario se ha registrado, debe ir a la bandeja de entrada de su E-

mail y verificar la cuenta antes de poder loguearse en la web con el usuario.

Este proceso sirve para verificar que el email proporcionado no es falso.

Se genera una cadena aleatoria de letras mayúsculas, minúsculas y números que

se guarda en la base de datos y se le envía al usuario en formato de url para que pueda

activarse. Ejemplo de enlace:

http://www.soji.besaba.com/registro/verificar/[cadena aleatoria]

Resultado: El usuario una vez registrado en la web recibe un correo donde

debe pinchar sobre un botón para verificar la cuenta. Este botón le redirige a nuestra

web, donde se verifica la cadena y cambia el estado del usuario a “activo” en la base de

datos, además, una vez verificado se le redirige a la página de perfil, donde deberá

loguearse para iniciar sesión.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

23

Fecha: última semana de abril de 2015

Autor: Sergio Santos

Caso de prueba: Vídeo introductorio

Descripción: Para que un usuario cualquiera pueda utilizar correctamente

nuestra aplicación web, se ha llevado a plantear la elaboración de un vídeo introductorio

con el fin del rápido aprendizaje del uso de la web.

Para ello, se ha planteado varias formas de realizarlo: un vídeo tutorial del uso

de la web, una presentación de PowerPoint, una secuencia de imágenes,… Pero después

de investigar, se ha descubierto la herramienta online de PowToon.

PowToon es un creador de presentaciones animadas mediante la manipulación

de objetos interactivos, como animaciones, imágenes en movimiento, música de

fondo… Es ideal para nuestro objetivo, por lo que se ha elegido para realizar nuestro

vídeo. Ha sido algo costoso de realizar ya que se ha tenido que estudiar un poco su uso.

Resultado: Una vez realizado con éxito el vídeo, se ha procedido a su

descarga, con el inconveniente de que, al ser una herramienta gratuita, aparece una

marca de agua que, para exponer a los usuarios, resulta ser desagradable.

Corrección: Para ocultar la marca de agua, se ha empleado la herramienta de

Avidemux. Con ello se ha podido ocultar la marca de agua, así como el

redimensionamiento del vídeo y la posibilidad de guardarlo con varias extensiones.

También, se ha realizado un audio con un guion descriptivo del vídeo mediante

la herramienta de Audacity, con el que se ha perfilado el sonido y se ha eliminado el

ruido de fondo.

Una vez obtenido el audio, se han unido el vídeo con el audio obteniendo un

mejor resultado de cara al usuario.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

24

Fecha: 06/05/2015

Autor: Sergio Santos y Julio Hontangas

Caso de prueba: Cookies

Descripción: Para visualizar el vídeo introductorio anterior, se ha planteado

realizarlo mediante cookies, es decir, que un usuario nuevo que acceda a la web, e le

muestre el video para explicarle el sitio, con la posibilidad de cerrarlo con un botón.

Así, los usuarios habituales a la web no tienen que visualizarlo cada vez que accedan.

Se va a realizar un fichero php en el cual, se va a pintar la parte del video en el

documento, situado el contenedor en el header, para que sea visible desde cualquier

parte de la web. En el fichero, se creará una cookie con el contenido del video, que

comprobará si el usuario tiene la cookie o no para crearla.

Mediante AJAX, se va a llamar al fichero php para comprobar si el posee la

cookie, en caso contrario se pintará en el lado cliente el contenido del video.

Resultado: El resultado ha sido nulo, no ha funcionado ya que no se ha sabido

comunicar los recursos de la vista con los ficheros del servidor creados mediante

CodeIgniter.

Corrección: Como no se ha podido averiguar cómo comunicar los ficheros, se

ha decidido generar las cookies mediante JavaScript:

Se obtiene las cookies del cliente y se recorren cada uno por su nombre

Se comprueba si existen los nombres de nuestra cookie

Si no existe la cookie, se procede a las distintas funciones

correspondientes

Y en caso contrario, si ya existen, no se ejecutan las funciones

Aprovechando la funcionalidad del cookie del video, hemos añadido otra cookie

para mostrar un mensaje de advertencia para las políticas de cookies de nuestra web.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

25

Fecha: 27/05/2015

Autor: Sergio Santos

Caso de prueba: Textarea personalizado

Descripción: A la hora de los registros de los usuarios, se les piden introducir

una gran cantidad de texto para descripciones. Como en un textarea no existe formato,

se ha añadido una librería jQuery (NicEdit) que personaliza un textarea de forma que,

el usuario pueda dar formato a su texto: colores, salto de líneas, listas…

Se ha insertado al final del documento el script de NicEdit, con funciones para

personalizar el textarea en distintas páginas.

Resultado: Al obtener el valor del textarea en los formularios, se obtenían

valores nulos o vacíos.

Corrección: Dicha librería, transforma el textarea mediante HTML5 con una

vista determinada y los valores, que el usuario introduce, los pinta en un div.

Para obtener el valor, existe una función en la librería de NicEdit,

denominada getContent(), que obtiene el valor introducido.

Obteniendo ese valor, después se lo pasamos al valor del textarea,

mediante JavaScript de esta manera, una vez enviado el formulario, ya

se envía el texto del cliente.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

26

Fecha: 30/05/2015

Autor: Sergio Santos

Caso de prueba: Recuperar Contraseña

Descripción: A la hora de registrarse, un usuario puede olvidar su contraseña,

por ello, se va a realizar un generador de contraseñas para cuando el usuario necesite

recuperarla.

Se situará en la vista a la hora de iniciar sesión en forma de hipervínculo, en el

que se re direccionará a una página con un formulario, que comprobará el email en la

base de datos mediante AJAX. Si dicho email no existe, se mostrará un mensaje de

error, en cambio, si el email existe se procesará lo siguiente:

o Se ejecutará en el controlador de Perfil una cadena aleatoria de

caracteres.

o Esa cadena, se encriptará con la encriptación elaborada para las

contraseñas.

o Se envía al modelo el identificador del usuario, obtenido mediante una

consulta con el email del usuario, y la contraseña encriptada para que

modifique la contraseña antigua con la actual.

o Después, se generará un correo con la cadena aleatoria generada que se

enviará al email del usuario, para que pueda consultar su nueva

contraseña y un botón para que le redirija al inicio de sesión.

o Una vez finalizado, mediante AJAX, se mostrará un mensaje en la web

notificando al usuario que puede comprobar en su dirección de correo la

nueva contraseña generada.

o El usuario podrá cambiar su contraseña en la opción de editar su perfil.

Resultado: Se ha realizado una prueba con un usuario nuevo, con el éxito de la

modificación de la contraseña en la base de datos y el recibo del email.

Corrección: Para obtener una vista más agradable hacia el usuario:

o Se ha generado un mailing más agradable para la vista del usuario.

o Modificación de la URL (routes.php) para que sea más amigable hacia el

usuario y hacía los buscadores.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

27

CONCLUSIONES La finalización del proyecto ha sido satisfactoria, contando que existían dos tipos de

objetivos.

Todos los requisitos a corto plazo se han elaborado correctamente, en cambio, los

objetivos a largo plazo no ha dado tiempo a realizarlos todos, salvo el posicionamiento

y la adaptación a los distintos dispositivos, ya que según se iba programando se ha

podido ir añadiendo las etiquetas y herramientas propias de estos objetivos.

La vista ha quedado bastante aceptable, sencilla y atractiva para los clientes. También

las funcionalidades se han realizado de tal manera para que el usuario sepa utilizarlo de

forma sencilla.

Aunque el proyecto se podría ampliar en un futuro inmediato, para los objetivos

restantes y adaptar más funcionalidades:

En primer lugar, realizaríamos los filtros de búsqueda, ya que es

imprescindible para que el usuario pueda adaptar sus necesidades.

Mostrar en primer lugar las ofertas correspondientes a la provincia del

usuario y después, las demás ofertas.

Crear un chat para que cliente e informático puedan comunizarse entre ellos y

así no tener que esperar a que comprueben sus correos.

Cuando un cliente crea una nueva oferta, comprobar usuarios de la misma

provincia a la oferta y notificarles por email de la existencia de la nueva oferta.

Desarrollar varios mailing más para notificar a los usuarios:

o nuevas ofertas

o cuando el usuario se ha dado de baja en la web

o notificar al usuario cuando le envíen un mensaje por el futuro chat

Crear un servidor propio para la web, para tener su propio dominio, así como

para poseer un servidor de correo propio.

Eliminar foto de perfil y curriculum automáticamente de los usuarios una

vez estos eliminen su perfil.

Poder generar una nueva cuenta y contraseña del administrador cada x

tiempo, para una mejor seguridad, y enviar los nuevos datos por email a la

cuenta del administrador.

Dar la posibilidad de suspender su cuenta. Cuando un usuario ya ha encontrado

lo que buscaba, dar la posibilidad de suspender su cuenta para que no reciba más

notificaciones hasta que la vuelva a activar, así no tiene que estar eliminando su

cuenta.

Proyecto SOJI<DAW>

Sergio Santos Gil & Julio Hontangas

2014/2015

28

LICENCIA DE USO SOJI por Sergio Santos Gil y Julio Hontangas Berrio se

distribuye bajo una Licencia Creative Commons Atribución-

CompartirIgual 4.0 Internaciona.

https://creativecommons.org/licenses/by-sa/4.0/

BIBLIOGRAFÍA

Manuales y consultas en blog

http://www.desarrolloweb.com/

Tutorial de CodeIgniter

http://uno-de-piera.com/tag/codeigniter/

Ejemplos y tutoriales de CodeIgniter

http://fernando-gaitan.com.ar/category/codeigniter/

Dudas y respuestas para programadores

http://stackoverflow.com/

Post de dudas y respuestas

http://www.technicalkeeda.com/

Posicionamiento de la web

https://www.google.com/webmasters/tools

Herramienta para comprobar fallos de posicionamiento y optimización

https://developers.google.com/speed/pagespeed/