“diseño y desarrollo de aplicación de punto de venta jhony”

UNIVERSIDAD POLITÉCNICA DE SINALOA

PROGRAMA ACADÉMICO DE INGENIERÍA EN

INFORMÁTICA

Tesina

“Diseño y Desarrollo de aplicación de

Punto de venta Jhony”

Para cumplir la acreditación de las estadías profesionales y contar con los créditos

necesarios para obtener el grado de Ingeniero en Informática

Autor:

Enrique Miguel Cerrito Urías

Asesora:

Dr. Luis Javier Mena Camare

Mazatlán, Sinaloa 27 de diciembre de 2020.

Tabla de contenido

CAPITULO I .............................................................................................................. 11

1.1- Antecedentes ............................................................................................................................... 12

1.2- Planteamiento del problema ....................................................................................................... 12

1.2-1. Relevancia ................................................................................... ¡Error! Marcador no definido.

1.3- Hipótesis ...................................................................................................................................... 13

1.4- Objetivos ...................................................................................................................................... 13

1.4-1. Objetivo General ..................................................................................................................... 13

1.4-2. Objetivos Particulares ............................................................................................................. 14

1.4-3. Objetivo de la investigación ........................................................ ¡Error! Marcador no definido.

1.5- Preguntas de investigación .......................................................................................................... 14

1.6- Importancia y/o Justificación del Estudio ........................................ ¡Error! Marcador no definido.

1.7- Limitaciones del Estudio .............................................................................................................. 15

CAPITULO II ............................................................................................................. 16

2.1- Aplicaciones Móviles ................................................................................................................... 17

Ventajas ................................................................................................................................................ 17

2.2- Desarrollo Móvil .......................................................................................................................... 18

2.3- Desarrollo Nativo ......................................................................................................................... 18

2.4- Desarrollo Hibrido o Multiplataforma ......................................................................................... 19

2.4-1. Android ................................................................................................................................... 19

2.5- Historia ........................................................................................................................................ 19

2.6- Material Design ........................................................................................................................... 20

2.7- Android Studio ............................................................................................................................. 21

2.8- Lenguajes de Programación ........................................................................................................ 21

2.8-1. Java ......................................................................................................................................... 21

2.8-2. XML ......................................................................................................................................... 22

2.8-3. Kootlin .................................................................................................................................... 23

2.8-4. PHP ......................................................................................................................................... 23

2.8-5. JSON ........................................................................................................................................ 24

2.8-6. Gradle ..................................................................................................................................... 25

2.9- Bases de datos ............................................................................................................................. 29

2.9-1. SQLite ...................................................................................................................................... 29

2.9-2. MySQL ..................................................................................................................................... 29

2.10- Web API ....................................................................................................................................... 31

2.10-1. Petición HTTP ..................................................................................................................... 31

2.10-2. Respuestas HTTP ................................................................................................................ 33

2.10-3. Mensajes HTTP .................................................................................................................. 34

CAPITULO III ............................................................................................................ 36

3.1 Material ....................................................................................................................................... 37

3.2 Instalación de Android Studio ...................................................................................................... 37

3.2.1 Instalación en Linux ................................................................................................................ 39

3.2.2 Instalación en Mac .................................................................................................................. 41

3.2.3 Configuración ......................................................................................................................... 41

3.3 Diseño .......................................................................................................................................... 47

3.3.1 Colores .................................................................................................................................... 47

3.3.2 Tipografía ................................................................................................................................ 48

3.3.3 Logo ........................................................................................................................................ 49

3.4 Diseño de los Modulos ................................................................................................................. 50

3.4.1 Modulo Login .......................................................................................................................... 50

3.4.2 Modulo de Menu principal y menu lateral ............................................................................. 51

3.4.3 Modulo Apertura de Dia ........................................................................................................ 52

3.4.4 Modulo Ventas ....................................................................................................................... 53

3.4.5 Modulo Cerrar Dia .................................................................................................................. 56

3.4.6 Modulo de Mi perfil ................................................................................................................ 57

3.4.7 Modulo configuración ............................................................................................................ 58

3.4.8 Modulo de Descarga de datos ................................................................................................ 59

3.4.9 Modulo de clientes ................................................................................................................. 60

3.4.10 Modulo Estado De cuenta ................................................................................................. 61

3.4.11 Modulo de Acerca de ......................................................................................................... 62

3.5 Procedimiento ............................................................................................................................. 63

3.5.1 Prosesos de La aplicación ....................................................................................................... 64

3.6 RESULTADOS ............................................................................................................................... 69

3.6.1 Conclusiones ........................................................................................................................... 70

3.7 REFERENCIAS BIBLIOGRÁFICAS .................................................................................................... 70

Tabla de imágenes

Imagen 1.1 ........................................................................................................ 20

Imagen 1.2 ........................................................................................................ 22

Imagen 1.3 ........................................................................................................ 25

Imagen 1.4 ........................................................................................................ 28

Imagen 1.5 ........................................................................................................ 28

Imagen 1.6 ........................................................................................................ 30

Imagen 1.7 ........................................................................................................ 31

Imagen 1.8 ........................................................................................................ 33

Imagen 1.9 ........................................................................................................ 34

Imagen 1.10 ...................................................................................................... 35

Imagen 3.2.1 ..................................................................................................... 38

Imagen 3.2.1 ..................................................................................................... 39

Imagen 3.2.1.1 .................................................................................................. 39

Imagen 3.2.1.2 .................................................................................................. 40

Imagen 3.2.1.3 .................................................................................................. 40

Imagen 3.2.2.1 .................................................................................................. 41

Imagen 3.2.3.1 .................................................................................................. 42

Imagen 3.2.3.2 .................................................................................................. 42

Imagen 3.2.3.3 .................................................................................................. 43

Imagen 3.2.3.4 .................................................................................................. 43

Imagen 3.2.3.5 .................................................................................................. 44

Imagen 3.2.3.6 .................................................................................................. 45

Imagen 3.2.3.7 .................................................................................................. 45

Imagen 3.2.3.8 .................................................................................................. 46

Imagen 3.2.3.9 .................................................................................................. 46

Imagen 3.3.1.1 .................................................................................................. 47

Imagen 3.3.1.2 .................................................................................................. 48

Imagen 3.3.1.3 .................................................................................................. 48

Imagen 3.3.3.1 .................................................................................................. 49

Imagen 3.3.3.2 .................................................................................................. 49

Imagen 3.4.1.1 .................................................................................................. 50

Imagen 3.4.2.1 .................................................................................................. 51

Imagen 3.4.3.1 .................................................................................................. 52

Imagen 3.4.4.1 .................................................................................................. 53

Imagen 3.4.4.2 .................................................................................................. 54

Imagen 3.4.4.3 .................................................................................................. 55

Imagen 3.4.5.1 .................................................................................................. 56

Imagen 3.4.6.1 .................................................................................................. 57

Imagen 3.4.7.1 .................................................................................................. 58

Imagen 3.4.8.1 .................................................................................................. 59

Imagen 3.4.9.1 .................................................................................................. 60

Imagen 3.4.10.1 ................................................................................................ 61

Imagen 3.4.11.1 ................................................................................................ 62

Imagen 3.5.1.1.1 ............................................................................................... 64

Imagen 3.5.1.3.1 ............................................................................................... 66

Imagen 3.5.1.6.1 ............................................................................................... 68

Imagen 3.5.1.7.1 ............................................................................................... 69

CAPITULO I

__________________________________________________________

ANTECEDENTES Y PLANTEAMIENTO DEL PROBLEMA.

1.1- Antecedentes

SAEMI es una consultaría enfocada en las tecnologías de la

información. Con ideas innovadoras y productos de calidad que nació

recientemente en Mazatlán. Inició ofreciendo servicios de Desarrollo,

Desarrollo Web, Marketing Digital y, recientemente incorporándose

al Desarrollo de Aplicaciones Móviles. SAEMI su dedicación

constante y eficaz a la resolución de problemas tecnológicos para sus

clientes y también impulsora de talento local.

1.2- Planteamiento del problema

La creación de una aplicación para tostadas jhony esta consiste en darle a los

vendedores una aplicación para sus dispositivos Android, la cual tendría como

objetivo de agilizar el proceso de ventas, abonos y devolución.

El desarrollo de la aplicación es para mejoramiento de una aplicación ya

