Diseño y desarrollo de un aplicativo web para optimizar la ...

1

Diseño y desarrollo de un aplicativo web para optimizar la gestión comercial, imagen

publicitaria y atención al cliente de la empresa Suculenta Villavicencio

Modalidad de grado - Análisis sistemático de literatura

Nathaly Martínez Baquero

Programa de Ingeniería de sistemas, Universidad Cooperativa de Colombia, Sede

Villavicencio

Ing. Carlos Ignacio Torres, Ing. Francy Yaneth Patiño

Villavicencio – Meta

Noviembre 2021

2

Dedicatoria

A mí misma, Nathaly Martínez Baquero, a todo lo que soy yo, porque todo lo que soy y

una muestra de lo que puedo lograr lo he dejado en este proyecto y a lo largo de estos cinco años

de carrera.

A mi madre Dennys Nathaly Baquero Bonilla y mi hermana Laura Nathalia

Mondragón Baquero, a ellas que han dado todo por mí y mi carrera, son mi mayor orgullo y

apoyo incondicional.

Nathaly Martínez Baquero.

3

Agradecimientos

Agradezco enormemente a mis mascotas, mi perro Lucas Ramón Martínez Baquero y mi

gata Moon Alejandra Baquero Bonilla, a ellos por estar ahí siempre conmigo, por ser mis

terapeutas y apoyo emocional infinito, por no juzgarme, desconfiar o decepcionarse de mí, por

estar siempre orgullosos de todo lo que soy sin importar cuantas veces llegué a odiarme por eso.

Agradezco especialmente a mi mejor amiga Daniela Cruz Narváez que pese a la distancia

siempre ha estado al pendiente de todo en mi vida, siempre ha sido la bomba de energía y

motivación que necesito cuando toco fondo, porque sin ella no estaría en este momento escribiendo

esto y por ello le estoy eternamente agradecida.

Agradezco especialmente a mis amigas Karen Luz Alicia Ortiz Mariño, Katherine Buitrago

Ávila, Nicoll Fernanda Gómez Rojas, Laura Juliana Bejarano Bermúdez y Gabriela Sánchez

Cárdenas, por ser voces de ánimo y comprensión en mis momentos de estrés y colapso.

Agradezco la existencia del equipo de voleibol UCC Villavicencio y a mi entrenador

Andrés David Ávila Aldana por demostrarme que la universidad no tiene que ser hostigante,

aburrida ni solamente enfocada al estudio, que hay tiempo para todo y eso es muy divertido.

Agradezco especialmente a mis amigos Edduin Herney Abril Reyes, Juan Felipe Gonzales

y Mario Leandro Salomón León por ser lo más cercano que he llegado a tener en cuanto a mejor

amigo se trata, por sus consejos y apoyo durante mi carrera y vida personal.

Agradezco especialmente a mis compañeros de carrera y amigos Cristian Miguel Castro

Baquero, César Daniel Díaz Fernández y Daniel Leandro Muñoz Castañeda, por su apoyo durante

todo este camino y hacerme ver que tener únicamente compañeros hombres durante toda mi carrera

no fue tan malo como lo llegué a pensar.

Agradezco especialmente a Kevin Alexander Sánchez Cobaleda (QEPD) por demostrarme

que la programación tiene su lado hermoso, que el programar es un arte al que debes entregar

cuerpo y alma, gracias por mostrarme lo bella que puede ser esta carrera y la vida misma.

Agradezco a todos los docentes que durante mi carrera me brindaron infinidad de

conocimientos, motivación y apoyo en todo momento.

Nathaly Martínez Baquero.

4

Resumen

Actualmente la información se genera rápidamente, el buen manejo de esta logra la

confiabilidad y soporte de la misma, por ello el tener las herramientas que permitan estas dos

características se hace indispensable para cualquier negocio independiente o empresa formal, este

es el motivo por el cual las tiendas online y plataformas de ventas web son día a día más

importantes y necesarias para el sector empresarial y comercial; este proyecto tiene como finalidad

el diseño y desarrollo de una tienda virtual para la empresa Suculenta Villavicencio, además de

lograr una herramienta como solución a las problemáticas de la empresa, busca resaltar conceptos

relacionados dentro del mundo del ecommerce y marketing digital que debe estar enmarcado

dentro del orden de generar beneficios económicos para la empresa, así mismo destacar cada una

de las fases de desarrollo dentro de un proyecto de software y lograr la aplicación de lo aprendido

durante la carrera de Ingeniería de sistemas.

5

Abstract

Currently the information is generated quickly, the good management of it achieves the

reliability and the support of the same, therefore having the tools that allow these two

characteristics is essential for any independent business or formal company, this is the reason why

which online stores and web sales platforms are day by day more important and necessary for the

business and commercial sector; This project aims to design and develop a virtual store for the

company Suculenta Villavicencio, in addition to achieving a tool as a solution to the problems of

the company, it seeks to highlight related concepts within the world of ecommerce and digital

marketing that must be framed within in the order of generating economic benefits for the

company, likewise highlighting each of the development phases within a software project and

achieving the application of what was learned during the Systems Engineering career.

6

Tabla de contenido

1. Definición del tema ................................................................................................................. 10

1.1. Tema .................................................................................................................................. 10

1.2. Descripción del problema ................................................................................................ 10

2. Objetivos .................................................................................................................................. 12

2.1. Objetivo general ............................................................................................................... 12

2.2. Objetivos específicos ........................................................................................................ 12

3. Justificación ............................................................................................................................. 13

3.1. Antecedentes ..................................................................................................................... 13

3.2. Importancia....................................................................................................................... 13

3.3. Beneficios........................................................................................................................... 13

4. Marco de referencia ................................................................................................................ 14

4.1. Literatura sobre casos análogos ...................................................................................... 14

4.2. Marco teórico .................................................................................................................... 17

4.3. Marco legal........................................................................................................................ 19

5. Diseño metodológico ............................................................................................................... 21

5.1. Metodología....................................................................................................................... 21

5.2. Implementación de la metodología ................................................................................. 22

5.3. Desarrollo y modelado ingenieril .................................................................................... 28

6. Resultados ................................................................................................................................ 41

7. Análisis y discusión ................................................................................................................. 43

8. Conclusiones ............................................................................................................................ 46

Referencias................................................................................................................................... 47

Anexos .......................................................................................................................................... 49

7

Lista de ilustraciones

Ilustración 1. Proyecto www.shoppingimmersion.com............................................................... 15

Ilustración 2. Proyecto de integración e-commerce .................................................................... 16

Ilustración 3. Proyecto la Huerta en Casa ................................................................................... 17

Ilustración 4. Backend WordPress .............................................................................................. 18

Ilustración 5. Proceso SCRUM ................................................................................................... 21

Ilustración 6. Cronograma generado por la herramienta Planner ................................................ 23

Ilustración 7. Tienda Virtual Suculenta Villavicencio en Planner .............................................. 24

