Artículo de Investigación
Recepción: 26 Junio 2020
Aprobación: 22 Agosto 2020
Como citar: : Choto Maza, J. D., Avila-Pesantez, D., & Avila Pesantez, L. M. (2020). Mobile App development using the MEAN Stack and IONIC framework: A case study in a transport company. Ecuadorian Science Journal, 4(2), 37-42. DOI: https://doi.org/10.46480/esj.4.2.74
Resumen: La utilización de aplicaciones móviles se ha convertido en un componente relevante transaccional dentro de una organización. Por tal motivo, se desarrolló un sistema móvil informativo para la gestión de rutas dentro de la compañía de transporte pesado Torres Revelo S.A, basado en la metodología ágil de desarrollo SCRUM y el framework MEAN Stack e Ionic basados en JavaScript. En este proyecto, se sometió a una prueba de usabilidad en función a la norma ISO/IEC 25010, tomando como referencias la inteligibilidad, aprendizaje, operabilidad, protección frente a errores de usuario, estética y accesibilidad. Se utilizó un cuestionario de 26 preguntas con el uso del método de Nielsen, aplicando a un total de 73 usuarios en todo el proceso del desarrollo de la aplicación, basado en prototipos. Al tabular los resultados obtenidos, se aplicó la prueba de chi cuadrado para determinar que la aplicación móvil y web es fácil de usar, aprender y permite al usuario realizar la trazabilidad de la ruta más corta. Estos procesos permiten tener una mejor gestión de la información dentro de la compañía.
Palabras clave: Aplicación móvil, framework IONIC, framework MEAN STACK, metodología de desarrollo SCRUM, Usabilidad.
Abstract: The use of mobile applications has become a relevant transactional component within an organization. For this reason, a mobile information system for route management was developed within the heavy transport company Torres Revelo S.A, based on the agile SCRUM development methodology and the MEAN Stack and Ionic framework based on JavaScript. In this project, it was subjected to a usability test based on the ISO / IEC 25010 standard, taking intelligibility, learning, operability, protection against user errors, aesthetics, and accessibility as references. A 26-question questionnaire was used with the Nielsen method, applying to a total of 73 users throughout the prototype-based application development process. By tabulating the results obtained, the chi-square test was applied to determine that the mobile and web application is easy to use, learn, and allow the user to trace the shortest route. These processes allow for better information management within the company.
Keywords: Mobile application, IONIC framework, MEAN STACK framework, SCRUM development methodology, Usability.
Introducción
Hoy en día el auge de las aplicaciones móviles está orientada a la innovación tecnológica y brindar soluciones eficaces relacionados a la experiencia del usuario. Esto conlleva al uso del teléfono inteligente en la vida cotidiana del ser humano actual para realizar actividades, además de la variedad y funcionalidades que ofrecen las aplicaciones móviles (Falaki et al., 2010).
Con este antecedente, la compañía de transportes pesado "Torres Revelo S.A" dedicada al transporte de carga por carretera, requiere un sistema móvil para la gestión de rutas para los transportistas, debido a que cada destino puede tener varias opciones de llegadas, y es necesario proporcionar una herramienta para seleccionar y trazar la ruta más corta, utilizando una de las opciones de navegación (GPS, acelerómetro, giroscopio, entre otros) que poseen los teléfonos inteligentes (Nicoară & Haidu, 2014; Bajaj, Ranaweera, & Agrawal, 2002) .
El desarrollo de una aplicación móvil hace uso de la tecnología MEAN Stack, la cual está basada en Java, con conexión a la base de datos no relacional MongoDB. Para la interacción entre el servidor y el cliente se utiliza Node.js y Express.js, por último, para las aplicaciones web por parte del usuario se seleccionó Angular (Karanjit, 2016). En este mismo ámbito, para el desarrollo de la aplicación móvil en la plataforma Android se optó por el framework Ionic (Yusuf, 2016). La metodología SCRUM permitió la gestión del sistema, mediante sus diferentes etapas. Utiliza periodos de tiempo para los entregables (Sprint), en el cual el cliente está inmerso y forma parte fundamental del análisis de los requerimientos (Salazar et al., 2018).
El artículo está estructurado de la siguiente manera: comienza a detallar información relacionada con la metodología SCRUM y la definición de las herramientas utilizadas para el desarrollo de la aplicación móvil. La sección 2 describe el marco teórico, detallando la tecnología para el front-end y el back-end. Además, de las métricas a ser evaluadas de la norma ISO/IEC 25. En la sección 3 se especifica los materiales y métodos, el mismo que detalla las etapas para el desarrollo del proyecto y el análisis estadístico de los resultados obtenidos. Finalmente, se presenta las conclusiones del artículo.
Marco Teórico
Es un hecho real que las aplicaciones para los dispositivos móviles en los últimos años se han popularizado, básicamente en el rastreo de la ubicación del dispositivo. Por lo que los desarrolladores basan sus servicios en el uso del GPS para brindar varias herramientas para permitir al usuario administrar el uso de la geolocalización (Vaughan-Nichols, 2009). El uso de los servicios de Google APIs proporciona ventajas, cuando se sabe la ubicación de un dispositivo como es brindar lugares cercanos, el tráfico, rutas, en otras funcionalidades (Singhal & Shukla, 2012).
Los servicios de ubicación brindan una solución mediante el uso de GPS, que se integran en los teléfonos inteligentes. Estos envían información, por la cual se complementa con la red del dispositivo móvil 3G y 4G para realizar esta operación con más rapidez y sin que el usuario espere demasiado para obtener los resultados deseados (Chandra & Qadeer, 2011). Las aplicaciones móviles son escritas y ejecutadas en varios ambientes, respetando las mejores prácticas de la programación (El-Kassas et al., 2017; McIlroy et al., 2016). Por consiguiente, se adaptan a los nuevos dispositivos que han estado en constante evolución y permiten al usuario tener una experiencia, sin hacer notar estos cambios significativos del sistema desarrollado (Hassan et al., 2018; Sauro & Lewis, 2016). Varias opciones tecnológicas se encuentran disponibles para la implementación de la aplicación móvil, que se describen en la Tabla 1.
Back-End
El entorno de desarrollo MEAN Stack trabaja con lenguaje de programación JavaScript, permitiendo interactuar con sus diferentes componentes, tanto en lado del cliente y el servidor (Bharath & Dey, 2018). El formato JSON es ampliamente utilizado para enviar y recibir datos, derivando un uso sencillo del aplicativo. MEAN Stack se fundamenta de las siguientes tecnologías: MongoDB base de datos, Express como el framework del lado del servidor, AngularJS framework por parte del cliente y finalmente Node.js el entorno por parte del servidor. Por lo cual, todos estos elementos tienen en común el lenguaje de programación, haciendo hincapié del desarrollo en el menor tiempo posible (Heredia & Sailema, 2018).
Front-End
Ionic: Es una herramienta open source, la cual permite el desarrollo de aplicaciones móviles híbridas, complementando el trabajo con angular. Además, este framework utiliza herramientas como JavaScript, HTML y SCSS para la implementación de la parte gráfica del usuario, el soporte brindado se encuentra en constante evolución y la respuesta rápida de la corrección de errores. Mediante el uso del framework Cordova se puede acceder a opciones nativas del teléfono inteligente, para el desarrollo de algoritmos o código para su funcionamiento (Nevalainen, 2018).
De acuerdo con los trabajos de (Enciso-Quispe et al., 2017; García, 2016; Wang et al., 2017) se comparan los diferentes framework para el desarrollo de aplicaciones móviles (ver Tabla 2) y de acuerdo con los resultados, se optó por la elección del framework Ionic en este estudio.
AngularJS: Basado en módulos (Elrom, 2016), este framework trabaja exclusivamente en la parte del cliente básicamente en el front-end. Esto permite realizar código y es eficaz para realizar CRUD de cualquier aplicación, ya que trabaja por separado, con la posibilidad de analizar o reutilizar el código escrito. La aplicación web se considera multiplataforma por la ejecución en distintos dispositivos, sin tomar en cuenta su sistema operativo, solo con la posibilidad de ejecutarse en base al navegador y la disponibilidad al acceso a internet (Ramos & Ramos, 2019). Es por ello, que la información que se maneja o se encuentra en exposición es catalogada síncrona para todo aquel que consuma los servicios web.
Norma ISO/IEC 25010
Es un modelo de calidad en uso, enfocado en trabajar y utilizar las propiedades que brinda el sistema directamente con el cliente, esto hace notar que el cliente manipula el programa (Ouhbi et al., 2015). Por otro lado, se encuentra el producto en su característica principal que es la calidad, para esto existen subcaracterísticas que permiten medir y por la cual se pueden sacar conclusiones dependiendo de los resultados. La norma ISO/IEC 25010 reemplazó a ISO/IEC 9126.
Usabilidad: Es capacidad de utilizar algún servicio o realizar una tarea de una forma básica, es por ello por lo que la facilidad y sencillez debe estar impresa como mecanismo de ayuda para el usuario. El acceso debe ser ilimitado para explorar todo el contenido al igual que las guías para llevar a cabo una tarea determinada.
Materiales y Métodos
En el desarrollo del proyecto, se basa completamente en el uso de la metodología ágil SCRUM por lo que se divide en las siguientes fases:
Product backlog: se encuentra listadas las historias de usuarios (HU) para dar cumplimiento a las especificaciones del proyecto, las cuales han sido recopiladas a través de reuniones con el cliente. Además, permitió establecer los módulos a ser desarrollados. Para estimar las historias de usuario, fue necesario utilizar la técnica ¨T-Shirt Poker Cards¨, la cual se basa en las tallas de las camisetas dando como resultado las siguientes siglas: XL, L, M, S, XS. Por lo que, cada punto estimado está comprendido en una hora de trabajo del desarrollador, en la Tabla 3 se muestra los valores.
Sprint Backlog: En el proyecto se han definido 9 Sprint compuesto por 23 HU y 9 historias técnicas. Para cada entregable se estableció un lapso de dos semanas para el desarrollo de la aplicación móvil informativa de rutas para la compañía, desglosado de la siguiente manera: una semana de trabajo tiene un total de 40 horas del mismo modo están relacionadas con los puntos estimados.
Producto Final: En esta fase, se culmina cuando todos los requerimientos han sido completados utilizando el proceso de SCRUM, por lo cual se muestra el producto final. Es primordial, que terminado el desarrollo de la aplicación móvil es necesario firmar con el uso de Android Studio (Chellappa, 2017) y así permitir el uso de la aplicación en un dispositivo Android sin restricciones. Además, esto permite subirle a una tienda de aplicaciones. La interfaz de usuario permite la interacción de las funcionalidades de la aplicación y móvil, que se visualiza en la Figura 1 y Figura 2.
Marco de resultados
Los resultados obtenidos de la evaluación de la calidad de software con la norma ISO/IEC 25010, en relación con la usabilidad y las subcaracterísticas inmersas. Para la experimentación se utilizó el test con el método de medición de Nielsen, con una población total de 73 personas categorizadas de la siguiente manera: 29 transportistas, 43 clientes y 2 administradores, los cuales están integrados a la compañía de transporte pesado Torres Revelo S.A.
Tabulación de datos
La encuesta aplicada evalúa cada subcaracterística de la norma ISO/IEC 25 010: Integridad, Aprendizaje, Operabilidad, Protección frente a errores de usuario, Estética y Accesibilidad. Las opciones de respuesta son cumple, no cumple y no aplica. Mostrada en las siguientes Tablas 4,5,6,7,8,9
Integridad
Resultados y Discusión
Realizado el proceso de recopilación de resultados, se procedió a aplicar la técnica de Chi Cuadrado. Para demostrar todo el proceso realizado, se planteó dos tipos de hipótesis, descritas a continuación:
Hipótesis nula: Los usuarios establecen que la aplicación móvil y web tiene inconvenientes para utilizar sus diferentes funcionalidades incorporadas, para la compañía de transporte pesado Torres Revelo S.A.
Hipótesis alternativa: Los usuarios establecen que la aplicación móvil y web es fácil de utilizar sus diferentes funcionalidades incorporadas, para la compañía de transporte pesado Torres Revelo S.A.
Con un nivel de significancia e α=0,05, el resultado del chi de la tabla es de 18,3100. Por tanto, el valor de 19,5533 > 18,3100, se acepta la hipótesis alternativa y la hipótesis nula es rechazada. Consecuentemente, los usuarios encuestados califican a la aplicación móvil y web de la compañía de transporte como usable en cuanto a: Integridad, Aprendizaje, Operabilidad, Protección frente a errores de usuario, Estética y Accesibilidad (ver figura 4).
Conclusiones
El framework MEAN Stack y el framework IONIC permitieron el desarrollo del proyecto, trabajando con una base de datos no relacional y el diseño sensible de la interfaz gráfica, mediante el uso de con Bootstrap. Además, se utilizó el servicio de Google Maps, para indicar la ruta más corta hacia el punto destino y el horario de entrega del cliente, y manejo de mensajería online para la comunicación cliente-transportista. Se aplicó la técnica de Chi Cuadrado, obteniendo un resultado de 19,533, el cual es mayor al valor critico 18,3100, utilizando un nivel de significancia de 0,05 y 10 grados de libertad. Con estos resultados se concluye que los usuarios están de acuerdo que la aplicación móvil y web administrativa es fácil de usar para la gestión de procesos de la compañía de trasporte.
Referencias Bibliográficas
H. Falaki, R. Mahajan, S. Kandula, D. Lymberopoulos, R. Govindan, y D. Estrin, “Diversity in smartphone usage”, en MobiSys’10 - Proceedings of the 8th International Conference on Mobile Systems, Applications, and Services, 2010, pp. 179–194.
P.-S. Nicoară y I. Haidu, “A GIS based network analysis for the identification of shortest route access to emergency medical facilities”, 2014.
R. Bajaj, S. L. Ranaweera, y D. P. Agrawal, “GPS: location-tracking technology”, Computer (Long. Beach. Calif)., vol. 35, núm. 4, pp. 92–94, may 2008.
A. Karanjit, “MEAN vs. LAMP Stack”, 2016.
S. Yusuf, “Ionic Framework By Example”, 2016. [En línea]. Disponible en: https://books.google.com.ec/books?hl=es&lr=&id=LQMcDAAAQBAJ&oi=fnd&pg=PP1&dq=ionic+framework&ots=bqq30jnLC_&sig=1Yjqli9N106EXH4-MlN98M4MnE0&redir_esc=y#v=onepage&q=ionic framework&f=false. [Consultado: 10-feb-2020].
J. Salazar, Á. T. Casallas, J. C. Linares, A. Lozano, y Y. L. Valbuena, TIA Tecnología, investigación y academia, vol. 6, núm. 2. [s.n.], 2018.
S. J. Vaughan-Nichols, “Will mobile computing’s future be location, location, location?”, Computer (Long. Beach. Calif)., vol. 42, núm. 2, pp. 14–17, 2009.
M. Singhal y A. Shukla, “Implementation of Location based Services in Android using GPS and Web Services”, 2012.
A. Chandra, S. Jain, y M. A. Qadeer, “GPS locator: An application for location tracking and sharing using GPS for Java enabled handhelds”, en Proceedings - 2011 International Conference on Computational Intelligence and Communication Systems, CICN 2011, 2011, pp. 406–410.
W. S. El-Kassas, B. A. Abdullah, A. H. Yousef, y A. M. Wahba, “Taxonomy of Cross-Platform Mobile Applications Development Approaches”, Ain Shams Eng. J., vol. 8, núm. 2, pp. 163–190, jun. 2017.
S. McIlroy, N. Ali, y A. E. Hassan, “Fresh apps: an empirical study of frequently-updated mobile apps in the Google play store”, Empir. Softw. Eng., vol. 21, núm. 3, pp. 1346–1370, jun. 2016.
S. Hassan, C. Tantithamthavorn, C. P. Bezemer, y A. E. Hassan, “Studying the dialogue between users and developers of free apps in the Google Play Store”, Empir. Softw. Eng., vol. 23, núm. 3, pp. 1275–1312, jun. 2018.
J. Sauro y J. Lewis, “Quantifying the User Experience: Practical Statistics for User Research - Jeff Sauro, James R Lewis - Google Libros”, 2016. [En línea]. Disponible en: https://books.google.com.ec/books?hl=es&lr=&id=USPfCQAAQBAJ&oi=fnd&pg=PP1&dq=user+experience&ots=Vx2cY47pUn&sig=etEdl4LVCZ4De7bePsgnTtKInp4&redir_esc=y#v=onepage&q=user experience&f=false. [Consultado: 10-feb-2020].
M. Bharath, K. V. Reddy, y R. Dey, “Implementation of IoT Architecture for Intruder Alert System using MQTT Protocol and MEAN Stack”, en 2018 4th International Conference on Computing Communication and Automation (ICCCA), 2018, pp. 1–5.
J. S. Heredia y G. C. Sailema, “Comparative Analysis for Web Applications Based on REST Services: MEAN Stack and Java EE Stack”, KnE Eng., vol. 3, núm. 9, p. 82, dic. 2018.
T. Nevalainen, “MEAN Software Stack”, 2018.
M. Huynh, P. Ghimire, y D. Truong, “HYBRID APP APPROACH: COULD IT MARK THE END OF NATIVE APP DOMINATION?”, 2017.
D. Flanagan, “JavaScript: The Definitive Guide - David Flanagan - Google Libros”, 2006. [En línea]. Disponible en: https://books.google.com.ec/books?hl=es&lr=&id=k0CbAgAAQBAJ&oi=fnd&pg=PT6&dq=javascript&ots=O3trjjkyrV&sig=H4n_jB_VWPLRhv1rdXlIaR-lHUg&redir_esc=y#v=onepage&q=javascript&f=false. [Consultado: 30-ene-2020].
Huenei IT Services, “Ventajas del Framework Ionic | Huenei”, 2017. [En línea]. Disponible en: https://www.huenei.com/index.php/es/2017/06/06/ventajas-de-ionic-framework/. [Consultado: 05-sep-2019].
L. Enciso-Quispe, J. Quichimbo, F. Luzon, E. Zelaya-Policarpo, y P. A. Quezada-Sarmiento, “REST architecture in the implementation of a web and mobile application for vehicular tariff rotating parking”, en 2017 12th Iberian Conference on Information Systems and Technologies (CISTI), 2017, pp. 1–6.
H. García, “Características de los servicios REST”, 2016. [En línea]. Disponible en: https://www.comunicacionesindustrialeslogitek.com/caracteristicas-de-los-servicios-rest/. [Consultado: 11-sep-2019].
N. Wang, X. Chen, G. Song, Q. Lan, y H. R. Parsaei, “Design of a New Mobile-Optimized Remote Laboratory Application Architecture for M-Learning”, IEEE Trans. Ind. Electron., vol. 64, núm. 3, pp. 2382–2391, mar. 2017.
E. Elrom, Pro MEAN Stack Development. Berkeley, CA: Apress, 2016.
A. Ramos y M. Ramos, “Aplicaciones Web 2.a edición - 9788428398756 - ALICIA RAMOS MARTÍN, MARIA JESUS RAMOS MARTÍN - Resumen y compra del libro - paraninfo.es”, 2014. [En línea]. Disponible en: https://www.paraninfo.es/catalogo/9788428398756/aplicaciones-web-2-a-edicion. [Consultado: 11-sep-2019].
S. Ouhbi, A. Idri, J. Fernández-Alemán, A. Tova, y H. Benjelloun, “Applying ISO/IEC 25010 on Mobile Personal Health Records”, 2015.
D. Chellappa, “Android Application Generator for Mobile Platform”, 2017. [En línea]. Disponible en: http://repo.bg.pw.edu.pl/index.php/en/r#/info/master/WUT4282e622dd624144af49897f29a8ee6c/. [Consultado: 10-feb-2020].
Notas
Información adicional
Como citar: : Choto Maza, J. D., Avila-Pesantez, D., & Avila Pesantez, L. M. (2020). Mobile App development
using the MEAN Stack and IONIC framework: A case study in a transport
company. Ecuadorian Science Journal, 4(2), 37-42.
DOI:
https://doi.org/10.46480/esj.4.2.74