existente la cual dependía de aplicaciones externas ajenas a Tostadas Jhony

para la impresión de Tickets durante una venta, devolución o abono, así como

un lector de códigos QR que no estaba integrado en la aplicación.

El objetivo es desarrollar una nueva aplicación con el estilo de negocios de

SAEMI que es el mejoramiento de procesos y diseños, SAEMI junto con

Tostadas Jhony quieren lograr un diseño de una interfaz más cómoda y

eficiente para vendedores que no estuvieran muy adaptados a las tecnologías

actuales, también integrar todas las funcionalidades de impresión de tickets y

lectura de código de barras en la misma aplicación, eliminando la necesidad de

depender de aplicaciones ajenas a Tostadas Jhony. Para que la aplicación lleve

todo el control de los procesos realizados por los vendedores de Jhony.

Uno de los problemas es también el tiempo que conlleva realizar el proceso de

una venta que es un tiempo de 8 minutos en promedio este tiempo se quiere

reducir en promedio un 50% con el proceso de la aplicación debido a que se

plantea mejorar el proceso al simplificarlos y que el vendedor no tenga que

ingresar toda la información sino tan solo seleccionarla.

1.2-1. Justificación

El desarrollo de esta aplicación es muy importante para Tostadas Jhony, debido

a que no cuentan con un control registrado sobre las traslaciones lo cual

causa incluso problemas administrativos por parte de ventas, por lo que también

esta aplicación está acorde a mejorar su imagen corporativa.

1.3- Hipótesis

El desarrollo de una aplicación nativa (IT, 2020) en el sistema operativo Android

mediante el lenguaje de programación Java, permitiría un desarrollo rápido de

aplicaciones gracias a su entorno completo de desarrollo, además el lenguaje al

ser nativo del sistema operativo tiene las librerías y herramientas necesarias para

acceso a todos los recursos como servicios de Google necesarios para Firebase

y acceso a todo el hardware del dispositivo. A su vez el desarrollo nativo nos

otorga facilitación de distribución de la aplicación.

1.4- Objetivos

1.4-1. Objetivo General

El objetivo es desarrollar una aplicación correctamente analizada y programada,

que le permita a Jhony optimizar y facilitar sus procesos, así como darles a los

vendedores una herramienta fiable para agilizar todos sus procesos sin la

necesidad de tener que cambiar de aplicaciones externas a Jhony.

1.4-2. Objetivos Particulares

los objetivos particulares que se van. A manejar es el analizar todos los procesos

que realiza la empresa para realizar una venta a los clientes para poder realizar

una correcta programación de la aplicación para que se ajuste a las necesidades

de la empresa. Se plantea cumplir con

• Acelerar el proceso de acceso y registro de ventas.

• La aplicación tendrá un diseño agradable y fácil de utilizar.

• Le mejoraran procesos de administración de producto desde la terminal

al vendedor.

• Se plantea implementar todas las funciones que necesita el vendedor en

una sola aplicación a la medida.

Uno de los objetivos del aprendizaje de aplicaciones intuitivas para

prácticamente cualquier usuario sin depender de su edad, el desarrollo de

aplicación avanzadas en Android, la cual requiere de unos conocimientos

bastantes amplios del sistema. El uso de reglas de diseño establecidas por

Google para unas aplicaciones con diseños óptimos acorde a la temática del

sistema operativo.

1.5- Preguntas de investigación

1. ¿Cuáles son los beneficios del cambio de interfaz?

2. ¿Qué problemas conlleva realizar la aplicación desde cero?

3. ¿Cuál es el beneficio a largo plazo?

4. ¿Se podría realizar una versión para el sistema operativo iOS?

5. ¿Podría afectar el cambio de interfaz o versión, los procesos que se

realizan actualmente?

6. ¿Cuáles son los beneficios de no depender de ninguna aplicación o

software externo?

7. ¿Es posible realizar una versión que sea compatible para Android y

iOS?

8. ¿Conlleva problemas el uso de aplicaciones ajenas?

9. ¿Cuál es la ventaja de utilizar una línea de diseño en particular?

10. ¿Podría solo requerirse una simple orientación a los vendedores del

uso de la aplicación?

11. ¿Podrían integrase nuevas funcionalidades a la aplicación a futuro?

12. ¿Se requerirá de la adquisición de equipos nuevo o licencias de

software?

13. ¿Requerirá la actualización de los equipos móviles donde se instalará

la aplicación?

1.6- Limitaciones del Estudio

Un supuesto en el que se habló mucho es el desarrollo de una versión para el

sistema operativo de Apple iOS, dado que la aplicación de Android requiere

accesos muy nativos al sistemas como acceso al Bluetooth y almacenamiento,

se requiere desarrollar desde cero, dado que su código no es portable, se

requiere de un computador Mac de Apple para poder desarrollar en iOS lo cual

aumentaría su presupuesto considerablemente, si bien se pueden hacer un

proceso llamado Hackintosh; que consiste en instalar el sistema MacOS en una

computadora con sistema Microsoft Windows, este requiere de un proceso muy

largo y complicado, aparte de que no todo el hardware es compatible, también se

requiere un computador Mac forzosamente, y que la computadora donde se

instale Mac OS tenga un procesador de la marca Intel y una GPU compatible

AMD Radeon.

Sin bien desde el principio del desarrollo se pensó en desarrollar el proyecto en

alternativas como React Native, que permite programar aplicaciones

móviles tanto para Android o iOS, por medio del lenguaje JavaScript con el uso

de CSS y HTML, sin embargo, se descartó rápidamente, dado que el uso de

librerías nativas que requieran los lenguajes Java (Android) o Swift de Apple, es

muy complicado, sobre todo relacionado con hardware o servicios nativos del

sistema.

CAPITULO II

__________________________________________________________

MARCO CONCEPTUAL

2.1- Aplicaciones Móviles

Una app móvil es una aplicación de software pensada para dispositivos móvilesa

como tabletas. teléfonos y relojes, estas aplicaciones son desarrolladas para la

ejecución de tareas igual o similares a las computadoras personales, pero

diseñada para pantallas o entornos más pequeños o específicos.

Ventajas

Las apps móviles cuentan con muchas ventajas en comparación con los

programas de escritorio, debido a las características de los dispositivos también

tienen muchas ventajas que aportan las apps.

• Comunicación Directa

Los clientes o usuarios pueden acceder a los servicios

proporcionados por la empresa mucho mas fácilmente, a su

vez la empresa una ofrece una aplicación basada en sus métricas

de forma mucho más rápida y eficiente.

• Complementación con la web

Las apps móviles al consultar servicios web, permiten una

integración muy completa a los servicios ofrecidos por una

empresa lo que ayuda a la experiencia de usuario.

• Mejores Experiencias

Las apps móviles al ejecutarse en pantallas más pequeñas como

lo son la de los celulares estas requieren de una metodología de

diseño muy diferente a las aplicaciones de escritorio, al tener muy

poco espacio en pantalla se debe hacer una experiencia al

usuario rica y con la información que solo necesita ver o le

interesa, lo cual crea nuevas formas o reglas de diseño que ayuda

aun mas a optimizar el desarrollo de apps.

2.2- Desarrollo Móvil

Los procesos y procedimientos establecidos involucrados en la creación de

software para pequeños dispositivos informáticos inalámbricos como tabletas y

teléfonos inteligentes. Al igual que el desarrollo de aplicaciones web, el proceso

de desarrollo de aplicaciones móviles también se deriva del desarrollo de

software tradicional. El desarrollo móvil se considera una rama del desarrollo

integrado, pero con la llegada de los teléfonos inteligentes, se ha convertido en

una rama separada y se ha convertido en una rama oficial, como el escritorio y

la Web.

Sin embargo, el desarrollo móvil empezó a tener problemas durante la masiva

expansión de los smartphones al haber dos plataformas dominantes que son

Android y iOS, por ello nacieron dos ramas de desarrollo móvil llamada

Desarrollo Nativo y Desarrollo Hibrido, ambas con diferencias importantes, pero

con el mismo propósito, el desarrollo de apps móviles.

2.3- Desarrollo Nativo

Las apps nativas son aquellas aplicaciones desarrolladas para ser instaladas en

una plataforma específica, como por ejemplo iOS o Android, utilizando un kit de