Ilustración 8. Diagrama de casos de uso ..................................................................................... 30

Ilustración 9. Modelo entidad-relación ....................................................................................... 37

Ilustración 10. Diagrama de clases .............................................................................................. 38

Ilustración 11. Arquitectura Cliente-Servidor aplicada en Wordpress ........................................ 39

Ilustración 12. Estructura WordPress .......................................................................................... 40

Ilustración 13. Resultado página de inicio .................................................................................. 41

Ilustración 14. Resultado página Tienda ..................................................................................... 42

Ilustración 15. Resultado página Carrito ..................................................................................... 42

Ilustración 16. Distribución estadística de los sitios web que usan CMS ................................... 43

Ilustración 17. Comparativa de popularidad entre los CMS. ...................................................... 45

8

Lista de tablas

Tabla 1. Roles SCRUM del proyecto........................................................................................... 22

Tabla 2. Product Backlog ............................................................................................................. 24

Tabla 3. Sprint Planning............................................................................................................... 26

Tabla 4. Sprint 1 ........................................................................................................................... 27

Tabla 5. Sprint 2 ........................................................................................................................... 27

Tabla 6. Sprint 3 ........................................................................................................................... 28

Tabla 7. Caso de uso número 1 .................................................................................................... 31



Tabla 10. Caso de uso número 4 .................................................................................................. 32






Tabla 16. Caso de uso número 10 ................................................................................................ 35


Tabla 18.Caso de uso número 12 ................................................................................................. 36


9

Lista de anexos

Anexo A. Entrevista a Laura Mondragón – Propietaria de Suculenta Villavicencio ................... 49

Anexo B. Código CSS para el diseño base de las páginas de la tienda virtual ............................ 50

Anexo C. Diseño base para la tienda virtual ................................................................................ 51

Anexo D. Diseño base del inicio de sesión ................................................................................... 52

Anexo E. Modelo Canvas de Suculenta Villavicencio ................................................................. 53

Anexo F. Especificación de requerimientos funcionales ............................................................. 54

10

1. Definición del tema

1.1. Tema

La temática que trata este documento y la base de este proyecto investigativo es el

ecommerce, ya que éste permite a los consumidores una respuesta más rápida a sus solicitudes y

la costumbre de estos a lo que es el entorno y manejo de herramientas digitales. Además el

ecommerce ofrece los procedimientos de pago de manera segura y confiable gracias a los

diferentes sistemas que se han estado desarrollando desde hace varios años para lograrlo (tales

como PSE, PayPal, etc).

El marketing digital, el ecommerce, diseño de interfaces y ofrecer una navegación segura

por internet hace que los clientes busquen cada vez más y más las tiendas virtuales de sus marcas

favoritas, por ello en pleno siglo XXI la tecnología sigue avanzando de tal forma que los negocios

deben sí o sí digitalizarse para poder expandirse y llegar a más y más clientes, no sólo por la parte

comercial sino también tomando muy en cuenta la parte social.

Dentro de las tiendas virtuales se pueden emplear demasiadas herramientas para que la

experiencia del cliente sea lo más cercano a un encuentro físico posible donde esté sienta el ser

atendido con gusto, de manera inmediata y que sus preguntas tengan una respuesta clara y concisa.

1.2. Descripción del problema

Suculenta Villavicencio es una empresa llanera cuyo objetivo es la preparación,

decoración y entrega de desayunos sorpresa y detalles románticos dentro de la zona de

Villavicencio/ Meta/ Colombia. Así como muchas otras empresas, su propietaria se adapta a los

cambios tecnológicos y de marketing que vienen con el pasar de los años para lograr el máximo

aprovechamiento de los recursos digitales con el objetivo de potenciar su negocio.

Con los hechos ocurridos en 2019 y la llegada de la pandemia por el Covid 19, la

competencia para el campo que abarca la empresa incrementó en más de un 30% a comparación

del 6% de años anteriores, de igual forma el campo para el marketing digital y el ecommerce

incrementó hasta en un 50% debido a la cuarentena obligatoria y el no poder realizar ventas de

forma presencial.

11

Bajo estas estadísticas, la empresa necesita una forma de digitalizar su atención a los

clientes y el control de pedidos sin recaer en la saturación que ya se tiene mediante la atención por

medio de Whatsapp y demás redes sociales.

12

2. Objetivos

2.1. Objetivo general

Diseñar y desarrollar una página web como solución a las problemáticas existentes para

la empresa Suculenta Villavicencio.

2.2. Objetivos específicos

• Identificar los problemas presentes en la empresa.

• Establecer los requerimientos deseados por la propietaria.

• Implementar metodologías de desarrollo de software.

• Diseñar las diferentes interfaces para cada espacio dentro de la página.

• Agilizar el proceso de solicitud de pedidos por los clientes.

• Mejorar el servicio al cliente a través de la recepción de pedidos por otro canal.

• Desarrollar y verificar el funcionamiento de la página web.

13

3. Justificación

3.1. Antecedentes

Suculenta Villavicencio es una empresa oriunda del Meta, fundada en el año 2016 con el

objetivo de alegrar a los Villavicenses con la entrega de los detalles. Toman en cuenta las fechas

festivas para realizar detalles temáticos y a su vez lanzar diferentes promociones para tener la

mejor relación con los clientes.

Cuentan con diferentes proveedores que brindan desde los elementos de decoración, hasta

los ingredientes para la preparación de los alimentos incluidos en los detalles y desayunos, también

se ofrece el servicio de decoración para fechas especiales y demás. Nunca se había contemplado

la idea de una tienda virtual como expansión de la empresa, pero debido a los hechos del 2020, se

vio en la obligación de adaptarse al cambio y poner el plan en marcha. (Mondragón, 2021)

3.2. Importancia

La importancia de este proyecto para la empresa Suculenta Villavicencio y para su

propietaria es de gran magnitud debido a que éste significa una evolución para la empresa, un paso

adelante para seguir creciendo, adaptándose a las nuevas tecnologías y herramientas que existen

dentro del mercado digital para algún día llegar a una expansión enorme y ¿quién sabe? Quizá a

todo el territorio nacional.

3.3. Beneficios

Tomando los objetivos de este proyecto los cuales no son más que las diferentes

problemáticas que tiene esta empresa los beneficios para esta con el desarrollo del proyecto son:

• Respuesta inmediata a los clientes.

• Nuevo canal de atención y ventas.

• Muestra de productos de manera inmediata.

• Expansión de la empresa a un nuevo medio de venta.

14

4. Marco de referencia

4.1. Literatura sobre casos análogos

El desarrollo de este proyecto es ejecutado dentro de un CMS, el cual es un sistema de gestión de

contenidos, más específicamente Wordpress; fuera del proyecto desarrollado, existen otros

previamente desarrollados que son similares en funcionamiento, estructura o diseño:

• Construcción de un portal de compra colectiva, multitienda con WordPress

“www.shoppingimmersion”:

“A lo largo del proyecto se creará una tienda online, que aglutinará diferentes

tipos de negocios ya sean de venta de productos o de servicios, ofreciendo a los clientes

finales importantes descuentos respecto al precio original. Esta reducción del precio se

debe a la venta por volumen, o compra colectiva. El portal se establecerá como el nexo de

unión entre negocios tradicionales, que apenas tienen presencia en Internet, con clientes

que usan este medio como herramienta habitual. De esta manera se logrará que los

pequeños comercios potencien su marca y lleguen a un mayor número de clientes

potenciales, abaratarán costes y encontrarán un nuevo espacio desconocido en muchos

casos para estos. Mientras el consumidor final logrará una mayor rapidez de compra, así

como la posibilidad de eliminar los desplazamientos para la realización de sus

transacciones. Se ofrecerán productos y servicios de todo tipo, desde packs vacacionales,

hasta productos típicos de la zona (vinos blancos, marisco, etc.). Se aplicarán diferentes

métodos de pago, así como diferentes maneras de canjes de cupones”. (Sánchez, 2021)

15

Nota. Por: (Sánchez, 2021)

• Integración y extensión de funcionalidades de plataformas e-commerce:

“En el actual entorno empresarial, altamente digitalizado y global, el rápido

avance de las tecnologías hace que la competitividad en los comercios electrónicos sea

cada vez mayor. Existen multitud de soluciones estándar que permiten construir de manera

rápida servicios ecommerce con los que satisfacer modelos de negocio comunes. Sin

embargo, las empresas con una fuerte base tecnológica, como KirolDNA, requieren de

soluciones personalizadas para satisfacer sus modelos de negocio. Muchas veces no son

creaciones de software completas, sino que se trata de aplicaciones basadas en otros

softwares usados comúnmente en sus modelos de negocios. La personalización o extensión

de funcionalidades es la parte decisiva para la obtención de ventajas competitivas en

determinadas ´áreas de mercado. El objetivo de este proyecto no es mostrar con detalle

todas las tareas desarrolladas para satisfacer el modelo de negocio de nuestra empresa,

Ilustración 1. Proyecto www.shoppingimmersion.com

16

sino dar una visión global de varios aspectos relacionados con la construcción de un

modelo de negocio digital, y como se han desarrollado”. (Barquín, 2021)

Nota. Por: (Barquín, 2021)

• Marketplace La huerta en casa:

“El proyecto del presente Trabajo de Fin de Grado Multimedia sigue el itinerario

profesional marcado en el plan de estudios. El objetivo marcado a la finalización del

Proyecto es la creación de un portal de compraventa colectiva, enfocado primordialmente

a los agricultores que deseen vender sus productos directamente al consumidor. Se

pretende crear un modelo de negocio sostenible, dónde los clientes finales obtengan la

posibilidad de obtener productos frescos obtenidos directamente desde la huerta y a la vez

que el agricultor tenga la posibilidad de llegar al público final, evitando intermediarios

tradicionales pudiendo obtener un mayor valor por su producto de una forma sencilla y

Ilustración 2. Proyecto de integración e-commerce

17

cómoda para ambas partes. Los dos pilares en que se basará el proyectos serán por un

lado, una tecnología eficaz y accesible y usable; y por otro lado un negocio basado en la

conjunción del comercio tradicional con el comercio electrónico. Será por lo tanto

imprescindible incluir en el proyecto no sólo la parte técnica/tecnológica necesaria para

el correcto desarrollo de este, sino que se incluirá la estrategia de marketing online, la

analítica web y la política de medio sociales que se desarrollará. El proyecto es una web

completa donde se gestionará la compraventa de productos agrícolas directamente entre

el consumidor y el agricultor. Además es un proyecto replicable puesto que podría

utilizarse por una cooperativa o asociación de agricultores para vender los productos de

sus socios”. (Doménech, 2021)

Nota. Por: (Doménech, 2021)

4.2. Marco teórico

Dentro del desarrollo de este documento y del proyecto como tal se tomaron en cuenta los

siguientes conceptos bases para el entendimiento del lector en el tema tratado y trabajado por la

autora:

Ilustración 3. Proyecto la Huerta en Casa

18

• Wordpress:

WordPress es un sistema de gestión de contenidos, está creado con PHP y MySQL,

y sujeto a la licencia GPLv2. Es también la plataforma que ha elegido más del 42% de

todos los sitios de la web. Combina la simplicidad para los usuarios y editores con la

complejidad para los desarrolladores. (WordPress, 2021)

Nota. Por: (WordPress, 2021)

• CMS:

Un sistema de gestión de contenidos o CMS es un software desarrollado para que

cualquier usuario pueda administrar y gestionar contenidos de una web con facilidad y sin

conocimientos de programación Web. Previamente un programador deberá desarrollar la

página web en base al CMS más apropiado para el tipo de web, dejando las tareas

posteriores de gestión en manos del usuario final. (Ideamos Web, 2021)

Ilustración 4. Backend WordPress

19

• Ecommerce:

También llamado comercio electrónico es la práctica de comprar y vender

productos a través de internet. También se llama "ecommerce" a cada tienda online que se

dedica a este negocio. (Cardona, 2021)

• Marketing digital:

Es el conjunto de estrategias volcadas hacia la promoción de una marca en el

internet. Se diferencia del marketing tradicional por incluir el uso de canales y métodos

que permiten el análisis de los resultados en tiempo real. (Rdstation, 2021)

4.3. Marco legal

Como marco legal, se toman algunas leyes y normativas vigentes en Colombia, que se

tuvieron en cuenta para el desarrollo del proyecto:

• Ley 527 de 1999. “Por medio de la cual se define y reglamenta el acceso y uso de los

mensajes de datos, del comercio electrónico y de las firmas digitales, y se establecen las

entidades de certificación y se dictan otras disposiciones.” (Función Pública, 2021)

• Ley 1273 de 2009. Delitos informáticos. “Por medio de la cual se modifica el Código

Penal, se crea un nuevo bien jurídico tutelado - denominado "de la protección de la

información y de los datos"- y se preservan integralmente los sistemas que utilicen las

tecnologías de la información y las comunicaciones, entre otras disposiciones.” (Alcaldía

de Bogotá, 2021)

• Ley 1266 de 2008. Habeas Data. “Por la cual se dictan las disposiciones generales del

hábeas data y se regula el manejo de la información contenida en bases de datos

personales, en especial la financiera, crediticia, comercial, de servicios y la proveniente

de terceros países y se dictan otras disposiciones.” (Interseguridad, 2021)

20

• Decreto 3466 de 2008. “Por el cual se dictan normas relativas a la idoneidad, la calidad,

las garantías, las marcas, las leyendas, las propagandas y la fijación pública de precios

de bienes y servicios, la responsabilidad de sus productores, expendedores y proveedores,

y se dictan otras disposiciones.” (Función Púlbica, 2021)

