desarrollo de un sistema multimedia que permita …planteamiento del problema 18 2. justificaciÓn...

DESARROLLO DE UN SISTEMA MULTIMEDIA QUE PERMITA LA AGRUPACIÓN DE LAS APLICACIONES WEBS Y MÓVILES RELACIONADAS

CON LA UNIVERSIDAD AUTÓNOMA DE OCCIDENTE

CRISTIAN ORLANDO MORALES GIRALDO CARLOS JOSE ROSALES FIGUEROA

UNIVERSIDAD AUTÓNOMA DE OCCIDENTE FACULTAD DE INGENIERÍA

DEPARTAMENTO DE OPERACIONES Y SISTEMAS PROGRAMA DE INGENIERÍA MULTIMEDIA

SANTIAGO DE CALI 2017

DESARROLLO DE UN SISTEMA MULTIMEDIA QUE PERMITA LA

AGRUPACIÓN DE LAS APLICACIONES WEBS Y MÓVILES RELACIONADAS CON LA UNIVERSIDAD AUTÓNOMA DE OCCIDENTE

CRISTIAN ORLANDO MORALES GIRALDO CARLOS JOSE ROSALES FIGUEROA

Pasantía Institucional para optar el título de Ingeniero Multimedia

Director: ZEIDA MARÍA SOLARTE ASTAIZA

Ingeniera Electrónica Magíster en Ingeniería

UNIVERSIDAD AUTÓNOMA DE OCCIDENTE

FACULTAD DE INGENIERÍA DEPARTAMENTO DE OPERACIONES Y SISTEMAS

PROGRAMA DE INGENIERÍA MULTIMEDIA SANTIAGO DE CALI

2017

3

Nota de aceptación:

Aprobado por el Comité de Grado en cumplimiento de los requisitos exigidos por la Universidad Autónoma de Occidente para optar al título de Ingeniero Multimedia

JUAN JOSÉ CARDONA_____________ Jurado

Santiago de Cali, 02 de Junio de 2017

4

AGRADECIMIENTOS

Ante todo, agradecemos a Dios por habernos permitido llegar hasta esta etapa de nuestra vida académica y haber realizado este trabajo de grado, el cual fue llevado a cabo con pasión y esmero. Pues sin él, no hubiese sido posible realizar y culminar este trabajo. También agradecemos a nuestros padres, quienes con su incondicional compañía y amor nos brindaron la posibilidad de alcanzar esta meta y concretar exitosamente este capítulo de nuestra formación profesional; a ellos queremos darles gracias por su gran esfuerzo y motivación. Queremos agradecer muy especialmente a nuestra directora de trabajo de grado, Zeida María Solarte Astaiza, quien compartió con nosotros cada momento durante el proceso, brindando asesoría, apoyo y todos sus conocimientos para hacer de este trabajo un éxito y una realidad. Finalmente, agradecemos al personal de los departamentos de cómputo y comunicaciones por brindarnos su compañía y atención durante el desarrollo de este proyecto.

5

CONTENIDO

pág.

GLOSARIO 15 RESUMEN 16 INTRODUCCIÓN 17 1. PLANTEAMIENTO DEL PROBLEMA 18 2. JUSTIFICACIÓN 19 3. ANTECEDENTES 20

3.1 NIVEL LOCAL Y NACIONAL 20 3.1.1 Javemóvil 20 3.1.2 Colegio Aleman Cali 21 3.1.3 Alcaldía de Cali Móvil 22

3.2 NIVEL INTERNACIONAL 23 3.2.1 Barcelona al mòbil 23 3.2.2 Mobil barnard 24 3.2.3 Play store 25 4. MARCO TEÓRICO 26 4.1 SISTEMA MULTIMEDIA 26

6

4.2 APLICACIONES MÓVILES 27

4.2.1 Tipos de aplicaciones móviles 28 4.2.1.1 Aplicaciones web 28 4.2.1.2 Aplicaciones nativas 28 4.2.1.3 Aplicaciones híbridas 29

4.3 SISTEMAS OPERATIVOS MÓVILES 29 4.3.1 Android 30 4.3.2 Ios 31 4.4 ENTORNOS DE DESARROLLO 31 4.4.1 Apex (oracle application express) 32 4.4.2 Apache cordova 32 4.4.3 Android studio 32 4.4.4 Jquery mobile 32

4.5 INTERACCIÓN HUMANO COMPUTADOR 33 4.6 USABILIDAD 34 4.7 EXPERIENCIA DE USUARIO 35 4.8 SERVICIOS WEB 36 4.9 CONTROL DE VERSIONES 38 4.9.1 GitHub 38 5. OBJETIVOS 39

7

5.1 OBJETIVO GENERAL 39 5.2 OBJETIVOS ESPECÍFICOS 39 6. MARCO METÓDOLOGICO: DESARROLLO DEL SISTEMA MULTIMEDIA PARA LA AGRUPACION DE LAS APLICACIONES 40

6.1 ANÁLISIS 40 6.1.1 Investigación y recopilación de la información 41 6.1.2 Stakeholders 43 6.1.3 Definición y análisis de los requerimientos 45 6.1.4 Casos de uso 48 6.1.5 Contextos de uso 61 6.2 DISEÑO 61 6.2.1 Arquitectura del sistema 61 6.2.2 Arquitectura del portal administrativo 63 6.2.3 Arquitectura del aplicativo movil 64 6.2.4 Balance del sistema multimedia basado en los tres pilares - ux, hw y sw. 65 6.2.5 Diseño de interfaces de la aplicativo movil 66 6.2.6 Diseño de interfaces del portal administrativo 80 6.2.7 Diseño de los servicios web del aplicativo movil 85 6.2.8 Diseño capa de negocio del portal administrativo 89 6.2.9 Diseño capa de datos 90 6.3 IMPLEMENTACION 91

8

6.3.1 Herramientas de desarrollo 91 6.3.2 Implemetacion de servicios 94 6.3.3 Aplicativo movil 96 6.3.4 PORTAL ADMINISTRATIVO 106 6.4 PRUEBAS 109 6.4.1 Pruebas de aceptación con los casos de prueba 109 BIBLIOGRAFÍA 110 ANEXOS 115

9

LISTA DE FIGURAS

Pág. Ilustración 1: JaveMóvil: 20 Ilustración 2: Colegio Alemán Cali. 21 Ilustración 3: Alcaldía Cali Móvil 22 Ilustración 4: Barcelona al mobil. 23 Ilustración 5: BARNARD 24 Ilustración 6: Google Play Store 25 Ilustración 7: Principios de los sistemas multimedia 26 Ilustración 8: Pilares base del sistema multimedia 27 Ilustración 9: Principios de los sistemas multimedia 33 Ilustración 10: Etapas Metodologia RUP 40 Ilustración 11 Perfil de Usuario 45 Ilustración 12: casos de uso de la aplicación móvil. 49 Ilustración 13: Casos de uso de la aplicación móvil II 56 Ilustración 14: Arquitectura del sistema. 63 Ilustración 15: Arquitectura de la aplicación web. 64 Ilustración 16: arquitectura de la aplicación móvil. 65 Ilustración 17: Arquitectura de información transversal de la aplicación móvil. 67 Ilustración 18: interfaz de inicio. Baja fidelidad. 68 Ilustración 19: Interfaz de noticias. Baja fidelidad. 69

10

Ilustración 20: Interfaz de aplicaciones. Baja fidelidad. 70 Ilustración 21: Interfaz de ajustes. Baja fidelidad. 70 Ilustración 22: Android vs IOS 71 Ilustración 23Interfaz de aplicaciones. Alta fidelidad 72 Ilustración 24: Interfaz de aplicaciones - Móviles. Alta fidelidad. 73 Ilustración 25: Interfaz de aplicaciones – Móviles - detalles. Alta fidelidad. 74 Ilustración 26: Interfaz de aplicaciones - Web. Alta fidelidad. 75 Ilustración 27: Interfaz de noticias. Alta fidelidad. 76 Ilustración 28: Interfaz de noticia en detalle. Alta fidelidad. 77 Ilustración 29: Interfaz inicio. Alta fidelidad. 78 Ilustración 30: correcciones de los prototipos de alta fidelidad 79 Ilustración 31: Navegación transversal jerárquica 80 Ilustración 32: Pantalla de logueo 81 Ilustración 33: Pestaña de aplicaciones 82 Ilustración 34: Crear o modificar aplicaciones 83 Ilustración 35: Botón Crear 84 Ilustración 36: Cargar noticias 85 Ilustración 37: Modelo de negocio, sección de aplicaciones 86 Ilustración 38: modelo de negocio, sección de noticias y eventos 87 Ilustración 39: paquete de datos de servicio de logueo 87 Ilustración 40: Interfaz servicio de Log-In 88 Ilustración 41: paquete de datos de servicio de Aplicaciones 88

11

Ilustración 42: Modelo de negocio de la página administrador 89 Ilustración 43: Modelo Entidad Relación en la base de datos 90 Ilustración 44Herramientas de desarrollo de la aplicación móvil. 93 Ilustración 45: Desarrollo de los servicios 94 Ilustración 46: Respuesta del servidor 95 Ilustración 47: Diferencias entre sistemas operativos 97 Ilustración 48: Interfaz de inicio 98 Ilustración 49: Mensaje de alerta, recuperación de contraseña 99 Ilustración 50: Mensaje de carga de la aplicación 100 Ilustración 51: Interfaz de noticias 101 Ilustración 52: Interfaz de aplicaciones móviles y web. 102 Ilustración 53: Descripción de una página web 103 Ilustración 54: Interfaz de ajustes 104 Ilustración 55: Mensaje conformación de cierre de sesión 105 Ilustración 56: Género 115 Ilustración 57: Edad 115 Ilustración 58: Facultad a la que pertenece el programa. 115 Ilustración 59: Semestre en el que se encuentra 116 Ilustración 60: Pregunta 1. 117 Ilustración 61: Pregunta 2 117 Ilustración 62: Pregunta 3 117