desarrollo de software específico (SDK) de la plataforma.

• Android de Google: se utilizan como lenguajes de programación Java y

Kootlin actualmente, y su IDE oficial es Android Studio

• iOS de Apple: se utilizan como lenguaje de programación Swift como

remplazo a Objetive-C aunque se puede seguir utilizando, y su IDE oficial

es xCode que solo puede ser utilizado en un computador de la misma

marca

Las aplicaciones nativas escritas para una plataforma no se pueden implementar en otra, es decir, una aplicación nativa diseñada específicamente para Android no podrá instalarse en un iPhone.

Este tipo de aplicaciones ofrecen un rendimiento más rápido y acceso directo a

los servicios nativos del dispositivo (acelerómetro, GPS, cámara, etc.), sin

embargo, una de las desventajas de crear aun app nativa es la cantidad de

tiempo que se necesita y todos los conocimientos de desarrollo que se requieren,

ya que cada software requiere un lenguaje de programación distinto.

2.4- Desarrollo Hibrido o Multiplataforma 2.4-1. Android

Android es un sistema operativo desarrollado para dispositivos inteligentes como

smartphones y tabletas. Es un sistema operativo basado en Linux lo cual le

permite una flexibilidad, ser de código y abierto, gratuito y con la posibilidad de

ejecutarse en casi cualquier plataforma como lo ha hecho en relojes inteligentes,

internet de las cosas o IoT, automóviles y en Smart TV.

2.5- Historia

El sistema operativo Android fue desarrollado originalmente por la empresa

Android Inc., con el objetivo de crear un sistema operativo alterno a los que había

en el marcado en ese entonces Symbian y BlackBerry OS, eran los más

extendidos, sin embargo todo cambio con la llegada del primer iPhone, donde

dejaba a sus competidores muy por debajo, sin embargo, mucho antes de la

salida del iPhone, Google compra Android Inc., Google crea la Open Handset

Alliance, un conglomerado de fabricantes y desarrolladores de hardware,

software y operadores de servicio. En 2007 Android presenta su primera versión

Android 1.0 Apple Pie, siendo el primer dispositivo con Android el HTC Dream

que fue lanzado un año después que el iPhone de Apple.

En la actualidad Android tiene a unas de las comunidades de desarrolladores

más grandes, dado que su lenguaje de programación es Java y actualmente

Kootlin, le llevo una gran popularidad debido a su mejor desarrollo, ya que

muchos venían de desarrollar aplicaciones para teléfonos Symbian, que usaban

JME o Java Micro Edition. Android se ha ganado el cariño no solo de

desarrolladores sino, que Android al ser basado en un núcleo Linux, se tiene

libertad de hacer cualquier modificación de parte del usuario a los diferentes

dispositivos vendidos por los fabricantes, como el cambio o actualización del

sistema operativo, que el fabricante ya no daba soporte.

2.6- Material Design

Material Design es una normativa de diseño enfocado en la visualización del

sistema operativo Android, además en la web y en cualquier plataforma. Fue

desarrollado por Google y anunciado en la conferencia Google I/O celebrada el

25 de junio de 2014

Material se integró en la versión 5.0 de Android, denominada Lollipop como

remplazo a su anterior estilo de diseño Holo, utilizado desde Android 4.0 Ice

Crean Sándwich hasta su versión 4.4 KitKat.

Fuente: Material Imagen 1.1

2.7- Android Studio

Android Studio es el entrono de desarrollo o IDE oficial, para el desarrollo de

aplicaciones para Android, basado en el Editor de la empresa JetBrains Intellij

IDEA. Al ser basado en este editor pose prácticamente todas sus características

como su potente editor de código, plugins o aditamentos que ayudan al

desarrollador. Android Studio complemente con el IDE de JetBrains todas las

herramientas y funciones necesarias para el desarrollo. Anteriormente el IDE

oficial era eclipse sin embargo Google Decide hacer su propio entorno de

desarrollo, lanado en 2014.

Android Studio incorpora muchas herramientas y funciones que aumentan la

eficiencia y productividad en el desarrollo de aplicaciones para Android como:

• Alta integración para el desarrollo con los servicios de Google

• Compatibilidad para el desarrollo de librerías nativas o apps que hagan

uso de toda la potencia del del hardware con el lenguaje C++ atreves del

NDK

• Al ser un editor basado en Intellij IDEA, tiene toda la integración con

controladores de versiones como GIT.

• Herramientas de testeo para verificar el rendimiento de la aplicación.

• Integración de un emulador de Android, fácil de usar y configurar, y con

diferentes plantillas de dispositivos Android que se encuentran en el

mercado (Familia Nexus y Google Pixel).

• Posibilidad de ejecución de aplicaciones Android en dispositivos físicos

que el desarrollador disponga.

• Entorno de diseño de interfaz con las posible as resoluciones de pantalla,

de los dispositivos comercializados del marcado.

• Posibilidad de usar dos lenguajes de programación para el desarrollo Java

y Kootlin.

2.8- Lenguajes de Programación 2.8-1. Java

Java es una plataforma informática y a su vez un lenguaje de programación

creado en 1995 por la empresa Sun Microsystem. El objetivo de este lenguaje

es que los programadores sólo tuvieran que escribir el código de un programa

una vez, y que éste, pudiese ejecutarse en cualquier dispositivo. Esto es posible

gracias a la Máquina Virtual de Java (JVM), que brinda esa portabilidad

necesaria.

Java es un lenguaje orientado a objetos, independiente de la plataforma

hardware donde se desarrolla, y que utiliza una sintaxis similar a la de C++ pero

reducida. Es un lenguaje con una curva de aprendizaje baja (se puede decir que

es fácil de aprender) y que dispone de una gran funcionalidad de base

(incrementada por la gran cantidad de código de terceros existente). Java, como

lenguaje de programación, ofrece un código robusto, que ofrece un manejo

automático de la memoria, lo que reduce el número de errores.

Fuente: Oracle Imagen 1.2

2.8-2. XML

XML es el acrónimo de Extensible Markup Language, es decir, es un lenguaje

de marcado que define un conjunto de reglas para la codificación de

documentos. ¿Te parece complicado? Entonces, vamos a simplificarlo.

El lenguaje de marcado es un conjunto de códigos que se pueden aplicar en el

análisis de datos o la lectura de textos creados por computadoras o personas. El

lenguaje XML proporciona una plataforma para definir elementos para crear un

formato y generar un lenguaje personalizado.

Un archivo XML se divide en dos partes: prolog y body. La parte prolog consiste

en metadatos administrativos, como declaración XML, instrucción de

procesamiento opcional, declaración de tipo de documento y comentarios. La

parte del body se compone de dos partes: estructural y de contenido (presente

en los textos simples).

El diseño XML se centra en la simplicidad, la generalidad y la facilidad de uso y,

por lo tanto, se utiliza para varios servicios web. Tanto es así que hay sistemas

destinados a ayudar en la definición de lenguajes basados en XML, así

como APIs que ayudan en el procesamiento de datos XML – que no deben

confundirse con HTML.

2.8-3. Kootlin

Es un lenguaje de programación de tipado estático que corre sobre la máquina

virtual de Java y que también puede ser compilado a código fuente

de JavaScript. Es desarrollado principalmente por JetBrains en sus oficinas

de San Petersburgo (Rusia). El nombre proviene de la isla de Kotlin, situada

cerca de San Petersburgo.

2.8-4. PHP

PHP es un lenguaje de scripting de código abierto, del lado del servidor, con

programación HTML integrada que se utiliza para crear páginas web dinámicas.

Las ventajas de PHP son su flexibilidad y su alta compatibilidad con otras bases

de datos. Además, PHP es considerado como un lenguaje fácil de aprender.

Las funciones de PHP se relacionan con los scripts del lado del servidor. PHP

puede realizar cualquier tarea que cualquier programa CGI (Common Gateway

Interface) puede hacer y maneja el intercambio de datos entre el servidor y el

software. Por lo tanto, PHP puede recopilar datos o crear webs de contenido

dinámico.

Tres funciones principales distinguen en particular el PHP:

• Programación del lado del servidor: esto requiere tres componentes, que

son un analizador PHP, un navegador web y un servidor web. Este último

está conectado con una instalación PHP. El navegador web se utiliza para

acceder al programa PHP. El navegador muestra páginas web que se