• Artículo 1. Aplicabilidad de la ley comercial. “Los comerciantes y los asuntos

mercantiles se regirán por las disposiciones de la ley comercial, y los casos no regulados

expresamente en ella serán decididos por analogía de sus normas.” (INCP, 2021)

• Artículo 2. Aplicación de la legislación civil. “En las cuestiones comerciales que no

pudieren regularse conforme a la regla anterior, se aplicarán las disposiciones de la

legislación civil.” (INCP, 2021)

• Ley 1341 de 2009. Ley de TIC y Sociedad de la información. “Por la cual se definen

principios y conceptos sobre la sociedad de la información y la organización de las

Tecnologías de la Información y las Comunicaciones TIC, se crea la Agencia Nacional del

Espectro y se dictan otras disposiciones.” (Función Pública, 2021)

21

5. Diseño metodológico

5.1. Metodología

Las metodologías de desarrollo de software se utilizan para, como su nombre lo indica, el

buen desarrollo de un proyecto software, además de estas existen también los conocidos marcos

de trabajo que se basan en los conceptos ingenieriles y que se tienen del proyecto a desarrollar,

tomando esto en cuenta para el presente proyecto se tomó el marco de trabajo SCRUM, ya que

este, por medio de iteraciones frecuentes, permite asegurar el alcance de los objetivos presentes en

el proyecto, además de que dentro de cada una de sus fases permite una buena planeación y

desarrollo:

Nota. Por: (Netmind, 2021)

Características de SCRUM:

• El producto software se desarrolla con un enfoque iterativo + incremental.

• Flexible a los cambios en los requisitos y mejora la gestión de riesgos

• Las funcionalidades presentes en cada entrega parcial (incremento de la iteración) serán

priorizadas.

• Se realizarán reuniones frecuentes a lo largo de todo el proyecto.

Ilustración 5. Proceso SCRUM

22

Scrum es una metodología ágil para el desarrollo de proyectos que requieren mayor rapidez

y adaptabilidad en sus resultados. Los ejecutivos que la aplican en sus organizaciones tienen dos

objetivos principales: brindar un mayor valor de productos finales para sus consumidores y

potenciar la flexibilidad en sus procesos. El Scrum está basado en Sprints, intervalos establecidos

que plantea la empresa para generar un producto entregable. En cada uno de ellos se desarrollan

mini proyectos que sirven para mejorar la eficacia del proyecto principal. Estas son las principales

etapas del Scrum: planificación del sprint, etapa de desarrollo, revisión del sprint y

retroalimentación. (Conexión ESAN, 2021)

5.2. Implementación de la metodología

Tabla 1. Roles SCRUM del proyecto

Product Owner Scrum Master Equipo de desarrollo

Suculenta Villavicencio –

Laura Mondragón

Nathaly Martínez Baquero

Nota. Por: Creado por la autora.

• Descripción de roles:

- Product Owner: el cual es el cliente a quién se le está realizando el proyecto, en este

caso es la empresa Suculenta Villavicencio cuya propietaria es Laura Nathalia

Mondragón.

- Scrum Máster: quien se encarga del correcto desarrollo y liderazgo del proyecto, así

como la correcta recolección de información y voz principal en las iteraciones con el

Product Owner, en este caso el cargo es para la estudiante Nathaly Martínez Baquero.

- Equipo de desarrollo: encargados del desarrollo de objetivos y del producto como tal,

en este caso correspondiente a la estudiante Nathaly Martínez Baquero.

23

• Cronograma del proyecto:

El cronograma del proyecto se realizó a partir de los objetivos planteados con base

en las problemáticas halladas en la empresa, estos fueron registrados dentro de una tabla la

cual se aprecia a continuación:

Nota. Por: Creador por la autora.

Ilustración 6. Cronograma generado por la herramienta Planner

24

Para el desarrollo del cronograma se utilizó la herramienta Planner, brindada por

Microsoft Office 365 cuyos permisos fueron otorgados gracias a la cuenta estudiantil de la

Universidad Cooperativa de Colombia, en ella se llevó la fecha inicio y la fecha límite de

cada uno de los objetivos a cumplir, así como la importancia de cada uno, etc.

Nota. Por: Creación de la autora.

• Product Backlog:

Ilustración donde se registran los puntos específicos a desarrollar del producto a

entregar, de manera que estos se puedan clasificar por medio de su nivel de prioridad dentro

del producto y su dependencia con los demás objetivos.

Tabla 2. Product Backlog

ID Título Descripción Prioridad Dependencia Prueba de

aceptación

REQ

01

Módulo de

Registro de

usuarios

La tienda

virtual permitirá

el registro de

nuevos clientes

previo a la

verificación en

Alta -

La tienda virtual

debe contar con

un login para

mayor seguridad

y analizar que los

Ilustración 7. Tienda Virtual Suculenta Villavicencio en Planner

25

la base de datos

de clientes.

usuarios creados

sean válidos y

mandar mensaje

de error en caso

de ingreso de

valores erróneos. REQ

02

Módulo de

inicio

(login)

La tienda

virtual contará

con un login

para los

usuarios

registrados que

permitirá la

compra de

productos.

Muy Alta REQ 01

REQ

03

Módulo de

catálogo de

productos

La tienda

virtual mostrará

al visitante y al

cliente el

catálogo de

productos.

Alta REQ 02

Se visualiza los

productos

disponibles para

añadir al carrito

de compras con su

valor unitario.

REQ

04

Módulo

carrito de

compras

Permite añadir

productos al

carrito, esto

dará

continuación al

proceso del

pedido.

Muy Alta REQ 03

Mostrará la

cantidad de

productos

agregados y su

total acumulado

del pedido en

tiempo real.

REQ

05

Módulo de

pedidos

Cada usuario

registrado

contará con un

historial de

pedidos.

Alta REQ 04

Se visualiza el

historial de

pedidos y

compras

realizadas

ordenadas

cronológicamente.

REQ

06

Módulo

finalizar

compra

Permite elegir

el método de

pago, muestra

la factura y

permite el pago

del pedido

Muy Alta REQ 02

Verifica el

pedido, su método

de pago y se

suministra la

información

necesaria para la

factura y entrega

del pedido.

REQ

07

Página

política de

privacidad

e

información

La tienda

virtual mostrará

al usuario la

información

básica de la

empresa, la

política de

Alta REQ 01

Todo usuario que

desee registrarse

deberá leer los

términos y

condiciones para

aceptar el

26

de la

empresa

privacidad y

tratamiento de

la información

suministrada

por el cliente.

tratamiento de

datos.


• Sprint Planning

Ilustración donde se muestra la planeación de los diferentes Sprints dentro del

proyecto, también conocido como la parte de Planificación de tareas:

Tabla 3. Sprint Planning

ID Prioridad Ejecutor Descripción

1 Muy Alta

Nathaly Martínez

Baquero

Identificación de los

problemas de la empresa

2 Alta Levantamiento de requerimientos