12

Ilustración 63: Pregunta 4 118 Ilustración 64: Pregunta 5 119 Ilustración 65: Pregunta 6 119 Ilustración 66: Pregunta 7 120 Ilustración 67: Pregunta 8 120 Ilustración 68: Pregunta 9 121

13

LISTA DE CUADROS

Pág. Tabla 1 Tabla de requerimientos funcionales de la aplicación móvil. 46 Tabla 2 Tabla de requerimientos no funcionales de la aplicación móvil. 47 Tabla 3: caso de uso: “Autenticación de usuario” 50 Tabla 4: caso de uso: “Módulo de noticias” 51 Tabla 5: caso de uso: “Módulo de aplicaciones móviles y páginas web” 52 Tabla 6: caso de uso: “Ajustes” 54 Tabla 7: Matriz de trazabilidad 55 Tabla 8: caso de uso: “Autenticación de usuario” 57 Tabla 9: caso de uso: “Módulo de noticias” 58 Tabla 10: caso de uso: “Cierre de sesión” 59 Tabla 11: Matriz de trazabilidad II 60 Tabla 12: Criterios de selección para herramientas de desarrollo 91 Tabla 13: Matriz de selección SW 92 Tabla 14Tabla usuarios 106 Tabla 15Tabla Perfiles 107 Tabla 16Tabla Noticias 107 Tabla 17 Tabla Aplicaciones 108 Tabla 18Tabla Dispositivos 108

14

Tabla 19: Caso de prueba 1 124 Tabla 20: Caso de prueba 2 126 Tabla 21: Caso de prueba 3 128 Tabla 22: Caso de prueba 4 130 Tabla 23: Caso de prueba 1. Validación de credenciales portal web 132 Tabla 24: Caso de prueba 2. Módulo de noticas portal web. 134 Tabla 25: Caso de prueba 3. Sección de aplicaciones portal web. 136 Tabla 26: Caso de prueba 4 139

15

GLOSARIO APLICACIÓNES MÓVILES: las aplicaciones móviles, son herramientas de software desarrolladas para dispositivos Smartphone, con el fin de satisfacer necesidades de diferentes nichos poblacionales, ya sean de entretenimiento, aprendizaje, negocios o de información. BACKEND: aspecto lógico del sistema no accedido directamente por el usuario, realiza funciones de consulta de base de datos principalmente y envía la respuesta para ser presentada al usuario. FRAMEWORK: estructura base ya creada por otros desarrolladores para agilizar la construcción de software. FRONTEND: aspecto visual por el cual interactúa el usuario y permite la entrada de información para ser enviada a la parte lógica del sistema. INTERACCIÓN: acción generada entre dos o más objetos o individuos que involucra una causa y un efecto. RUP: siglas para Rational Unified Process o Proceso Racional Unificado en español, es una metodología de desarrollo de software que se organiza en cuatro principales fases (Iniciación, Elaboración, Construcción y Transición). SISTEMA MULTIMEDIA: sistemas interactivos complejos que hacen uso de información multimedia (imágenes, animación, texto, sonido y video), soportados por tecnologías hardware y software en donde se tiene en cuenta la interacción que tienen los usuarios con la tecnología. USABILIDAD: propiedad que mide la facilidad de uso de la interfaz de un producto frente a la interacción que tiene con el usuario.

16

RESUMEN En el presente trabajo de grado se describe el proceso de desarrollo e implementación de un sistema multimedia que permite la agrupación de las aplicaciones web y móviles. El sistema multimedia estará compuesto de dos componentes, el primer componente es una aplicación móvil que tiene como propósito brindar información relevante sobre las aplicaciones y servicios ofrecidos por la Universidad Autónoma de Occidente por medio de los dispositivos móviles de los estudiantes, además de mostrar las noticias y eventos relacionados con la universidad. El segundo componente es una aplicación web diseñada con el fin de administrar los contenidos sobre noticias, aplicaciones móviles y aplicaciones web. El proyecto también toma en consideración lanzamiento de futuras aplicaciones móviles, por lo que se describen una serie de pautas y normas que las aplicaciones deben cumplir para el ingreso al sistema. El desarrollo de esta pasantía universitaria se realizó bajo la metodología de Proceso Racional Unificado (RUP), que consta de las etapas de Inicio, Elaboración, Transición y Lanzamiento que permitieron no sólo completar el desarrollo e implementación sino también simplificar y detallar los procesos de integración con los sistemas de la universidad, complementar los diferentes componentes del sistemas y realizar pruebas de funcionamiento y de usabilidad. Palabras clave: Aplicación móvil híbrida, Desarrollo de software, Usabilidad, Metodología RUP.

17

INTRODUCCIÓN “En la actualidad, la penetración de la telefonía móvil en los países desarrollados es del 100% y el crecimiento que experimenta anualmente es mínimo, mientras que en los países en vía de desarrollo se está produciendo un crecimiento anual significativo”1. Los estudiantes de la universidad no son ajenos a esta tendencia de uso de los teléfonos inteligentes, por lo tanto se plantea en la Universidad Autónoma de Occidente, la necesidad de desarrollar aplicativos móviles para que la comunidad universitaria tenga mayor acceso a la información de los procesos académicos y administrativos de la universidad. En consecuencia a que dichos aplicativos responderán a las necesidades puntuales de los diferentes estamentos universitarios, la Universidad Autónoma de Occidente contará con una gran cantidad de aplicaciones móviles, generando en sus usuarios frustración al tener que cambiar entre aplicativos para poder acceder a información relevante tales como: servicios académicos, financieros, noticias, eventos, etc. En este proyecto, el cual nace bajo la modalidad de pasantía institucional, se plantea el desarrollo de un aplicativo móvil, el cual agrupará los recursos web y móviles de la universidad Autónoma de Occidente, así como también las noticias y eventos relacionados con la institución, con el fin de facilitar el acceso a la información requerida por la comunidad universitaria. Además de definir una serie de parámetros que permitirá normalizar el desarrollo y la imagen corporativa de la institución.

1Measuring the Information Society Report 2014 [en línea]. Suiza. International Telecommunications Union (ITU). [consultado el 24 de Marzo 2016]. Disponible en internet: https://www.itu.int/en/ITU-D/Statistics/Documents/publications/mis2014/MIS2014_without_Annex_4.pdf

https://www.itu.int/en/ITU-D/Statistics/Documents/publications/mis2014/MIS2014_without_Annex_4.pdfhttps://www.itu.int/en/ITU-D/Statistics/Documents/publications/mis2014/MIS2014_without_Annex_4.pdf

18

1. PLANTEAMIENTO DEL PROBLEMA

Según el informe Cifras 2016-32 de la universidad Autónoma de Occidente, en el tercer periodo del 2016 la Universidad Autónoma de Occidente contaba con 10.841 estudiantes matriculados en 50 programas académicos ofrecidos, con aproximadamente 696 docentes dictando asignaturas. Con la necesidad de cubrir el despliegue de la información requerida por la comunidad universitaria, la Universidad Autónoma de Occidente dispuso gran variedad de plataformas y aplicaciones web. Sin embargo, actualmente el acceso a la información de la universidad solo se puede realizar a través de su plataforma web, por lo cual la Universidad Autónoma plantea a futuro el desarrollo de diferentes aplicaciones móviles, para responder de manera más eficiente a las necesidades puntuales de los diferentes estamentos de la comunidad académica. El hecho de desarrollar múltiples aplicaciones móviles, generará un problema interno en la universidad, por lo cual surge el interrogante: ¿Cómo la comunidad académica accederá de manera fácil a las aplicaciones móviles existentes? La no solución del problema planteado, podría generar frustración en los usuarios al tener que navegar entre diferentes sitios para encontrar los aplicativos que le permitan acceder a información relevante; tales como servicios académicos, financieros, noticias, eventos, etc. Dado lo anterior en este proyecto se plantea la creación de un espacio en donde se agrupen las futuras aplicaciones móviles y las páginas y servicios web actuales, con el propósito de facilitar su acceso a la comunidad, además de mostrar las noticias de intereses del estudiante desde la aplicación. Además debido a las necesidades de los Stakeholders, se requiere un desarrollo rápido de la solución que cuenten con conceptos como: HCI (Interacción Humano Computador), UX (Experiencia de Usuario), WS (Servicios Web), etc. Que garantice la integridad de los datos en los servidores de la universidad, aumentando el valor de los servicios universitarios brindados. 2 Cifras 2016-3. [en línea]. Santiago de Cali: Universidad Autónoma de Occidente.2016 [consultado el 24 de Marzo de 2016]. Disponible en internet: http://www.uao.edu.co/la-universidad/universidad-autonoma-de-occidente-en-cifras

http://www.uao.edu.co/la-universidad/universidad-autonoma-de-occidente-en-cifrashttp://www.uao.edu.co/la-universidad/universidad-autonoma-de-occidente-en-cifras

19

