desarrollo e implementaciÓn de plataforma web para...
TRANSCRIPT
DESARROLLO E IMPLEMENTACIÓN DE PLATAFORMA WEB PARA LA
GESTIÓN Y SOCIALIZACIÓN DE LA INFORMACIÓN PARA EL CENTRO DE
CONOCIMIENTO SOCIAL COLECTIVO
CARLOS ANDRÉS FONSECA CAMARGO
UNIVERSIDAD DISTRITAL FRANCISCO JOSÉ DE CALDAS
FACULTAD DE INGENIERÍA
INGENIERÍA DE SISTEMAS
BOGOTÁ
2017
2
DESARROLLO E IMPLEMENTACIÓN DE PLATAFORMA WEB PARA LA
GESTIÓN Y SOCIALIZACIÓN DE LA INFORMACIÓN PARA EL CENTRO DE
CONOCIMIENTO SOCIAL COLECTIVO
CARLOS ANDRÉS FONSECA CAMARGO
20092020104
PROYECTO DE GRADO
Director:
Ing. Alejandro Daza
UNIVERSIDAD DISTRITAL FRANCISCO JOSÉ DE CALDAS
FACULTAD DE INGENIERÍA
INGENIERÍA DE SISTEMAS
BOGOTÁ
2017
3
CONTENIDO
Pág.
1. INTRODUCCIÓN ........................................................................................................ 8
2. PLANTEAMIENTO DEL PROBLEMA ......................................................................... 9
2.1 DESCRIPCIÓN DEL PROBLEMA ....................................................................... 9
2.2 FORMULACIÓN DEL PROBLEMA ...................................................................... 9
3. OBJETIVOS ............................................................................................................. 10
3.1 OBJETIVO GENERAL ....................................................................................... 10
3.2 OBJETIVOS ESPECÍFICOS .............................................................................. 10
4. JUSTIFICACIÓN ...................................................................................................... 11
5. MARCO REFERENCIAL .......................................................................................... 12
5.1 ANTECEDENTES ............................................................................................. 12
5.2 ESTADO DEL ARTE ......................................................................................... 12
5.2.1 WORDPRESS .............................................................................................................. 12
5.2.2 DRUPAL ..................................................................................................................... 13
5.2.3 JOOMLA ..................................................................................................................... 13
5.3 MARCO TEÓRICO ............................................................................................ 14
5.3.1 CÓDIGO ABIERTO O CÓDIGO PROPIETARIO ............................................................. 15
5.3.2 ARQUITECTURA TÉCNICA .......................................................................................... 15
5.3.3 USABILIDAD ............................................................................................................... 15
5.3.4 FUNCIONALIDAD ....................................................................................................... 16
5.3.5 RECOLECCIÓN DE INFORMACIÓN ............................................................................. 17
5.3.6 METODOLOGÍA ......................................................................................................... 17
5.4 MARCO CONCEPTUAL .................................................................................... 19
5.4.1 BOOTSTRAP ............................................................................................................... 19
5.4.2 PASARELA DE PAGOS ................................................................................................ 19
5.4.3 TRELLO ...................................................................................................................... 20
5.4.4 SLACK......................................................................................................................... 20
5.4.5 SCRUM ...................................................................................................................... 20
6. ALCANCES Y LIMITACIONES ................................................................................. 22
4
6.1 ALCANCES ....................................................................................................... 22
6.2 LIMITACIONES ................................................................................................. 22
7. PLANTEAMIENTO METODOLÓGICO ..................................................................... 23
7.1 PLANIFICACIÓN DE LA ITERACIÓN ................................................................ 23
7.2 EJECUCIÓN DE LA ITERACIÓN ...................................................................... 23
7.3 INSPECCIÓN Y ADAPTACIÓN ......................................................................... 23
7.4 ITERACIONES .................................................................................................. 24
8. RECURSOS ............................................................................................................. 25
8.1 RECURSOS FÍSICOS E INFRAESTRUCTURA: ............................................... 25
8.2 RECURSOS DE SOFTWARE: .......................................................................... 25
9. PRESUPUESTO ...................................................................................................... 27
10. CRONOGRAMA DE ACTIVIDADES ..................................................................... 29
11. PROCESO DE DESARROLLO ............................................................................. 30
11.1 FASE DE PLANEACIÓN ................................................................................... 30
11.1.1 Necesidades del proyecto ......................................................................................... 30
11.1.2 STAKEHOLDERS ......................................................................................................... 31
11.1.3 REQUERIMIENTOS ..................................................................................................... 32
11.1.4 HISTORIAS DE USUARIO ............................................................................................ 34
11.1.5 PRODUCT BACKLOG .................................................................................................. 36
11.1.6 ITERACIONES E HISTORIAS DE USUARIO ................................................................... 38
11.2 FASE DE DESARROLLO E IMPLEMENTACIÓN .............................................. 39
11.2.1 Iteración 1 ................................................................................................................. 39
11.2.2 Iteración 2 ................................................................................................................. 39
11.2.3 Iteración 3 ................................................................................................................. 40
11.2.4 Iteración 4 ................................................................................................................. 41
11.2.5 Iteración 5 ................................................................................................................. 42
11.2.6 Iteración 6 ................................................................................................................. 42
11.2.7 Iteración 7 ................................................................................................................. 42
11.2.8 Iteración 8 ................................................................................................................. 43
11.2.9 Iteración 9 ................................................................................................................. 44
11.2.10 Iteración 10 ........................................................................................................... 44
11.2.11 Iteración 11 ........................................................................................................... 44
5
11.2.12 Iteración 12 ........................................................................................................... 45
12. CONCLUSIONES ................................................................................................. 46
13. TRABAJO FUTURO .............................................................................................. 46
14. BIBLIOGRAFIA ..................................................................................................... 47
6
LISTA DE IMÁGENES
Ilustración 1 Scrum ........................................................................................................................... 21
Ilustración 2 Cronograma de Actividades. Fuente: Autor ................................................................. 29
Ilustración 3 Tableros Iteraciones Trello. Fuente: Autor .................................................................. 36
Ilustración 4 Uso de Slack. Fuente: Autor ......................................................................................... 39
Ilustración 5 Menú. Fuente: Autor .................................................................................................... 39
Ilustración 6 Contador Próximo Evento. Fuente: Autor ................................................................... 40
Ilustración 7Hazte Miembro. Fuente: Autor ..................................................................................... 40
Ilustración 8 Buscador Eventos. Fuente: Autor ................................................................................ 40
Ilustración 9 Insertar eventos y categorías desde el panel administrador. Fuente: Autor .............. 41
Ilustración 10 Eventos por Categorías. Fuente: Autor ...................................................................... 41
Ilustración 11 Descripción del Sitio. Fuente: Autor .......................................................................... 41
Ilustración 12 Eventos Pasados. Fuente: Autor ................................................................................ 42
Ilustración 13 Aliados. Fuente: Autor ............................................................................................... 42
Ilustración 14 Insertar Conferencista desde el panel administrador. Fuente: Autor ....................... 43
Ilustración 15 Conferencistas. Fuente: Autor ................................................................................... 43
Ilustración 16 Mapa. Fuente: Autor .................................................................................................. 43
Ilustración 17 Faq’s. Fuente: Autor ................................................................................................... 44
Ilustración 18 Buscador. Fuente: Autor ............................................................................................ 44
Ilustración 19 Formulario de Contacto. Fuente: Autor ..................................................................... 44
Ilustración 20 Membresía mensual o anual. Fuente: Autor ............................................................. 45
Ilustración 21 Compra membresía. Fuente: Autor ........................................................................... 45
7
LISTA DE TABLAS
Tabla 1 Comparativo CMS Fuente: Autor ......................................................................................... 14
Tabla 2 Iteraciones y Actividades Fuente: Autor .............................................................................. 24
Tabla 3 Recursos Físicos e Infraestructura Fuente: Autor ................................................................ 25
Tabla 4 Recursos de Software Fuente: Autor ................................................................................... 26
Tabla 5 Presupuesto Fuente: Autor .................................................................................................. 28
Tabla 6 Necesidades del Proyecto. Fuente: Autor ............................................................................ 31
Tabla 7 Stakeholders. Fuente: Autor ................................................................................................ 32
Tabla 8 Requerimientos. Fuente: Autor ............................................................................................ 34
Tabla 9 Product Backlog. Fuente: Autor ........................................................................................... 38
Tabla 10 Iteraciones. Fuente: Autor ................................................................................................. 39
8
1. INTRODUCCIÓN
El Centro de Conocimiento Social Colectivo es una organización dedicada al intercambio
de conocimiento, donde una comunidad de mentes afines interactúa, genera contenidos y
experiencias significativas alrededor de temas como: negocios y emprendimiento, ciencia y
tecnología, creatividad y diseño, cultura y bienestar, bajo tres ejes transversales:
sostenibilidad, innovación y educación. Cuenta con una programación permanente de
conversatorios, charlas, conferencias y eventos culturales, entre otros, cuyo objetivo es
involucrar a sus asistentes en un mundo de experiencias creativas que agilicen su
conocimiento y los conecte entre sí para llevarlos a la acción.
El contenido es compartido por los miembros quienes cuentan con un alto nivel de
reputación, credibilidad e influencia. Así, se va formando una red exponencial con el mismo
propósito, relacionamiento y gestión colectiva de conocimiento. Social Colectivo cree que
una nueva economía es viable si y sólo si se desarrollan ecosistemas y comunidades
sostenibles construidos bajo las premisas de conectar, colaborar y compartir. Promoviendo
la conciencia colectiva.
La organización quiso hacer uso de las nuevas tecnologías de la información para impulsar
sus actividades y lograr alcanzar sus objetivos, por estos motivos fue necesario desarrollar
una plataforma web que permitiera a sus colaboradores y asistentes acceder al contenido
desarrollado durante sus actividades.
En este documento se presentarán los objetivos principales, las necesidades y requisitos
planteados por la organización. El proyecto se realizó en fases (Análisis, Diseño, Desarrollo
e Implementación) bajo la metodología scrum ya que permite fácil adaptación en las etapas
de desarrollo del producto; para la realización de las historias de usuario se usó la
herramienta trello y para la comunicación entre el desarrollador y el scrum master se usó
slack. Posteriormente se llevaron a cabo una serie de pruebas con el fin de validar el
resultado del proyecto. Se desarrollaron módulos mediante shortcodes usando el lenguaje
de programación PHP, como el menú, slider, gestión de eventos, descripción del sitio,
publicaciones eventos pasados etc. , que permitieron que la plataforma web fuera
totalmente administrable y de fácil manejo para el usuario. Así mismo se desarrolló e integró
una pasarela de pagos que permite comprar entradas para los eventos que tengan algún
costo o adquirir una membresía, éste pago electrónico se realiza por medio de PSE, esta
plataforma web es totalmente adaptable a cualquier dispositivo gracias al uso del framework
bootstrap.
El objetivo de la organización es brindar una información íntegra sobre los eventos que se
realizarán todos los días, dar a conocer las actividades que se han realizado, así como
integrar a nuevos miembros, a través de su sitio web; permitiendo a sus visitantes, ser parte
de este proyecto.
9
2. PLANTEAMIENTO DEL PROBLEMA
2.1 DESCRIPCIÓN DEL PROBLEMA
En el mundo globalizado una de las nuevas tendencias son el uso y manejo de información
por medio de Internet, esto da como resultado mayor interacción entre usuarios y
organizaciones, generando así una audiencia masiva aumentando la credibilidad de la
información de dicha organización que publique, o venda sus productos o servicios por
medio de una página Web, explorando así nuevas oportunidades de negocio las cuales
podrán enriquecer la organización como tal, así como una menor pérdida de la información
, explorando las nuevas tecnologías , lo cual permitirá la creación de aplicaciones web más
interactivas y de fácil acceso.
El Centro de Conocimiento Social Colectivo genera contenido gracias a los conversatorios,
conferencias, talleres y eventos culturales que se realizan semanalmente. Estos eventos
son dados a conocer mediante el voz a voz, ocasionando que muchas veces no asista gran
cantidad de gente. El contenido generado durante la realización de estos eventos es
guardado en video o en registro fotográfico, pero no existe un entorno que permita gestionar
los contenidos fácilmente, ni darlos a conocer al público. También existe una membresía
para aquellas personas que deseen tener ciertos privilegios, esta membresía se cancela en
las oficinas del Centro de Conocimiento.
En tal sentido, la organización no cuenta con un acceso único a la información que permita
al público conocer más acerca del Centro de Conocimiento ni un calendario de eventos que
sea de fácil acceso para todos los interesados, así como tampoco facilitar la compra de la
membresía virtualmente. Por lo tanto, se hizo necesario la creación de la plataforma web
del Centro de Conocimiento Social Colectivo, puesto que gracias a esta se logra brindar
información para aquellas personas que desean interactuar y hacer parte de esta
organización.
2.2 FORMULACIÓN DEL PROBLEMA
¿CÓMO ADMINISTRAR Y GESTIONAR EN UN ACCESO ÚNICO LA INFORMACIÓN
COMPARTIDA EN CADA UNO DE LOS EVENTOS REALIZADOS EN EL CENTRO DE
CONOCIMIENTO SOCIAL COLECTIVO?
10
3. OBJETIVOS
3.1 OBJETIVO GENERAL
Diseñar y desarrollar una plataforma web para el Centro de Conocimiento Social Colectivo
que permita la gestión y socialización de información acerca de la organización y así mismo
sus actividades realizadas.
3.2 OBJETIVOS ESPECÍFICOS
Especificar y gestionar los requerimientos del cliente, para tener claras las
necesidades del usuario y plasmarlas en el desarrollo.
Planificar las etapas de desarrollo, mediante la metodología SCRUM para la gestión
y seguimiento durante el desarrollo del proyecto.
Desarrollar e integrar los diferentes módulos de la plataforma web, para lograr que
ésta sea totalmente administrable, permitiendo la gestión de la información y
organización de eventos por categorías, teniendo en cuenta que estos módulos
sean totalmente adaptables a la plataforma web.
Diseñar y desarrollar pruebas mediante el uso del desarrollo basado en pruebas,
para aprobar el despliegue de cada iteración del proyecto.
Generar la documentación técnica para que la administración del sitio web sea de
fácil manejo y pueda ser utilizada por el personal que va a dar soporte y a desarrollar
nuevas funcionalidades en un futuro.
11
4. JUSTIFICACIÓN
Debido a que la comunicación e información de las actividades que se realizan en el Centro
de Conocimiento Social Colectivo actualmente se transmite voz a voz, se hace necesario
la creación de una plataforma web, que permita dar a conocer a la comunidad qué es el
Centro de Conocimiento, cada uno de los eventos realizados allí, así como también la
integración de nuevos miembros que generen y compartan cada uno de sus conocimientos
para lograr alcanzar el principal objetivo de la organización que es conectar, colaborar y
compartir tiempo, espacio e intelecto en pro de un mundo mejor.
Para permitir que el sitio web sea totalmente administrable, se desarrollará una plataforma
web con diferentes módulos que se adapten a las necesidades del cliente, permitiendo gran
facilidad en la creación de los eventos que se realizarán semanalmente para total
conocimiento de la comunidad, los conferencistas que asistirán, así como también se podrá
publicar un resumen con cada una de las actividades ya realizadas durante cada evento,
por último se desarrollará una pasarela de pagos que permitirá la compra de membresía
para las personas que deseen hacer parte de este centro de conocimiento. En vista de los
diferentes dispositivos que existen hoy en día para acceder a internet la plataforma deberá
ser responsiva, para que el contenido se puede visualizar en éstos dispositivos
12
5. MARCO REFERENCIAL
5.1 ANTECEDENTES
Un gestor de contenidos aporta herramientas para que las personas sin conocimientos
técnicos en desarrollo web puedan concentrarse solo en el contenido. El contenido creado
se almacena en la base de datos que utiliza el sistema, donde también se guardan datos
relacionados con la estructura web, los usuarios de la misma, etc. La mayoría de los CMS
(Content Management System) presentan una gestión de usuarios en la que cada uno
cuenta con diferentes roles para gestionar el contenido. Cuando se crea el contenido, se le
puede asignar una fecha de publicación, es decir, el momento en el cual el contenido será
visible en la web. También existe la opción de publicarlo directamente. Los CMS se
caracterizan por gestionar automáticamente la accesibilidad web, capacidad de adaptación
a las necesidades de cada usuario y por ser compatibles con la mayoría de navegadores
web existentes.
Los CMS se ejecutan en el servidor web donde está alojado un sitio, pudiendo acceder a
ellos a través de los navegadores web. Cuando un usuario realiza una petición de una
página, el gestor de contenidos es el encargado de interactuar con el servidor para generar
una página dinámica, con un formato definido, y cuyo contenido se extrae de la base de
datos.
Los CMS surgieron bajo la necesidad de distintas organizaciones de gestionar una gran
cantidad de contenidos en sus páginas web. Éstos se han convertido en una herramienta
de gran importancia debido al gran auge de las páginas web con abundante contenido y
donde el usuario participa activamente dejando su opinión en la sección de comentarios.
Los CMS traen una gran cantidad de plantillas predefinidas que están conformadas por
varios módulos que son los que crean la estructura web. En ocasiones se suelen utilizar
estas plantillas, pero a veces es mejor realizar un desarrollo a la medida según la necesidad
del cliente.
5.2 ESTADO DEL ARTE
Existen cientos de gestores de contenido web, entre los más utilizados y eficientes están:
5.2.1 WORDPRESS
Es un sistema de gestión de contenidos o CMS (por sus siglas en inglés, Content
Management System) enfocado a la creación de cualquier tipo de sitio. Originalmente
alcanzó una gran relevancia usado para la creación de blogs, para convertirse con el tiempo
en una de las principales herramientas para la creación de páginas web comerciales. Ha
sido desarrollado en el lenguaje PHP para entornos que ejecuten MySQL y Apache, bajo
licencia GPL y es software libre. (Wordpress, 2010)
13
5.2.2 DRUPAL
Drupal es un sistema de administración de contenido. Esto significa que es un sistema para
administrar el contenido de sitios Web, tal como artículos, fotos, u otros archivos. Drupal es
sistema dinámico; en lugar de ser archivos pre-generados (estáticos), el contenido textual
de las páginas y otras configuraciones son almacenados en una base de datos. Cuando un
visitante ingresa a una página, un script se ejecuta en el servidor Web, consultando la base
de datos y colocando el contenido de la página sobre una plantilla. (Drupal, 2012)
5.2.3 JOOMLA
Joomla es un sistema de gestión de contenidos (o CMS, por las siglas en inglés, Content
Management System) que permite desarrollar sitios web dinámicos e interactivos. Permite
crear, modificar o eliminar contenido de un sitio web de manera sencilla a través de un
"panel de administración". Es un software de código abierto, programado o desarrollado en
PHP y liberado bajo Licencia pública general GNU (GPL).
Este administrador de contenidos puede utilizarse en una computadora personal local
(localhost), en una intranet o a través de Internet, y requiere para su funcionamiento una
base de datos creada con un gestor de bases de datos (MySQL es lo más habitual), así
como de un servidor HTTP Apache. (Joomla, 2014)
Comparativo de los anteriores CMS
Wordpress Joomla Drupal
Lenguaje PHP PHP PHP
Precio Gratis Gratis Gratis
Código abierto Sí Sí Sí
Cuota de mercado 65% 15% 12%
Flexibilidad para
implementar
funcionalidades a
medida
Muy alta Baja Muy alta
Dificultad para
administrador
Baja Media Alta
Dificultad para
implementar
cualquier diseño
Baja Alta Alta
Posicionamiento
SEO
Alto Medio Bajo
Calidad de
documentación
Alta Baja Alta
14
Calidad de
comunidad de
usuarios
Alta Baja Media
Tabla 1 Comparativo CMS Fuente: Autor
Como afirman Giannaccini y Müller (2014) Usar plantillas prefabricadas puede conllevar a muchas desventajas o errores al momento de crear una página web, ya que estas plantillas traen diferentes desventajas que a futuro pueden convertirse en una molestia para el dueño de la página web.
Después de conocer los gestores de contenidos más utilizados, se realizó una evaluación
y verificación de los diferentes componentes de los CMS existentes en el mercado, con el
fin de determinar los servicios ofrecidos y la flexibilidad de adaptación de los componentes
y se encontró que si bien es cierto que cada CMS cuenta con una variedad de módulos y
plantillas, éstas no se pueden editar al 100%, limitándose a pocas secciones de la misma,
el diseño web será repetitivo con otros usuarios, contendrá componentes que el cliente
nunca va a utilizar, haciendo que la página sea más pesada y menos optimizada para un
posicionamiento.
Es por esto que, si se desea usar un CMS, siendo Wordpress el que tiene mejor usabilidad,
flexibilidad y facilidad de uso por parte del usuario, lo mejor es realizar el desarrollo de
estructura web y módulos a medida sin usar una plantilla predeterminada, ya que es
necesario abarcar y solucionar de la manera más óptima posible las necesidades del
cliente.
5.3 MARCO TEÓRICO
Un Sistema de gestión de contenidos (Content Management System, en inglés,
abreviado CMS) permite la creación y administración de contenidos principalmente en
páginas web.
Consiste en una interfaz que controla una o varias bases de datos donde se aloja el
contenido del sitio. El sistema permite manejar de manera independiente el contenido y el
diseño. Así, es posible manejar el contenido y darle en cualquier momento un diseño distinto
al sitio sin tener que darle formato al contenido de nuevo, además de permitir la fácil y
controlada publicación en el sitio a varios editores. (Pérez-Montoro, 2006)
Los CMS se pueden clasificar según sus características:
Según el lenguaje de programación empleado, como, por ejemplo: Active Server
Pages, Java, PHP, ASP.NET, Ruby On Rails, Python, PERL, etc.
Según la licencia: Código abierto o Software propietario
15
Se desarrollará una plataforma web que permita tener una comunicación dinámica e
interactiva donde el usuario pueda tener acceso e informarse rápida y eficazmente acerca
de los eventos que se realizan en el Centro de Conocimiento Social Colectivo.
5.3.1 CÓDIGO ABIERTO O CÓDIGO PROPIETARIO
Los CMS comercializados por empresas no permiten el acceso al código fuente por parte
de terceros, en contraste con los CMS de código fuente abierto, cuyos desarrolladores sí
que permiten el acceso libre y la modificación del código. La disponibilidad del código fuente
posibilita que se pueda modificar el producto, aportándole nuevas funcionalidades,
corrigiendo posibles errores, etc., lo que facilita la evolución del producto. Los CMS de
código propietario, sin embargo, sólo dan acceso al código previa compra de una licencia.
Otra ventaja de los CMS de código libre es el coste. Normalmente, este tipo de gestores de
contenido son gratuitos, sin ningún coste de licencias. En el caso de los CMS comerciales,
el coste puede llegar a ser muy elevado, sobre todo para un particular. Los gestores de
contenido de código libre suelen tener comunidades de usuarios que comentan sus
experiencias con el uso de estos sistemas, aportan novedades, desarrollan nuevas
funcionalidades, etc.
Debido a que la organización necesita un desarrollo web a medida y que permita añadirle
nuevas funcionalidades a futuro, se opta por escoger CMS de código abierto.
5.3.2 ARQUITECTURA TÉCNICA
Para facilitar la administración de la plataforma web del Centro de Conocimiento, ésta se
dividirá en varios módulos que permitirán de manera ágil gestionar y dar a conocer de
manera óptima la información de la organización, así como sus eventos, un resumen de
cada uno de ellos y la inclusión de nuevos miembros.
Es por esto que el CMS tiene que ser fiable y con la capacidad de adaptarse a futuras
necesidades, pudiendo incluirle módulos o componentes que satisfagan las necesidades
del cliente. También es conveniente que permita separar contenido, presentación y
estructura, para seguir los estándares web.
5.3.3 USABILIDAD
La usabilidad es la capacidad del producto software para ser entendido, aprendido, usado
y resultar atractivo para el usuario. (Norma Internacional ISO 25010, 2011)
Para el desarrollo de la plataforma web se tendrán en cuenta las siguientes buenas
prácticas de usabilidad web
16
1. Calidad de diseño web: La plataforma web deberá tener un diseño atractivo, sencillo
y coherente, sin enlaces rotos o páginas de error.
2. Autonomía y eficiencia del usuario: Para facilitar la productividad del usuario y no la
de la plataforma web, el acceso a cada sección y a sus contenidos deberá ser de
manera práctica y sencilla para el usuario, evitando pop-ups al ingresar a las
secciones y disminuyendo el número de pasos para acceder al contenido.
3. Interfaz visible y legible: Se deberá usar una combinación de colores que vayan
acorde con la imagen de la organización, una fuente y tamaño legible para el usuario
según el dispositivo de navegación.
4. Contenido organizado, claro y sencillo: El contenido de cada uno de los eventos
deberá ser claro y conciso y lo más resumido posible, destacando aspectos
importantes.
5. Calidad del menú de navegación: El menú de navegación será sencillo, sin ningún
submenú, logrando facilidad en la navegación del usuario.
6. Tiempo de espera y carga: La plataforma web deberá estar optimizado para que el
usuario no tenga que esperar demasiado tiempo mientras éste carga, además
mejorará el posicionamiento en buscadores.
7. Diseño web adaptable: El usuario podrá visualizar el contenido desde cualquier
dispositivo y la plataforma web será totalmente adaptable.
5.3.4 FUNCIONALIDAD
La plataforma web que se desarrollará deberá contar con las siguientes funcionalidades
Buscador. Es de mucha utilidad para los usuarios del portal web disponer de una herramienta que permite realizar distintos procesos de búsqueda.
Fecha de publicación y caducidad de los contenidos. Cuando se crea un contenido, se le puede asignar una fecha de publicación y caducidad, periodo durante el cual estará presente en la web.
Soporte de múltiples navegadores. Cada usuario de Internet tiene preferencias por un navegador u otro. Por ello, el CMS seleccionado tiene que poder ser visualizado a través de distintos navegadores web.
Eventos a desarrollar durante cada mes asociados a alguna categoría (negocios y emprendimiento, ciencia y tecnología, creatividad y diseño, cultura y bienestar).
17
Pasarela de pagos PSE: El sistema contendrá una pasarela de pagos en la que se podrán cancelar mediante pago electrónico las membresías.
5.3.5 RECOLECCIÓN DE INFORMACIÓN
La información que contendrá el CMS será proporcionada por la organización de la siguiente manera:
El departamento de recursos humanos será el encargado de proporcionar la información acerca de la organización (¿Quiénes somos?, ¿Qué hacemos?, términos y condiciones).
El departamento de comunicaciones será el encargado de recolectar la información compartida en cada evento y deberá redactar y presentar un resumen de éste, para ser incluido en la sección de publicaciones de eventos realizados
El departamento de audiovisuales será el encargado de recolectar la evidencia fotográfica de cada evento realizado para ser incluida junto con el resumen de cada evento.
El departamento de eventos será el encargado de enviar la información (fecha, hora, lugar) de los eventos que se realizarán mensualmente, así como también la categoría a la que éste va asociado.
El administrador de la plataforma web será el encargado de gestionar todo el contenido.
5.3.6 METODOLOGÍA
Para el desarrollo de la plataforma web se usó la metodología ágil Scrum, esta permite fácil
adaptación en las etapas de desarrollo del producto, dándole prioridad al cliente mediante
las entregas continuas en las cuales el cliente puede observar un valor agregado en el
producto en cada entrega y si así lo desea, posee la oportunidad de sugerir cambios, lo que
a fin de cuentas ofrece una ventaja competitiva para la satisfacción del cliente y el desarrollo
ágil del producto.
Para la gestión y manejo de las actividades a realizar o historias de usuario, como son
conocidas en esta metodología, se usó la aplicación Trello, una aplicación web que facilita
la administración del proyecto y la comunicación general entre el equipo de trabajo
mediante tableros (board) compuestos de columnas (listas) que representan distintos
estados.
5.3.6.1 REUNIONES EN SCRUM
DAILY SCRUM
Cada día de un sprint (período en el cual se lleva a cabo cada ciclo en sí.), se realiza la reunión sobre el estado del proyecto. Esto se llama daily standup o Stand-up meeting. El Scrum tiene unas guías específicas: La reunión comienza puntualmente a su hora.
18
Todos son bienvenidos, pero sólo los involucrados en el proyecto pueden hablar. La reunión tiene una duración fija de 15 minutos, de forma independiente del tamaño del equipo. La reunión debe ser a la misma hora todos los días. Durante la reunión, cada miembro del equipo contesta a tres preguntas:
¿Qué hice ayer?
¿Qué voy hacer mañana?
¿He tenido algún problema que te haya impedido alcanzar tu objetivo?
Al finalizar la reunión se resuelven las dudas respecto a los problemas que han impedido alcanzar el objetivo. (Schwaber, Sutherland, 2013) REUNIÓN DE PLANIFICACIÓN DEL SPRINT
Al inicio de cada ciclo de Sprint (cada 15 o 30 días), se lleva a cabo una reunión de planificación del Sprint. Se pretende:
Seleccionar qué trabajo se hará.
Preparar, con el equipo completo, el Sprint Backlog que detalla el tiempo que llevará hacer el trabajo.
Identificar y comunicar cuánto del trabajo es probable que se realice durante el actual Sprint.
Realizarse esta planificación en ocho horas como tiempo límite. Al final del ciclo Sprint se hacen la reunión de revisión del Sprint. REUNIÓN DE REVISIÓN DEL SPRINT (SPRINT REVIEW MEETING)
Revisar el trabajo que fue completado y no completado
Presentar el trabajo completado a los interesados (también conocido como demo)
El trabajo incompleto no puede ser demostrado
Cuatro horas como límite
Para una comunicación más directa se usó la aplicación Slack, la cual permite enviar
cualquier tipo de mensaje adjuntando diferentes tipos de archivos y facilitando aún más la
comunicación.
19
5.4 MARCO CONCEPTUAL
5.4.1 BOOTSTRAP
Bootstrap, es un framework originalmente creado por Twitter, que permite crear interfaces
web con CSS y JavaScript, cuya particularidad es la de adaptar la interfaz del sitio web al
tamaño del dispositivo en que se visualice. Es decir, el sitio web se adapta automáticamente
al tamaño de una PC, una Tablet u otro dispositivo. Esta técnica de diseño y desarrollo se
conoce como “responsive design” o diseño adaptativo.
El beneficio de usar responsive design en un sitio web, es principalmente que el sitio web
se adapta automáticamente al dispositivo desde donde se acceda. Lo que se usa con más
frecuencia, y que a mi opinión personal me gusta más, es el uso de media queries, que es
un módulo de CSS3 que permite la representación de contenido para adaptarse a
condiciones como la resolución de la pantalla y si trabajas las dimensiones de tu contenido
en porcentajes, puedes tener una web muy fluida capaz de adaptarse a casi cualquier
tamaño de forma automática.
Aun ofreciendo todas las posibilidades que ofrece Bootstrap a la hora de crear interfaces
web, los diseños creados con Bootstrap son simples, limpios e intuitivos, esto le da agilidad
a la hora de cargar y al adaptarse a otros dispositivos. El Framework trae varios elementos
con estilos predefinidos fáciles de configurar: Botones, Menús desplegables, Formularios
incluyendo todos sus elementos e integración jQuery para ofrecer ventanas y tooltips
dinámicos.
Bootstrap tiene un soporte relativamente incompleto para HTML5 y CSS 3, pero es
compatible con la mayoría de los navegadores web. La información básica de
compatibilidad de sitios web o aplicaciones está disponible para todos los dispositivos y
navegadores. Existe un concepto de compatibilidad parcial que hace disponible la
información básica de un sitio web para todos los dispositivos y navegadores. Por ejemplo,
las propiedades introducidas en CSS3 para las esquinas redondeadas, gradientes y
sombras son usadas por Bootstrap a pesar de la falta de soporte de navegadores antiguos.
Esto extiende la funcionalidad de la herramienta, pero no es requerida para su uso. Desde
la versión 2.0 también soporta diseños sensibles. Esto significa que el diseño gráfico de la
página se ajusta dinámicamente, tomando en cuenta las características del dispositivo
usado (Computadoras, tabletas, teléfonos móviles). (Bootstrap, 2016)
5.4.2 PASARELA DE PAGOS
La pasarela de pago es el servicio de un proveedor de servicios de aplicación de comercio
electrónico, con el que se autorizan pagos a negocios electrónicos (en línea), ventas en
20
línea al detalle, que normalmente se comunican mediante webservice con las plataformas
que utilizan el servicio.
Las pasarelas de pago cifran información sensible, como los números de tarjetas de crédito,
para garantizar que la información pasa en forma segura entre el cliente y el vendedor.
(Sung, Lee, 2011)
5.4.3 TRELLO
Trello es un gestor de tareas que permite el trabajo de forma colaborativa mediante tableros
(board) compuestos de columnas (llamadas listas) que representan distintos estados. Se
basa en el método Kanban para gestión de proyectos, con tarjetas que viajan por diferentes
listas en función de su estado, es ideal para metodologías de desarrollo como Scrum.
(Schwaber, Sutherland, 2013)
5.4.4 SLACK
Slack es una herramienta de mensajería en tiempo real que facilita la gestión de grupos de
trabajo, ahorrando tiempo y centralizando la comunicación, y que sobre todo triunfa a nivel
empresarial, aunque es recomendable para todo tipo de comunidades. Slack permite crear
grupos de trabajo entre un número ilimitado de miembros, mantener conversaciones
privadas, establecer canales públicos y privados o compartir archivos. Eso significa que
puede ser útil, por ejemplo, para un diseñador autónomo que está desarrollando un
proyecto para una empresa, para un grupo de redactores que trabajan para una misma
página web o para el departamento de informática de una compañía que tiene tantos
proyectos como canales.
5.4.5 SCRUM
Este método creado a mediados de principio de los años 90, responde a los principios del
manifiesto ágil y es una de las metodologías ágiles más utilizadas. El proceso de desarrollo
mediante esta metodología gira en torno las reuniones y comunicación del equipo, donde
además es importante la comunicación con el cliente.
De acuerdo a los requerimientos en scrum se define un backlog, lo cual se traduce en una
lista de funcionalidades, que en su desarrollo dan valor agregado al producto, se consignan
en historias de usuario durante la planeación del proyecto.
Los tiempos para el desarrollo se conocen como sprint, estas son unidades de tiempo en
las cuales el equipo de desarrollo trabaja en funcionalidades basadas en los requerimientos
del proyecto. Al terminar el sprint la meta es alcanzar los objetivos propuestos por el equipo
y dar valor agregado al producto en dicha iteración; Generalmente los sprint son definidos
en periodos de treinta (30) días y es importante que durante el sprint no existan cambios a
los compromisos adquiridos por el equipo. Al finalizar el sprint se realiza una
retroalimentación en la que el equipo entrega los resultados y se planea la siguiente
iteración.
21
El equipo involucrado en el proyecto es el siguiente:
● Scrum master: Principal facilitador entre la comunicación del equipo
● Product owner: Cliente implicado en la revisión del producto.
● Equipo de Desarrolladores
Ilustración 1 Scrum Fuente: Ingeniería de software un enfoque práctico, Séptima edición, Roger S Pressman. Recuperado de: http://eva.sepyc.gob.mx:8383/greenstone3/sites/localsite/collect/ciencia1/index/assoc/HASH015f/ceb375c1.dir/33040073.pdf
22
6. ALCANCES Y LIMITACIONES
6.1 ALCANCES
El desarrollo de este proyecto pretende crear un sitio web para la generación y publicación
de contenido de Centro de Conocimiento Social Colectivo
El alcance de la pasantía tiene contemplado el diseño y la construcción de un sitio web que
permita su fácil administración, y la creación de los eventos que se realizarán durante cada
semana, así como la pasarela de pagos para nuevos miembros.
1. Desarrollar un módulo de gestión de menús, para que el usuario pueda navegar de
una manera interactiva.
2. Desarrollar un módulo de cuenta regresiva, para que el usuario pueda ver en qué
fecha se realizará el próximo evento.
3. Desarrollar un módulo de eventos organizados por categoría, para que el usuario
pueda ver cada uno de los eventos realizados durante el año.
4. Desarrollar un módulo de pasarela de pagos para adquirir una membresía que
permita el ingreso de nuevos miembros.
5. Desarrollar un módulo de publicaciones de eventos pasados, para crear
publicaciones a cerca de cada uno de los eventos realizados.
6. Desarrollar un módulo de conferencistas, para que el usuario tenga conocimiento
de cada uno de los conferencistas presentes en las actividades
7. Desarrollar un sitio web adaptable, que permita la visualización de la plataforma web
en diferentes dispositivos.
6.2 LIMITACIONES
La información de los eventos, así como de las actividades realizadas no podrá ser incluida
hasta que no esté generada por el departamento de comunicaciones.
El tiempo estimado para llevar a cabo el desarrollo del proyecto será de 3 meses, sin incluir
las pruebas de la pasarela de pagos
Disponibilidad del equipo necesario por estar en uso en otros proyectos de la organización.
El despliegue a producción no se realizará hasta que las pruebas de la pasarela de pagos
se hagan por la entidad encargada para realizar el proceso de recaudo mediante PSE.
RESULTADOS ESPERADOS
Se espera que, al finalizar el proyecto, se haya desarrollado una plataforma web con cada
uno de los módulos anteriormente mencionados logrando que ésta sea totalmente
administrable y de fácil manejo, para que el Centro de Conocimiento pueda darse a conocer
más personas gracias al uso de la plataforma web, así como también incorporar nuevos
miembros que contribuyan al crecimiento y desarrollo de éste.
23
7. PLANTEAMIENTO METODOLÓGICO
Para el diseño y desarrollo de la plataforma web se plantean iteraciones de una semana
donde participan los desarrolladores y el scrum master encargado de asignar tareas al
equipo de desarrollo.
7.1 PLANIFICACIÓN DE LA ITERACIÓN
El primer día se realizará la reunión de planificación de la iteración la cual tendrá dos partes:
Selección de requisitos: el cliente presentará al equipo la lista de requisitos priorizada del
producto o proyecto. El equipo hará saber al cliente las dudas que surgirán y seleccionará
los requisitos más prioritarios que se comprometerá a completar en la iteración, de manera
que puedan ser entregados si el cliente los solicita.
Planificación de la iteración: El equipo elaborará la lista de tareas de la iteración
necesarias para desarrollar los requisitos a los que se ha comprometido. La estimación del
esfuerzo se hará de manera conjunta y los miembros del equipo se auto asignan tareas.
7.2 EJECUCIÓN DE LA ITERACIÓN
Cada día el equipo realizará una reunión de sincronización, lo que se conoce como Daily
Scrum, en donde se inspeccionará el progreso hacia el objetivo de la iteración, los
obstáculos que pueden impedir este objetivo; para poder hacer las adaptaciones necesarias
que permitan cumplir con el compromiso adquirido.
Durante la iteración, el Scrum Master se encargará de que el equipo pueda cumplir con su
compromiso y que no se vea afectada su productividad, eliminará los obstáculos que el
equipo no pueda resolver por sí mismo.
7.3 INSPECCIÓN Y ADAPTACIÓN
El último día de la iteración se realizará la reunión de revisión de la iteración la cual tendrá
dos partes:
Demostración: El equipo hace una demostración al cliente, mostrando los requisitos
completados en la iteración, en función de los resultados mostrados y de los cambios que
hayan surgido en el contexto del proyecto, el cliente realizará las adaptaciones necesarias
de manera objetiva, ya desde la primera iteración, re planificando el proyecto.
Retrospectiva: El equipo realizará la retrospectiva, en donde analizará cómo ha sido su
manera de trabajar y cuáles son los problemas que podrían impedirle progresar
adecuadamente, mejorando de manera continua su productividad y así mismo el Scrum
Master se encargará de ir eliminando los obstáculos identificados.
24
7.4 ITERACIONES
Tarea Estimación Responsable
1. Requerimientos del cliente
1 Día Cliente – Desarrollador – Scrum Master
2. Diseño Pruebas Unitarias
5 días Desarrollador
3. Diseño de Interfaz Gráfica
5 días Desarrollador
4. Módulo Menú 5 días Desarrollador
5. Módulo Slider 7 días Desarrollador
6. Módulo de Eventos 7 días Desarrollador
7. Módulo de Descripción Sitio
5 días Desarrollador
8. Módulo Publicaciones Eventos Pasados
5 días Desarrollador
9. Módulo Aliados 5 días Desarrollador
10. Módulo Conferencistas 5 días Desarrollador
11. Módulo Ubicación 5 días Desarrollador
12. Módulo FAQ’s 5 días Desarrollador
13. Módulo Búsqueda 5 días Desarrollador
14. Módulo Contacto 5 días Desarrollador
15. Módulo Pasarela de Pagos
10 días Desarrollador
16. Pruebas 5 días Desarrollador
17. Diseño de Manuales 5 días Desarrollador
18. Entrega para despliegue 1 días Desarrollador Tabla 2 Iteraciones y Actividades Fuente: Autor
25
8. RECURSOS
8.1 RECURSOS FÍSICOS E INFRAESTRUCTURA:
Recurso Descripción
Computador Portátil Sony Vaio Procesador: Intel Core i5 2da generación
RAM: 8 Gb DDR3
Disco duro: HDD 500GB (velocidad de 5400 rpm)
Infraestructura De Red Infraestructura utilizada en la organización para realizar el proyecto.
Plataforma control de Versiones
GITHUB
Plataforma de desarrollo colaborativo basada en el sistema de control de Versiones git.
Tabla 3 Recursos Físicos e Infraestructura Fuente: Autor
8.2 RECURSOS DE SOFTWARE:
Recurso Descripción
Gestor de Contenidos
Permite la creación y administración de contenidos principalmente en páginas web.
PHP
Lenguaje de programación
Versión: PHP 5.2.4
HTML5
Es un lenguaje markup (de hecho, las siglas de HTML significan Hyper Text Markup Language) usado para estructurar y presentar el contenido para la web
Versión: HTML5
Mysql
Sistema gestor de base de datos
Versión: Mysql 5.0
26
Javascript
Lenguaje de programación
Versión: Javascript 1.8.5
CSS3
Es un lenguaje usado para definir la presentación de un documento estructurado escrito en HTML o XML (y por extensión en XHTML).
Versión: CSS3
Bootstrap
Framework css html
Versión: Bootstrap v3.2.0
Tabla 4 Recursos de Software Fuente: Autor
27
9. PRESUPUESTO
SOFTWARE
Componente Fuente
Financiamiento
Inversión Total Pasantía
(3 meses)
PHP ____________ $ 0 $ 0
MYSQL ____________ $ 0 $ 0
HTML5 ____________ $ 0 $ 0
Javascript ____________ $ 0 $ 0
CSS3 ____________ $ 0 $ 0
Bootstrap ____________ $ 0 $ 0
Hosting
Social Colectivo
$ 30.000/mes $ 90.000
Dominio
Social Colectivo
$ 36.000/año
$ 36.000
Trello ____________ $ 0 $ 0
Slack ____________ $0 $0
HARDWARE
Computador portátil
Personal $ 1.100.000 $ 1.100.000
28
SUELDOS
Scrum Master Social Colectivo $ 3.000.000 $9.000.000
Desarrollador Social Colectivo $ 1.500.000 $ 4.500.000
SERVICIOS
Luz Personal $ 40.000/mes $ 120.000
Internet Personal $ 90.000/mes $ 270.000
Transportes Personal $ 100.000/mes $ 300.000
OTROS
Impresión y empaste
Personal $ 60.000 $ 60.000
Material Bibliográfico (Copias)
Personal $ 30.000 $ 30.000
SUBTOTAL $ 5’986.000 Pesos
$ 15’506.000 Pesos
15% Gastos Imprevistos
$ 2’325.900 Pesos
TOTAL $ 17’831.900 Pesos
Tabla 5 Presupuesto Fuente: Autor
29
10. CRONOGRAMA DE ACTIVIDADES
Ilustración 2 Cronograma de Actividades. Fuente: Autor
30
11. PROCESO DE DESARROLLO
11.1 FASE DE PLANEACIÓN
Durante esta fase se especificaron las necesidades, los stakeholders, los requerimientos,
las historias de usuario, la metodología, y la arquitectura del proyecto, se definieron las
actividades necesarias para el desarrollo del mismo y por último se establecieron
responsables y la duración de cada actividad.
11.1.1 Necesidades del proyecto
Se realizó una reunión con el cliente en la que éste dio a conocer las necesidades para
llevar a cabo el proyecto, y quedó evidenciado en la siguiente tabla:
ID NECESIDAD
N1 Desarrollar la interfaz de acuerdo a los mockups presentados por el cliente.
N2 La plataforma web deberá adaptarse a cualquier clase de dispositivo (Computador, Tablet, Smartphone).
N3 Se podrán agregar, editar o eliminar menús y submenús.
N4 Cada menú podrá desplegar o no, un submenú.
N5 Cada menú o submenú podrá redirigir a una página interna o externa a la plataforma web.
N6 Se podrá editar el orden en que aparecen los ítems del menú principal.
N7 Se podrá agregar, editar o eliminar elementos al carrusel de la página.
N8 El carrusel deberá contener un contador de cuenta regresiva indicando cuánto tiempo falta para el próximo evento
N9 El carrusel deberá contener un buscador de eventos.
N10 El módulo de eventos deberá contener categorías dependiendo de la clase de evento
N11 Los eventos podrán ser vistos de acuerdo a la categoría: negocios y emprendimiento, ciencia y tecnología, creatividad y diseño, cultura y bienestar.
N12 Cada evento deberá redirigir a una página interna en la que se verá la descripción y el precio del evento.
N13 La plataforma web se tiene que conectar con la pasarela de pagos contratada por el
31
centro de conocimiento, en la que podrá recibir el pago para asistir a un evento
N14 La pasarela de pagos también podrá recibir el pago para adquirir una membresía.
N15 Al módulo de descripción del sitio se le podrá agregar un ícono, un título, un pequeño resumen y un botón que redirija a una descripción detallada
N16 Al módulo de eventos pasados se le podrá agregar un título, una imagen y contenido editable.
N17 Al módulo de aliados se le podrá agregar, editar o eliminar una imagen de cada aliado y se presentará en forma de slider.
N18 Al módulo de conferencistas se le podrá agregar, editar o eliminar una imagen, un título, el país del conferencista y una breve descripción
N19 El módulo de ubicación deberá indicar la dirección del Centro de Conocimiento.
N20 El módulo de faq’s podrá agregar, editar o eliminar título con ícono y contenido.
N21 El módulo de contacto deberá incluir un formulario con 4 campos: nombre, correo electrónico, asunto, mensaje.
N22 El usuario que ingrese a la plataforma web podrá interactuar con todo el contenido publicado.
Tabla 6 Necesidades del Proyecto. Fuente: Autor
11.1.2 STAKEHOLDERS
En esta parte se contemplaron los stakeholders o actores que participan en la plataforma
web.
ID ACTOR DESCRIPCIÓN
A1 Administrador Es el principal usuario de la plataforma web, es el que autoriza todo el contenido y los usuarios.
A2 Redactor Este actor redacta las publicaciones y genera el contenido.
A3 Visitante Este actor es el que entra a la plataforma para ver el contenido que ofrece el centro de conocimiento y los
32
eventos que se realizarán. Además podrá comprar una entrada a un evento o una membresía y contactarse con los responsables del proyecto.
A4 Desarrollador Este actor es temporal, el cual se encarga del desarrollo de la plataforma web
Tabla 7 Stakeholders. Fuente: Autor
11.1.3 REQUERIMIENTOS
Para los requerimientos se unieron las necesidades relacionadas entre sí.
ID REQUERIMIENTO NECESIDADES ASOCIADAS
DESCRIPCIÒN
R1 Persistencia de datos
N3-N4-N5-N6-N7-N8-N9-N10-N11-N12-N13-N14-N15-N16-N17-N18-N19-N20-N21-N22
El sistema contará con un modelo de base de datos que represente todas las entidades participantes en la plataforma web.
R2 Gestión de menú N3-N4-N5-N6-N22 La plataforma web contará con la opción de gestionar el menú y submenús que aparecerán en la barra superior de la página; cada uno de los ítems del menú contará con la opción de redirigir a una página interna o externa.
R3 Gestión de carrusel N7-N8-N9 Se podrá gestionar el buscador y el contador, así como también agregar una imagen de fondo.
R4 Gestión de eventos por categoría
N10-N11-N12-N13 Se podrán ver todos los eventos o de acuerdo a la categoría
33
seleccionada por el usuario
R5 Gestión descripción del sitio
N15 Se podrá gestionar la descripción del sitio, agregando, editando o eliminando un ícono, un título, un pequeño resumen y un botón que redirija a una página interna.
R6 Gestión publicaciones eventos pasados
N16 Se podrá gestionar un resumen de los eventos realizados, que podrá incluir también una imagen y un título.
R7 Gestión aliados N17 Se podrá gestionar el módulo de aliados agregando, editando o eliminando una imagen de cada aliado en forma de carrusel.
R8 Gestión conferencistas
N18 Se podrá gestionar el módulo de conferencistas agregando, editando o eliminando una imagen del conferencista, el país, el nombre y una pequeña descripción.
R9 Gestión ubicación N19 Se podrá gestionar el módulo de ubicación añadiendo la dirección del Centro de Conocimiento en el mapa.
R10 Gestión faq’s N20 Se podrá gestionar el módulo de faq’s agregando, editando o
34
eliminando la pregunta y su respectiva respuesta.
R11 Gestión contacto N21 Se podrá gestionar el formulario de contacto agregando, editando o eliminando los campos que sean necesarios.
R12 Gestión membresía N13-N14 La plataforma se conectará con la pasarela de pagos contratada por el Centro de Conocimiento para poder recibir el pago de las membresías.
Tabla 8 Requerimientos. Fuente: Autor
11.1.4 HISTORIAS DE USUARIO
HU1: Gestión de menú
Como administrador deseo poder agregar, editar y eliminar menus y submenús.
Como administrador deseo poder agregar enlaces a los menús y submenús
HU2: Gestión de slider
Como administrador deseo poder agregar, editar o eliminar una imagen al slider.
Como administrador deseo poder agregar, editar o eliminar un contador para el
próximo evento al slider
Como administrador deseo poder agregar, editar o eliminar un título y un resumen.
Como administrador deseo poder agregar un buscador de eventos.
HU3: Gestión de eventos por categorías
Como administrador deseo poder agregar, editar o eliminar un evento.
Como administrador deseo poder agregar, editar o eliminar un título, una imagen,
una descripción, y fecha y hora.
Como administrador deseo poder asignarle una categoría a cada evento.
35
HU4: Gestión descripción del sitio
Como administrador deseo poder agregar, editar o eliminar un título, un ícono, un
pequeño resumen y un botón.
HU5: Gestión publicación eventos pasados
Como administrador deseo poder agregar, editar, o eliminar una(s) imagen(es), un
título y un resumen del evento realizado.
HU6: Gestión Aliados
Como administrador deseo poder agregar o eliminar una imagen de cada uno de los
aliados.
HU7: Gestión Conferencistas
Como administrador deseo poder agregar, editar o eliminar una imagen, un nombre,
un país, y una descripción del conferencista.
HU8: Gestión Ubicación
Como administrador deseo poder agregar, editar o eliminar un texto con la dirección
del Centro de Conocimiento.
Como administrador deseo poder agregar un marcador que me indique la dirección
del Centro de Conocimiento.
HU9: Gestión Faq´s
Como administrador deseo poder agregar, editar o eliminar preguntas frecuentes
con su respectiva respuesta.
HU10: Gestión Contacto
Como administrador deseo poder agregar, editar o eliminar un formulario de
contacto con los siguientes campos: nombre, correo electrónico, asunto, mensaje.
HU11: Gestión Membresías
Como administrador deseo poder agregar, editar o eliminar el precio de la
membresía.
Como administrador deseo poder agregar, editar o eliminar la clase de membresía
(anual ó mensual).
36
HU12: Interacción con la plataforma
Como usuario deseo poder realizar búsquedas sobre los eventos
Como usuario deseo poder ver las publicaciones de eventos pasados.
Como usuario deseo poder comprar las entradas a los eventos.
Como usuario deseo poder adquirir una membresía.
Como usuario deseo poder contactarme por medio de un formulario con los
administradores del Centro de Conocimiento.
Como usuario deseo poder ver los términos y condiciones del Centro de
Conocimiento.
Se realizaron 12 historias de usuario, las cuales se priorizaron en reunión de “Scrum
retrospective”, contemplando las principales funcionalidades que el Product Owner requería
para luego en cada iteración realizar el desarrollo de éstas.
Se usó la herramienta trello, en la cual se pueden evidenciar diferentes tableros con las
actividades planteadas para cada iteración del proyecto.
Ilustración 3 Tableros Iteraciones Trello. Fuente: Autor
11.1.5 PRODUCT BACKLOG
Estado Prioridad Iteración
Como administrador deseo poder agregar, editar y eliminar menús y submenús.
Terminada Alta 1
Como administrador deseo poder agregar enlaces a los menús y submenús
Terminada Media 1
37
Como administrador deseo poder agregar, editar o eliminar una imagen al slider.
Terminada Media 2
Como administrador deseo poder agregar, editar o eliminar un contador para el próximo evento al slider
Terminada Alta 2
Como administrador deseo poder agregar, editar o eliminar un título y un resumen.
Terminada Alta 2
Como administrador deseo poder agregar un buscador de eventos.
Terminada Media 2
Como administrador deseo poder agregar, editar o eliminar un evento.
Terminada Baja 3
Como administrador deseo poder agregar, editar o eliminar un título, una imagen, una descripción, y fecha y hora.
Terminada Alta 3
Como administrador deseo poder asignarle una categoría a cada evento.
Terminada Baja 3
Como administrador deseo poder agregar, editar o eliminar un título, un ícono, un pequeño resumen y un botón.
Terminada
Alta 4
Como administrador deseo poder agregar, editar, o eliminar una(s) imagen(es), un título y un resumen del evento realizado.
Terminada Alta 5
Como administrador deseo poder agregar o eliminar una imagen de cada uno de los aliados.
Terminada Baja 6
Como administrador deseo poder agregar, editar o eliminar una imagen, un nombre, un país, y una descripción del conferencista.
Terminada Alta 7
Como administrador deseo poder agregar, editar o eliminar un texto con la dirección del Centro de Conocimiento.
Terminada Baja 8
Como administrador deseo poder agregar un marcador que me indique la dirección del Centro de Conocimiento.
Terminada Baja 8
38
Como administrador deseo poder agregar, editar o eliminar preguntas frecuentes con su respectiva respuesta.
Terminada Alta 9
Como administrador deseo poder agregar, editar o eliminar un formulario de contacto con los siguientes campos: nombre, correo electrónico, asunto, mensaje.
Terminada Alta 10
Como administrador deseo poder agregar, editar o eliminar el precio de la membresía.
Terminada Alta 11
Como administrador deseo poder agregar, editar o eliminar la clase de membresía (anual ó mensual).
Terminada Alta 11
Como usuario deseo poder realizar búsquedas sobre los eventos
Terminada Baja 12
Como usuario deseo poder ver las publicaciones de eventos pasados.
Terminada Media 12
Como usuario deseo poder comprar las entradas a los eventos.
Terminada Alta 12
Como usuario deseo poder adquirir una membresía.
Terminada Alta 12
Como usuario deseo poder contactarme por medio de un formulario con los administradores del Centro de Conocimiento.
Terminada Alta 12
Como usuario deseo poder ver los términos y condiciones del Centro de Conocimiento.
Terminada Alta 12
Tabla 9 Product Backlog. Fuente: Autor
11.1.6 ITERACIONES E HISTORIAS DE USUARIO
ID HISTORIAS DE USUARIO ITERACIÓN
HU1 Gestión de Menú 1
HU2 Gestión de Slider 2
HU3 Gestión de Eventos por Categorías
3
HU4 Gestión Descripción del Sitio 4
HU5 Gestión Publicación Eventos Pasados
5
39
HU6 Gestión Aliados 6
HU7 Gestión Conferencistas 7
HU8 Gestión Ubicación 8
HU9 Gestión Faq’s 9
HU10 Gestión Búsqueda 10
HU11 Gestión Contacto 11
HU12 Gestión Membresías 12 Tabla 10 Iteraciones. Fuente: Autor
Para el desarrollo de cada iteración se usó la plataforma slack, en la que al finalizar el día
se le informaba al scrum master lo que se había realizado durante el día, los inconvenientes
presentados y lo que estaba planeado para realizar al día siguiente, esto se conoce como
daily.
Ilustración 4 Uso de Slack. Fuente: Autor
11.2 FASE DE DESARROLLO E IMPLEMENTACIÓN
Para que cada módulo fuese gestionable se desarrollaron una serie de shortcodes en los
que el administrador puede agregar la información necesaria sin necesidad de que deba
tener conocimientos sobre programación.
A continuación, se presenta el resultado del proceso realizado en cada iteración, haciendo
uso de la metodología SCRUM.
11.2.1 Iteración 1
Se desarrolló un menú con links que redirigen a páginas internas y al carro de compras
para el caso de membresías o eventos.
Ilustración 5 Menú. Fuente: Autor
11.2.2 Iteración 2
En esta iteración se desarrolló el slider con el buscador, una descripción y un contador para
el próximo evento.
40
Ilustración 6 Contador Próximo Evento. Fuente: Autor
Ilustración 7Hazte Miembro. Fuente: Autor
Ilustración 8 Buscador Eventos. Fuente: Autor
11.2.3 Iteración 3
Durante esta iteración se crearon categorías para agrupar los eventos y poder visualizarlos
dependiendo la categoría seleccionada (charlas, networking, talleres).
41
Ilustración 9 Insertar eventos y categorías desde el panel administrador. Fuente: Autor
Ilustración 10 Eventos por Categorías. Fuente: Autor
11.2.4 Iteración 4
En esta iteración se crea un título de la sección, un ícono, un título para cada servicio
prestado en el Centro de Conocimiento y una pequeña descripción de cada servicio.
Ilustración 11 Descripción del Sitio. Fuente: Autor
42
11.2.5 Iteración 5
En esta iteración se desarrolló un módulo en que se puede agregar un título, una imagen y
un pequeño resumen de los eventos realizados anteriormente, también cuenta con un botón
que nos redirigirá a una página interna donde se encuentran todos los eventos pasados.
Ilustración 12 Eventos Pasados. Fuente: Autor
11.2.6 Iteración 6
En esta iteración se desarrolló un módulo en el cual se puede agregar una imagen de cada
uno de los aliados del Centro de Conocimiento.
Ilustración 13 Aliados. Fuente: Autor
11.2.7 Iteración 7
Se desarrolló un módulo en el que se agrega una foto, nombre, país, y descripción del
conferencista.
43
Ilustración 14 Insertar Conferencista desde el panel administrador. Fuente: Autor
Ilustración 15 Conferencistas. Fuente: Autor
11.2.8 Iteración 8
Se desarrolló un módulo integrado con google maps para añadir un marcador con la
dirección del Centro de Conocimiento y una caja de texto con la misma.
Ilustración 16 Mapa. Fuente: Autor
44
11.2.9 Iteración 9
En esta parte del desarrollo se creó un módulo en el cual se pueda agregar una pregunta
con su respectiva respuesta.
Ilustración 17 Faq’s. Fuente: Autor
11.2.10 Iteración 10
Se desarrolló un módulo en el cual se puedan buscar los eventos pasados, así como
también información referente al Centro de Conocimiento.
Ilustración 18 Buscador. Fuente: Autor
11.2.11 Iteración 11
Se desarrolló un módulo de contacto, el cual incluye un formulario con los campos sugeridos
por el Product Owner.
Ilustración 19 Formulario de Contacto. Fuente: Autor
45
11.2.12 Iteración 12
Se desarrolló un módulo de pasarela de pagos para las membresías, en el que el usuario
podrá escoger que tipo de membresía desea adquirir, después lo redirigirá a una página
interna dónde le solicitará algunos datos personales y por último será redirigido a una
página externa donde podrá realizar el pago por medio de PSE.
Ilustración 20 Membresía mensual o anual. Fuente: Autor
Ilustración 21 Compra membresía. Fuente: Autor
46
12. CONCLUSIONES
El principal objetivo de este proyecto era el de desarrollar una plataforma web gestionable,
adaptable a todos los dispositivos (Tablet, Smartphone, PC), dando cumplimiento a cada
uno de los requerimientos se ha logrado la consecución de todos ellos.
El contenido puede ser modificado desde un panel de control en el que aparecen
los diferentes módulos desarrollados.
La apariencia de la plataforma web se adapta al dispositivo utilizado para
visualizarla, se ha logrado este comportamiento utilizando el framework Bootstrap.
La Plataforma web que se ha desarrollado cumple con lo propuesto en los mockups.
Se ha integrado una pasarela de pagos en la que se pueden adquirir membresías o
comprar entradas para un evento.
El sistema ha quedado completamente desarrollado, pero no se ha desplegado a
producción ya que faltan los resultados de las pruebas realizadas por parte de PSE para la
pasarela de pagos.
El uso de la metodología Scrum permitió un alineamiento entre el cliente y nuestro equipo
desarrollo logrando una flexibilidad y adaptación respecto a las necesidades del cliente.
El desarrollo de esta plataforma web me permitió adquirir mayor experiencia en cuanto a la
toma de decisiones, responsabilidades y a la manera en la que se deben abordar los
obstáculos que se presenten a lo largo del desarrollo para poderlos solucionar de una
manera óptima, cumpliendo con todos los requerimientos del cliente.
13. TRABAJO FUTURO
Como trabajo futuro se planea realizar el despliegue a producción e integrar nuevos
módulos que contengan contenido exclusivo solo para las personas que adquieran una
membresía ya sea mensual o anual.
47
14. BIBLIOGRAFIA
Sung, Lee. (2011). Preferencia de los protocolos de pago de débito basadas en Internet.
Revista IEEE, 424-427.
Jurriaan Souer, Dirk-Jan Joor. (2010). Un enfoque para identificar aspectos comunes en
ingeniería de aplicaciones web para un sistema de gestión de contenido web. Revista ACM-
DL, Articulo N° 8.
Stephanie Falla Aroche. (2009). 10 opciones de CMS que debes conocer. Artículo publicado
en el Especial de CMS de Comunicación y Pedagogía.
Xavier García Cuerda. (2004). Introducción a los Sistemas de Gestión de Contenidos (CMS)
de código abierto - Publicado en Gestión de contenidos, Tecnologías.
Schwaber, Sutherland. (2013). La Guía Definitiva de Scrum: Las Reglas del Juego.
Recuperado de http://www.scrumguides.org/docs/scrumguide/v1/Scrum-Guide-ES.pdf
Sistema Gestor de Contenido WordPress. (2010). Que es WordPress. Estados Unidos.
Disponible en: www.wordpress.com
Sistema Gestor de Contenido Drupal. (2012). Que es Drupal. Bélgica. Disponible en:
www.drupal.org
Sistema Gestor de Contenido Joomla. (2014). Que es Joomla. Disponible en
www.joomla.org
Que es PHP. (2012). Disponible en: http://php.net/manual/es/intro-whatis.php
Definición MYSQL. (2011). Disponible en:
http://searchdatacenter.techtarget.com/es/definicion/MySQL.
Que es HTML5. (2012). Disponible en: https://es.wikipedia.org/wiki/HTML5.
Definición CSS3. (2012). Disponible en: https://www.w3schools.com/css/css3_intro.asp
Que es Bootstrap. (2014). Disponible en: https://www.w3schools.com/bootstrap/
Que es Scrum. (2014). Disponible en: https://proyectosagiles.org/que-es-scrum/
Norma ISO 25000, Calidad del producto de software. (2011). Disponible en:
http://iso25000.com/index.php/normas-iso-25000