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

Texto completo

(1)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. 2.

(3) CONTENIDO. Pág.. 1.. INTRODUCCIÓN ........................................................................................................ 8. 2.. PLANTEAMIENTO DEL PROBLEMA ......................................................................... 9. 3.. 2.1. DESCRIPCIÓN DEL PROBLEMA ....................................................................... 9. 2.2. FORMULACIÓN DEL PROBLEMA ...................................................................... 9. 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. 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. 6.. MARCO TEÓRICO ............................................................................................ 14. 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. ALCANCES Y LIMITACIONES ................................................................................. 22. 3.

(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. 4.

(5) 11.2.12. Iteración 12 ........................................................................................................... 45. 12.. CONCLUSIONES ................................................................................................. 46. 13.. TRABAJO FUTURO .............................................................................................. 46. 14.. BIBLIOGRAFIA ..................................................................................................... 47. 5.

(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. 6.

(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. 7.

(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.. 8.

(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?. 9.

(10) 3. 3.1. OBJETIVOS. 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.. 10.

(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. 11.

(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). 12.

(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. Lenguaje Precio Código abierto Cuota de mercado Flexibilidad para implementar funcionalidades a medida Dificultad para administrador Dificultad para implementar cualquier diseño Posicionamiento SEO Calidad de documentación. Wordpress PHP Gratis Sí 65% Muy alta. PHP Gratis Sí 15% Baja. Joomla. Drupal PHP Gratis Sí 12% Muy alta. Baja. Media. Alta. Baja. Alta. Alta. Alto. Medio. Bajo. Alta. Baja. Alta. 13.

(14) Calidad comunidad usuarios. de Alta de. 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. 14.

(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. 15.

(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).. 16.

(17) . 5.3.5. 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. 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.. 17.

(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.. 18.

(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. 19.

(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.. 20.

(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/330 40073.pdf. 21.

(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.. 22.

(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.. 23.

(24) 7.4. ITERACIONES Tarea 1. Requerimientos cliente. Estimación. 5 días. Responsable Cliente – Desarrollador – Scrum Master Desarrollador. 5 días. Desarrollador. 5 días 7 días 7 días 5 días. Desarrollador Desarrollador Desarrollador Desarrollador. 5 días. Desarrollador. 5 días 5 días 5 días 5 días 5 días 5 días 10 días. Desarrollador Desarrollador Desarrollador Desarrollador Desarrollador Desarrollador Desarrollador. 5 días 5 días 1 días. Desarrollador Desarrollador Desarrollador. del 1 Día. 2. Diseño Pruebas Unitarias 3. Diseño de Interfaz Gráfica 4. Módulo Menú 5. Módulo Slider 6. Módulo de Eventos 7. Módulo de Descripción Sitio 8. Módulo Publicaciones Eventos Pasados 9. Módulo Aliados 10. Módulo Conferencistas 11. Módulo Ubicación 12. Módulo FAQ’s 13. Módulo Búsqueda 14. Módulo Contacto 15. Módulo Pasarela de Pagos 16. Pruebas 17. Diseño de Manuales 18. Entrega para despliegue Tabla 2 Iteraciones y Actividades Fuente: Autor. 24.

(25) 8. RECURSOS 8.1. RECURSOS FÍSICOS E INFRAESTRUCTURA: Recurso. Computador Portátil Sony Vaio. Descripción 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 Permite la creación y administración de contenidos principalmente en páginas web.. Gestor de Contenidos. Lenguaje de programación PHP. Versión: PHP 5.2.4 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. HTML5. Versión: HTML5 Sistema gestor de base de datos Mysql. Versión: Mysql 5.0. 25.

(26) Lenguaje de programación Javascript. Versión: Javascript 1.8.5 Es un lenguaje usado para definir la presentación de un documento estructurado escrito en HTML o XML (y por extensión en XHTML).. CSS3. Versión: CSS3. Framework css html Bootstrap. Versión: Bootstrap v3.2.0. Tabla 4 Recursos de Software Fuente: Autor. 26.

(27) 9. PRESUPUESTO. SOFTWARE Componente. Fuente. Inversión. Financiamiento. Total Pasantía (3 meses). PHP. ____________. $0. $0. MYSQL. ____________. $0. $0. HTML5. ____________. $0. $0. Javascript. ____________. $0. $0. CSS3. ____________. $0. $0. Bootstrap. ____________. $0. Hosting. Social Colectivo. $ 30.000/mes. $ 90.000. Dominio. Social Colectivo. $ 36.000/año. $ 36.000. Trello. ____________. $0. $0. Slack. ____________. $0. $0. $ 1.100.000. $ 1.100.000. $0. HARDWARE Computador portátil. Personal. 27.

(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. $ 5’986.000 Pesos. $ 15’506.000 Pesos. 15% Gastos Imprevistos. $ 2’325.900 Pesos. SUBTOTAL. $ 17’831.900 Pesos. TOTAL Tabla 5 Presupuesto Fuente: Autor. 28.

(29) 10. CRONOGRAMA DE ACTIVIDADES. Ilustración 2 Cronograma de Actividades. Fuente: Autor. 29.

(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 N1 N2. N3 N4 N5. N6 N7 N8. N9 N10. N11. N12. N13. NECESIDAD Desarrollar la interfaz de acuerdo a los mockups presentados por el cliente. La plataforma web deberá adaptarse a cualquier clase de dispositivo (Computador, Tablet, Smartphone). Se podrán agregar, editar o eliminar menús y submenús. Cada menú podrá desplegar o no, un submenú. Cada menú o submenú podrá redirigir a una página interna o externa a la plataforma web. Se podrá editar el orden en que aparecen los ítems del menú principal. Se podrá agregar, editar o eliminar elementos al carrusel de la página. El carrusel deberá contener un contador de cuenta regresiva indicando cuánto tiempo falta para el próximo evento El carrusel deberá contener un buscador de eventos. El módulo de eventos deberá contener categorías dependiendo de la clase de evento 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. Cada evento deberá redirigir a una página interna en la que se verá la descripción y el precio del evento. La plataforma web se tiene que conectar con la pasarela de pagos contratada por el. 30.

(31) centro de conocimiento, en la que podrá recibir el pago para asistir a un evento La pasarela de pagos también podrá recibir el pago para adquirir una membresía. 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 Al módulo de eventos pasados se le podrá agregar un título, una imagen y contenido editable. Al módulo de aliados se le podrá agregar, editar o eliminar una imagen de cada aliado y se presentará en forma de slider. 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 El módulo de ubicación deberá indicar la dirección del Centro de Conocimiento. El módulo de faq’s podrá agregar, editar o eliminar título con ícono y contenido. El módulo de contacto deberá incluir un formulario con 4 campos: nombre, correo electrónico, asunto, mensaje. El usuario que ingrese a la plataforma web podrá interactuar con todo el contenido publicado.. N14 N15. N16. N17. N18. N19 N20 N21. N22. 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 A1. ACTOR Administrador. A2. Redactor. A3. Visitante. 31. DESCRIPCIÓN Es el principal usuario de la plataforma web, es el que autoriza todo el contenido y los usuarios. Este actor redacta las publicaciones y genera el contenido. Este actor es el que entra a la plataforma para ver el contenido que ofrece el centro de conocimiento y los.

(32) A4. 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. Este actor es temporal, el cual se encarga del desarrollo de la plataforma web. Desarrollador. Tabla 7 Stakeholders. Fuente: Autor. 11.1.3 REQUERIMIENTOS Para los requerimientos se unieron las necesidades relacionadas entre sí. ID. REQUERIMIENTO. NECESIDADES ASOCIADAS N3-N4-N5-N6-N7N8-N9-N10-N11N12-N13-N14-N15N16-N17-N18-N19N20-N21-N22. R1. Persistencia de datos. R2. Gestión de menú. N3-N4-N5-N6-N22. R3. Gestión de carrusel. N7-N8-N9. R4. Gestión de eventos por categoría. N10-N11-N12-N13. 32. DESCRIPCIÒN El sistema contará con un modelo de base de datos que represente todas las entidades participantes en la plataforma web. 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. Se podrá gestionar el buscador y el contador, así como también agregar una imagen de fondo. Se podrán ver todos los eventos o de acuerdo a la categoría.

(33) R5. Gestión descripción del sitio. N15. R6. Gestión publicaciones eventos pasados. N16. R7. Gestión aliados. N17. R8. Gestión conferencistas. N18. R9. Gestión ubicación. N19. R10. Gestión faq’s. N20. 33. seleccionada por el usuario 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. Se podrá gestionar un resumen de los eventos realizados, que podrá incluir también una imagen y un título. Se podrá gestionar el módulo de aliados agregando, editando o eliminando una imagen de cada aliado en forma de carrusel. 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. Se podrá gestionar el módulo de ubicación añadiendo la dirección del Centro de Conocimiento en el mapa. Se podrá gestionar el módulo de faq’s agregando, editando o.

(34) R11. Gestión contacto. N21. R12. Gestión membresía. N13-N14. eliminando la pregunta y su respectiva respuesta. Se podrá gestionar el formulario de contacto agregando, editando o eliminando los campos que sean necesarios. 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.. 34.

(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).. 35.

(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 Terminada Alta 1 eliminar menús y submenús. Como administrador deseo poder agregar enlaces Terminada a los menús y submenús. 36. Media. 1.

(37) Como administrador deseo poder agregar, editar o Terminada eliminar una imagen al slider.. Media. 2. Como administrador deseo poder agregar, editar o Terminada eliminar un contador para el próximo evento al slider. Alta. 2. Como administrador deseo poder agregar, editar o Terminada eliminar un título y un resumen.. Alta. 2. Como administrador deseo poder agregar un Terminada buscador de eventos.. Media. 2. Como administrador deseo poder agregar, editar o Terminada eliminar un evento.. Baja. 3. Como administrador deseo poder agregar, editar o Terminada eliminar un título, una imagen, una descripción, y fecha y hora.. Alta. 3. Como administrador deseo poder asignarle una Terminada categoría a cada evento.. Baja. 3. Como administrador deseo poder agregar, editar o Terminada eliminar un título, un ícono, un pequeño resumen y un botón.. Alta. 4. Como administrador deseo poder agregar, editar, o Terminada eliminar una(s) imagen(es), un título y un resumen del evento realizado.. Alta. 5. Como administrador deseo poder agregar o Terminada eliminar una imagen de cada uno de los aliados.. Baja. 6. Como administrador deseo poder agregar, editar o Terminada eliminar una imagen, un nombre, un país, y una descripción del conferencista.. Alta. 7. Como administrador deseo poder agregar, editar o Terminada eliminar un texto con la dirección del Centro de Conocimiento.. Baja. 8. Como administrador deseo poder agregar un Terminada marcador que me indique la dirección del Centro de Conocimiento.. Baja. 8. 37.

(38) Como administrador deseo poder agregar, editar o Terminada eliminar preguntas frecuentes con su respectiva respuesta.. Alta. 9. Como administrador deseo poder agregar, editar o Terminada eliminar un formulario de contacto con los siguientes campos: nombre, correo electrónico, asunto, mensaje.. Alta. 10. Como administrador deseo poder agregar, editar o Terminada eliminar el precio de la membresía.. Alta. 11. Como administrador deseo poder agregar, editar o Terminada eliminar la clase de membresía (anual ó mensual).. Alta. 11. Como usuario deseo poder realizar búsquedas Terminada sobre los eventos. Baja. Como usuario deseo poder ver las publicaciones de Terminada eventos pasados.. Media. 12. Como usuario deseo poder comprar las entradas a Terminada los eventos.. Alta. 12. Como usuario membresía.. una Terminada. Alta. 12. Como usuario deseo poder contactarme por medio Terminada de un formulario con los administradores del Centro de Conocimiento.. Alta. 12. Como usuario deseo poder ver los términos y Terminada condiciones del Centro de Conocimiento.. Alta. 12. deseo. poder. adquirir. 12. Tabla 9 Product Backlog. Fuente: Autor. 11.1.6 ITERACIONES E HISTORIAS DE USUARIO ID HU1 HU2 HU3 HU4 HU5. HISTORIAS DE USUARIO Gestión de Menú Gestión de Slider Gestión de Eventos por Categorías Gestión Descripción del Sitio Gestión Publicación Eventos Pasados. 38. ITERACIÓN 1 2 3 4 5.

(39) HU6 HU7 HU8 HU9 HU10 HU11 HU12. Gestión Aliados Gestión Conferencistas Gestión Ubicación Gestión Faq’s Gestión Búsqueda Gestión Contacto Gestión Membresías. 6 7 8 9 10 11 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.. 39.

(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).. 40.

(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. 41.

(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.. 42.

(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. 43.

(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. 44.

(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. 45.

(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.. 46.

(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 ACMDL, 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). http://searchdatacenter.techtarget.com/es/definicion/MySQL.. Disponible. en:. 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. 47.

(48)