2. JUSTIFICACIÓN La Universidad Autónoma de Occidente piensa desarrollar diversas aplicaciones móviles para los diferentes estamentos de la universidad, solución que busca facilitar el rápido acceso a la información, medida que se adoptó teniendo en cuenta la gran penetración de los Smartphone que se ve en la actualidad. Sin embargo esta variedad de aplicativos podrían generar frustración hacia sus usuarios, por la desinformación a la hora de saber cuáles son las aplicaciones de interés y la accesibilidad a estas al tener que realizar diferentes descargas y tener puntos de accesos distintos. Esta variedad de aplicaciones, si tuviera un punto de acceso único, un solo portal, que facilitara el acceso a las aplicaciones móviles de la universidad, y además que cada una tuviera una descripción, generaría en el usuario una experiencia más agradable, ya que este podría descargar fácilmente las aplicaciones que más le interesen. Adicionalmente la agrupación de las aplicaciones de la Universidad Autónoma de Occidente, permitiría facilitar la gestión de contenidos e imagen corporativa de estas mismas a partir de la creación de unos estándares que regulen la integración de futuras aplicaciones con el sistema. Sin embargo, el planteamiento de un punto de acceso en una plataforma de dispositivos móviles que no cuente con una interfaz intuitiva y el usuario aprenda rápidamente a navegar y utilizar sus funcionalidades, tendría el efecto contrario al que la universidad plantea. Por este motivo es imprescindible la aplicación de conceptos como usabilidad, accesibilidad, experiencia de usuario etc. Y de procesos de prototipado, heurísticas de usabilidad, pruebas con usuarios, etc. Por tanto, se plantea el desarrollo de un sistema multimedia que permita la agrupación de las aplicaciones web y móviles relacionadas con la Universidad Autónoma de Occidente, el cual es importante para enriquecer la experiencia del usuario, al generar una convergencia entre los diferentes canales de servicios de la universidad (aplicaciones móviles, y web), buscando generar una experiencia más coherente y usable, aprovechando los dispositivos móviles que le dan un valor agregado en cuanto a versatilidad y comodidad. Propuesta válida desde la perspectiva de la alta penetración de los dispositivos móviles en Colombia, según Lunden3, estudios realizados en el 2014 sobre la penetración de los dispositivos móviles en Latinoamérica, Colombia se posiciona en el tercer puesto, tendencia a la cual no es ajena la Universidad Autónoma de Occidente. 3 LUNDEN, Ingrid. 6.1B SMARTPHONE Users Globally by 2020, Overtaking Basic Fixed Phone Subscriptions. Techcrunch.com [en línea]. Junio 2015. [consultado el 24 de Marzo de 2016]. Disponible en internet:http://techcrunch.com/2015/06/02/6-1b-smartphone-users-globally-by-2020-overtaking-basic-fixed-phone-subscriptions/

http://techcrunch.com/2015/06/02/6-1b-smartphone-users-globally-by-2020-overtaking-basic-fixed-phone-subscriptions/http://techcrunch.com/2015/06/02/6-1b-smartphone-users-globally-by-2020-overtaking-basic-fixed-phone-subscriptions/

20

3. ANTECEDENTES

A continuación se presentan algunos desarrollos existentes de plataformas web adaptadas a dispositivos móviles y aplicaciones móviles que integran una variedad de servicios ofrecidos a los usuarios, que servirán como punto de partida para dar un ejemplo más específico de las funciones y características del proyecto a desarrollar. 3.1 NIVEL LOCAL Y NACIONAL 3.1.1 Javemóvil.

Ilustración 1: JaveMóvil:

Fuente: JaveMóvil Pontificia Universidad Javeriana Cali [en línea]. Apple.com Itunes [consultado el 24 de Marzo de 2016]. Disponible en internet: https://itunes.apple.com/co/app/javemovil-2/id946790061?mt=8

https://itunes.apple.com/co/app/javemovil-2/id946790061?mt=8

21

JaveMóvil es la aplicación para dispositivos móviles de la Pontificia Universidad Javeriana, con la que los estudiantes pueden saber de sus clases, salones y edificios; contactar compañeros; mantenerse al tanto de las noticias y eventos, entre otras muchas utilidades que se ofrecerán en esta primera versión de la aplicación. 3.1.2 COLEGIO ALEMAN CALI

Ilustración 2: Colegio Alemán Cali.

Fuente: Aplicación colegio alemán [en línea]. Androidpit.es [consultado el 24 de Marzo de 2016]. Disponible en internet: http://www.androidpit.es/aplicacion/com.appmachine.p4908EJ Colegio Alemán Cali es la aplicación para dispositivos móviles del Colegio Alemán Cali, con la que los estudiantes pueden saber de sus clases, salones y edificios; contactar compañeros; mantenerse al tanto de las noticias y eventos, entre otras muchas utilidades que se ofrecerán en esta primera versión de la aplicación.

http://www.androidpit.es/aplicacion/com.appmachine.p4908EJ

22

3.1.3 Alcaldía de Cali móvil. Ilustración 3: Alcaldía Cali Móvil

Fuente: Cali App [en línea] Google Play [consultado el 24 de Marzo de 2016]. Disponible en internet: https://play.google.com/store/apps/details?id=com.alcaldiacalimovil Aplicativo móvil que te permite acceder a los diferentes servicios móviles y en línea que ofrece la Alcaldía de Santiago de Cali, a través de tu SMARTPHONE o tableta, con el fin que agilicen y simplifiquen sus tareas y mejoren los servicios ofrecidos para ellos. Además de ser una referencia en cuanto a la función de la aplicación en sí, es una referencia en cuanto al como el aplicativo muestra la información de los aplicativos y servicios disponibles y re direcciona al usuario al servicio requerido.

https://play.google.com/store/apps/details?id=com.alcaldiacalimovil

23

3.2 NIVEL INTERNACIONAL 3.2.1 Barcelona al Mòbil. Ilustración 4: Barcelona al mobil.

Fuente: Barcelona al mobil [en línea] itunes.apple.com [consultado el 24 de Marzo de 2016]. Disponible en internet: https://itunes.apple.com/es/app/barcelona-al-mobil/id476286604?mt=8 Barcelona al móbil, permite el acceso directo a todos los servicios para móviles del ayuntamiento de Barcelona, donde el usuario podrá descargar aplicaciones nativas que se pueden descargar del Market, además de servicios web, SMS y RSS.

https://itunes.apple.com/es/app/barcelona-al-mobil/id476286604?mt=8https://itunes.apple.com/es/app/barcelona-al-mobil/id476286604?mt=8

24

3.2.2 Mobil barnard.

Ilustración 5: Barnard

Fuente: Barnard [en línea]. Barnard.edu [consultado el 24 de Marzo de 2016]. Disponible en internet: http://a2.mzstatic.com/us/r30/Purple7/v4/24/c4/56/24c4567f-2b20-8280-95b6-264b20fa2d6d/screen322x572.jpeg Barnard es una universidad ubicada en al oeste de la ciudad de New York y cerca del este de Manhattan, sobresale en involucrar a los estudiantes potenciales con su aplicación para el campus. Tiene un módulo de admisión integral y una gran variedad de vídeos que le da al visitante una sensación real para el campus. Con una gran variedad de módulos como se puede ver en la primera imagen.

http://a2.mzstatic.com/us/r30/Purple7/v4/24/c4/56/24c4567f-2b20-8280-95b6-264b20fa2d6d/screen322x572.jpeghttp://a2.mzstatic.com/us/r30/Purple7/v4/24/c4/56/24c4567f-2b20-8280-95b6-264b20fa2d6d/screen322x572.jpeg

25

3.2.3 Play store.

Ilustración 6: Google Play Store

Fuente: Google Play Store [en línea]. Descargaplaystore.mobi [consultado el 24 de Marzo de 2016]. Disponible en internet: http://descargaplaystore.mobi/wp-content/uploads/2015/10/descargar-play-store1.jpg La play store es una tienda virtual de aplicaciones, música, películas, y libros, para dispositivos móviles, en ella se puede descargar aplicaciones, guarda un registro de las aplicaciones que uno posee, se puede ejecutar dichas aplicaciones desde la aplicación, además que posee categorías para realizar búsquedas. Calificación y comentarios por parte del usuario.

http://descargaplaystore.mobi/wp-content/uploads/2015/10/descargar-play-store1.jpghttp://descargaplaystore.mobi/wp-content/uploads/2015/10/descargar-play-store1.jpg

26

4. MARCO TEÓRICO

Teniendo en cuenta la temática que se aborda para la ejecución del proyecto, existen una gran variedad de conceptos que permitirán la comprensión y desarrollo del mismo. A continuación se presenta una descripción concisa y detallada de los aspectos más relevantes, con el fin de contextualizar el alcance del proyecto. 4.1 SISTEMA MULTIMEDIA Sistemas interactivos complejos que hacen uso de información multimedia, soportados por tecnologías hardware y software en donde se tiene en cuenta la interacción que tienen los usuarios con la tecnología, además que permite una comunicación multisensorial y multidireccional. Para llegar a la creación de un sistema multimedia, se deben tener en cuenta ciertos conceptos y principios basados en disciplinas como procesamiento de imágenes y audio, HCI (Interacción hombre - máquina), visión por computador, reconocimiento de patrones, gráficos por computador, redes y sistemas operativos.4 Ilustración 7: Principios de los sistemas multimedia

Fuente: Principios de los sistemas multimedia. [en línea]. Computer Science department, 2007. [Consultado el 12 de Marzo de 2016]. Disponible en internet: http://www.cs.bc.edu/~hjiang/c335/

4 JIANG Hao. Introduction CS335. Principles of multimedia systems. Computer Science Department [en línea]. 2007 [consultado el 12 de Marzo 2016]. Disponible en internet http://www.cs.bc.edu/~hjiang/c335/notes/lec1/intro.ppt

http://www.cs.bc.edu/~hjiang/c335/http://www.cs.bc.edu/~hjiang/c335/notes/lec1/intro.ppthttp://www.cs.bc.edu/~hjiang/c335/notes/lec1/intro.ppt

27

