Chair Tracker Document Ac I On
Chair Tracker Document Ac I On
Chair Tracker Document Ac I On
2
Índice
Índice ......................................................................................... 3
Índice de figuras ....................................................................... 7
Índice de tablas ......................................................................10
Resumen ...................................................................................... 11
Abstract ........................................................................................ 12
Bloque 1: Introducción .................................................................. 13
1.1 Contexto ...........................................................................14
1.1.1 Estado del arte ...................................................15
1.2 Análisis de mercado ........................................................18
Análisis funcional........................................................18
Público objetivo ...........................................................19
Análisis formal ............................................................20
Conclusiones ...............................................................21
1.3 Glosario de términos .......................................................22
Bloque 2: Análisis ......................................................................... 24
2.1 Objetivos ...........................................................................25
2.2 Mapa de historias de usuario .........................................26
2.3 Catálogo de requisitos ....................................................28
2.3.1 Generales ...........................................................28
2.3.2 De información ..................................................29
2.3.3 Funcionales ........................................................30
2.3.4 No funcionales ...................................................38
2.3.5 Reglas de negocio .............................................40
2.4 Riesgos ..................................................................41
Bloque 3: Planificación ................................................................. 43
3.1 Alcance del proyecto .......................................................44
3.2 Fases del proyecto ...........................................................45
3.2.1 Fase 0: Inicio del proyecto ................................45
3.2.2 Fase 1: Planificación del proyecto ...................46
3.2.3 Fase 2: Diseño ...................................................47
3.2.4 Fase 3: Estudio de mercado .............................47
3
3.2.5 Fase 4: Desarrollo ..............................................48
3.2.6 Fase 5: Prueba y test .........................................49
3.2.7 Fase 6: Cierre del proyecto ...............................50
3.2.8 Documentación .................................................50
3.3 Hitos del proyecto ............................................................50
3.3.1 Hito 1: Planificación del proyecto ....................50
3.3.2 Hito 2: Diseño de documentación y Hardware50
3.3.3 Hito 3: Diseño Software ....................................51
3.3.4 Hito 4: Estudio de mercado y revisión de la
documentación ...........................................................51
3.3.5 Hito 5: Desarrollo del Hardware .......................51
3.3.6 Hito 6: Desarrollo de la aplicación ...................52
3.3.7 Hito 7: Pruebas ..................................................52
3.3.8 Hito 8: Cierre del proyecto ................................52
3.4 Calendario de entregables ..............................................52
3.5 Diagrama de Gantt ...........................................................53
3.6 Equipo planteado .............................................................62
3.7 Presupuesto del proyecto ...............................................63
Bloque 4: Análisis tecnológico ...................................................... 66
4.1 Herramientas utilizadas ..................................................67
4.1.1 Planificación ......................................................67
4.1.2 Diseño.................................................................67
4.1.3 Base de datos ....................................................68
4.1.4 API ......................................................................68
4.1.5 Cliente.................................................................70
4.1.6 Boceto ................................................................70
4.1.7 App......................................................................71
4.1.8 PCB .....................................................................72
4.1.9 Carcasa ..............................................................73
4.1.10 Control de versiones .......................................73
4.2 Lenguajes y plataformas .................................................74
4.2.1 SQL .....................................................................74
4.2.2 C ..........................................................................74
4
4.2.3 Java ....................................................................75
4.2.4 TypeScript ..........................................................75
4.2.5 React Native .......................................................76
Bloque 5: Diseño e Implementación ............................................. 77
5.1 Software............................................................................78
5.1.1 Diseño arquitectura empleada .........................78
5.1.2 Base de datos ....................................................79
5.1.3 Verticles .............................................................80
5.1.4 API ......................................................................80
Métodos GET ...................................................81
Métodos PUT ...................................................86
Métodos POST .................................................87
Métodos DELETE .............................................88
5.1.6 MQTT ..................................................................89
Servidor ............................................................89
Cliente ESP8266 ..............................................89
5.1.7 Cliente.................................................................90
Actuadores .......................................................90
Gestión alarmas...............................................90
Gestión llamadas .............................................91
5.1.8 Aplicación...........................................................92
Mockups de las pantallas de la app...............92
Estructura de la aplicación .............................97
Estructura de archivos .....................................97
Estructura de navegación ............................. 100
Aspectos destacables de implementación 101
Librerías utilizadas ....................................... 107
5.1.9 Cambios introducidos .................................... 108
Base de datos ............................................... 108
API.................................................................. 109
Métodos introducidos en la API .................. 110
Diseño ............................................................ 111
5
5.2 Hardware ....................................................................... 118
5.2.1 Fases del desarrollo del circuito ................... 118
Prototipo en fase inicial de desarrollo ........ 118
Prototipo en la segunda iteración de
desarrollo ...................................................... 120
Prototipo en la tercera iteración de desarrollo
........................................................................ 127
5.2.3 PCB .................................................................. 128
5.2.4 Carcasa ........................................................... 133
5.2.5 Sistema final ................................................... 135
Bloque 6: Pruebas ...................................................................... 140
6.1 Pruebas .......................................................................... 141
6.1.1 Pruebas del hardware .................................... 141
6.1.2 Pruebas del software ..................................... 143
Bloque 7: Cierre ......................................................................... 144
7.1 Simulación de implementación en el mercado .......... 145
7.2 Proyectos futuros ......................................................... 146
7.3 Conclusiones ................................................................. 147
Bibliografía ................................................................................. 149
Anexos ....................................................................................... 155
1. Seguimiento temporal del proyecto .............................. 156
2. Manual de usuario........................................................... 161
3. Actas de reuniones con el tutor ..................................... 168
6
Índice de figuras
7
Figura 34. Imágenes de los primeros mock-ups de la aplicación
................................................................................................. 96
Figura 35. Estructura de carpetas referentes a componentes ... 97
Figura 36. Estructura de carpetas referentes a contenedores ... 98
Figura 37. Estructura de archivos de una pantalla .................... 98
Figura 38. Estructura de archivos del navegador ...................... 99
Figura 39. Estructura de carpetas referentes a las conexiones . 99
Figura 40. Flujo de navegación ............................................... 100
Figura 41. Aspecto destacable del código de estilos ............... 101
Figura 42. Aspecto destacable del código de hook de conexión a
la API ...................................................................................... 102
Figura 43 . Aspecto destacable del código de almacenamiento en
memoria ................................................................................. 103
Figura 44. Aspecto destacable del código mqtt ....................... 104
Figura 45. Aspecto del código destacable del navegador ....... 105
Figura 46. Aspecto del código destacable del uso de librerías 106
Figura 47. Listado de librerías utilizadas ................................. 107
Figura 48. Imágenes finales de la implementación de la app .. 117
Figura 49. Imágenes del prototipo inicial ................................. 120
Figura 50. Diagrama del transistor de encendido ESP-8266 ... 121
Figura 51. Diagrama de conexionado del dispositivo .............. 122
Figura 52. Imágenes de la segunda iteración del dispositivo... 127
Figura 53. Imágenes de la primera PCB ................................. 128
Figura 54. Esquema del diseño de la primera PCB ................. 129
Figura 55. Imágenes de la primera PCB ................................. 130
Figura 56. Imágenes de la primera PCB impresa .................... 131
Figura 57. Imágenes de la PCB final ....................................... 132
Figura 58. Imágenes del diseño de la carcasa 3D................... 134
Figura 59. Imagen comparativa entre las tres iteraciones de la
carcasa ................................................................................... 135
Figura 60. Ensamblado de la PCB .......................................... 136
Figura 61. Imágenes del dispositivo final ................................ 139
Figura 62. Pruebas de voltaje y amperaje ............................... 142
Figura 63. Imágenes del dispositivo final ................................ 157
Figura 64. Desviaciones en la planificación I........................... 158
Figura 65. Desviaciones en la planificación II.......................... 159
Figura 66. Desviaciones en la planificación III......................... 160
8
Figura 67. Configuración del AP del dispositivo ...................... 161
Figura 68. Configuración de credenciales del dispositivo ........ 162
Figura 69. Welcome de la aplicación....................................... 163
Figura 70. Sección de alarmas de la aplicación ...................... 164
Figura 71. Sección de contactos de la aplicación .................... 165
Figura 72. Sección de estadísticas de la aplicación ................ 166
Figura 73. Sección de perfil de la aplicación ........................... 167
Figura 74. Sección de términos y condiciones de la aplicación167
9
Índice de tablas
10
Resumen
En este proyecto se presenta un sistema completo,
combinando hardware y software, por el que se le ofrece
al usuario un dispositivo con sensores y actuadores que
combinados con su aplicación móvil (disponible en
Android e iOS) permitirán diversas funcionalidades
relativas a la higiene postural.
11
Abstract
The aim of this project is to present a complete
system, combining software and hardware, that offers the
user a device with embedded sensors and actuators,
together with a mobile app (available at Android and iOS).
In this manner, we enable the user to use several features
related to postural hygiene.
12
Bloque 1:
Introducción
13
1.1 Contexto
Cada vez son más las personas que pasan gran parte
de su tiempo sentados frente al ordenador ya sea por
trabajo u ocio.
14
1.1.1 Estado del arte
Actualmente, existen varias propuestas que intentan
abordar los mismos objetivos que se plantean en este
proyecto.
15
Sitting Time Tracker es un prototipo de un dispositivo
físico capaz de registrar el tiempo que se pasa frente al
ordenador. Es una alternativa de código abierto, donde se
explica tanto el montaje como el funcionamiento del
código implementado en la placa. De cara a la creación de
un producto, está mucho más alejado de la propuesta
que se intenta alcanzar con nuestro proyecto, pues le
faltan bastante de las funciones que queremos
implementar. Esto es debido a que es un sistema
bastante simple y carece de base de datos, aplicación
para el usuario, dispositivo físico final, etc. Todas estas
características son las que hacen que nuestro sistema sea
amigable para cualquier tipo de usuario, en
contraposición con este prototipo que requiere de
conocimientos técnicos para poder ponerlo en
funcionamiento.
16
acarrear el impacto contrario del buscado por nuestra
propuesta.
17
1.2 Análisis de mercado
En este apartado se presenta un análisis del mercado
donde se detallarán las funcionalidades del dispositivo
presentado junto con el posible mercado al que se podrá
enfrentar y los factores de forma que presenta su actual
competencia.
Análisis funcional
Las funcionalidades que presenta nuestro sistema
son las siguientes:
18
forma sonora de que ha llegado el fin de su
ciclo de trabajo o descanso y deberá descansar
o reanudar su actividad, respectivamente.
• Sistema de llamadas: para evitar posibles
distracciones, ya sea en un entorno laboral o de
ocio, el usuario recibirá notificaciones gracias a
otro de los actuadores del dispositivo físico,
que vibrará avisándole de que deberá
consultar el mensaje recibido de forma
orgánica y completamente integrada, sin
necesidad de acudir a aplicaciones externas
que interrumpan el flujo en el que se
encuentren.
• Precisión: el sistema ofrece una gran precisión
respecto a la detección del usuario gracias a su
sensorización lo cual facilita el uso y no implica
al usuario en el proceso de inicio o pausa del
contador del ciclo en el cual se encuentre.
• Mejora de la higiene postural: como
consecuencia de todas las funcionalidades
anteriores conseguimos fomentar la higiene
postural mediante el descanso activo del
usuario.
Público objetivo
Nuestro público objetivo es diverso debido a la
versatilidad de nuestro sistema dentro de diferentes
ámbitos de aplicación que comparten un problema
común, la gestión del tiempo. Por ello se ha decidido
realizar la siguiente división en bloques:
19
encuentre frente al ordenador o herramienta
de trabajo. Gracias a esto podrán llevar un
conteo de las horas y poder realizar estudios
asociados a la productividad.
Análisis formal
Como forma de posibles soluciones a la problemática
dada encontramos en el mercado los siguientes tipos:
20
existen diversos tipos como sensores
colocados en el pecho.
• Aplicaciones: el producto no depende de un
dispositivo físico, sino que funciona instalando
una aplicación en el smartphone del usuario.
Esto implica limitaciones en el desarrollo pues
no todos los móviles presentan el mismo tipo
de sonorización o tienen la adecuada para
llevar a cabo la función deseada de forma
eficiente y hay que realizar aproximaciones.
Existen diversos sistemas operativos, lo cual
decide en gran parte su desarrollo.
• Gadgets como objetos independientes: este
tipo de producto no dependen de ningún tipo
de adaptador para su utilización. Algunos de
ellos disponen de conexiones con aplicaciones
móviles, redes WIFI o USB. Una de sus
características es que necesitan de un método
de recargar al incorporar una batería, pues,
aunque el sistema sea inalámbrico, necesitara
un suministrador eléctrico en ocasiones.
Conclusiones
Una vez estudiados los tipos de forma, público
objetivo, y funcionalidades podemos concluir con que
gracias al factor de forma seleccionado podemos proveer
al usuario con un sistema completo que cumple con todas
las funcionalidades descritas y que como factor
diferenciador respecto a sus competidores presenta una
21
gran precisión en la detección del usuario, permitiendo de
esta forma una integración casi transparente y sin
necesidad de atención pues podrá establecer ciclos de
trabajo y descanso en un horario y días de la semana
determinados mientras se actualizan automáticamente
sus estadísticas sin importar la plataforma que utilice en
lo que respecta a su dispositivo móvil, gracias a su
desarrollo multiplataforma en React Native. Esto se
puede ver en mayor detalle en la tabla comparativa
presentada en el estado del arte.
22
• Ciclo trabajo/descanso: número de veces
que se ha completado un tiempo de trabajo
o tiempo de descanso.
• Remitente: usuario que realiza la llamada.
• Destinatario: usuario que recibe la llamada.
• Registro: guardado de información de
alarmas/llamadas para la posterior
generación de estadísticas en la app.
• Estadísticas: reporte de las horas de trabajo
(sentado) y descanso (levantado) clasificadas
por alarma.
23
Bloque 2: Análisis
24
2.1 Objetivos
Entre los objetivos principales del proyecto se
encuentra mejorar la higiene postural de nuestros
usuarios ayudándonos de ciclos de trabajo, donde
permanecerá sentado y ciclos de descanso en lo que se
deberá de levantar.
25
2.2 Mapa de historias de usuario
A continuación, se representa un resumen
organizativo del catálogo de requisitos completo a modo
de mapa de historias de usuario.
26
Figura 1. Mapa historias de usuario
27
2.3 Catálogo de requisitos
2.3.1 Generales
28
2.3.2 De información
29
RI-04: Registros.
Como administrador.
Quiero tener información sobre el tipo de registro que
se va a almacenar (alarma o llamada), junto con el oid
correspondiente en cada caso, la fecha, el tiempo total
de trabajo, el tiempo total de descanso y en si se tratara
de una llamada el Hash Mac del remitente y
destinatario.
Para poder registrar las llamadas y poder llevar un
control sobre el tiempo total de trabajo y descanso de
los usuarios.
2.3.3 Funcionales
30
RF-04: Realización de llamadas.
Como usuario.
Quiero poder realizar llamadas a otra placa.
Para poder enviar avisos a mis compañeros de trabajo
de forma sencilla.
RF-07: CRUD.
Como usuario.
Quiero disponer en la Api Rest de un CRUD de las tablas
de la BBDD.
Para ser capaces de gestionar la información de forma
más sencilla y permitir mejoras de funcionalidad en el
sistema.
31
RF-09: Integridad mediante tuberías.
Como usuario.
Quiero intercambiar mensajes entre los vértices.
Para comunicar información entre los distintos
procesos del sistema.
32
RF-14: Conexión placa con Api Rest.
Como usuario.
Quiero poder conectar de forma sencilla el dispositivo
con la Api Rest.
Para poder garantizar el correcto funcionamiento del
sistema de cara a la implementación final.
33
RF-19: Formateo horas.
Como administrador del sistema.
Quiero ser capaz de combinar los formatos de las horas
de los servidores NTP con los usados por la BBDD y la
Api Rest.
Para poder garantizar la integridad de las horas en el
sistema.
34
RF-24: Detección de actividad del trabajador.
Como administrador del sistema.
Quiero reconocer si un usuario se encuentra sentado o
levantado de la silla.
Para gestionar realmente los ciclos de trabajo/descanso
que realiza.
RF-28: Login.
Como administrador del sistema.
Quiero tener un login en la aplicación.
Para poder identificar o registrar a un usuario.
35
RF-29: Página principal.
Como usuario.
Quiero tener una página principal en la aplicación.
Para permitir acceder de forma rápida a las
funcionalidades de esta.
36
RF-34: Conexión App con Api Rest.
Como administrador del sistema.
Quiero tener conexión de forma sencilla entre la
aplicación y la Api Rest.
Para poder garantizar el correcto funcionamiento del
sistema.
37
2.3.4 No funcionales
38
RNF-05 Seguridad de usuarios.
Como usuario y administrador.
Quiero que nuestras credenciales estén a buen recaudo
en todo momento.
Para evitar suplantaciones de identidad y así impedir
que sujetos ajenos al sistema accedan a él.
39
2.3.5 Reglas de negocio
40
2.4 Riesgos
A continuación, se muestra la matriz de riesgos donde
se describe el posible problema que se puede generar
junto con la probabilidad de que este ocurra y el impacto
que podría llegar a tener, por ello, se presenta un plan de
contingencia.
41
Mayor dificultad de Alto Baja Introducir
la esperada en el temporalmente
desarrollo del mayores esfuerzos
software. temporales en la
planificación
correspondiente al
desarrollo de la
aplicación.
Pruebas de Medio Media Se deberá
funcionamiento replanificar la
fallidas. actividad para
localizar el error y
solventarlo.
Rotura del Medio Baja Será necesaria una
prototipo hardware. replanificación de la
fase del proyecto
para avanzar en él
mientras se
adquieren de nuevo
los componentes
para el montaje del
prototipo.
Dificultad para Bajo Baja No es necesario
encontrar stock de ningún plan de
los componentes contingencia.
hardware
necesarios.
42
Bloque 3:
Planificación
43
3.1 Alcance del proyecto
Atendiendo a los requisitos anteriores podemos
plantear un alcance, que establecerá el fin de la
organización para este proyecto.
44
3.2 Fases del proyecto
La planificación temporal se ha decidido repartir a
través de fases. Estas fases están divididas mediante
actividades, que a su vez engloban diversas tareas.
45
concepto físico que se deseará llegar a implementar para
el sistema final.
• A0.5 – Cliente: desarrollo e implementación del
firmware de la placa para poder llevar a cabo la
funcionalidad básica de nuestro sistema.
46
3.2.3 Fase 2: Diseño
La segunda fase corresponde al diseño general de los
elementos que emplearemos a lo largo del desarrollo del
proyecto. Se divide en las siguientes actividades:
47
dirigirá el sistema final, teniendo en cuenta todos los tipos
de mercados posibles.
• A3.3 – Valor diferencial del producto: comparativa
entre los posibles competidores y nuestro sistema
destacando cada una de las características y diferencias
junto con la aportación realizada al mercado por parte de
nuestro dispositivo.
48
o T4.2.2: Configuración del entorno de
trabajo.
o T4.2.3: Desarrollo de las pantallas.
o T4.2.4: Desarrollo de la navegación.
o T4.2.5: Desarrollo de componentes.
o T4.2.6: Conexión con API Rest.
o T4.2.7: Definición del tipado.
o T4.2.8: Desarrollo e implementación de
la lógica.
o T4.2.9: Mejoras de código.
49
3.2.7 Fase 6: Cierre del proyecto
Se valorará el cómputo general del proyecto, así como
posibles mejoras de cara al futuro y una valoración final
del desarrollo del proyecto.
3.2.8 Documentación
Durante las fases citadas anteriormente se realizará
la documentación pertinente de forma concurrente
según la finalización de los hitos, descritos en el siguiente
punto.
50
Las actividades que forman parte de este hito son:
A2.1, A2.2, A2.3 (T2.3.1, T2.3.2, T2.3.3). A2.4 (T2.4.1, T2.4.2,
T2.4.3, T2.4.4)
51
3.3.6 Hito 6: Desarrollo de la aplicación
El siguiente hito tratará del fin del desarrollo de la
aplicación. También durante este hito se crearán
iteraciones del código como medio para recibir feedback
durante el proceso de desarrollo, en lugar de evaluar todo
el software una vez completo.
52
Las fechas propuestas para realizar estas revisiones
son las siguientes:
• 1 de noviembre de 2021
• 29 de enero de 2022
• 27 de febrero de 2022
• 15 de abril de 2022
• 30 de mayo de 2022
• 10 de junio de 2022
53
Figura 2. Visión general fases planificación
54
Figura 3. Desglose de la planificación I
55
Figura 4. Desglose de la planificación II
56
Figura 5. Fase 0 de la planificación
57
Figura 6. Fase 1 y 2 de la planificación
58
Figura 7. Fase 3 de la planificación
59
Figura 8. Fase 4 de la planificación
60
Figura 9. Fase 5, 6 y Documentación de la planificación
61
3.6 Equipo planteado
El equipo planteado queda definido mediante el
siguiente diagrama. Constará de 5 departamentos
principales con 7 trabajadores en total. Aunque esta
división se trata de una estimación de los recursos
humanos para la realización del proyecto, realmente
ambos integrantes de este TFG nos hemos repartido las
tareas equitativamente a lo largo de las fases, para poder
así, adquirir conocimiento en cada una de las ramas que
se tratan en la elaboración del proyecto, como lo son:
diseño, desarrollo software, desarrollo hardware,
marketing, etc.
62
coste del proyecto, viabilidad, rentabilidad, ganancias,
etc., tanto antes del desarrollo como en la posterior
simulación de la implementación del producto en el
mercado.
63
Batería litio Samsung ICR 18650 x01 21.44€
26J (x4)
Motor vibrador ADN1903071 x02 15.98€
Batería LIPO 2400mA x01 4.73€
TP4056 USB-C x02 0.68€
Kit de conectores DuPont y pines x01 3.97€
macho/hembra
Cepillo de desoldaduras x01 1.33€
Alambre de soldadura x01 5.85€
Soldador TS100 x02 65.98€
PCB x10 9.37€
Carcasa x02 8€
Total: 185.23€
64
Gestión de proyecto
Cargo Nº horas €/hora Coste
Junior Project Manager 300 10.41 3123€
Diseñadores
Cargo Nº horas €/hora Coste
Junior Designer 30 6.50 195€
Desarrolladores Software
Cargo Nº horas €/hora Coste
Junior React Native Developer (1) 75 7.00 525€
Junior React Native Developer (2) 75 7.00 525€
Junior Back-end Developer (1) 50 6.60 330€
Desarrolladores Hardware
Cargo Nº horas €/hora Coste
Junior Hardware Developer 50 7.20 360€
Expertos en marketing
Cargo Nº horas €/hora Coste
Junior marketing Agent 20 6.60 330€
65
Bloque 4: Análisis
tecnológico
66
4.1 Herramientas utilizadas
Las herramientas utilizadas a lo largo de la ejecución
del proyecto han sido clasificadas y explicadas en relación
con su ámbito de uso, de la siguiente forma:
4.1.1 Planificación
El diagrama de Gantt ha sido generado a través de la
herramienta Tom’s Planner.
67
“Adobe Illustrator es un editor de gráficos vectoriales
sirve para editar entre otras cosas. Es desarrollado y
comercializado por Adobe Systems y constituye su primer
programa oficial de su tipo en ser lanzado por esta
compañía definiendo en cierta manera el lenguaje gráfico
contemporáneo mediante el dibujo vectorial.” [2]
4.1.4 API
Atendiendo al desarrollo de la API Rest han sido
necesarias las siguientes herramientas: Eclipse 2020-12,
Postman y MQTT Explorer.
68
“Eclipse es una plataforma de software compuesto
por un conjunto de herramientas de programación de
código abierto multiplataforma para desarrollar lo que el
proyecto llama "Aplicaciones de Cliente Enriquecido",
opuesto a las aplicaciones "Cliente-liviano" basadas en
navegadores.” [12]
69
4.1.5 Cliente
Para el firmware del ESP8266 se ha utilizado Visual
Studio Code con la extensión de Platform.io.
“Visual Studio Code es un editor de código fuente
ligero pero poderoso que funciona en cualquier sistema
operativo. Incluye soporte para JavaScript, TypeScript y
Node.js y tiene un rico ecosistema de extensiones para
otros lenguajes.” [38]
4.1.6 Boceto
Para la realización de los bocetos de la aplicación
móvil se ha utilizado Marvel App.
70
aprendizaje y tampoco se requiere de ningún software
adicional.” [21].
4.1.7 App
Se ha utilizado Xcode, Android Studio y Visual Studio
Code para el desarrollo completo de la aplicación móvil
multiplataforma. Dentro de Visual Studio Code ha sido
necesario el uso de ESLint para poder generar un código
final lo más profesionalizado posible.
71
aumentan tu productividad cuando desarrollas apps para
Android.” [18]
4.1.8 PCB
Usamos KiCad EDA para el diseño completo de la PCB.
72
4.1.9 Carcasa
Para la elaboración del diseño 3D de la carcasa de
nuestro sistema utilizaremos Fusion 360.
73
4.2 Lenguajes y plataformas
Para el desarrollo tecnológico de este proyecto, se
han utilizado 4 lenguajes de programación, que son los
siguientes:
4.2.1 SQL
El lenguaje utilizado para la elaboración de nuestra
base de datos relacional ha sido SQL.
4.2.2 C
El firmware que lleva incorporado el ESP8266 ha sido
desarrollado bajo el lenguaje de programación C.
“C es un lenguaje de programación de propósito
general originalmente desarrollado por Dennis Ritchie
entre 1969 y 1972 en los Laboratorios Bell, como
evolución del anterior lenguaje B, a su vez basado en
BCPL.Al igual que B, es un lenguaje orientado a la
implementación de sistemas operativos, concretamente
Unix.” [6]
74
4.2.3 Java
El desarrollo completo de la API Rest de nuestro
sistema está realizado en Java.
4.2.4 TypeScript
La aplicación móvil multiplataforma combina dos
lenguajes de programación a lo largo de su desarrollo,
uno de ellos es TypeScript.
75
4.2.5 React Native
El otro lenguaje de programación en el que se basa
nuestra aplicación corresponde con React Native.
76
Bloque 5: Diseño
e Implementación
77
5.1 Software
En este apartado, explicaremos tanto la fase de
diseño como el resultado del desarrollo de toda la parte
software de nuestro sistema. En el directorio del proyecto
se ofrecerá todo el código implementado para poder
tener un nivel mayor de detalle sobre la codificación de
las decisiones tomadas a lo largo de las diferentes fases.
78
temporales para más tarde, al finalizar la alarma,
actualizar los datos en la BDD a través de la API REST del
server con el método editarAlarma().
79
Figura 33. Esquema de la base de datos
5.1.3 Verticles
Hemos tomado la decisión de desplegar tres verticles.
Uno dedicado al servidor HTTP, otro a la conexión a la
BBDD y un último dedicado a ser cliente MQTT de nuestro
broker Mosquitto.
Estos tres verticles se comunicarán a través de paso
de mensajes mediante el bus de eventos.
5.1.4 API
La API se ejecuta en el servidor y cuenta con los
métodos necesarios para la total comunicación con la
BBDD con métodos GET, PUT, POST, Delete:
80
Métodos GET
Tenemos métodos de obtención de los datos de
cada tabla en su totalidad, además, hemos implementado
otros métodos para obtener datos relacionados con el
usuario que nos serán de utilidad a la hora de realizar
peticiones desde el cliente.
• obtenerUsuarios
o Routing:
/api/usuarios/
o Entrada: json vacío
o Salida:
"1":{
"hash_mac": "valor",
"nif": " valor",
"contrasena": " valor ",
"last_login": valor,
"nombre": " valor ",
"apellidos": " valor ",
"rol": " valor ",
"nif_jefe": valor
},
• obtenerAlarma
o Routing:
/api/alarmas/
o Entrada: json vacío
o Salida:
1:{
"oid_alarma": 1,
"dias": " valor ",
"t_inicio": " valor ",
"t_fin": "valor",
"t_trabajo": valor,
"t_descanso": valor,
"ciclo_trabajo": valor,
"ciclo_descanso": valor,
"hash_mac_fk": "valor"
},
81
• obtenerAlarmasUsuario
o Routing:
/api/alarmas/hash_mac
o Entrada:
{
"hash_mac_fk": " mac del usuario a
observar "
}
o Salida:
“1”:{
"oid_alarma": 1,
"dias": " valor ",
"t_inicio": " valor ",
"t_fin": "valor",
"t_trabajo": valor,
"t_descanso": valor,
"ciclo_trabajo": valor,
"ciclo_descanso": valor,
"hash_mac_fk": "valor"
},
• obtenerLlamadas
o Routing: json vacío
/api/llamadas/
o Entrada: json vacío
o Salida:
“1”:{
"oid_llamada": 1,
"estado": "valor",
"desde": " valor ",
"descripcion": " valor”,
"remitente_hash_mac_fk": " valor ",
"destinatario_hash_mac_fk": " valor "
},
• obtenerLlamadasEnviadasUsuario
o Routing:
/api/llamadas/enviadas/hash_mac
o Entrada:
{
"remitente_hash_mac_fk": " mac del
usuario a observar "
}
o Salida:
“1”:{
82
"oid_llamada": 1,
"estado": "valor",
"desde": " valor ",
"descripcion": " valor”,
"remitente_hash_mac_fk": " mac del
usuario a observar ",
"destinatario_hash_mac_fk": " valor "
}
• obtenerLlamadasRecibidasUsuario
o Routing:
/api/llamadas/recibidas/hash_mac
o Entrada:
{
" destinatario_hash_mac_fk": " mac del
usuario a observar "
}
o Salida:
“1”:{
"oid_llamada": 1,
"estado": "valor",
"desde": " valor ",
"descripcion": " valor”,
"remitente_hash_mac_fk": " valor "
"destinatario_hash_mac_fk": " mac del
usuario a observar "
}
• obtenerRegistros
o Routing: json vacío
/api/registros
o Entrada: json vacío
o Salida:
“1”:{"oid_reg": 1,
"tipo": "valor",
"fecha": "2021-05-23T21:36:52",
"trabajo": 2910,
"descanso": 980,
"oid_llamada_fk": null,
"oid_alarma_fk": 1,
"hash_mac_fk": "mac123",
"remitente_hash_mac_fk": null,
"destinatario_hash_mac_fk": null
}
83
• obtenerRegistrosLlamadas
o Routing: json vacío
/api/registros/llamadas
o Entrada: json vacío
o Salida: "4": {
"oid_reg": 4,
"tipo": "valor",
"fecha": "valor",
"trabajo": null,
"descanso": null,
"oid_llamada_fk": 1,
"oid_alarma_fk": null,
"hash_mac_fk": null,
"remitente_hash_mac_fk": "valor",
"destinatario_hash_mac_fk": "valor"
}
• obtenerRegistrosAlarmas
o Routing: json vacío
/api/registros/alarmas
o Entrada: json vacío
o Salida: "1": {
"oid_reg": 1,
"tipo": "A",
"fecha": "2021-05-23T21:36:52",
"trabajo": 2910,
"descanso": 980,
"oid_llamada_fk": null,
"oid_alarma_fk": 1,
"hash_mac_fk": "mac123",
"remitente_hash_mac_fk": null,
"destinatario_hash_mac_fk": null
}
• obtenerRegistrosAlarmasUsuario
o Routing:
/api/registros/alarmas/hash_mac
o Entrada: {
"hash_mac_fk": " mac del usuario a
observar "
}
o Salida:
"1": {
"oid_reg": 1,
"tipo": "A",
84
"fecha": "2021-05-23T21:36:52",
"trabajo": 2910,
"descanso": 980,
"oid_llamada_fk": null,
"oid_alarma_fk": 1,
"hash_mac_fk": "mac123",
"remitente_hash_mac_fk": null,
"destinatario_hash_mac_fk": null
}
• obtenerRegistrosLlamadasEnviadas
o Routing:
/api/registros/llamadas/enviadas
/hash_mac
o Entrada: {
"remitente_hash_mac_fk": " mac del
usuario a observar "
}
o Salida: "4": {
"oid_reg": 4,
"tipo": "L",
"fecha": "valor",
"trabajo": null,
"descanso": null,
"oid_llamada_fk": 1,
"oid_alarma_fk": null,
"hash_mac_fk": null,
"remitente_hash_mac_fk": " mac del
usuario a observar ",
"destinatario_hash_mac_fk": "valor
}
• obtenerRegistrosLlamadasRecibidas
o Routing:
/api/registros/llamadas/recibida
s/hash_mac
o Entrada: {
"destinatario_hash_mac_fk": " mac
del usuario a observar "
}
o Salida: "4": {
"oid_reg": 4,
"tipo": "L",
"fecha": "valor",
"trabajo": null,
"descanso": null,
"oid_llamada_fk": 1,
85
"oid_alarma_fk": null,
"hash_mac_fk": null,
"remitente_hash_mac_fk": "valor",
"destinatario_hash_mac_fk": " mac del
usuario a observar”
}
Métodos PUT
También poseemos métodos para la edición de
todas las tablas exceptuando la de registro que será
actualizada automáticamente mediante triggers.
Los métodos son los siguientes:
• editarUsuario
o Routing:
/api/alarmas/editarUsuario
o Entrada: {
"hash_mac": "mac del usuario a
editar",
"nif": "valor",
"contrasena": "valor",
"last_login": valor,
"nombre": "valor",
"apellidos": "valor",
"rol": "valor",
"nif_jefe": valor
}
o Salida: mensaje de confirmación
• editarAlarma
o Routing:
/api/alarmas/editarAlarma
o Entrada: {
"oid_alarma": oid alarma a editar,
"dias": " valor ",
"t_inicio": " valor ",
"t_fin": "valor",
"t_trabajo": valor,
"t_descanso": valor,
"ciclo_trabajo": valor,
"ciclo_descanso": valor,
"hash_mac_fk": "valor"
}
86
o Salida: mensaje de confirmación
• editarLlamada
o Routing:
/api/alarmas/editarLlamada
o Entrada:
{
"oid_llamada": oid llamada a editar,
"estado": "valor",
"desde": " valor ",
"descripcion": " valor”,
"remitente_hash_mac_fk": " valor ",
"destinatario_hash_mac_fk": " valor "
}
o Salida: mensaje de confirmación
Métodos POST
Los métodos para añadir elementos a las tablas
son los siguientes:
• anadirUsuario
o Routing:
/api/usuarios/anadirUsuario
o Entrada: {
"hash_mac": "valor",
"nif": " valor",
"contrasena": " valor ",
"last_login": valor,
"nombre": " valor ",
"apellidos": " valor ",
"rol": " valor ",
"nif_jefe": valor
}
o Salida: mensaje de confirmación
• anadirAlarma
o Routing:
/api/usuarios/anadirAlarma
o Entrada: {
"dias": " valor ",
"t_inicio": " valor ",
"t_fin": "valor",
"t_trabajo": valor,
87
"t_descanso": valor,
"ciclo_trabajo": valor,
"ciclo_descanso": valor,
"hash_mac_fk": "valor"
}
o Salida: mensaje de confirmación
• anadirLlamada
o Routing:
/api/usuarios/anadirLlamada
Entrada: {
"oid_llamada": 1,
"estado": "valor",
"desde": " valor ",
"descripcion": " valor”,
"remitente_hash_mac_fk": " valor ",
"destinatario_hash_mac_fk": " valor "
}
o Salida: mensaje de confirmación
Métodos DELETE
Si en algún momento necesitamos eliminar algún
elemento de la BBDD, usaremos estos métodos (no será
disponible eliminar llamadas ni registros para evitar
malentendidos):
• borrarUsuario
o Routing:
/api/usuarios/borrarUsuario
o Entrada:
{
"hash_mac": "mac del usuario a borrar"
}
o Salida: mensaje de confirmación
• borrarAlarma
o Routing:
/api/usuarios/borrarUsuario
o Entrada:
{
"oid_alarma": 1
}
o Salida: mensaje de confirmación
88
5.1.6 MQTT
Para la implementación del estándar MQTT en
nuestro proyecto hemos hecho uso del broker de
Mosquitto, el cual corre en el puerto 8083 y necesitaría de
identificación.
Servidor
Desde el servidor utilizamos la librería de VERT.X
para actuar como clientes al broker de Mosquitto y poder
publicar mensajes. Estos son:
Cliente ESP8266
Desde el ESP8266 hemos implementado la librería
PubSubClient para actuar como clientes respecto al
broker al igual que hacemos en el servidor, en este caso
estaremos suscritos a las rutas en las cuales publica el
servidor, correspondiendo destinatario_hash_mac y
hash_mac_fk al sha1 que realizamos a nuestra MAC al
conectarnos a la red WIFI. De esta forma únicamente nos
llegarán mensajes asociados a nuestro usuario, evitando
así el recibir mensajes destinados a otros clientes. Según
sean estos realizaremos distintas acciones:
89
• Al recibir una publicación de mensaje bajo la
ruta /destinatario_hash_mac/llamadas/
haremos uso de los actuadores, haciendo
vibrar el dispositivo.
• Al recibir de una publicación de mensaje
bajo la ruta /hash_mac_fk/refresh/
realizaremos una búsqueda de la próxima
alarma más cercana con los datos
actualizados desde el servidor.
5.1.7 Cliente
Actuadores
Nuestro principal actuador se trata de un sensor de
distancia por ultrasonidos, concretamente el HC-SR04,
que gestionamos mediante la librería Ping y que nos
permite saber si el usuario se encuentra sentado o no en
la silla para actuar en consecuencia en el contador que se
explicara a continuación con mayor detalle.
Gestión alarmas
Para la gestión de alarmas nuestro sistema
realizará una búsqueda de la próxima alarma más
cercana en el tiempo y que corresponda al día actual,
tomando como referencia para la hora y fecha los
obtenidos mediante un NTP Client.
90
Esta operación se llevará a cabo no sólo en el setup,
sino también cuando finalice nuestra alarma actual y en
caso de no existir ninguna activa, realizaremos esta
búsqueda cuando recibamos un mensaje MQTT en la ruta
comentada anteriormente.
Gestión llamadas
Para la implementación de llamadas en el cliente
debemos de gestionar la recepción de llamadas puesto
que el envío se realizará en un futuro mediante la interfaz
web.
91
el motor de vibración para notificar al usuario de una
llamada entrante.
5.1.8 Aplicación
Este es una de las actividades que más tiempo han
demandado a lo largo de las fases de diseño y de
desarrollo, puesto que además de cubrir las necesidades
y funciones requeridas por el sistema, se ha debido tener
en cuenta la facilidad de uso por parte de cualquier tipo
de usuario.
92
93
94
95
Figura 34. Imágenes de los primeros mock-ups de la aplicación
96
Estructura de la aplicación
En este apartado se expondrá la estructura que
hemos seguido a lo largo del proyecto de la aplicación.
Explicando brevemente el contenido de cada pantalla,
además de la estructura de carpetas y archivos que
hemos decidido implementar.
Estructura de archivos
En primer lugar, la estructura de archivos del
proyecto se encuentra organizada en diversas
subcarpetas dependiendo de su funcionalidad, son las
siguientes:
• Componentes: se trata de elementos que
pueden ser reutilizados a lo largo de la
aplicación, dotándonos así de modularidad y
aprovechamiento de código, es el caso del
header, iconos, tarjetas o botones.
97
pantallas de autentificación, principales o
modales
98
• Navegador: encontramos los archivos
destinados a la navegación, definiendo el
navigator y los tipos que serán usados junto
con las pantallas. Se utiliza la misma
jerarquía de archivos de los contendores.
99
confidencialidad de estas y la carpeta theme
donde encontramos diferentes apartados en
lo referente al tema de la aplicación como
colores o dimensiones del dispositivo.
Estructura de navegación
En este punto se presenta la estructura de
navegación mediante un grafo.
100
Aspectos destacables de implementación
A continuación, comentaremos los aspectos más
importantes que nos ha permitido otorgar a nuestra
aplicación de una implementación lo más profesional
posible.
101
También hemos sido conscientes de desarrollar
una app lo más optimizada posible. Se ha tratado siempre
de evitar repeticiones de código, ya sea mediante el uso
de componentes (en maquetación) como a través de la
creación de hooks o métodos personalizados
dependiendo de la funcionalidad requerida (en lógica).
102
El modelado de todos estos datos ha sido una parte
fundamental para poder tratarlos correctamente usando
TypeScript, actuando, así como enlace entre los JSON
recibidos por la API y los objetos que se usan a lo largo de
todos los componentes y pantallas.
103
constantemente (creación de alarmas, cumplimiento de
ciclos de trabajo/descanso, realización de llamadas…) por
lo que hemos visto necesario el incluir un refresco
automático mediante suscripciones MQTT de los datos
por cada cambio que sufran estos datos en el back-end.
Además, para que el usuario se cerciore de que sus datos
están siempre actualizados, hemos incorporado también
un refresco manual en las pantallas.
104
Estos modales otorgan fluidez en la experiencia de
usuario, porque en formularios pequeños o menos
importantes, no navegamos a una pantalla distinta para
realizarlos, sino que superponemos este tipo de modales
sobre las pantallas donde se llaman. Al igual que a la hora
de mostrar información menos relevante como los
“Términos y condiciones” o el “Acerca de”, emergen otro
tipo de modales.
105
Figura 46. Aspecto del código destacable del uso de librerías
106
Librerías utilizadas
Hemos usado una gran cantidad de librerías a lo
largo de la aplicación por lo que las enumeraremos
brevemente, mostrando la versión usada y el objetivo de
su uso:
107
Las librerías más relevantes para el desarrollo de la
aplicación han sido: async-storage [26] (para el
almacenamiento de información en caché), picker [28],
datetimepicker [27], formik [15] y yup [20] (para la
realización de formularios y su validación), styled-
components [30] (para la creación de componentes
estilizados sin la necesidad de usar StyleSheet). Y otros
auto descriptivos, pero igual de importantes como
calendar [29], chart-kit [17], mqtt [14] o use-axios-client
[37].
Base de datos
• Tablas:
Los primeros cambios introducidos a las tablas
son referentes a la longitud del hash_mac del
usuario que pasa de 40 caracteres a 10, con el
objetivo de facilitar el registro de este en el
sistema.
En los registros fueron necesarias más
modificaciones, con el fin de mostrar una
información más completa y detallada sobre
los datos almacenos de las llamadas. Se
incluyeron los campos de: remitente_nombre,
destinatario_nombre, desde, descripción. Así
como la eliminación de las referencias a las
claves secundarias, para que los datos se
queden almacenados permanentemente pese
a futuras eliminaciones de alarmas.
108
• Triggers:
Uno de los cambios referentes a los triggers de
la BBDD hace referencia a la clasificación de los
registros de las alarmas por los meses del año.
Esto tiene la finalidad de generar nuevos
registros cada mes para poder así tener
estadísticas más precisas sobre las alarmas.
Tras las pruebas sofware nos percatamos de
un error en el trigger de solapamiento de
alarmas, por lo que se tuvo que adaptar en
distintos aspectos. El primero de ellos, que
permitiese el solapamiento de horas si ninguno
de los días establecidos en la nueva alarma
solapaba a los horarios de las ya creadas. Por
último, que prohibiera la creación de alarmas
con el mismo horario.
Los triggers de creación automática de los
registros de alarmas y llamadas también
fueron modificados para que soportasen los
nuevos datos implementados.
API
Uno de los cambios más necesarios para poder
utilizar los métodos creados en la API fue la adaptación
de estos para que funcionasen a través tanto de
peticiones con cuerpo, como con peticiones por
parámetros. Fue debido a la librería de Axios para React
Native, donde es obligatorio utilizar parámetros para la
utilización de métodos GET.
109
Para mostrar una agenda de contactos coherente con
el entorno de cada usuario, se agregó un método que
filtra la lista de contactos por el hash_mac del usuario.
• existeUsuario
o Routing:
/api/usuarios/existeUsuario
Entrada: {
"nif ": 00000000A,
"contrasena": "valor",
}
o Salida: {
"existe": 0 || 1,
}
• obtenerContactos
o Routing:
/api/usuarios/contactos
Entrada: {
"hash_mac": "valor",
}
o Salida: mensaje de confirmación
110
• obtenerAlarmasUsuarioDia
o Routing:
/api/alarmas/hash_macDia
Entrada: {
"hash_mac_fk": "valor",
"dias": "valor",
}
o Salida: mensaje de confirmación
• obtenerRegistrosAlarmasUsuarioAnyo
o Routing:
/api/registros/alarmas/hash_m
acAnyo
Entrada: {
"hash_mac_fk": "valor",
"anyo": valor,
}
o Salida: mensaje de confirmación
Diseño
El cambio más notorio respecto a los Mockups
planteados fue la elección de una paleta de colores con
más cohesión, además de ayudar a reducir la fatiga visual
al optar por colores más oscuros.
111
Los formularios se han creado más completos que en
los mockups, permitiendo la inclusión de validaciones y
mensajes de erros. También se adaptaron con el objetivo
de estar más integrados con el diseño de la aplicación.
112
113
114
115
116
Figura 48. Imágenes finales de la implementación de la app
117
5.2 Hardware
En este otro apartado, explicaremos tanto la fase de
diseño como el resultado del desarrollo de toda la parte
hardware de nuestro sistema. En el directorio del
proyecto se ofrecerán los archivos fuente implementados
para poder tener un nivel mayor de detalle sobre la
resolución de las decisiones tomadas a lo largo de las
diferentes fases.
118
En iteraciones futuras el sistema será autónomo y
estará alimentado con baterías 18650 que tendrán la
posibilidad de ser recargadas.
119
Figura 49. Imágenes del prototipo inicial
120
alimentación mediante USB. Además, ofrece la
posibilidad de recargar las baterías mediante un USB.
121
Pero esto no supone problema al tratarse de una unidad
de desarrollo y no un producto final de cara al usuario el
cual no tendría la posibilidad de conectarse al serial y
alimentaríamos el microcontrolador mediante el USB, lo
cual le brinda más protecciones al usuario.
122
123
124
125
126
Figura 52. Imágenes de la segunda iteración del dispositivo
127
PCBs que se detallarán a continuación permitieron
reducir el circuito del prototipo a lo siguiente:
5.2.3 PCB
Debemos de tener en cuenta que el diseño se deberá
realizar utilizando una única cara y que el tamaño de
cable que utilizaremos corresponde con el recomendado
para señales digitales, 0,4064 mm pues todas las señales
que tenemos son procedentes del microcontrolador y las
referentes a alimentación presentan un voltaje de 5V.
128
Figura 54. Esquema del diseño de la primera PCB
129
Realizamos todos los pasos anteriores, pero con una
redistribución de los componentes un poco más
compleja, dando como resultado, el diseño físico final que
tendrá la PCB de nuestro sistema:
130
Figura 56. Imágenes de la primera PCB impresa
131
una máscara de soldadura que facilita todo el proceso de
montaje de componentes. El resultado fue el siguiente:
132
5.2.4 Carcasa
El diseño de la carcasa tuvo como base el proyecto
Project-Box-Template [32] que ofrecía una solución al
problema de no tener que usar tornillería para lo que iba
a ser la base y tapa de la caja.
133
Figura 58. Imágenes del diseño de la carcasa 3D
134
Figura 59. Imagen comparativa entre las tres iteraciones de la carcasa
135
Para facilitar el proceso, se ha hecho uso de una
estación de trabajo que permite el ajuste de
soportes magnéticos para poder sujetar la PCB y
los componentes.
136
2) Para el montaje de los componentes tenemos 4
componentes principales en el interior de la
carcasa: batería, PCB, vibrador e interruptor
debemos de tener en cuenta la necesidad de
incluir cablería externa a la PCB.
137
138
Figura 61. Imágenes del dispositivo final
139
Bloque 6:
Pruebas
140
6.1 Pruebas
Para garantizar la calidad de la implementación de
nuestro sistema, se han realizado una serie de pruebas
tanto hardware como software, dando así un plus de
seguridad al usuario de que tanto el funcionamiento
como el dispositivo son correctos.
141
provistos por la batería ya incluida (aunque
también se puede conectar vía USB) y la
intensidad que circula es de 3.7A.
• Test de temperatura: para garantizar que el
sistema es capaz de funcionar en la mayoría
de las condiciones de trabajo, se ha
probado su uso al lado de un radiador (con
una temperatura de 45ºC
aproximadamente) y en un congelador (a
unos -8ºC aproximadamente).
• Test de caída: se han realizado caídas
intencionadas del sistema desde diferentes
alturas: 0.5m, 1m y 1.5m, para probar la
resistencia, sobre todo de la carcasa, a
posibles golpes que pueda sufrir el
dispositivo.
• Test de duración de la batería: el sistema es
capaz de aguantar con alarmas activas 12
horas.
142
Todas las pruebas anteriores se han ejecutado con
éxito y garantizan tanto la calidad del sistema como el
funcionamiento deseado. Además, nos aportan datos
muy relevantes de cara a la salida al mercado del
producto, así como la resistencia, duración de batería,
consumo…
143
Bloque 7: Cierre
144
7.1 Simulación de implementación en el
mercado
Llegados a este punto del proyecto, faltaría
únicamente subir las aplicaciones tanto a App Store como
a Google Play, que tiene un coste adicional no
contemplado en el alcance de nuestro proyecto.
145
7.2 Proyectos futuros
Este Trabajo de Fin de Grado se trata de una primera
iteración de un proyecto completo. Pero se encuentra
abierto a mejoras en varios aspectos:
146
7.3 Conclusiones
El inicio de este Trabajo de Fin de Grado se remonta
al inicio de la asignatura Desarrollo de Aplicaciones
Distribuidas correspondiente al 3º año del grado de
Ingeniera de Computadores. Donde tuvo origen la idea,
en parte por la situación que nos acontecía en aquellos
momentos, el confinamiento.
147
combinar conocimientos adquiridos no solo software en
tanto a sistemas empotrados, bases de datos, protocolos,
APIs, etc. Sino también al desarrollo de hardware con la
selección de componentes, diseño de PCB o diseño 3D.
148
Bibliografía
149
[1] (s. f.-a). GitHub - axios/axios: Promise based HTTP client for
the browser and node.js. Axios GitHub. Recuperado 13 de
marzo de 2022, de https://github.com/axios/axios
[2] Adobe Illustrator. (2021, 29 septiembre). En Wikipedia, la
enciclopedia libre.
https://es.wikipedia.org/wiki/Adobe_Illustrator
[3] Adobe Photoshop. (2022, 20 enero). En Wikipedia, la
enciclopedia libre.
https://es.wikipedia.org/wiki/Adobe_Photoshop
[4] App Store. (2012, 16 febrero). Xcode. App Store. Recuperado
21 de enero de 2022, de
https://apps.apple.com/es/app/xcode/id497799835?mt=12
[5] Arocha Rodulfo, J. I. (2019). Sedentarism, a disease from xxi
century. Clínica e Investigación en Arteriosclerosis (English
Edition), 31(5), 233–240.
https://doi.org/10.1016/j.artere.2019.04.001
[6] C (lenguaje de programación). (2022, 14 enero). En Wikipedia,
la enciclopedia libre.
https://es.wikipedia.org/wiki/C_(lenguaje_de_programaci%C
3%B3n)
[7] Chairless - Smart sitting time tracker - Apps on Google Play.
(s. f.). Google Play. Recuperado 30 de enero de 2022, de
https://play.google.com/store/apps/details?id=com.runtimeerr
orstudio.chairless&hl=en_US&gl=US
[8] Chandrasekaran, B., & Ganesan, T. B. (2020). Sedentarism and
chronic disease risk in COVID 19 lockdown – a scoping
review. Scottish Medical Journal, 66(1), 3–10.
https://doi.org/10.1177/0036933020946336
[9] colaboradores de Wikipedia. (s. f.). SQL. Wikipedia, la
enciclopedia libre. https://es.wikipedia.org/wiki/SQL
[10] Comprar suscripción de Fusion 360 | Obtener Precios del
software de diseño CAD/CAM de Fusion |Tienda en linea de
Autodesk España. (2022, 13 enero). Fusion 360. Recuperado
150
21 de enero de 2022, de
https://www.autodesk.es/products/fusion-360/overview
[11] Devlioti, V. (2018, 24 agosto). Enough With The Fit
Trackers, Here Is the Sit Tracker. Wersm. Recuperado 30 de
enero de 2022, de https://wersm.com/enough-with-the-fit-
trackers-here-is-the-sit-tracker/
[12] Eclipse (software). (2021, 19 junio). En Wikipedia, la
enciclopedia libre.
https://es.wikipedia.org/wiki/Eclipse_(software)
[13] ESLint. (2021, 23 diciembre). En Wikipedia.
https://en.wikipedia.org/wiki/ESLint
[14] F. (s. f.-b). GitHub - FrozenPyrozen/rn-native-mqtt: An
MQTT client for React Native that actually works and exposes
a simple Javascript interface. GitHub.
https://github.com/FrozenPyrozen/rn-native-mqtt
[15] Formik. (s. f.). Formik. https://formik.org/
[16] GitHub. (2022, 13 enero). En Wikipedia, la enciclopedia
libre. https://es.wikipedia.org/wiki/GitHub
[17] (s. f.-c). GitHub - indiespirit/react-native-chart-kit:
React Native Chart Kit: Line Chart, Bezier Line Chart,
Progress Ring, Bar chart, Pie chart, Contribution graph
(heatmap). GitHub. https://github.com/indiespirit/react-native-
chart-kit
[18] Introducción a Android Studio | Desarrolladores de
Android |. (s. f.). Android Developers. Recuperado 21 de enero
de 2022, de https://developer.android.com/studio/intro?hl=es-
419
[19] Introduction - Toms planner - 1. (s. f.). Toms Planner.
Recuperado 21 de enero de 2022, de
https://plan.tomsplanner.com/documentation/manual/en/1/en/t
opic/introduction
[20] J. (s. f.-d). GitHub - jquense/yup: Dead simple Object
schema validation. GitHub. https://github.com/jquense/yup
151
[21] Marvel. (s. f.). Marvel - The design platform for digital
products. Get started for free. https://marvelapp.com/
[22] Mobile UI Kit (Community). (s. f.). Figma. Recuperado 3 de
mayo de 2022, de
https://www.figma.com/community/file/94212424128911731
8
[23] MySQL :: MySQL Workbench. (s. f.). MySQL Defición.
Recuperado 21 de enero de 2022, de
https://www.mysql.com/products/workbench/
[24] Nordquist, T. N. (s. f.). MQTT explorer. MQTT explorer.
Recuperado 21 de enero de 2022, de http://mqtt-explorer.com/
[25] Postman. (s. f.). Definición Postman. Recuperado 21 de
enero de 2022, de https://www.postman.com/
[26] R. (s. f.-e). GitHub - react-native-async-storage/async-
storage: An asynchronous, persistent, key-value storage system
for React Native. GitHub. https://github.com/react-native-
async-storage/async-storage
[27] R. (s. f.-f). GitHub - react-native-
datetimepicker/datetimepicker: React Native date & time
picker component for iOS, Android and Windows. GitHub.
https://github.com/react-native-datetimepicker/datetimepicker
[28] R. (s. f.-g). GitHub - react-native-picker/picker: Picker is a
cross-platform UI component for selecting an item from a list
of options. GitHub. https://github.com/react-native-
picker/picker
[29] React Native. (2022, 13 enero). En Wikipedia.
https://en.wikipedia.org/wiki/React_Native
[30] S. (s. f.-h). GitHub - styled-components/styled-components:
Visual primitives for the component age. Use the best bits of
ES6 and CSS to style your apps without stress . GitHub.
https://github.com/styled-components/styled-components
[31] S. (s. f.-i). KiCad EDA Loader Download. Component
Search Engine.
https://componentsearchengine.com/library/kicad?gclid=Cj0K
152
CQjwyYKUBhDJARIsAMj9lkEQVBQ_4wU2-
El_Hf7iR0z_T2s9vYcKaVVIPbVzLQbMKPfJPtZgDAsaAjd
nEALw_wcB
[32] S. (2019, 12 marzo). GitHub - SensorsIot/Project-Box-
Templates. GitHub. Recuperado 22 de enero de 2022, de
https://github.com/SensorsIot/Project-Box-Templates
[33] symbol 1614977–1 1614977–1. (s. f.). Resistor
Symbol&FootPrint. Recuperado 18 de enero de 2022, de
https://www.snapeda.com/parts/1614977-
1/TE%20Connectivity/view-part/?ref=search&t=1614977-1
[34] symbol 113990105. (s. f.). NodeMCU V2
Symbol&FootPrint. Recuperado 18 de enero de 2022, de
https://www.snapeda.com/parts/NodeMCU%20v2/Seeed%20
Technology%20Co.,%20Ltd/view-part/
[35] symbol CEM-1203(42) CEM-1203(42). (s. f.). CEM-1203
Symbol&FootPrint. Recuperado 18 de enero de 2022, de
https://www.snapeda.com/parts/CEM-
1203(42)/CUI%20Devices/view-part/
[36] TypeScript. (2022, 17 enero). En Wikipedia, la
enciclopedia libre. https://es.wikipedia.org/wiki/TypeScript
[37] useAxios. (s. f.). Use-Axios-Client. https://use-axios-
client.io/
[38] Visual Studio Code - Code Editing. Redefined. (2021, 3
noviembre). Visual Studio Code. Recuperado 21 de enero de
2022, de https://code.visualstudio.com/
[39] W. (s. f.-j). GitHub - wix/react-native-calendars: React
Native Calendar Components . GitHub.
https://github.com/wix/react-native-calendars
[40] What is Java. (s. f.). Java. Recuperado 21 de enero de 2022,
de
https://www.java.com/es/download/help/whatis_java.html#:~:
text=Java%20es%20un%20lenguaje%20de,en%201995%20p
or%20Sun%20Microsystems.&text=Java%20es%20r%C3%A
153
1pido%2C%20seguro%20y,Java%20est%C3%A1%20en%20t
odas%20partes
[41] What is PlatformIO? — PlatformIO latest documentation.
(s. f.). PlatformIO. Recuperado 21 de enero de 2022, de
https://docs.platformio.org/en/latest/what-is-platformio.html
154
Anexos
155
1. Seguimiento temporal del proyecto
Se incluye un resumen acerca de la planificación
temporal realizada al comienzo de este proyecto, frente a
los tiempos reales de ejecución de cada fase de este.
156
Figura 63. Imágenes del dispositivo final
157
Figura 64. Desviaciones en la planificación I
158
Figura 65. Desviaciones en la planificación II
159
Figura 66. Desviaciones en la planificación III
160
2. Manual de usuario
En este apartado se expondrá a continuación un
manual de usuario que tiene como fin la resolución de
cualquier tipo de dudas que le puedan surgir al usuario
acerca del uso de la aplicación.
161
Figura 68. Configuración de credenciales del dispositivo
162
Figura 69. Welcome de la aplicación
163
En caso de necesitar una nueva alarma, pulsaremos
el icono de suma, que se encuentra en la esquina superior
derecha, que nos llevará a la pantalla de añadir alarma.
164
Desde esta pantalla, podremos realizar llamadas a
cualquier usuario que aparezca en el listado. Además, si
el rol es jefe, tendrá la posibilidad de establecer alarmas
a sus empleados.
165
Figura 72. Sección de estadísticas de la aplicación
166
Figura 73. Sección de perfil de la aplicación
167
3. Actas de reuniones con el tutor
17/09/2021
Acotación de los requisitos generales del proyecto.
07/10/2021
Discusión y elección de las tecnologías usadas en el
proyecto. Selección del curso de React Native a
realizar.
24/10/2021
Reunión donde se mostraron los requisitos
funcionales y acotación sobre el índice a trabajar en
la documentación correspondiente.
16/11/2021
Actualización del estado del curso y documentación.
13/01/2022
Discusión sobre tecnologías a usar en el desarrollo
del dispositivo físico.
31/01/2022
Corrección de la memoria por parte del tutor e
indicaciones para la continuación de la
documentación, así como la selección de
herramientas para el primer mock-up de la app.
15/02/2022
Corrección de los mock-ups y actualización del estado
del proyecto hardware y memoria. Discusión sobre
activar el modo punto de acceso en el ESP.
07/03/2022
Decisión sobre librería a utilizar para conectar a la API
Rest la aplicación y decisión definitiva sobre la librería
del ESP y activar el punto de acceso.
168
07/04/2022
Reunión sobre diversas decisiones relativas a la
conexión del smartphone del usuario, dispositivo
físico y la app.
03/05/2022
Actualización sobre la primera iteración
completamente funcional de la aplicación y feedback
sobre tareas aún por implementar.
07/05/2022
Resolución de dudas sobre problemas derivados del
uso de librería MQTT que fueron resueltas gracias al
uso de un fork de la misma.
18/05/2022
Pequeñas correcciones y feedback sobre el sistema
completo en funcionamiento y sobre la sección de
implementación de la aplicación en la
documentación.
169