3 Alta Elaboración del modelado del producto

4 Media Definición de metodología y arquitectura a

implementar en el proyecto

5 Media Implementación de redes sociales

6 Muy Alta Página de inicio

7 Alta Módulo de registro

8 Alta Módulo catálogo de productos

10 Alta Módulo de pedidos

11 Muy Alta Módulo carrito de compras

12 Alta Módulo finalizar compra

13 Alta Implementación del Chatbot

14 Muy Alta Configuración del sistema de pagos

15 Muy Alta Pruebas de los módulos


27

• Sprints

Tabla 4. Sprint 1

SPRINT 1 Inicio: Marzo

(mes 1)

Fin: Mayo

(mes 3)

Duración: 2

meses

Backlog ID Tarea Tipo Estado Responsable

HT1

Revisar las

herramientas

necesarias para

la creación de la

tienda virtual

Investigativo Completado

Nathaly

Martínez

Baquero HT2 Análisis de

requerimientos Investigativo Completado

HT3 Definir la

arquitectura del

aplicativo web

Diseño Completado

Nota. Por: Creación de la autora

Tabla 5. Sprint 2

SPRINT 2 Inicio: Mayo

(mes 3)

Fin: Julio

(mes 5)

Duración: 2

meses


HT1 Diagramas Documental Completado

Nathaly

Martínez

Baquero

HT2 Diseño del

chatbot Diseño Completado

HT3 Diseño y

muestra del

login

Diseño Completado

HT4 Diseño y

muestra de la

página de inicio

Diseño Completado


28

Tabla 6. Sprint 3

SPRINT 3 Inicio: Julio

(mes 5)

Fin: Octubre

(mes 8)

Duración: 3

meses


HT1

Diseño y

muestra del

Módulo catálogo

de productos

Diseño Completado

Nathaly

Martínez

Baquero

HT2

Diseño y

muestra del

módulo de

pedidos

Diseño Completado

HT3

Diseño y

muestra del

Módulo carrito

de compras

Diseño Completado

HT4 Configuración

del sistema de

pagos

Diseño Completado

HT5

Diseño y

muestra del

módulo

Finalizar compra

Diseño Completado

HT6 Pruebas de los

módulos Testeo Completado


5.3. Desarrollo y modelado ingenieril

• Requerimientos funcionales:

La tienda virtual Suculenta Villavicencio Web permitirá realizar las siguientes funciones:

- Administrar pedidos: El administrador del sistema podrá gestionar los pedidos

dentro del SVW (organizar, buscar, eliminar).

- Administrar productos: El administrador del sistema podrá gestionar los

productos dentro del SVW (agregar, modificar, eliminar, buscar).

- Administrar usuarios: El administrador del sistema podrá gestionar los

usuarios dentro del SVW (agregar, modificar, eliminar, buscar).

29

- Compras: Proceso por el cual el cliente realizará el pago de su producto

mediante los medios de pago establecidos en el SVW.

- Generación de estadísticas: Proceso por el cual, para vista del administrador,

se generarán estadísticas de las ventas de los productos y el número de pedidos

y registros.

- Generación de notificaciones: Proceso por el cual el SVW notificará al cliente

y al administrador de cualquier pedido realizado.

- Navegación: Acto de indagación por parte de los visitantes dentro del SVW.

- Publicación de Información: El administrador del sistema actualizará la

información general dentro del SVW (productos, información de la empresa,

festividades, fechas especiales, etc).

- Registro: Proceso por el cual los visitantes pueden registrarse en el SVW y así

realizar compras.

- Chatbot: Permitir la comunicación de los clientes con un sistema de IA

(Chatbot) para cualquier inquietud que estos presenten.

• Requerimientos no funcionales:

- Aplicación de la usabilidad para visitantes y usuarios.

- Contar con un dispositivo el cual tenga acceso a internet.

- La tienda virtual deberá estar en capacidad de dar respuesta a todos los usuarios.

- La tienda virtual deberá ser diseñada y construida con los niveles mínimos de

flexibilidad y adaptabilidad.

- La solución debe tener interfaces gráficas claras de operación.

30

• Diagrama de casos de uso:

Ilustración 8. Diagrama de casos de uso


31

- Descripción de los casos de uso:

Tabla 7. Caso de uso número 1

Caso de uso Registrar Usuario

Identificador 1

Descripción El visitante registra sus datos en la tienda

virtual para lograr obtener su sesión como

usuario y posteriormente cliente.

Actor principal Visitante

Actor secundario Administrador

Precondiciones Ingresar a la tienda virtual

Flujo principal 1- Entrar a la tienda virtual

2- Ir a la parte Mi cuenta

3- Ingresar datos

4- Ingresar Usuario

5- Ingresar contraseña

6- Validar datos

7- Sesión iniciada

Post condiciones Tener una sesión de usuario registrada

Flujos alternativos Error en el ingreso de datos

Error en la verificación de datos

Error al cargar la tienda virtual.



Caso de uso Visualizar catálogo de productos

Identificador 2

Descripción El visitante (ya sea como visitante o

cliente con cuenta registrada) podrá ver

los diferentes productos ofrecidos por la

empresa en la tienda virtual

Actor principal Visitante

Actor secundario Cliente

Precondiciones Ingresar a la tienda virtual


2- Ir a la parte de Tienda

3- Visualizar los diferentes productos

ofrecidos

Post condiciones Lograr identificar y conocer cada uno de

los productos disponibles dentro de la

tienda virtual

Flujos alternativos Error al cargar la página de Tienda


32


Caso de uso Iniciar sesión

Identificador 3

Descripción El visitante deberá registrarse para poder

iniciar su sesión y categorizarse como

cliente, así mismo el cliente podrá iniciar

sesión en el momento que lo desee.

Actor principal Cliente

Actor secundario Visitante

Precondiciones Haber registrado un usuario y contraseña


2- Ir a la parte de Mi cuenta

3- Ingresar usuario

4- Ingresar contraseña

5- Validar datos

6- Sesión iniciada en la tienda virtual

Post condiciones Lograr el inicio de sesión

Flujos alternativos Error en el ingreso de usuario o

contraseña

Error al cargar la página Mi cuenta.



Caso de uso Agregar pedido

Identificador 4

Descripción El cliente podrá agregar los pedidos que

desee a su cuenta parcial o total.



Precondiciones Haber iniciado sesión con su usuario y

contraseña


2- Realizar el inicio de sesión

3- Ir a la parte de Tienda

4- Escoger un producto

5- Agregar el pedido al Carrito

Post condiciones Lograr agregar un pedido al Carrito para

la cuenta total o parcial del cliente.

Flujos alternativos Error en el inicio de sesión.

Error al cargar la página Tienda.

Error al agregar un pedido al Carrito.


33


Caso de uso Modificar Pedido

Identificador 5

Descripción El cliente podrá realizar la modificación

de su pedido siempre y cuando este no

haya finalizado.