Los sistemas multimedia, se encuentran basados en tres pilares que son: Hw (hardware), Sw (software) y UX (experiencia de usuario). De los cuales, dependiendo del sistema a implementar habrán pilares que presenten mayor importancia que otros. A continuación, se muestra la relación entre los tres pilares para formar un sistema multimedia:

Ilustración 8: Pilares base del sistema multimedia

Fuente: Principios de los sistemas multimedia. [En línea]. Computer Science department. Septiembre 4 2007. [Consultado el 12 de Marzo de 2016]. Disponible en internet: http://www.cs.bc.edu/~hjiang/c335/ 4.2 APLICACIONES MÓVILES Las aplicaciones móviles, son pequeños programas o aplicaciones informáticas que realizan funciones para las que han sido diseñadas: juegos, calculadoras de todo tipo, directorios, glosarios, programas formativos, presentaciones o catálogos de empresas, etc. Permite a las empresas ofrecer nuevos servicios a los clientes o personal interno con multitud de información y contenidos en formatos muy atractivos, todo a través de teléfonos móviles o tabletas. Se pueden descargar e instalarse en cualquier dispositivo móvil de última generación (Smartphone) y permiten a sus usuarios ejecutarlos con o sin conexión a internet.

http://www.cs.bc.edu/~hjiang/c335/

28

“Actualmente se encuentran aplicaciones de todo tipo, forma y color, pero en los primeros teléfonos, estaban enfocadas en mejorar la productividad personal: se trataba de alarmas, calendarios, calculadoras y clientes de correo”.5 4.2.1 Tipos de aplicaciones móviles: Es importante aclarar, que no todas las aplicaciones móviles, tienen las mismas características, ni son del mismo tipo. Los tipos aplicaciones móviles que se conocen son, nativos, web e híbridos. 4.2.1.1 Aplicaciones web: “Sitio web específicamente optimizado para un dispositivo móvil. Las características que definen una aplicación web son las siguientes: la interfaz de usuario se construye con tecnologías web estándar, para acceder a estas aplicaciones es por medio de un navegador y una URL (pública, privada o protegida) y está optimizada para los dispositivos móviles. Una aplicación web no está instalada en el dispositivo móvil”.6 4.2.1.2 Aplicaciones nativas: Las aplicaciones nativas son aquellas que han sido desarrolladas con el software que ofrece cada sistema operativo a los programadores, llamado genéricamente Software Development Kit o SDK. Así, Android, iOS y Windows Phone tienen uno diferente y las aplicaciones nativas se diseñan y programan específicamente para cada plataforma, en el lenguaje utilizado por el SDK. Este tipo de apps se descarga e instala desde las tiendas de aplicaciones, sacando buen partido de las diferentes herramientas de promoción y marketing de cada una de ellas. Las aplicaciones nativas se actualizan frecuentemente y en esos casos, el usuario debe volver a descargarlas para obtener la última versión, que a veces corrige errores o añade mejoras. A nivel de diseño, esta clase de aplicaciones tiene una interfaz basada en las guías de cada sistema operativo, logrando mayor coherencia y consistencia con el

5 CUELLO Javier y VITTONE Jóse. Diseñando apps para móviles [en línea]. España. 2013 [consultado el 16 de Marzo 2016]. Disponible en internet: http://www.appdesignbook.com/es/contenidos/las-aplicaciones/ 6 PRIETO BLÁZQUEZ, Joseph. RÁMIREZ VIQUE, Robert, MORILLO POZO, Julián David. DOMINGO PIETRO, Marc. Tecnología y desarrollo e dispositivos móviles. Entornos de programación móviles [en línea]. 1 ed. Barcelona: Eureca Media, SL. 2011 [consultado el 13 de Marzo de 2016]. Disponible en internet: https://desarrolloappandroid.files.wordpress.com/2013/06/tecnologia-desarrollo-dispositivos-moviles.pdf

http://www.appdesignbook.com/es/contenidos/las-aplicaciones/http://www.appdesignbook.com/es/contenidos/las-aplicaciones/https://desarrolloappandroid.files.wordpress.com/2013/06/tecnologia-desarrollo-dispositivos-moviles.pdfhttps://desarrolloappandroid.files.wordpress.com/2013/06/tecnologia-desarrollo-dispositivos-moviles.pdf

29

resto de aplicaciones y con el propio SO. “Esto favorece la usabilidad y beneficia directamente al usuario que encuentra interfaces familiares”.7 Estas aplicaciones no necesitan Internet para su funcionamiento, ya que se encuentran instaladas en el dispositivo, esto permite manipular todos los componentes de hardware del teléfono, como la cámara y los sensores (GPS, acelerómetro, giróscopo, entre otros). 4.2.1.3 Aplicaciones híbridas: “Las aplicaciones híbridas presentan el mismo comportamiento que las aplicaciones nativas. Es decir, estas pueden ser instaladas en el celular desde las tiendas de aplicaciones móviles, pero poseen cierta diferencia y es que son desarrolladas como las páginas web”8 Son desarrolladas bajo la combinación de tecnologías web como HTML, CSS y JavaScript. La diferencia clave es que se encuentran alojadas dentro de una aplicación nativa usando un “WebView” de la plataforma móvil. La diferencia entre las aplicaciones híbridas y las web es que al estar instaladas en el dispositivo, estas pueden tener acceso a sus sensores como cámara, acelerómetro, giroscopio, etc. Capacidades que normalmente se encuentran restrictas a las aplicaciones web. Actualmente todas las aplicaciones híbridas son exportadas a través de Apache Cordova, una plataforma que provee un set de APIs en JavaScript para acceder a las capacidades del dispositivo por medio de plugins que son creados por código nativo. 4.3 SISTEMAS OPERATIVOS MÓVILES

En el libro “sistemas operativos” escrito por William Stallings, se define un sistema operativo (SO) como aquel que “explota los recursos de hardware de uno

7 CUELLO Javier y VITTONE Jóse. Diseñando apps para móviles [en línea]. España. 2013 [consultado el 16 de Marzo de 2016]. Disponible en internet: http://www.appdesignbook.com/es/contenidos/las-aplicaciones/ 8 BRISTOWE John. ¿What is a Hybrid Mobile App? Developer.telerik.com [en línea]. Marzo 2015 [consultado el 15 de marzo de 2016]. Disponible en internet: http://developer.telerik.com/featured/what-is-a-hybrid-mobile-app/

http://www.appdesignbook.com/es/contenidos/las-aplicaciones/http://www.appdesignbook.com/es/contenidos/las-aplicaciones/http://developer.telerik.com/featured/what-is-a-hybrid-mobile-app/

30

o más procesadores para ofrecer un conjunto de servicios a los usuarios de un sistema o aplicación”9. El sistema operativo móvil determina también que aplicaciones de terceras partes se pueden instalar en el dispositivo. Por lo tanto, “cada sistema operativo define unos entornos sobre los que se pueden crear aplicaciones”.10 En este apartado se describirán los sistemas operativos más usados en el mercado de Smartphone entre los cuales se encuentran Android y iOS, además se definirán los entornos de desarrollo sobre los cuales se puede trabajar para estos dos sistemas operativos. 4.3.1 Android: “Android es un sistema operativo para dispositivos móviles como teléfonos inteligentes y tabletas basado en el núcleo Linux. Es desarrollado por la Open Handset Alliance, la cual es liderada por Google, usando diversos conjuntos de herramientas de software de código abierto para dispositivos móviles.”11 Fue construido para permitir a los desarrolladores la creación de aplicaciones móviles que aprovechan al máximo el uso de todas las herramientas que un dispositivo como este puede ofrecer. Implementa una arquitectura en la que cualquier aplicación puede obtener acceso a las capacidades del teléfono móvil. Por ejemplo, una aplicación puede llamar una o varias de las funcionalidades básicas de los dispositivos móviles, tales como realizar llamadas, enviar mensajes de texto, o utilizar la cámara, facilitando a los desarrolladores crear experiencias más ricas y con más coherencia para los usuarios. Está construido sobre el kernel de Linux. Además, se utiliza una máquina personalizada virtual que fue diseñada para optimizar los recursos de memoria y de hardware en un entorno móvil. Android es de código abierto, y además puede ser libremente ampliado para incorporar nuevas tecnologías de vanguardia que van surgiendo. “La plataforma continuará evolucionando a medida que la

9 STALLINGS W. Sistemas Operativos [en línea] 2ed. Madrid: Prenticehall. 1997 [consultado el 16 de Marzo de 2016]. Disponible en internet: http://cs.uns.edu.ar/~jechaiz/sosd/clases/libros/stallings-beymar.pdf 10 GONZALEZ, Daniel. Responsive web design: multidispositivo para mejorar la experiencia del usuario. Bid.ub.edu [en línea]. 1998 [consultado el 17 de Marzo de 2016]. Disponible en internet: http://bid.ub.edu/pdf/31/es/gonzalez2.pdf. ISSN 1575-5886 11 Programación en dispositivos móviles portables. Android [en línea]. Universidad Carlos III de Madrid. Software de comunicaciones [consultado el 17 de Marzo de 2016] Disponible en internet: https://sites.google.com/site/swcuc3m/home/android/portada

http://cs.uns.edu.ar/~jechaiz/sosd/clases/libros/stallings-beymar.pdfhttp://cs.uns.edu.ar/~jechaiz/sosd/clases/libros/stallings-beymar.pdfhttp://bid.ub.edu/pdf/31/es/gonzalez2.pdfhttps://sites.google.com/site/swcuc3m/home/android/portada

31