almacenan en el servidor y se generan con PHP. La programación del

lado del servidor es ideal para webs de prueba antes de su publicación en

la web.

• Programación a través de la línea de comandos: Los scripts PHP pueden

ser creados sin un navegador o servidor. En este caso, sólo necesitarás

un analizador PHP. Estos scripts son adecuados para las tareas regulares

que se llevan a cabo en una web.

• Escribir aplicaciones de escritorio: esta función no se utiliza con tanta

frecuencia como la programación de páginas web. Sin embargo, el PHP

es adecuado para el desarrollo de aplicaciones de escritorio debido a su

complejidad, que también puede ser utilizado a través de múltiples

plataformas.

2.8-5. JSON

JSON (JavaScript Object Notation - Notación de Objetos de JavaScript) es un

formato ligero de intercambio de datos. Leerlo y escribirlo es simple para

humanos, mientras que para las máquinas es simple interpretarlo y generarlo.

Está basado en un subconjunto del Lenguaje de Programación

JavaScript, Standard ECMA-262 3rd Edition - Diciembre 1999. JSON es un

formato de texto que es completamente independiente del lenguaje, pero utiliza

convenciones que son ampliamente conocidos por los programadores de la

familia de lenguajes C, incluyendo C, C++, C#, Java, JavaScript, Perl, Python, y

muchos otros. Estas propiedades hacen que JSON sea un lenguaje ideal para el

intercambio de datos.

JSON está constituido por dos estructuras: Una colección de pares de

nombre/valor. En varios lenguajes esto es conocido como un objeto, registro,

estructura, diccionario, tabla hash, lista de claves o un arreglo asociativo.

Una lista ordenada de valores. En la mayoría de los lenguajes, esto se

implementa como arreglos, vectores, listas o secuencias.

Estas son estructuras universales; virtualmente todos los lenguajes de

programación las soportan de una forma u otra. Es razonable que un formato de

intercambio de datos que es independiente del lenguaje de programación se

base en estas estructuras.

En JSON, se presentan de estas formas: Un objeto es un conjunto desordenado

de pares nombre/valor. Un objeto comienza con {llave de apertura y termine con}

llave de cierre. Cada nombre es seguido por: dos puntos y los pares

nombre/valor están separados por, coma.

Fuente: JSON.org Imagen 1.3

2.8-6. Gradle

Gradle, es una herramienta que permite la automatización de compilación de

código abierto, la cual se encuentra centrada en la flexibilidad y el rendimiento.

Los scripts de compilación de Gradle se escriben utilizando Groovy o Kotlin DSL

(Domain Specific Language).

Gradle tiene una gran flexibilidad y nos deja hacer usos otros lenguajes y no solo

de Java, también cuenta con un sistema de gestión de dependencias muy

estable. Gradle es altamente personalizable y rápido ya que completa las tareas

de forma rápida y precisa reutilizando las salidas de las ejecuciones anteriores,

sólo procesar las entradas que presentan cambios en paralelo.

Además, es el sistema de compilación oficial para Android y cuenta con soporte

para diversas tecnologías y lenguajes. Algunas características de Gradle que

podemos destacar son las siguientes:

• Depuración colaborativa: Permite compartir los resultados de la

compilación para resolver en equipo de forma eficiente posibles

problemas que aparezcan.

• Construcción incremental: Valida en el proceso de compilación si la

entrada, salida o implementación de una tarea ha cambiado, en caso de

no existir algún cambio la considera actualizada y no se ejecuta.

• Diseño de repositorio personalizado: Podremos tratar prácticamente

cualquier estructura de directorios del sistema de archivos como un

repositorio de Artifacts.

• Dependencias transitivas: Es uno de los principales beneficios que ofrece

al utilizar la gestión de dependencias ya que se encarga de descargar y

administrar las dependencias transitivas.

• Soporte a Groovy y Scala incorporado: Compatibilidad con los proyectos

de Groovy, permitiendo trabajar con código Groovy o código Scala e

inclusive desarrollar código mixto Java y Groovy o Java y Scala.

• Compilación incremental para Java: En caso de que el código fuente o la

ruta de clase cambien, Gradle cuenta con la capacidad para detectar

todas las clases que se vean afectadas por dicho cambio y procederá a

recompilarlas.

• Embalaje y distribución de JAR, WAR y EAR: Cuenta con herramientas

para empaquetar el código basado en JVM (Java Virtual Machine) en

archivos de archivo comunes.

• Integración con Android Studio: Android Studio no cuenta con un

generador interno, sino que delega todas las tareas de compilación en

Gradle, garantizando la corrección en todas las construcciones, ya sea

que se ejecuten desde Android Studio, la línea de comandos o un servidor

de construcción de integración continua.

• Soporte de MS Visual C ++ y GoogleTest: Gradle acepta la construcción

con el compilador de Visual C de Microsoft en Windows. (VS 2010, VS

2013 y VS 2015 compatibles), así como también realizar pruebas de

aplicaciones C con GoogleTest.

• Publicar en repositorios Ivy y Maven: Permite publicar Artifacts en

repositorios Ivy con diseños de directorios completamente

personalizables. De igual modo, sucede con Maven en Bintray o Maven

Central.

• TestKit para pruebas funcionales: Permite la ejecución programática de

builds inspeccionando los resultados de compilación, ésta es una prueba

de compatibilidad entre versiones.

• Distribuciones personalizadas: En Gradle cada distribución cuenta con un

directorio init.d en el que se pueden colocar scripts personalizados que

pre configuran su entorno de compilación.

• Lee el formato POM: Es compatible con el formato de metadatos POM,

por lo que es posible recuperar dependencias de cualquier repositorio

compatible con Maven.

• Compara builds: Resalta de forma rápida las diferencias entre

compilaciones, lo que hace que el análisis de la causa raíz sea mucho

más rápido y eficaz.

• Compilador daemon: Gradle crea un proceso de daemon que se reutiliza

dentro de una compilación de múltiples proyectos, cuando necesita

bifurcar el proceso de compilación, mejorando la velocidad de

compilación.

• Personalizar y extender escaneos: Ofrece la opción de agregar sus

propios datos para construir escaneos como etiquetas, valores y enlaces,

integrando escaneos de compilación en la cadena de herramientas.

• Caché de dependencia de terceros: Las dependencias de repositorios

remotos se descargan y almacenan en caché localmente, las

compilaciones posteriores utilizan los artifacts almacenados en caché

para evitar el tráfico de red innecesario.

Fuente: OpenWebBinnars Imagen 1.4

Fuente: globallydynamic Imagen 1.5

2.9- Bases de datos 2.9-1. SQLite

SQLite es una herramienta de software libre, que permite almacenar información

en dispositivos empotrados de una forma sencilla, eficaz, potente, rápida y en

equipos con pocas capacidades de hardware, como puede ser una PDA o un

teléfono celular. SQLite implementa el estándar SQL92 y también agrega

extensiones que facilitan su uso en cualquier ambiente de desarrollo. Esto

permite que SQLite soporte desde las consultas más básicas hasta las más

complejas del lenguaje SQL, y lo más importante es que se puede usar tanto en

dispositivos móviles como en sistemas de escritorio, sin necesidad de realizar

procesos complejos de importación y exportación de datos, ya que existe

compatibilidad al 100% entre las diversas plataformas disponibles, haciendo que

la portabilidad entre dispositivos y plataformas sea transparente.

Estas son algunas de las características principales de SQLite:

• La base de datos completa se encuentra en un solo archivo.

• Puede funcionar enteramente en memoria, lo que la hace muy rápida.

• Tiene un footprint menor a 230KB.

• Es totalmente autocontenida (sin dependencias externas).

• Cuenta con librerías de acceso para muchos lenguajes de programación.

• Soporta texto en formato UTF-8 y UTF-16, así como datos numéricos de

64 bits.

• Soporta funciones SQL definidas por el usuario (UDF).

• El código fuente es de dominio público y se encuentra muy bien

documentado.

2.9-2. MySQL

MySQL, es un sistema de gestión de base de datos relacional o SGBD. Este

gestor de base de datos en multihilo y multiusuario, lo que le permite ser utilizado

por varias personas al mismo tiempo, e incluso, realizar varias consultas a la vez,

lo que lo hace sumamente versátil.