Precondiciones Haber iniciado sesión

Haber agregado un pedido al Carrito.


2- Ir a la parte de Carrito

3- Seleccionar el pedido a modificar

4- Modificar lo que se quiera

modificar

5- Validar datos

Post condiciones Pedido deseado modificado

Flujos alternativos Error en el inicio de sesión

Error al cargar la página de Carrito

Error al agregar pedido

Error al modificar pedido



Caso de uso Visualizar pedidos

Identificador 6

Descripción El cliente podrá visualizar los pedidos

realizados justo antes de finalizar la

compra




Haber agregado pedidos al Carrito.



3- Visualizar los pedidos realizados

Post condiciones Lograr la visualización de pedidos antes

de finalizar la compra

Flujos alternativos Error en al iniciar sesión

Error al cargar la página de Carrito

Error al visualizar pedidos.


34


Caso de uso Eliminar pedido

Identificador 7

Descripción El cliente podrá eliminar el pedido que

desee siempre y cuando este no haya

finalizado su compra.




Haber agregado pedidos al Carrito



3- Agregar pedidos al Carrito

4- Visualizar los pedidos realizados.

5- Eliminar el pedido escogido

Post condiciones Lograr la eliminación del pedido no

deseado.

Flujos alternativos Error al iniciar sesión

Error al agregar pedidos al Carrito

Error al visualizar los pedidos

Error al eliminar el pedido deseado.



Caso de uso Visualizar historiales

Identificador 8

Descripción El cliente podrá visualizar el historial de

compra registrado a su usuario y sesión.




Haber realizado y finalizado pedidos en la

tienda virtual.


2- Ir a la parte de Mi cuenta

3- Ir a la parte de Pedidos

4- Visualizar el historial de pedidos

realizados

Post condiciones Lograr visualizar el historial de pedidos

finalizados.


Error al cargar la página Mi cuenta


35


Caso de uso Finalizar compra

Identificador 9

Descripción El cliente podrá finalizar su compra a

través de la tienda virtual




Haber agregado un pedido al Carrito


2- Agregar un pedido al carrito

3- Ir a la parte de Finalizar compra

4- Ingresar los datos requeridos

5- Finalizar la compra pagando por

medio de las formas de pago

disponibles

Post condiciones Lograr la finalización de la compra


Error al agregar pedido

Error al finalizar compra.



Caso de uso Descargar

Identificador 10

Descripción El cliente podrá realizar la descarga de su

comprobante de compra si así lo quiere.




Haber finalizado al menos una compra


2- Agregar un pedido al carrito

3- Finalizar pedido

4- Descargar el recibo de compra.

Post condiciones Lograr la descarga del o los recibos de

compra.


Error al finalizar la compra

Error al generar recibo y descarga.


36


Caso de uso Agregar productos

Identificador 11

Descripción El administrador de la tienda virtual podrá

agregar los productos que desee.

Actor principal Administrador

Actor secundario Administrador secundario

Precondiciones Haber iniciado sesión con el usuario del

administrador


2- Iniciar sesión bajo el usuario

administrador

3- Agregar productos.

Post condiciones Lograr agregar los productos que se

deseen a la tienda virtual


Error al agregar productos.


Tabla 18.Caso de uso número 12

Caso de uso Modificar productos

Identificador 12

Descripción El administrador podrá realizar la

modificación de los productos según estos

varíen en su precio, cantidad, tamaño, etc.



Precondiciones Haber iniciado sesión bajo el usuario del

administrador

Tener productos agregados los cuales

poder modificar


2- Iniciar sesión con el usuario

administrador

3- Agregar al menos un producto a la

tienda virtual

4- Modificar el producto existente

Post condiciones Lograr la modificación del producto

deseado.


Error en la modificación del o los

productos.


37


Caso de uso Eliminar productos

Identificador 13

Descripción El administrador podrá eliminar los

productos que desee siempre y cuando

estos ya existan dentro de la tienda virtual.



Precondiciones Haber iniciado sesión con el usuario

administrador

Tener productos existentes dentro de la

tienda virtual


2- Iniciar sesión bajo el usuario del

administrador

3- Visualizar los productos existentes

4- Eliminar el producto escogido

Post condiciones Lograr eliminar uno o más productos.


Error al eliminar productos


• Modelo entidad – relación:


Ilustración 9. Modelo entidad-relación

38

• Diagrama de clases:

Ilustración 10. Diagrama de clases


• Arquitectura del proyecto:

Tomando que la arquitectura es: “la arquitectura de un sistema de software (en un

punto determinado) es la organización o la estructura de los componentes importantes del

sistema que interactúan mediante interfaces, con componentes compuestos de interfaces y

componentes cada vez más pequeños”. (CGRW01, 2021)

Se desarrolló dentro de este proyecto:

- Arquitectura cliente servidor:

En un sistema con arquitectura cliente-servidor, la información está almacenada

y gestionada en el servidor, y los clientes hacen peticiones, en este caso a través de

39

Internet, para recibirla. En el caso de los Gestores de Contenidos como WordPress, al

funcionar con páginas dinámicas con el lenguaje de programación PHP, el proceso

tiene algunos pasos más. De forma simplificada lo podemos describir en estos pasos:

Nota. Por: (Digital Learning, 2021)

- Arquitectura del CMS Wordpress:

Los themes WordPress utilizan varios archivos a la vez para formar una página,

que son llamados por funciones específicas de la plataforma para facilitar el proceso.

Estos son similares a la función include de PHP y evitan tener que escribir la misma

porción de código en varias plantillas. Por ejemplo, la sección del encabezado del sitio

siempre es igual, llevará un logo y unos botones que no se cambiará; en un sitio

construido íntegramente en HTML se debe copiar este código en cada una de las

páginas.

En cambio, en WordPress bastará con escribir todo el código del encabezado

dentro de header.php y luego solicitar el encabezado en cada sección que se requiera.

El proceso es igual para la barra lateral (sidebar.php) y el pie de página (footer.php).

De ese modo cuando se lista el index de un sitio WordPress, éste estará compuesto de

los archivos header.php, index.php, sidebar.php y footer.php.

Ilustración 11. Arquitectura Cliente-Servidor aplicada en Wordpress

40

“ Para el caso de listar una página los archivos serán: header.php, page.php,

sidebar.php y footer.php. Se diferencia en que el inicio utiliza index.php para mostrar

su contenido principal y una página utiliza el archivo page.php.” (Aguilar, 2021)

Nota. Por: (Aguilar, 2021)

Ilustración 12. Estructura WordPress

41

6. Resultados

Se tomó en cuenta todo aquello que la propietaria veía como necesario para el resultado

final de la tienda virtual, adicionando las iteraciones y reuniones que hubo con ella, se logró

establecer un diseño base trabajado con CSS y HTML, para proceder con una versión beta de lo

que es la tienda y las funciones de esta.

Se adecuó el CMS al diseño establecido, además de añadir el código fuente CSS y PHP