comunidad de desarrolladores trabajando juntos puedan crear aplicaciones móviles innovadoras”.12 4.3.2 Ios: “IOS es un sistema operativo creado y desarrollado por Apple Inc. Distribuido exclusivamente en el hardware móvil de la compañía como el iPhone, iPad e iPod Touch. Basado en UNIX y BSD, llevando ciertas características de su sistema operativo de escritorio Mac OS X a pantallas de menor tamaño, con métodos de entrada multitáctiles”.13 Antes llamado iPhone OS y distribuido en su primera versión en el 2006 con el iPhone de primera generación como su portador, es el segundo sistema operativo más popular después de Android en el mundo. Apple iOS mantiene innovando ya que anualmente recibe actualizaciones que incluyen nuevos dispositivos que lo portarán y nuevas características, manteniéndolo a la vanguardia de las plataformas móviles. 4.4 ENTORNOS DE DESARROLLO Las aplicaciones móviles representan una gran oportunidad para las diferentes empresas o emprendedores enfocados en el desarrollo de aplicaciones, por lo tanto estos siempre se encuentran en búsqueda de los mejores entornos de desarrollo.

12 GONZALEZ, Daniel. Responsive web design: multidispositivo para mejorar la experiencia del usuario. Bid.ub.edu [en línea]. 1998 [consultado el 17 de Marzo de 2016]. Disponible en internet: http://bid.ub.edu/pdf/31/es/gonzalez2.pdf. ISSN 1575-5886 13 Programación en dispositivos móviles portables. Android. [en línea]. Universidad Carlos III de Madrid. Software de comunicaciones [consultado el 17 de Marzo de 2016] Disponible en internet: https://sites.google.com/site/swcuc3m/home/android/portada

http://www.appdesignbook.com/es/contenidos/las-aplicaciones/http://bid.ub.edu/pdf/31/es/gonzalez2.pdfhttps://sites.google.com/site/swcuc3m/home/android/portada

32

4.4.1 Apex (oracle application express): Oracle Application Express (Oracle APEX), se conocía anteriormente como HTML_DB, es una herramienta de desarrollo basada en un navegador web, que permite desarrollar de manera rápida aplicaciones web para la base de datos Oracle. “Utilizando solamente un navegador web y limitada experiencia en programación, se puede desarrollar y desplegar aplicaciones profesionales que son a su vez rápidas y seguras. El lenguaje de programación que va a necesitar, si la funcionalidad estándar del paquete no llena por completo sus necesidades es PL/SQL”14. 4.4.2 Apache cordova: Es un marco de desarrollo móvil de código abierto, el cual permite el uso de tecnologías web estándar como HTML5, CSS3 Y JavaScript para el desarrollo de aplicaciones multiplataforma. “Las aplicaciones se ejecutan dentro de paquetes específicos para cada plataforma, basados en los enlaces de API compatibles con los estándares de acceso a las capacidades de cada dispositivo o sistema operativo”.15 4.4.3 Android studio: Android Studio es un entorno de desarrollo integrado (IDE), basado en IntelliJ IDEA de la compañía JetBrains, que proporciona varias mejoras con respecto al plugin ADT (Android Developer Tools) para Eclipse. “Android Studio utiliza una licencia de software libre Apache 2.0, está programado en Java y es multiplataforma”16. 4.4.4 Jquery mobile: Jquery Mobile es una buena opción para las organizaciones que necesitan un marco web móvil de código abierto que les permitirá aprovechar las capacidades de jQuery. El marco ofrece la posibilidad de usar HTML, JavaScript y CSS para construir páginas web móviles interactivas destinadas a una amplia gama de teléfonos inteligentes, y se puede utilizar con PhoneGap para construir aplicaciones móviles híbridas. 4.4.5 Ionic framework: Ionic es una herramienta de desarrollo de aplicaciones móviles híbridas, esto quiere decir que sirve para compilar aplicaciones tanto para 14 Oracle Application Express [en línea]. Oracle [consultado el 17 de Marzo de 2016]. Disponible en internet: https://apex.oracle.com/es/ 15 About Apache Cordova™ [en línea]. Apache Cordova [consultado el 17 de Marzo de 2016]. Disponible en internet: http://cordova.apache.org 16 Android Studio v10. Características y comparativa con eclipse. Academiaandroid.com [en línea] 2014 [consultado el 18 de Marzo de 2016]. Disponible en internet: http://academiaandroid.com/android-studio-v1-caracteristicas-comparativa-eclipse/

http://academiaandroid.com/ide-entornos-integrados-de-desarrollo-para-android/http://academiaandroid.com/ide-android-intellij-android-studio-aide/http://es.wikipedia.org/wiki/Apache_Licensehttps://apex.oracle.com/es/http://www.appdesignbook.com/es/contenidos/las-aplicaciones/http://cordova.apache.org/http://academiaandroid.com/android-studio-v1-caracteristicas-comparativa-eclipse/

33

Android, y iOS. Ionic está basado en HTML5, CSS, y JS. Está construido usando Sass, y optimizado para trabajar con AngularJS. Desarrollado sobre AngularJS y lanzada su primera beta en el 2013, Ionic utiliza su base para proporcionar la estructura de aplicación mínima sobre la que trabaja (controlador de la aplicación), mientras que Ionic en sí ofrece facilidades en el desarrollo de la interfaz de usuario. Con esta dupla, AngularJS con su versatilidad y potencia para la creación de aplicaciones e Ionic Framework para el desarrollo de la interfaz, se tiene una herramienta de creación de aplicaciones completa, con la que ahorra tiempo y trabajo en el desarrollo de un proyecto.

Ilustración 9: Principios de los sistemas multimedia

Fuente: Principios de los sistemas multimedia [en línea]. Blog.codecentric.de [consultado el 17 de Marzo de 2016] Disponible en internet: https://blog.codecentric.de/files/2014/11/overview.png 4.5 INTERACCIÓN HUMANO COMPUTADOR La Interacción entre humanos y Computadoras, (HCI) (Human-Computer Interaction) es un área de investigación multidisciplinaria enfocada en las modalidades de interacción entre humanos y computadoras, algunas veces se utiliza el término más genérico de Interface Humano Máquina, (HMI), para referirse a la interfaz de usuario en un sistema de manufactura o de control de procesos. En otras palabras, la disciplina HCI investiga y trata todos los aspectos relacionados con el diseño y la implementación de las interfaces entre los humanos y las computadoras. Dada la naturaleza y objetivos, la HCI en forma innata involucra múltiples disciplinas relacionadas con la ciencia de la

https://blog.codecentric.de/files/2014/11/overview.png

34

computación, (procesamiento de imágenes, visión computarizada, lenguajes de programación y otras similares), así como disciplinas relacionadas con las ciencias humanas (ergonomía, factores humanos, psicología cognitiva, y otras similares). “La investigación sobre HCI primariamente concierne al diseño, implementación y especificación de nuevas interfaces para mejorar la interacción entre humanos y máquinas. El término mejora puede quedar relacionado con diferentes aspectos, incluyendo lo intuitivo en el uso, así como la robustez de una interface”17. En el inicio de la ciencia de la computación, los diseñadores y desarrolladores le prestaron mucha menor atención a la problemática de hacer que el hardware y los productos de software fueran utilizables, o 'amigables al usuario.' Así lo requerimientos provenientes desde un creciente conjunto de usuarios para el uso simple de dispositivos eventualmente captaron la atención de los investigadores bajo la denominación de usabilidad. 4.6 USABILIDAD El término usabilidad es relativamente reciente. Se puede decir que surgió poco después de la expansión de Internet, a finales de los años 90. Pero, realmente, la idea que quiere expresar es bastante anterior, aunque se conocía con otros nombres como por ejemplo el Diseño Centrado en el Usuario o Human-Computer Interaction (HCI). “La usabilidad se refiere a la capacidad de un software o sistema interactivo de ser comprendido, aprehendido, usado fácilmente y atractivo para un usuario, en condiciones específicas de uso. También es la efectividad, eficiencia y satisfacción con la que un producto permite alcanzar sus objetivos específicos”18. A partir de la conceptualización llevada a cabo por la ISO, se infieren los principios básicos en los que se basa la usabilidad: ● Facilidad de Aprendizaje: facilidad con la que nuevos usuarios desarrollan una interacción efectiva con el sistema o producto. Está relacionada con la

17 MUÑOZ ARTEAGA, Jaime, et al. Temas de diseño en interacción humano-computadora [en línea]. LATIn 2014 [consultado el 2 de agosto del 2016]. Disponible en internet: http://www.proyectolatin.org/books/Temas_de_Dise%C3%B1o_en_Interacci%C3%B3n_Humano_Computadora_CC_BY-SA_3.0.pdf 18 MONER CANO, David. SABATÈ ALSINA, Jordi. Usabilidad: el guion multimedia. Unsj.edu.ar [en línea] [consultado el 1 de agosto del 2016]. Disponible en internet: http://www.unsj.edu.ar/unsjVirtual/comunicacion/seminarionuevastecnologias/wp-content/uploads/2015/04/usabilidad_para_web.pdf

http://www.proyectolatin.org/books/Temas_de_Dise%C3%B1o_en_Interacci%C3%B3n_Humano_Computadora_CC_BY-SA_3.0.pdfhttp://www.proyectolatin.org/books/Temas_de_Dise%C3%B1o_en_Interacci%C3%B3n_Humano_Computadora_CC_BY-SA_3.0.pdfhttp://www.unsj.edu.ar/unsjVirtual/comunicacion/seminarionuevastecnologias/wp-content/uploads/2015/04/usabilidad_para_web.pdfhttp://www.unsj.edu.ar/unsjVirtual/comunicacion/seminarionuevastecnologias/wp-content/uploads/2015/04/usabilidad_para_web.pdf

35