Nació como una iniciativa de Software Libre y aún sigue ofreciéndose como tal,

para usuarios particulares. Pero si se desea utilizarlo para promover datos en

una empresa, se puede comprar una licencia, como un software propietario, que

es autoría de la empresa patrocinante (Actualmente Oracle Corporation).

La mayor parte del código se encuentra escrito en lenguaje C/C++ y la sintaxis

de su uso es bastante simple, lo que permite crear bases de datos simples o

complejas con mucha facilidad. Además, es compatible con múltiples

plataformas informáticas y ofrece una infinidad de aplicaciones que permiten

acceder rápidamente a las sentencias del gestor de base de datos.

Fuente: Mysql Imagen 1.6

2.10- Web API

Una API es un conjunto de definiciones y protocolos que se utiliza para

desarrollar e integrar el software de las aplicaciones. API significa interfaz de

programación de aplicaciones.

Las API permiten que sus productos y servicios se comuniquen con otros, sin

necesidad de saber cómo están implementados. Esto simplifica el desarrollo de

las aplicaciones y permite ahorrar tiempo y dinero. Las API le otorgan flexibilidad;

simplifican el diseño, la administración y el uso de las aplicaciones, y

proporcionan oportunidades de innovación, lo cual es ideal al momento de

diseñar herramientas y productos nuevos (o de gestionar los actuales).

Las API son un medio simplificado para conectar su propia infraestructura a

través del desarrollo de aplicaciones nativas de la nube, pero también le permiten

compartir sus datos con clientes y otros usuarios externos.

Fuente: Red Hat Imagen 1.7

2.10-1. Petición HTTP

Las peticiones HTTP son mensajes enviados por un cliente, para iniciar una

acción en el servidor. Su línea de inicio está formada por tres elementos:

1. Un método HTTP, un verbo como: GET, PUT o POST) o un nombre

como: HEAD o OPTIONS), que describan la acción que se pide sea

realizada. Por ejemplo, GET indica que un archivo ha de ser enviado

hacia el cliente, o POST indica que hay datos que van a ser enviados

hacia el servidor (creando o modificando un recurso, o generando un

documento temporal para ser enviado).

2. El objetivo de una petición, normalmente es una URL, o la dirección

completa del protocolo, puerto y dominio también suelen ser

especificados por el contexto de la petición. El formato del objetivo de la

petición varia según los distintos métodos HTTP. Puede ser:

• Una dirección absoluta, seguida de un signo de cierre de interrogación

‘?’ y un texto de consulta. Este es el formato más comun, conocido

como el formato original ('origin form' en inglés), se usa en los

métodos GET, POST, HEAD,y OPTIONS .

POST/HTTP 1.1

GET/background.png HTTP/1.0

HEAD/test.html?query=alibaba HTTP/1.1

OPTIONS /anypage.html HTTP/1.0

• Una URL completa; conocido como el formato absoluto, usado

mayormente con GET cuando se conecta a un proxy.

GET http://developer.mozilla.org/en-US/docs/Web/HTTP/Messages

HTTP/1.1

• El componente de autorizado de una URL, formado por el nombre del