para que el diseño al ser pasado a WordPress quedará mejor aplicado.

Como resultado final se obtiene la página principal de la tienda virtual, el carrito de compra,

la página de la tienda donde se muestran los productos y la página de Mi cuenta que permite al

cliente ver su historial de compra y datos de envío establecidos dentro de la página.


Ilustración 13. Resultado página de inicio

42



Ilustración 14. Resultado página Tienda

Ilustración 15. Resultado página Carrito

43

7. Análisis y discusión

Analizando los diseños bases establecidos para trabajar en la versión beta de la tienda

virtual y haciendo la comparación con los resultados finales, la satisfacción por parte de la

propietaria de la empresa es del 97%, esto enfatizando que el resultado final sigue abierto a

cambios constantes debido a que solo es la versión beta del producto fina. Con la flexibilidad de

desarrollo de WordPress, se logró implementar el código CSS y esto permite igualdad entre el

diseño establecido previamente en Visual Studio Code y el presentado funcional en el CMS

WordPress.

Nota. Por: (BuiltWith, 2021)

WordPress es el CMS más utilizado dentro del mundo de los CMS, como fue mencionado

es fácil de mantener y actualizar. Es versátil ya que logra implementar una apariencia más visual

y, así mismo, muchas características e integrar contenidos de diferentes sistemas.

Para este proyecto se eligió este CMS porque es fácil de crear temas y complementos

personalizados, además de permitir la inyección de código abierto para mayor precisión en el ajuste

Ilustración 16. Distribución estadística de los sitios web que usan CMS

44

de lo deseado por el usuario; respecto a este punto surgieron dudas sobre ¿Por qué no usar Wix

como CMS principal si se habla de la sencillez en cuanto a la personalización de la tienda virtual?

“ Bueno esto se contempla desde el punto de que la plataforma que se elija debería

ofrecerte suficientes opciones para que puedas crear cualquier tipo de sitio web que quieras. Wix

no se queda atrás en cuanto a la personalización. Te permite agregar una gran cantidad de

funciones útiles a tu sitio web, como secciones de comentarios, foros, chat en vivo e incluso tiendas

online, del mismo modo, la plataforma ofrece muchas opciones de estilo, incluidos los temas y las

herramientas que necesitarás para editar la apariencia y el diseño de tu sitio. ¿Y WordPress?

Podemos empezar diciendo que WordPress está en una liga propia en cuanto a personalización.

Cuando utilizas esta plataforma, obtienes acceso a miles de Plugins y temas. Estos pueden alterar

dramáticamente la apariencia y la funcionalidad de tu sitio, permitiéndote crear sitios web únicos

con casi cualquier función que puedas imaginar. Lo mejor es que muchos de los mejores Plugins

de WordPress son gratuitos, lo que significa que puedes instalar una función avanzada sin tener

que gastar tu presupuesto.

Es común que, independientemente de lo que quieras agregar a tu sitio, exista un plugin

para ayudarte a hacerlo. Finalmente, también vale la pena recordar que WordPress es una

plataforma de código abierto. Esto significa que si te inclinas por el lado técnico, puedes editar

cualquier aspecto del código, alterar su funcionalidad y aspecto manualmente. Si tienes alguna

experiencia en desarrollo web o estás dispuesto a aprender de las guías que hay en internet,

puedes crear sitios web de WordPress con características que Wix no puede igualar. Por esas

razones, tenemos que dar como claro ganador a WordPress en cuanto a las opciones de

personalización. El sitio de WordPress es más fácil de usar cuando lo comparas con Wix. La

plataforma de blogs tiene todas sus necesidades en un solo lugar.” (Hostinger, 2021)

Además, el punto clave de este proyecto es la correcta administración de la tienda virtual,

por ende se busca el buen control de pedidos, control de usuarios, control de inventario y

WordPress es más conveniente para usar el complemento de Woocomerce; ¿bajo qué comparativa

se llegó a la conclusión de Wordpress como principal herramienta en comercio electrónico?

“ Hoy en día, la gente está vendiendo más y más productos en línea. Veamos cómo se

compara cada plataforma en la configuración de una tienda en línea. Con Wix, tienes la opción

de agregar una tienda en línea a tu sitio web, sin embargo, solo puedes agregar comercio

45

electrónico con un plan pago. Los planes de comercio electrónico de Wix vienen con todas las

características que necesitarás para vender productos, sin embargo, es un poco sencillo en

comparación con otros complementos, como Shopify. WixStores acepta tarjetas de crédito o

débito, con la excepción de UnionPay solo disponible para algunos usuarios. PayPal u otros

pagos no mencionados en el sitio Wix no son aceptados.

El creador de sitios web de WordPress, por otro lado, es compatible con sitios de comercio

electrónico y el complemento gratuito de WordPress Woocomerce ya está siendo utilizado por el

26% del 1 millón de sitios principales que usan comercio electrónico. WordPress tiene otros

complementos gratuitos de comercio electrónico disponibles para ayudar a los usuarios a vender

todo, desde servicios, productos, suscripciones, eventos, etc. Todavía tendrás que pagar una tarifa

de transacción, pero los complementos son de instalación gratuita. Algunos complementos

conocidos de WordPress son Woocomerce, BigCommerce y Shopify. Cuando se trata de comercio

electrónico, es fácil ver que WordPress es el camino por seguir. Con numerosas opciones de

Plugins gratuitos, te permite tener más flexibilidad y opciones. Mientras que con Wix, deberás

registrarte en el plan de pago de ecommerce para recibir los mismos beneficios.” (Hostinger,

2021)

Por último, WordPress tiene un buen soporte y los materiales se encuentran fácilmente en

línea y también es conveniente para la optimización de motores de búsqueda (SEO).

Nota. Por: (BuiltWith, 2021)

Ilustración 17. Comparativa de popularidad entre los CMS.

46

8. Conclusiones

El implementar la tienda virtual a la empresa Suculenta Villavicencio teniendo en cuenta

que la evolución del comercio electrónico dio un salto exponencial a causa de la situación

provocada por el COVID 19, es un avance significativo para la empresa para su publicidad y

mejora en calidad, puesto que todo se realizó con el fin de cumplir con los objetivos establecidos

por la propietaria y buscar solución a las problemáticas establecidas.

Entrando en conclusiones técnicas, se escogió el desarrollo en CSS debido a que es el

lenguaje para describir la presentación de las páginas web, incluidos los colores, el diseño y las

fuentes. Permite adaptar la presentación a diferentes tipos de dispositivos, como pantallas grandes,

pantallas pequeñas o impresoras.

CSS es independiente de HTML y se puede utilizar con cualquier lenguaje de marcado

basado en XML. La separación de HTML de CSS hace que sea más fácil mantener los sitios,

compartir hojas de estilo entre páginas y adaptar las páginas a diferentes entornos. Esto se conoce

como la separación de la estructura (o: contenido) de la presentación.