predictibilidad, sintetización, familiaridad, la generalización de los conocimientos previos y la consistencia. ● Facilidad de Uso: facilidad con la que el usuario hace uso de la herramienta, con menos pasos o más naturales a su formación específica. Tiene que ver con la eficacia y eficiencia de la herramienta. ● Flexibilidad: relativa a la variedad de posibilidades con las que el usuario y el sistema pueden intercambiar información. También abarca la posibilidad de diálogo, la multiplicidad de vías para realizar la tarea, similitud con tareas anteriores y la optimización entre el usuario y el sistema. ● Robustez: es el nivel de apoyo al usuario que facilita el cumplimiento de sus objetivos. Está relacionada con la capacidad de observación del usuario, de recuperación de información y de ajuste de la tarea al usuario.

En informática, la usabilidad está muy relacionada con la accesibilidad, hasta el punto de que algunos expertos consideran que una forma parte de la otra o viceversa. Uno de estos expertos y gurú de la usabilidad en los entornos web es Jakob Nielsen, quien definió la usabilidad en el 2003 como "un atributo de calidad que mide lo fáciles de usar que son las interfaces web". 4.7 EXPERIENCIA DE USUARIO La experiencia de usuario o UX es un término que actualmente está en esa extraña posición de ser excitantemente nuevo para muchos, considerado como un componente esencial del proceso de diseño web por expertos de la industria, sin embargo la UX también genera un aire de misterio en torno a ella. Esto es en parte porque es difícil definir exactamente qué es. Al ser entrevistados, los profesionales de la industria dicen que el término puede ser “subjetivo” y “difícil de describir”, ya que tiene varios significados asociados. UX Design (User Experience Design) o “Diseño de Experiencia de Usuario” es una filosofía de diseño que tiene por objetivo la creación de productos que resuelvan necesidades concretas de sus usuarios finales, consiguiendo la mayor satisfacción y mejor experiencia de uso posible con el mínimo esfuerzo. “Toma forma como un

36

proceso en el que se utilizan una serie de técnicas multidisciplinares y donde cada decisión tomada debe estar basada en las necesidades, objetivos, expectativas, motivaciones y capacidades de los usuarios”19. 4.8 SERVICIOS WEB

El término "Web Service" designa una tecnología que permite que las aplicaciones se comuniquen en una forma que no depende de la plataforma ni del lenguaje de programación. Un servicio web es una interfaz de software que describe un conjunto de operaciones a las cuales se puede acceder por la red a través de mensajería estandarizada. A diferencia de los modelos Cliente/Servidor, tales como un servidor de páginas Web, los Web Services no proveen al usuario una interfaz gráfica (GUI). En vez de ello, los Web Services comparten la lógica del negocio, los datos y los procesos, por medio de una interfaz de programas a través de la red. Es decir conectan programas, por tanto son programas que no interactúan directamente con los usuarios. Los desarrolladores pueden por consiguiente agregar a los Web Services la interfaz para usuarios, por ejemplo mediante una página Web o un programa ejecutable, tal de entregarles a los usuarios una funcionalidad específica que provee un determinado Web Service. Los Web Services usan protocolos basados en el lenguaje XML, JSON, BSON, etc. Con el objetivo de describir una operación para ejecutar o datos para intercambiar con otro servicio web. Un grupo de servicios web que interactúa de esa forma define la aplicación de un servicio web específico en una arquitectura orientada a servicios (SOA). Uno de los mecanismos más usado para el intercambio de información es JSON o (JavaScript Object Notation) es un formato de texto ligero usado para la transmisión de datos entre dispositivos, con la facilidad que permite el paso de JSON a un objeto de JavaScript y viceversa. Básicamente JSON describe los datos con una sintaxis dedicada que se usa para identificar y gestionar los datos. 19 CORDOBA CELY, Carlos Andrés. La experiencia de usuario extendida (UxE) [en línea]. Tesis doctoral. Doctorado en ingeniería multimedia. Barcelona. Universidad politécnica de Cataluña. Escuela técnica superior de ingeniería industrial. 2013. 218 p. [consultado el 2 de agosto del 2016]. Disponible en internet: http://www.tesisenred.net/bitstream/handle/10803/116204/TCCC1de1.pdf?sequence=1

http://www.tesisenred.net/bitstream/handle/10803/116204/TCCC1de1.pdf?sequence=1http://www.tesisenred.net/bitstream/handle/10803/116204/TCCC1de1.pdf?sequence=1

37

JSON nació como una alternativa a XML, el fácil uso en JavaScript ha generado un gran número de seguidores de esta alternativa. Una de las mayores ventajas que tiene el uso de JSON es que puede ser leído por cualquier lenguaje de programación. Por lo tanto, puede ser usado para el intercambio de información entre distintas tecnologías. El servidor de aplicaciones generalmente gestiona la mayor parte (o la totalidad) de las funciones de lógica de negocio y de acceso a los datos de la aplicación, se ve frecuentemente como parte de una aplicación de tres niveles, que consta de un servidor gráfico de interfaz de usuario (GUI), un servidor de aplicaciones (lógica empresarial) y un servidor de bases de datos y transacciones. GlassFish un servidor de aplicaciones de Oracle Corporation, que permite ejecutar aplicaciones que sigan los mismos parámetros. Es gratuito de y código libre el cual se distribuye bajo las licencias GNU GPL y CDDL. “Además implementa la plataforma JavaEE5, por lo que soporta las últimas versiones de tecnologías como: JSP, JSF, Servlets, EJBs, Java API para Servicios Web (JAX-WS), Arquitectura Java para Enlaces XML (JAXB), Metadatos de Servicios Web para la Plataforma Java 1.0, y muchas otras tecnologías”.20 Una de las opciones que GlassFish permite brindar es el despliegue de Servicios Web en arquitectura REST, la cual es cualquier interfaz entre sistemas que use HTTP para obtener datos o generar operaciones sobre esos datos en todos los formatos posibles, como XML y JSON. “Es una alternativa en auge a otros protocolos estándar de intercambio de datos como SOAP (Simple Object Access Protocol), que disponen de una gran capacidad pero también mucha complejidad”21.

20 GlassFish Server Quick Start Guide [en línea] Oracle [consultado el 2 de febrero del 2017]. Disponible en internet: http://www.oracle.com/technetwork/middleware/glassfish/documentation/index.html 21 NAVARRO MARSET, Rafael. Rest vs Web services. Modelado, Diseño e Implementación de Servicios Web. users.dsic.upv.es [en línea]. 2006-07 [consultado el 29 de Abril del 2017]. Disponible en internet: http://users.dsic.upv.es/~rnavarro/NewWeb/docs/RestVsWebServices.pdf

http://www.oracle.com/technetwork/middleware/glassfish/documentation/index.htmlhttp://users.dsic.upv.es/~rnavarro/NewWeb/docs/RestVsWebServices.pdf

38

Ilustración 10. Formatos

4.9 CONTROL DE VERSIONES Para el control y la organización de proyectos de desarrollo de software sean estos grandes o pequeños, es normal el uso de repositorios en línea que permiten el trabajo colaborativo, y por lo general con un gestor de versiones que permite visualizar los cambios realizados entre cada versión del software, de modo que puedas recuperar versiones especificas en el futuro. Los controladores de versiones tienen como finalidad posibilitar un trabajo más rápido y eficiente. 4.9.1 GitHub: Se define como control de versiones a la gestión de los diversos cambios que se realizan sobre los elementos de algún producto o una configuración del mismo, la gestión de los diversos cambios que se realizan sobre los elementos de algún producto o una configuración. Git es un software de control de versiones, diseñado por Linus Torvalds. A partir de este software libre se basan diferentes repositorios en línea como lo son GitHub, BitBukect, Black Duck Open Hub entre otros. “GitHub es una plataforma de desarrollo colaborativo de software para alojar proyectos utilizando el sistema de control de versiones Git. GitHub aloja tu repositorio de código y te brinda herramientas muy útiles para el trabajo en equipo, dentro de un proyecto. El código se almacena de forma pública, aunque también se puede hacer de forma privada, creando una cuenta de pago.”22 22 CASTILLO, Luciano. GitHub conociendogitub.readthedocs.io [en línea] 2012 [consultado el 22 de Mayo del 2016]. Disponible en internet: http://conociendogithub.readthedocs.io/en/latest/data/introduccion/

http://es.wikipedia.org/wiki/Githttp://conociendogithub.readthedocs.io/en/latest/data/introduccion/

39

5. OBJETIVOS

5.1 OBJETIVO GENERAL Desarrollar un sistema multimedia que permita la agrupación de las aplicaciones web y móviles relacionadas con la Universidad Autónoma de Occidente y su sistema de administración de contenidos basada en principios de usabilidad y HCI. 5.2 OBJETIVOS ESPECÍFICOS ● Definir los requerimientos y procedimientos que deben seguir las aplicaciones para que se pueden integrar al sistema multimedia. ● Desarrollar una aplicación móvil tipo launcher, que integre los diferentes servicios y aplicaciones que brinda y brindará la universidad. ● Desarrollar una página web que facilite la gestión de contenidos publicados y consumidos por la aplicación móvil tipo launcher. ● Realizar pruebas de usabilidad, funcionalidad, integración y aceptación del sistema multimedia.

40

6. MARCO METÒDOLOGICO: DESARROLLO DEL SISTEMA MULTIMEDIA PARA LA AGRUPACION DE LAS APLICACIONES

Para el desarrollo del sistema multimedia se adoptó la metodología de RUP (Rational Unified Process) metodología desarrollada y mantenida por Rational Software, la cual actualmente es propiedad de IBM, es una de las metodologías más populares para el análisis, diseño, implementación, y documentación de sistemas orientados a objetos. Es una metodología flexible que se adapta de acuerdo a las necesidades del contexto, por lo tanto permite la convergencia de otras metodologías de acuerdo a la necesidad de los desarrolladores. RUP se divide en cuatro etapas, iniciación, Elaboración, construcción y transición, dentro de las cuales se realizan varias interacciones de número variable de acuerdo al proyecto. Ilustración 10: Etapas Metodología RUP