dominio y opcionalmente el puerto (el puerto precedido por el

símbolo ':’), se denomina a este formato como el formato de autoridad.

Únicamente se usa con CONNECT cuando se establece un túnel

HTTP.

CONNECT developer.mozilla.org:80 HTTP/1.1

• El formato de asterisco, se utiliza un asterisco ('*’) junto con las

opciones: OPTIONS, representando al servidor entero en conjunto.

OPTIONS * HTTP/1.1

3. La versión de HTTP, la cual define la estructura de los mensajes,

actuando como indicador, de la versión que espera que se use para la

respuesta.

Fuente: Mozilla Developer Imagen 1.8

2.10-2. Respuestas HTTP

La línea de inicio de una respuesta HTTP, se llama la línea de estado, y

contienen la siguiente información:

1. La versión del protocolo, normalmente HTTP/1.1.

2. Un código de estado, indicando el éxito o fracaso de la petición. Códigos

de estado muy comunes son: 200, 404, o 302

3. Un texto de estado, que es una breve descripción, en texto, a modo

informativo, de lo que significa el código de estado, con el fin de que una

persona pueda interpretar el mensaje HTTP.

Una línea de estado típica es, por ejemplo: HTTP/1.1 404 Not Found.

Las cabeceras HTTP para respuestas siguen también la misma estructura como

cualquier otra cabecera: una cadena de texto, que no diferencia entre

mayúsculas y minúsculas, seguida por dos puntos (':') y un valor cuya estructura

depende del tipo de cabecera. Toda la cabecera incluido su valor, se ha de

expresar en una única línea.

Existen varias cabeceras posibles. Estas se pueden dividir en distintos grupos:

• Cabeceras generales, ('General headers' en inglés), como Via, afectan al

mensaje completo.

• Cabeceras de petición, ('Request headers' en

inglés), como Vary , Accept-Ranges, dan información adicional sobre el

servidor, que no tiene espacio en la línea de estado.

• Cabeceras de entidad, ('Entity headers' en ingles), como Content-

Length las cuales se aplican al cuerpo de la petición. Por supuesto, esta

cabecera no necesita ser transmitida si el mensaje no tiene cuerpo ('body'

en inglés).

•

Fuente: Mozilla Developer Imagen 1.9

2.10-3. Mensajes HTTP

Los mensajes HTTP, son los medios por los cuales se intercambian datos entre

servidores y clientes. Hay dos tipos de mensajes: peticiones, enviadas por el

cliente al servidor, para pedir el inicio de una acción; y respuestas, que son la

respuesta del servidor.

Los mensajes HTTP están compuestos de texto, codificado en ASCII, y pueden

comprender múltiples líneas. En HTTP/1.1, y versiones previas del protocolo,

estos mensajes eran enviados de forma abierta a través de la conexión. En

HTTP/2.0 los mensajes, que anteriormente eran legibles directamente, se

conforman mediante tramas binarias codificadas para aumentar la optimización

y rendimiento de la transmisión.

Los desarrolladores de páginas Web, o administradores de sitios Web,

desarrolladores... raramente codifican directamente estos mensajes HTTP.

Normalmente especifican estos mensajes HTTP, mediante archivos de

configuración (para proxies, y servidores), APIs (para navegadores) y otros

medios.

Fuente: Mozilla Imagen 1.10

CAPITULO III

__________________________________________________________

DISEÑO Y DESARROLLO.

3.1 Material

Para el comienzo del desarrollo se realizo una reunión con el encargado del

departamento de sistemas de Tostadas Jhony el Sr. Noe Meza, quien nos

presento la aplicación que se tenia en producción, Menciono que la aplicación

había sido desarrollada mediante un convenio, de un equipo de desarrollo o con

una empresa, pero, sin embargo, el desarrollo de la nueva versión de la

aplicación debería cumplir con los siguientes puntos:

• Una interfaz más agradable y fácil de usar para los vendedores, para que

los vendedores que no están familiarizados con las nuevas tecnologías

no presenten problemas en la utilización.

• La aplicación no deberá requerir demasiada capacitación sobre la

utilización para los vendedores.

• Se deberá contar con un sistema de configuración práctico y sencillo para

el proceso de cambio de ruta y la configuración de impresoras bluetooh

• Funcionalidad para la impresión de tickets de venta, abonos,

devoluciones y etc.

• Deberá tener una interfaz acorde a la nueva imagen corporativa de

Tostadas Jhony que es directa de SAEMI.

• Deberá contar con la posibilidad de descargar información de productos,

promociones, precios especiales, obsequios. En una base de datos local,

ya que algunas rutas ya establecidas se encuentran en zonas donde la

conexión a internet no esta disponible, tanto internet domestico como

datos móviles ofrecidos por los diferentes operadores.

3.2 Instalación de Android Studio

El software que se utilizo para el desarrollo de la aplicación es Android Studio, el

IDE oficial de desarrollo de la plataforma móvil, para ellos se debe de cumplir

ciertos requisitos de hardware para su instalación, se requieren los siguientes

requisitos:

• 10 GB de espacio libre (Recomendado una unidad de estado sólido o

SSD)

• Un procesador Intel o AMD de cuatro núcleos, con una velocidad

recomendada de 2.0 GHz

• 8 GB de RAM (mínimo), 12 GB o superior (recomendados)

• Soporte para virtualización para emulación de Android o Tener un

dispositivo Android Físico

• Sistema Operativo Linux, Windows o Mac OS

Al cumplir los requisitos podemos descargar el IDE desde la pagina de Android

Developers, de forma completamente gratuita.

Fuente: Del Autor Imagen 3.2.1

Al descargar Android Studio nos pedirá aceptar los términos y condiciones, no

tendremos que seleccionar para que sistema operativo se requiere, ya que nos

reconocerá automáticamente el sistema operativo que tenemos instalado en

nuestra computadora.

Fuente: Del Autor Imagen 3.2.1

3.2.1 Instalación en Linux

Al descargar el archivo .tar, procedemos a descomprimir el archivo, podremos

colocarlo en cualquier carpeta, pero lo mas recomendable es descomprimirla en

la carpeta raíz de nuestro usuario ejemplo /home/usuario/, se puede realizar este

proceso por manera gráfica, o mediante la consola de comandos

Fuente: Del Autor Imagen 3.2.1.1

Para ejecutar el asistente de instalación procederemos a abrir la consola de

comando o terminal y entramos a la carpeta de Android Studio seguido de la

carpeta bin, con el comando cd.


Ejecutamos el archivo studio.sh mediante la terminal, este es el ejecutable de

Android Studio, los pasos seguidos aplican con cualquier distribución Linux tanto

Ubuntu, Debian, Fedora, entre otros. No se requieren permisos de administrador

para su ejecución.


3.2.2 Instalación en Mac

Al descargar el archivo .dmg, procederemos a ejecutarlo, el archivo nos mostrara

una ventana con dos iconos.


Para a la instalación arrastraremos el icono de Android studio a la carpeta de

aplicaciones con esto finalizaremos la instalación en el sistema operativo Mac.

3.2.3 Configuración

El asistente de configuración de Android Studio, es exactamente el mismo en

todas las plataformas compatibles, así que aplica tanto para Linux, Windows y

OS X, primero nos pedirá si tenemos alguna configuración que queramos

importar, como temas, plugins o configuraciones, si no tenemos ninguna

configuración anterior, tendremos que seleccionar “no importar configuraciones”

y dar en continuar.


Después mostrara que, si queremos enviar estadísticas de uso de Google con el

objetivo de mejorar o corregir bugs que surjan durante el uso de la aplicación.


Continuando con la configuración el asistente nos da la bienvenida a Android

Studio, explicando la funcionalidad del Editor, y para que plataformas Android

esta disponible de manera oficial, después daremos en siguiente.


A continuación, el asistente de Android Studio nos pedirá que, si queremos una

instalación estándar que procederá con la instalación de todo el software

necesario o personalizada, en este caso seleccionaremos en personalizada y

damos click en siguiente.


Posteriormente nos pedirá donde esta localizado el JDK de Java, es requerido

tenerlo instalado en su versión 1.8, si ya lo tenemos instalado, detectara

automáticamente en la carpeta donde se encuentra instalado, después damos

click en siguiente.


Posteriormente nos pedirá el tema que tendremos por default, aquí podremos

elegir entre tema claro y oscuro, en este caso se selecciona oscuro, pero pueden

elegir el de su preferencia.


Después de la configuración del tema nos pedirá que queremos descargar del

software de desarrollo, es importante descargar las ultimas versiones del SDK

Tools, también si queremos instalar el Android Virtual Device o AVD, pero

dejaremos todas las opciones por defecto marcadas, y procedemos a continuar.

(Es necesario contar con conexión a internet)


Antes de comenzar la descargar el asistente nos mostrara un resumen de todo

el software que queremos descargar, procederemos a continuar dando click en

siguiente.


Posteriormente iniciara la descargar de el SDK Tools, este proceso puede

demorar dependiendo de la conexión a internet.


3.3 Diseño

3.3.1 Colores

En Material Design una de sus reglas declara que el color de la aplicación debe

ser acorde al color más representativo de la empresa, el color que utiliza en este

caso Tostadas Jhony es un color rojo intenso, por lo cual se decidió elegir la

siguiente paleta de colores principales de la aplicación.

Fuente: Por Autor Imagen 3.3.1.1

se decidió por cambiar la paleta de colores en todas las interfaces para que fuera

una interfaz blanca, pero conservando en partes de la interfaz como títulos,

botones o cualquier elemento representativo un color rojo mas ligero en cuanto

a intensidad, para seguir conservando los colores principales de la aplicación.

Esta decisión se hizo ya que era más fácil la implementación de un modo oscuro

que Google requiere estrictamente en sus aplicaciones, a partir del lanzamiento

de Android 10 y para que la interfaz fuera mas amigable ala vista del usuario. A

continuación, se muestran las nuevas paletas de colores, tanto para tema claro

como oscuro respectivamente.



3.3.2 Tipografía

La fuente que se utilizo fue la fuente predeterminada del sistema operativo

Roboto, solo en una excepción de utilizo una fuente especial para solo un título

en el inicio de la aplicación, que este caso es la fuente lastica. La fuente roboto

al ser la predeterminada del sistema operativo, es agradable a la vista a la vez

que es muy amigable con Material Design también predeterminada, aunque es

posible utilizar otras fuentes como Sans-serif.

3.3.3 Logo

El logo es muy importante en cualquier software sin importar la plataforma, ya

que represente la imagen comercial de este, en este caso se decidió utilizar el

logo original de Tostadas Jhony.


Pero el logo para el icono del launcher de la aplicación se decidió usar un icono

de Jhony minimizado, solo buscando algo representativo y llamativo de la marca

como lo es el castillo y su tamaño era adecuado para el icono de la aplicación.

Además, el IDE genera tres iconos con formas distintas para cada uno de las

diferentes configuraciones que de los launcher de los diferentes fabricantes de

teléfonos Android.

Fuente: Por el autor Imagen 3.3.3.2

3.4 Diseño de los Módulos

En este apartado se habla sobre el puro diseño y no los procesos de los módulos

que contiene la aplicación debido a que gran parte del proyecto se enfoco en

lograr una aplicación con un diseño sencillo pero funcional para la facilitación de

los procesos que realizan los vendedores.

3.4.1 Modulo Login

Durante la creación el diseño del Login en lo que nos enfocamos fue que fuera

algo sencillo como Material Design lo estipula, pero darle un toque personal y

llamativo para lograr eso decidimos colocar un fondo diseñado específicamente

para el apartado y que encajara perfectamente en el ambiente.


3.4.2 Modulo de Menú principal y menú lateral

Menú principal

En el diseño del menú principal se planeo hacerlo de una manera mas vistoso

por lo que los diferentes módulos se implementaron con iconos representativos

para que fuera mas simple de entender el menú y también se pensó en darle una

forma de facilitación a los vendedores para encontrar lo que necesitan por lo que

el botón de ventas como es el que ellos siempre usan se planteo en darle un

distintivo para su fácil ubicación y utilización.

Menú lateral

En este menú tiene algunas opciones diferentes al menú principal porque no se

utilizan frecuentemente por el vendedor, son opciones extras que se

implementaron para no sobre cargar el menú principal, pero a la vez tenerlas a

en un acceso rápido, aquí también se muestra información relevante del

vendedor que esta utilizando la aplicación.


3.4.3 Modulo Apertura de Día

En este modulo solo se muestra formulario sencillo que obtiene la fecha al iniciar

el día como el titulo lo menciona, al inicio información sobre la ruta de comercio

que esta designada al dispositivo y por último una pequeña frase motivacional

aleatoria, después muestra un listado de los datos que esta descargando para

las operaciones que se realizaran en el día de laboral.


3.4.4 Modulo Ventas

Este modulo por funciones de comodidad y visualización se dividió en 3 partes

importantes como lo son la lista de clientes, la ventana de ventas y la lista de

productos, el diseño se implemento de esta manera para no sobre cargar la

pantalla con toda la información y mejorar estéticamente el proceso y la

visualización de los datos necesarios.

lista de clientes

en este apartado lo que se nos muestra es un dialog que contiene una lista de

clientes de asignados a la ruta que se muestra al iniciar una venta, los clientes

se muestras de una amera cómoda para el vendedor dependiendo el orden de

visita que llevara en su ruta asignada, la información que se muestra solo es la

necesaria el nombre, id y dirección del establecimiento cada cliente se

representa con una letra por estética visual, al final se muestra un botón flotante

que se encarga de leer los códigos de barra que se encuentran en los

establecimientos para proceder a la venta.


Ventana de ventas

Esta ventana se muestra después de a ver seleccionado un cliente en la lista de

clientes, su diseño esta conformado con una tarjeta para la información del

cliente, una sección para los productos que se están tramitando desde la lista de

producto y por ultimo los datos de precios de la venta ligeramente resaltados.

• Subtotal: Muestra la suma de la multiplicación de la cantidad y el precio

del producto, pero sin descuento, en caso de que el cliente tenga

descuento con Tostadas Jhony

• Descuento: Es el resultado de la suma de la multiplicación de la cantidad

del producto, pero por el descuento que dicho producto tenga con el

cliente si lo tiene disponible

• Total, es la resta entre el subtotal y el descuento.


Lista de productos

Esta lista se muestra al hacer click en el icono del carrito en la ventana venta

aquí podemos observar una lista de los productos que ofrece la empresa jhony

los datos que se muestran de cada producto son los necesarios como lo son el

nombre del producto, la cantidad que lleva en el transporte, el precio y un id para

identificar el producto, una vez seleccionado los productos de compra se

marcaran con una palomita para identificarlos. Una vez finalizado este proceso

los productos seleccionados se mandarían a la ventana de ventas.


3.4.5 Modulo Cerrar Día

En este modulo lo principal que podemos visualizar es una pequeña lista de los

diferentes procesos que el vendedor realiza durante su día de trabajo en esta

lista podemos observar un resumen de cuantas operaciones de cada tipo realizo

durante el día, también tiene un botón para empezar el proceso de cierre de día,

al dar click en el nos enviara a otra ventana con un formulario de 8 apartados

que tienen que ser rellenados por los vendedores para poder finalizar el proceso

de finalización del día.


3.4.6 Modulo de Mi perfil

En este modulo podremos observar un apartado con la información mas

importante del vendedor como lo es el nombre, puesto, teléfono de contacto,

numero de seguro social y por ultimo el tipo de sangre y debajo de apartado

podemos visualizar una los datos mas principales como lo son Modelo, Placas y

kilometraje sobre el vehículo que este asignado a la ruta del vendedor.


3.4.7 Modulo configuración

En esta ventana podremos visualizar diferentes configuraciones de la aplicación

como lo es el tema oscuro, las configuraciones para la impresora de tickets, la

configuración de la ruta, del servidor al que esta apuntando la aplicación y unas

opciones extra para el testeo de la aplicación durante su desarrollo que son el

visualizar la base de datos interna del teléfono y el envió de una copia de

seguridad de la misma por correo electrónico, en esta vista podremos visualizar

y configurar estas distintas opciones.


3.4.8 Modulo de Descarga de datos

Esta ventana se creo para poder actualizar datos del servidor después de a ver

inicializado el día ya que en algunas ocasiones los datos no estaban correctos

en el servidor al momento de iniciar el día, para evitar el problema de cerrar el

día y volver a iniciar se tomo ala decisión de crear este apartado que nos brinda

mas comodidad al momento de este tipo de errores por parte del servidor con

esta opción el vendedor solo escogería las opciones que necesita actualizar y

las descargaría.


3.4.9 Modulo de clientes

Esta ventana esta diseñada del mismo modo que la lista de clientes en el modulo

de ventas la única diferencia es que no es dialog, en realizad es una ventana

completa esta muestra un dialog con información sobre el cliente de una manera

agradable para el vendedor y rápida, la información que muestra es el nombre

del establecimiento, numero telefónico, correo electrónico, dirección y los días

de la semana en los cuales se le visita al cliente, también cuenta con un acceso

directo al modulo de ventas y a una pequeña encuesta que se les hace a los

clientes. Pero a la vez algunos clientes cuentan con cuentas a crédito y esto les

agrega una opción extra que es abonos.


3.4.10 Modulo Estado De cuenta

Esta ventana se accede desde el modulo de clientes debido a que solo algunos

clientes cuentan con una cuenta a crédito, esta ventana cuenta con una card

donde podemos visualizar el nombre de cliente y un saldo actual de su cuenta

de crédito, también podemos ver un historial de movimientos que son las ventas

que a pedido a crédito solo se muestra la fecha de creación y el saldo a pagar

de las ventas a crédito, al final de la ventana esta situado un botón flotante que

nos permite acceder a aun dialog de abonos donde igual observaremos el

nombre del cliente y el código de registro y un apartado donde podremos agregar

un el saldo a abonar del cliente.


3.4.11 Modulo de Acerca de

Es una vista sencilla que solo muestra información de la aplicación como lo es el

nombre, la versión, datos del autor en este caso SAEMI y algunos datos

generales de la empresa dueña de la aplicación que es Tostadas Jhony.


3.5 Procedimiento

Lo primero que se realizo durante el desarrollo de la aplicación fue el análisis de

procesos que realiza la empresa desde el momento de partida de los repartidores

desde la empresa, esto para poder entender mejor todo el proceso de los

vendedores, el análisis se llevo a cabo por el encargado de sistemas de jhony y

un compañero de mi grupo de trabajo cabe destacar que algunos procesos

también se analizaron desde una aplicación ya existente en la empresa

encargada de los procesos de ventas a la cual sustituirá nuestra aplicaron , ellos

se encargaban de analizar y comprender todos los procesos que realizan los

vendedores tanto por administración como por la aplicación, una vez

comprendidos, se convocaba a una reunión con el equipo de desarrollo en la

cual se plantea y explicaban los procesos a realizar, se hacia notar las partes

importantes de ellos, los puntos negativos para poder ser mejorados y un posible

diseño con el cual empezaríamos a trabajar.

Durante el desarrollo de la aplicación se analizo y procesaron en su totalidad los

procesos que desarrollan los vendedores durante su día laboral parte de estos

procesos se tomaron de base de la anterior aplicación con la que contaba jhony

por lo cual nosotros solamente los intentamos mejorar y simplificar lo mas posible

para obtener una mejor respuesta del usuario y un mejor resultado al momento

de realizarlos y otros procesos fueron creados completamente con el desarrollo

de la aplicación.

Algunos procesos que realiza la aplicaron son bastante largos y complejos, pero

otros son simples de implementar, durante el desarrollo de ellos fuimos

analizando el problema buscando la mejor optimización y funcionamiento de

ellos, algunos pasaron por diferentes formas de planeación y de desarrollo

generando diferentes versiones del mismo proceso hasta que encontramos en

lo que parece ser el mejor método tanto para optimización, funcionalidad y

eficacia.

Debido a la variabilidad de procesos que realiza la aplicación, solo se planteara

explicar en generar los procesos y no a profundidad, mostrando solo lo mas

relevante de diseño y funcionalidad de los mismos.

3.5.1 Procesos de La aplicación

3.5.1.1 Inicio de sesión

El primer proceso es el inicio de sesión del usuario, si el usuario es la primera

vez que inicia sesión en la aplicación se iniciara el proceso de configuración de

ruta esto es un proceso de 2 sencillos pasos de seleccionar la agencia de ventas

y la ruta asignada al vendedor, si el usuario ya había configurado esto antes al

iniciar sesión entrara directamente al menú principal de la aplicación.

Fuente: Por el autor Imagen 3.5.1.1.1

3.5.1.2 Inicio De Día

Este es un proceso principal de la aplicación debido a que sin el no se puede

realizar los procesos principales como lo son la ventas y devoluciones.

El inicio de día es una forma de validar que el usuario empezó la ruta para este

proceso solo hace falta poner la fecha del día actual y dar empezar día de trabajo

con esto la aplicación empezara a descargar los datos necesarios del día desde

el servidor para que se permita entrar al apartado de ventas y a todas las

opciones que contiene la aplicación con los datos actualizados.

3.5.1.3 Ventas

Este es el proceso mas largo e importante de la aplicación debido a que es el

proceso principal, en el se hace utilización de pequeños procesos internos que

nos saltaremos porque no son tan importantes de explica.

Lo primero que se realiza para realizar una venta es seleccionar un cliente de la

lista de clientes que muestra en la ventana de ventas previamente mostrada en

la sección de diseño una vez seleccionado el cliente nos guarda su información

en ventas para poder tener un control del detalle de ventas, después de esto

tendremos que seleccionar los productos que el cliente desea comprar esto igual

se puede seleccionar en la lista de productos por selección múltiple, una ves

seleccionados todos los productos a vender se enviaran ala ventana de ventas

donde se podrá seleccionar la cantidad de cada uno de lo productos y mostrando

el costo individual de cada producto, también nos mostrara los precios de la

venta que son un subtotal de toda la venta de productos, un descuento esto se

implementa a algunos clientes o algunos productos, y el precio total de la venta.

Durante la venta el cliente también puede realizar devoluciones de productos

este proceso es igual de al de venta de producto solo que en vez de sumar al

subtotal de la venta se restara el precio de los productos devueltos durante la

venta.

Al finalizar una venta la se muestra un registro de historial donde se muestra el

cliente, fecha y hora, el toral de venta y el método de pago; durante esto la

aplicación manda a imprimir un ticket con los datos de la venta.


3.5.1.4 Estado de cuenta

A este proceso solo podremos acceder desde la ventana de clientes debido a

que solo algunos cuentan con una cuenta a crédito.

Este proceso es el abono a las cuentas a crédito, la ventana siguiente nos

muestra el saldo a pagar y el historial de movimientos que son las ventas

realizada a crédito, al realizar un abono a ala cuenta este se implementara

reduciendo la por abonos a las ventas mas viejas en existencia hasta saldarla

venta y hace reduciendo el estado de cuenta, se pueden realizar los abonos que

quiera el cliente de las cantidades que quieran mientras salde su cuenta

pendiente.

3.5.1.5 Descargas

Este es uno de los procesos sencillo a la vista, pero complicados internamente

es una opción que se implemento en la aplicación debido a que en algunas

ocasiones cuando se inicia el día en la aplicación los moderadores del servidor

no han actualizado algunos datos como Clientes, precios, obsequios o productos

por lo tanto se descargan incompletos los datos necesarios para el día laborar.

Esto causa problemas con las ventas, esto se soluciono con el proceso de

descargas independientes de estos datos cuando surgen estos tipos de

problemas el vendedor notifica al moderador de que hacen falta datos para que

los actualicen y una vez actualizados los datos en el servidor el vendedor podrá

descargar los datos faltantes sin tener que volver regresar a la empresa y sin

perder los procesos de ventas ya realizados y procesados.

3.5.1.6 Pedidos de ruta

Este proceso con se realiza en una de las opciones del menú lateral, esta

enfocado para cuando el vendedor se queda sin productos durante el día para

esto el se realiza el pedido de la ruta que selecciona desde un dialog de

productos los productos que le hacen falta para un revastecimieto al almacén al

realizar el pedido sele envía una petición al almacén y almacén manda otro

vehículo para revastecer al vendedor en su ruta para que no tenga que volver a

la empresa y ahorrar ese tiempo de regreso.


3.5.1.7 Cierre de día

El proceso de cierre de día se lleva a cabo al finalizar la ruta y el día laboral, este

se encarga de mandar toda la información de las ventas, devoluciones o abonos

que allá realizado el vendedor durante su día al servidor principal, en la

aplicación se muestra un resumen con las cantidades de ventas, abonos y

devoluciones realizados durante el día para que el vendedor no tenga que

contarlas o llevar un historia, la aplicación lo hace por el porque es lo que

buscamos mejorar el proceso, después de eso nos mostrara una ventana con un

formulario que el vendedor debe completar el formulario son datos sobre el día

como gastas que realizo , kilometraje recorrido , gasolina gastada y etc.

Al momento de finalizar esta encuesta todos los datos realizados por el vendedor

se mandarán al servidor mediante un JSON para tener solo una inserción al día

y poder identificar si surge un error al intentar subir los datos al servidor,

Con esto el proceso del vendedor y de la aplicación termina su día.


3.6 RESULTADOS

Los resultados sobresalientes de la implementación de la aplicación son a los

vendedores les gusto mucho la aplicación por el motivo que no seles tuvo que

dar un curso del funcionamiento ellos mismos fueron probándola y aprendiéndola

a utilizar lo cual era uno de los aspectos a conseguir en el desarrollo, también se

logro mejorar el proceso de venta debido a que se realiza un 50% mas rápido y

practico que en la aplicación anterior que ya existía.

3.6.1 Conclusiones

En conclusión, el proyecto fue realizado a tiempo y forma, cumpliendo con los

puntos y expectativas que se habían acordado en el acuerdo de desarrollo, la

aplicación ya paso por las pruebas de testeo y esta siendo probada en el

departamento de productividad como ultimo filtro para poder mandarla a

productivo, la aplicación tomo las mejores partes de la aplicación anterior y las

reutilizo y mejoro aun mas. Cumpliendo con su objetivo para la empresa de

Tostadas Jhony.

El equipo de trabajo junto con el que desarrolle la aplicación es muy competente

y cumplido con todas nuestras tareas. Demostrando que los conocimientos

adquiridos en la carrera sobre el trabajo en equipo e individual sirvieron como

base para formar un equipo de trabajo ya en el área laboral, al igual que el

conocimiento sobre el tema de desarrollo Android para lograr cumplir con las

actividades que senos otorgaban durante las estancias.

3.7 REFERENCIAS BIBLIOGRÁFICAS

Google. (11 de Nov de 2020). Android Developers. Obtenido de https://developer.android.com/studio

Hackingtosh. (11 de Nov de 2020). Hackingtosh. Obtenido de Hackingtosh: https://hackintosh.com/

IT, E. (11 de Nov de 2020). Escuela IT. Obtenido de Escuela IT: https://escuela.it/materias/desarrollo-nativo#:~:text=Desarrollo%20nativo%20es%20aquel%20en,realiza%20usando%20Java%20como%20lenguaje.

Native, R. (11 de Nov de 2020). React Native. Obtenido de https://reactnative.dev/

NorthWare. (11 de Nov de 2020). NorthWare. Obtenido de https://www.northware.mx/2017/09/12/desarrollo-de-aplicaciones-moviles-hibridas/#:~:text=Por%20otro%20lado%2C%20las%20aplicaciones,h%C3%ADbridos%20contra%20desarrollos%20web%20m%C3%B3vil.

Technopedia. (9 de 9 de 2012). Technopedia. Obtenido de https://www.techopedia.com/definition/19709/hackintosh

Pizarro, N. (2020). Beneficios de las aplicaciones móviles para las empresas | IDA Chile. Retrieved 26 November 2020, from https://blog.ida.cl/estrategia-digital/beneficios-aplicaciones-moviles-empresas/ Aplicación móvil - Ventajas y desventajas. (2020). Retrieved 26 November 2020, from https://blog.agendize.com/es-mx/aplicacion-movil-ventajas-y-desventajas

Aplicación móvil. (2020). Retrieved 26 November 2020, from

https://es.wikipedia.org/wiki/Aplicaci%C3%B3n_m%C3%B3vil

SEAS, E., & SEAS, E. (2020). Conoce el lenguaje de programación Java | Blog SEAS. Retrieved 26 November 2020, from https://www.seas.es/blog/informatica/conoce-el-

lenguaje-de-programacion-java/

XML Tutorial. (2020). Retrieved 26 November 2020, from

https://www.w3schools.com/xml/

(2020). Retrieved 27 November 2020, from https://www.redhat.com/es/topics/api/what-

are-application-programming-interfaces

¿Qué es XML y para qué sirve este lenguaje de marcado?. (2020). Retrieved 27 November 2020, from https://rockcontent.com/es/blog/que-es-xml/

JSON. (2020). Retrieved 27 November 2020, from https://www.json.org/json-es.html

Material Design. (2020). Retrieved 27 November 2020, from https://material.io/design

SQLite: La Base de Datos Embebida. (2020). Retrieved 27 November 2020, from

https://sg.com.mx/revista/17/sqlite-la-base-datos-embebida

Java Software | Oracle. (2020). Retrieved 27 November 2020, from

https://www.oracle.com/java/

Releases, G., Features, G., Plugins, C., Kotlin, G., Gradle, M., Resources, M., & Enterprise, G. (2020). Gradle Build Tool. Retrieved 27 November 2020, from https://gradle.org/

“diseño y desarrollo de aplicación de punto de venta jhony”

Documents