Así mismo se escogió HTML para describir la estructura de las páginas web, esto puesto

que permite publicar documentos en línea con encabezados, texto, tablas, listas, fotos, etc;

recuperar información en línea a través de enlaces de hipertexto, con solo hacer clic en un botón.

Permite el diseño de formularios para la realización de transacciones con servicios remotos, para

su uso en la búsqueda de información, realización de reservas, pedido de productos, etc.

Con HTML, se logra describir la estructura de las páginas mediante la marcación de los

elementos del lenguaje que se etiquetan como partes de contenido tales como párrafo, lista, tabla

y esto da un punto a favor enorme en cuanto a la organización del código.

47

Referencias

Aguilar, J. (26 de 11 de 2021). WordPress Content. Obtenido de https://www.jose-

aguilar.com/blog/wp-content/uploads/2012/11/layout.jpg

Alcaldía de Bogotá. (26 de 11 de 2021). Normas. Obtenido de

https://www.alcaldiabogota.gov.co/sisjur/normas/Norma1.jsp?i=34492

Barquín, F. M. (03 de 12 de 2021). Repositorio UNICAN. Obtenido de

https://repositorio.unican.es/xmlui/bitstream/handle/10902/9380/Mangas%20Barquin%2

0Francisco.pdf?sequence=1&isAllowed=y

BuiltWith. (2021). CMS. Retrieved from https://trends.builtwith.com/cms

Cardona, L. (26 de 11 de 2021). Cyberclick. Obtenido de https://www.cyberclick.es/numerical-

blog/que-es-un-ecommerce-tipos-como-crearlo-y-ejemplos

CGRW01. (26 de 11 de 2021). Conceptos. Obtenido de

https://cgrw01.cgr.go.cr/rup/RUP.es/SmallProjects/core.base_rup/guidances/concepts/sof

tware_architecture_4269A354.html

Conexión ESAN. (26 de 11 de 2021). Etapas SCRUM. Obtenido de

https://www.esan.edu.pe/apuntes-empresariales/2018/10/las-etapas-del-scrum-como-

aplicar-este-metodo/

Digital Learning. (26 de 11 de 2021). Cliente Servidor CMS. Obtenido de

http://www.digitallearning.es/wp-content/uploads/2017/08/ClienteServidorCMS_2.png

Doménech, P. F. (03 de 12 de 2021). Open Access UOC. Obtenido de

http://openaccess.uoc.edu/webapps/o2/bitstream/10609/45186/4/pauferrerTFG0116memo

ria.pdf

Función Pública. (26 de 11 de 2021). Gestor Normativo. Obtenido de

https://www.funcionpublica.gov.co/eva/gestornormativo/norma.php?i=4276

Función Pública. (26 de 11 de 2021). Gestor Normativo. Obtenido de


Función Púlbica. (26 de 11 de 2021). Gestor Normativo. Obtenido de


Hostinger. (2021). Hostiger. Retrieved from Wix vs Wordpress. Obtenido de

https://www.hostinger.com.ar/tutoriales/wix-vs-wordpress

Ideamos Web. (26 de 11 de 2021). Ideamos Web. Obtenido de https://ideamosweb.com/que-es-

un-cms-y-que-ventajas-

tiene/#:~:text=CMS%20son%20las%20siglas%20de,sin%20conocimientos%20de%20pr

ogramaci%C3%B3n%20Web.

48

INCP. (26 de 11 de 2021). Legislativa. Obtenido de

https://incp.org.co/Site/productosyservicios/legislativa/410/l1410.htm

Interseguridad. (26 de 11 de 2021). Normativa Habeas Data. Obtenido de

https://interseguridad.org/normatividad-habeas-data-y-manejo-de-informacion/

Malavida. (24 de 11 de 2021). Malavida. Obtenido de

https://imag.malavida.com/mvimgbig/download-fs/joomla-702-2.jpg

Malavida. (26 de 11 de 2021). Malavida. Obtenido de

https://imag.malavida.com/mvimgbig/download-fs/joomla-702-2.jpg

Mondragón, L. (11 de 04 de 2021). Problemáticas de Suculenta Villavicencio. (N. M. Baquero,

Entrevistador)

Netmind. (26 de 11 de 2021). SCRUM. Obtenido de https://netmind.net/es/wp-

content/uploads/2020/12/MicrosoftTeams-image-37.png

Rdstation. (26 de 11 de 2021). Marketing Digital. Obtenido de

https://www.rdstation.com/es/marketing-digital/

Sánchez, J. P. (03 de 12 de 2021). Open Access UOC. Obtenido de

http://openaccess.uoc.edu/webapps/o2/bitstream/10609/42262/8/jpeinadosTFG0615mem

oria.pdf

Soluciones. (s.f.). Solucines.

Solucionex. (26 de 11 de 2021). Solucionex. Obtenido de

https://www.solucionex.com/sites/default/files/posts/imagen/drupal_2.png

Wikipedia. (26 de 11 de 2021). Wikipedia. Obtenido de https://es.wikipedia.org/wiki/Joomla

Wikipedia. (26 de 11 de 2021). Wikipedia. Obtenido de https://es.wikipedia.org/wiki/Drupal

Wikipedia. (26 de 11 de 2021). Wikipedia. Obtenido de

https://es.wikipedia.org/wiki/PrestaShop#/media/Archivo:Prestashop-logo-vector.png

Wikipedia. (26 de 11 de 2021). Wikipedia. Obtenido de https://es.wikipedia.org/wiki/PrestaShop

WordPress. (26 de 11 de 2021). WordPress. Obtenido de https://es-co.wordpress.org/about/

WordPress. (26 de 11 de 2021). WordPress. Obtenido de https://s.w.org/images/home/screen-

themes.png?3

49

Anexos

Anexo A. Fragmento entrevista a Laura Mondragón – Propietaria de Suculenta Villavicencio

N: ¿Cuál diría que es el mayor problema presente en la empresa?

L: En definitiva la saturación de pedidos en ciertos días, en este ámbito laboral hay días de días,

días en los cuales pueden escribir solo dos personas o días en los que escriben entre treinta o

cuarenta personas.

N: Para los días de alta actividad, ¿diría que la gestión es correcta?

L: No realmente, pese a que Whatsapp Bussines ayuda etiquetando los chats para realizar la

organización de estos, siempre puede haber error humano y que se pase uno que otro pedido por

medio de esta herramienta de trabajo.

50

Anexo B. Código CSS para el diseño base de las páginas de la tienda virtual


51

Anexo C. Diseño base para la tienda virtual

Nota. Por: Creación de la autora

52

Anexo D. Diseño base del inicio de sesión


53

Anexo E. Modelo Canvas de Suculenta Villavicencio


54

Anexo F. Especificación de requerimientos funcionales


Diseño y desarrollo de un aplicativo web para optimizar la ...

Documents

Transcript of Diseño y desarrollo de un aplicativo web para optimizar la ...