Fuente: Rational Unified Process. (RUP). Ima.udg.edu [en línea] [consultado el 22 de Mayo de 2016]. Disponible en Internet: http://ima.udg.edu/~sellares/EINF-ES2/Present1011/MetodoPesadesRUP.pdf

6.1 ANÁLISIS Actualmente la Universidad Autónoma de Occidente cuenta con aplicaciones web que se encuentran agrupadas en su página principal de información, Además, cuenta con aplicaciones móviles de convenios con terceras empresas como Google y Roseta Stone, las cuales sirven como herramientas para los estudiantes que permiten el almacenamiento de información, control de material de clases e información de aprendizaje.

http://ima.udg.edu/~sellares/EINF-ES2/Present1011/MetodoPesadesRUP.pdfhttp://ima.udg.edu/~sellares/EINF-ES2/Present1011/MetodoPesadesRUP.pdf

41

Por lo anterior la Universidad Autónoma de Occidente se planteó el desarrollo de una aplicación móvil, que tiene como objetivo permitir al usuario acceder a los diferentes servicios en línea de la universidad, además de información sobre las aplicaciones relacionadas con esta misma. Esto con el fin que agilizar y simplificar el acceso a la información relevante de la universidad. El uso de las apps como respuesta a una situación se justifica cuando simplifica un proceso y mejora la experiencia para el usuario. En este caso, la administración de un App suele ser en ocasiones un proceso tedioso, debido a que al modificarse el contenido de las aplicaciones web, aplicaciones móviles o noticias se tendría que actualizar en cada dispositivo móvil de los usuarios, resultando tedioso porque se debe manipular directamente el código de programación, como también la gestión de los contenidos multimedia que nuestra App presente. Por lo anterior, se ha detectado la oportunidad de desarrollar una aplicación web, con la que se pueda administrar la plataforma móvil, donde le permitirá al usuario (administrador) agregar, actualizar y eliminar los diferentes aplicativos móviles, web y/o noticias según sea el caso. 6.1.1 Investigación y recopilación de la información. Servicios ofrecidos por la Universidad. Portal Principal: plataforma principal de la Universidad Autónoma de Occidente, donde se encuentra información de todo tipo relacionada con la institución. además de contener los enlaces de redirección a los diferentes servicios no solo para invitados o estudiantes sino para la comunidad académica en su totalidad. Portal Estudiantil: ingresando a www.uao.edu.co/portalestudiantiluao, un espacio que alberga datos personales, mensajes enviados y brinda información sobre servicios académicos, financieros, procesos de matrícula y grado, además de la opción para el cambio de contraseña. Moodle Augusta: es un software diseñado para ayudar a los educadores a crear cursos en línea de alta calidad y entornos de aprendizaje virtuales. Tales sistemas de aprendizaje en línea son algunas veces llamados VLEs (Virtual Learning Environments) o entornos virtuales de aprendizaje.

42

Centro de Innovación: tiene como propósito afrontar los retos y desafíos planteados por la sociedad de la información y el conocimiento en materia de educación mediada electrónicamente, desde la innovación educativa, comunicativa y tecnológica; y el reconocimiento de la diversidad y complejidad del ser humano. Biblioteca: La Biblioteca ofrece a sus usuarios (docentes, estudiantes, investigadores, personal administrativo y visitantes) diferentes servicios mediante los cuales pueden acceder a la información publicada en las áreas del conocimiento relacionadas con nuestros programas. Dicha información se puede consultar y está disponible en los siguientes formatos de presentación: texto, audiovisual y electrónico. Adicionalmente cuenta con servicio para reservar y escoger espacios físicos dentro del campus en unos horarios establecidos. Sistema de Gestión del Aprendizaje - SIGA: softwares que permiten administrar, distribuir, monitorear, evaluar y apoyar las diferentes actividades de un proceso de aprendizaje. Lo UAO de la semana: Informativo con periodicidad semanal que registra las actividades que van a realizarse durante la semana vigente a su publicación. Actualmente cuenta con una versión impresa, la cual se entrega a los estudiantes en distintos puntos dentro del campus universitario; además cuenta con una versión digital publicada en el enlace www.louaodelasemana.uao.edu.co Campus Sostenible: La Autónoma de Occidente cuenta con una oferta académica en programas de pregrado profesional, posgrado y tecnologías enfocados al tema ambiental y desarrollo de campañas y actividades de sensibilización. En esa medida, la Institución decide adoptar el modelo de Campus Sostenible con el fin de articular y potencializar las acciones académicas, de investigación y de proyección social que apoyadas por la operación interna, promueven el compromiso y la responsabilidad ambiental y social. Centro para la Excelencia Académica: El Centro para la Excelencia Académica integra y articula todas las iniciativas institucionales que trabajan por la permanencia y graduación estudiantil, en condiciones de alta calidad, desde las diferentes dependencias académicas, administrativas, financieras y de Bienestar Universitario.

http://www.louaodelasemana.uao.edu.co/

43

Servicios de Terceros: Adicionalmente a los servicios propios ofrecidos por la universidad Autónoma de Occidente, institución cuenta con el uso de aplicaciones o servicios por parte de terceros como lo son el caso de redes sociales como Facebook, Twitter e Instagram, además de los servicios de Google implementados recientemente. 6.1.2 Stakeholders: Stakeholders entiéndase como todas las personas que influyen directa o indirectamente con la problemática y sistema a multimedia a desarrollar, son de vital importancia para el proyecto ya que aprobaran el desarrollo y uso de este. En el caso específico del sistema se identificaron los Stakeholders Primarios los cuales a su vez se dividen en dos perfiles; perfil administrativo y perfil estudiante con el fin de obtener información relevante de dos puntos de vista totalmente distintos. Stakeholders primarios - Perfil administrativo. Perfil administrativo hace referencia a todas las personas vinculadas a los servicios ofrecidos para el desarrollo de la aplicación y los futuros encargados de administrar la aplicación después de su posterior lanzamiento y puesta en producción. Inicialmente dos departamentos pertenecientes a la universidad mostraron interés completo en el lanzamiento de una aplicación móvil para la comunidad estudiantil. El primer departamento es el departamento de comunicaciones, presentando la propuesta de acercar las noticias y eventos a la comunidad académica por medio de una aplicación móvil. A partir de la anterior propuesta se pactó con el departamento la implementación de unos servicios que el aplicativo pudiera consumir para desplegar en una interfaz con las noticias y eventos. El segundo departamento es el centro de cómputo, mostrando interés en el desarrollo de una aplicación móvil debido al hecho de que otras instituciones educativas ya han desarrollado sus propias aplicaciones agregando valor a ellas mismas como institución de alto nivel. Adicionalmente se trataron temas como la administración posterior al lanzamiento y el desarrollo de los servicios y recursos que debía la universidad prestar para el desarrollo de la aplicación móvil.

44

Stakeholders primarios - Perfil estudiante. En el proceso de desarrollo, es importante conocer no solo a las personas involucradas directamente con el desarrollo de la aplicación móvil, sino también los usuarios finales, por lo que se realizó una investigación en torno a los estudiantes dentro del campus universitario. Perfil de usuario. La definición de los perfiles de usuario se realizó a través de dos instrumentos de indagación social; Observación y Encuesta online (Anexo 1). El primer instrumento permitió conocer cómo se comporta el usuario en el espacio de intervención, dichas observaciones se realizaron dentro del campus de la Universidad Autónoma de Occidente. Además de los anteriores métodos de recolección de información, recurrimos a datos que la Universidad Autónoma de Occidente23 brinda a la comunidad, donde pudimos identificar: La población estudiantil total de la Universidad Autónoma De Occidente en el periodo académico 2016-3 es de 24.247. El 75% de la población estudiantil está en estrato 3 o superior, siendo el estrato socioeconómico nivel 3 el más grande con un porcentaje del 35%. Hasta el periodo 2016-3 la universidad autónoma de occidente ofrece 50 programas académicos, siendo en su mayoría de nivel profesional con 21 programas académicos. Los usuarios identificados para la aplicación móvil son los estudiantes de la Universidad Autónoma de Occidente, .con un rango de edad entre 15 y 25 años En su mayoría de estrato socioeconómico de nivel 3 o superior, lo cual les permite tener buen manejo de recursos tecnológicos y acceso a dispositivos móviles. En su mayoría cursan uno y algunos hasta 2 programas académicos de nivel profesional. 23 Cifras 2016-3. [en línea]. Santiago de Cali: Universidad Autónoma de Occidente. 2016. [consultado el 2 de Febrero de 2016]. Disponible en internet: http://www.uao.edu.co/la-universidad/universidad-autonoma-de-occidente-en-cifras

http://www.uao.edu.co/la-universidad/universidad-autonoma-de-occidente-en-cifrashttp://www.uao.edu.co/la-universidad/universidad-autonoma-de-occidente-en-cifras

45

Ilustración 11 Perfil de Usuario

Fuente: Elaboración propia. 6.1.3 Definición y análisis de los requerimientos: Para la realización de este proyecto se establecen los requerimientos presentados en el anexo 1, en los cuales se tienen en cuenta las necesidades identificadas por los usuarios y las ideas discutidas con el departamento de telecomunicaciones y el departamento de cómputo de la universidad. De estas reuniones salieron los siguientes requerimientos funcionales (RF) y requerimientos no funcionales (RNF):

46

Tabla 1 Tabla de requerimientos funcionales de la aplicación móvil.

Requerimientos Funcionales (RF)

RF-001. El usuario deberá loguearse por medio del usuario y la contraseña institucional.

RF-002. El sistema deberá mostrar una lista de las aplicaciones móviles de la universidad.

RF-003. El sistema deberá mostrar una lista las aplicaciones web de la universidad.

RF-004. El sistema deberá mostrar información y noticias relevantes de la universidad.

RF-005. El sistema deberá filtrar las noticias dependiendo del perfil del usuario.

RF-006. El usuario deberá poder seleccionar las aplicaciones en cada una de las listas

RF-007. El sistema deberá mostrar una descripción al seleccionar una aplicación móvil.

RF-008. El sistema deberá mostrar de manera opcional una descripción al seleccionar una aplicación web.

RF-09. El sistema no deberá filtrar las noticias y eventos si el usuario no se encuentra logueado en la aplicación.

RF-010. El sistema deberá permitir al usuario identificar qué aplicaciones están o no instaladas en el dispositivo

RF-011. Si el usuario selecciona una aplicación móvil que ya se encuentra instalada en el dispositivo, el sistema la ejecutara.

RF-012. Después de mostrar la información de la aplicación móvil, el sistema deberá redireccionar al usuario a la respectiva App Store, siempre y cuando la aplicación seleccionada no se encuentre instalada en el dispositivo.

47

Tabla 1: (Continuación)

RF-013. Deberá existir una aplicación web que permita gestionar todos los contenidos del sistema.

RF-014. Solo los usuarios con perfil administrador podrán gestionar los contenidos.

RF-015 el sistema debe llevar un reporte de las actividades realizadas por los administradores con ip, hora y acción

RF-016 la aplicación móvil debe informar al usuario si una aplicación móvil de la universidad dejará de funcionar

Fuente: Elaboración propia. Tabla 2 Tabla de requerimientos no funcionales de la aplicación móvil. Requerimientos No Funcionales (RNF)

RNF-001. La aplicación debe desplegarse en dispositivos móviles Android (4.3 o superior) y iOS (7.0 o superior).

RNF-002. La aplicación deberá seguir los parámetros de diseño brindados por el equipo de diseño de la Universidad Autónoma de Occidente

RNF-003. El sistema deberá presentar los términos y condiciones de uso de la aplicación bajo las normas y políticas de la Universidad Autónoma de Occidente

RNF-004. La aplicación debe ser fácil de usar.

RNF-005. El sistema deberá tener una serie de parámetros que sirvan de guía para desarrollar futuras aplicaciones institucionales y se puedan integrar con el launcher

RNF-006. La aplicación debe ser de fácil instalación.

RNF-007. La aplicación debe proporcionar retroalimentación al usuario sobre el estado en que se encuentre su consulta.

Fuente: Elaboración propia.

48

Una vez se establecen los requerimientos se procede a la realización de un acta la cual es firmada por cada uno de los Stakeholders que participaron en la reunión. 6.1.4 Casos de uso.

Aplicativo móvil. Caso de uso 1 (CU_01): “Autenticación de usuario” Caso de uso 2 (CU_02): “Módulo de noticias” Caso de uso 3 (CU_03): “Módulo de aplicaciones móviles y páginas web” Caso de uso 5 (CU_04): “Ajustes” Actor: El usuario al que estará dirigido la aplicación, son estudiantes de la universidad Autónoma de Occidente.

49

Ilustración 12: casos de uso de la aplicación móvil.

Fuente: Elaboración propia. Número: CU_01 Nombre de caso de uso: “Autenticación de usuario” Actor: Estudiante. Descripción: Pasos a seguir para ingresar a la aplicación. Requerimientos funcionales asociados: RF-001.

50

Tabla 3: caso de uso: “Autenticación de usuario”

Curso normal Alternativa

Inicio de caso de uso, el usuario inicia dando click en el icono de la aplicación.

La aplicación inicia y se encuentra con la interfaz de logueo, en donde se encuentran campos de texto para el ingreso de las credenciales.

El usuario ingresa su nombre de usuario institucional, y su contraseña, da click en el botón de ingreso, y sus datos se validan frente al directorio activo.

El usuario ingresa satisfactoriamente, y se le presenta información relacionada con las aplicaciones móviles y páginas web de la universidad.

El usuario no puede ingresar a la aplicación y se le muestra un mensaje de alerta que le dice que verifique los datos ingresados, y si se le olvidó la contraseña ingrese al link: “se te olvidó la contraseña” que se encuentra en la parte de abajo de la interfaz.

finaliza el caso de uso Fuente: Elaboración propia. El usuario de la aplicación deberá tener acceso a internet para poder validar sus datos frente al directorio activo. Una vez validada la información, podrá ingresar sin necesidad de internet, para consultas sin conexión, a menos que se cierre la sesión en cuyo caso se volverá pedir las credenciales para el ingreso. Número: CU_02

51

Nombre de caso de uso: “Módulo de noticias” Actor: Estudiante Descripción: Pasos a seguir para que el usuario, consulte las noticias de la universidad. Requerimientos funcionales asociados: RF-004

Tabla 4: caso de uso: “Módulo de noticias”


Inicio de caso de uso, una vez que el usuario se ha autentico se despliega por defecto la pantalla de aplicaciones.

El usuario selecciona el icono que representa el módulo de noticias, y esta sección se carga posteriormente.

El usuario puede llegar al módulo de noticias haciendo usos de “swipes” deslices, para cambiar de forma rápida entre pantallas.

Se carga la pantalla de noticias donde se pueden ver, todas las noticias a modo de lista, cada una de las noticias con una imagen, un título y un fragmento de la noticia.

El usuario selecciona una de las noticias, consecuentemente se carga una vista con la noticia en específico, con una imagen, el título, y la información referente de la noticia.

52

Tabla 4 (Continuación)

El usuario selecciona el icono de devolverse que se encuentra en la esquina superior izquierda, la cual regresa al usuario a la página donde está la lista de noticias, donde el usuario puede seleccionar otra noticia.

Fuente: Elaboración propia. Número: CU_03 Nombre de caso de uso: “Módulo de aplicaciones móviles y páginas web” Actor: Estudiante Descripción: Pasos a seguir para que el usuario, consultar las aplicaciones móviles y páginas web de la universidad. Requerimientos funcionales asociados: RF-002, RF-003, RF-006, RF-007, RF-008, RF-009, RF-010, RF-011, RF-012. Tabla 5: caso de uso: “Módulo de aplicaciones móviles y páginas web”



Una vez que se carga la interfaz se ven dos opciones: “aplicaciones móviles” y “páginas web”.

53

Tabla 5 (continuación) El usuario selecciona la opción de “aplicaciones móviles”, se despliega una lista de las aplicaciones móviles de la universidad, cada elemento de la lista muestra un nombre y un logo.

El usuario selecciona una de la aplicaciones, consecuentemente aparece una ventana emergente en la que se puede ver el nombre de la aplicación, el logo, una descripción, y un link de descarga de la tienda de aplicaciones que corresponde al sistema operativo.

Si el usuario selecciona una aplicación que ya tiene instalada en su celular, por lo tanto en vez de la ventana emergente, el sistema ejecuta la aplicación seleccionada.

El usuario selecciona la opción de “páginas web”, se despliega una lista de las páginas web de la universidad, cada elemento de la lista muestra un nombre y un logo.

El usuario selecciona de las páginas web, consecuentemente aparece una ventana emergente en la que se puede ver un nombre, el logo, una descripción, y un link para dirigirse a la página.

Finalización de caso de uso. Fuente: Elaboración propia. Número: CU_04 Nombre de caso de uso: “Ajustes” Actor: Estudiante Descripción: Opciones disponibles en la sección de ajustes Requerimientos funcionales asociados: RF-005

54

Tabla 6: caso de uso: “Ajustes”



El usuario selecciona el icono que representa el módulo de ajustes, y esta sección se carga posteriormente.

El usuario puede llegar al módulo de ajustes haciendo usos de “swipes” deslices, para cambiar de forma rápida entre pantallas.

Al usuario se le despliegan dos opciones, “filtro de noticias”, y “cerrar sesión”.

El usuario en la sección de “filtro de noticias”, puede seleccionar filtros de acuerdo a sus preferencias.

El usuario selecciona la opción de “cerrar sesión”.

Al usuario se le despliega una ventana emergente en donde se le pregunta si está seguro que desea cerrar sesión, selecciona “ok”, se cierra la aplicación, y se redirige al usuario a la pantalla de logeo, final de caso de uso.

El usuario selecciona “cancelar” de la ventana emergente, vuelve a cargarse la pantalla de ajustes.

Fuente: Elaboración propia.

55

Matriz de trazabilidad. Prioridad: Alto (A), Medio (M), Bajo (B). Tabla 7: Matriz de trazabilidad Requerimiento / casos de usos

CU_01 CU_02 CU_03 CU_04

RF-001

RF-002

RF-003

RF-004

RF-005

RF-006

RF-007

RF-008

RF-009

RF-010

RF-011

RF-012

RF-013

RF-014

RF-015

RF-016

Prioridad A M A M

56

Portal administrativo. CU_01: Autenticación de usuario. CU_02: Módulo de noticias. CU_03: Módulo aplicaciones móviles y páginas web de la universidad. Actor: El usuario que usaran el portal administrativo, son el personal administrativo de la universidad Autónoma de occidente. Ilustración 13: Casos de uso de la aplicación móvil II

Fuente: Elaboración propia Número: CU_01 Nombre de caso de uso: “Autenticación de usuario” Actor: personal de la universidad

57

Descripción: Pasos a seguir para ingresar a la aplicación Requerimientos funcionales asociados: RF-014

Tabla 8: caso de uso: “Autenticación de usuario”


Inicio de caso de uso, el usuario inicia dando click