INSTITUTO TECNOLÓGICO UNIVERSITARIO “RUMIÑAHUI”

CARRERA DESARROLLO DE SOFTWARE

DESARROLLO DEL SITIO WEB PARA EL CONTROL DE AGENDAMIENTO

DE CITAS MÉDICAS PARA LA INSTITUCIÓN CLÍNICA ALBORADA C. A.

TRABAJO DE TITULACIÓN
PREVIO A LA OBTENCIÓN DEL TITULO DE TECNÓLOGO SUPERIOR
EN DESARROLLO DE SOFTWARE

AUTORES:

Juan Carlos Lladó Villavicencio

Mario Alberto Rosales Hart
Lucía Elizabeth Alegría Salazar

Agosto 30 de 2022

I
 AGRADECIMIENTO

Al finalizar este trabajo quiero agradecer profundamente a Dios por todas sus bendiciones,
a mi familia por siempre estar apoyándome y motivándome
para seguir con mis estudios hasta culminarlos.
Además, quiero agradecer al Instituto Tecnológico Universitario Rumiñahui,
a sus directivos y maestros de mi educación superior, quienes me han
dado las pautas para mi formación profesional.
A mis compañeros de clase, con quienes hemos compartido experiencias
y una bonita amistad a lo largo de esta carrera.

Lucía Alegría

II
 AGRADECIMIENTO

Agradezco a Dios, a mi Familia han sido siempre el motor que impulsa mis sueños y espe-
ranzas, quienes estuvieron siempre a mi lado en los días y noches más difíciles durante mis
horas de estudio. Siempre han sido mis mejores guías de vida.

Mario Rosales Hart

III
 AGRADECIMIENTO

Agradezco profundamente a Dios por las bendiciones, a mi tía Pilar Villavicencio por su
apoyo y motivación incondicionales para
culminar mi formación profesional.
Quiero agradecer al Instituto Tecnológico Universitario Rumiñahui, a sus tutores
y directiva por la educación superior, quienes con sus conocimientos
nos han dado las directrices para nuestra formación profesional.
A mis compañeros de clases, con quienes compartimos buenas experiencias
y una buena amistad a lo largo de la carrera.

Juan Carlos Lladó

IV
 DEDICATORIA

Dedico este trabajo a Dios en primer lugar, por darme la oportunidad, la salud,
el entusiasmo y la sabiduría para estudiar una carrera y alcanzar mis objetivos.
A mi esposo, quien ha sido mi apoyo en todo momento
Y me ha brindado amor incondicional siempre.
A mis padres, que siempre me han impulsado y enseñado con su ejemplo,
que los sueños se logran sin importar edad ni dificultades.
A mis hijas, por quienes siempre deseo alcanzar la mejor versión de mí.

Lucía Alegría

V
 DEDICATORIA

Dedico a Dios, a mi Familia, hoy cuando concluyo mis estudios, les dedico a ustedes este
logro, como una meta más conquistada. Orgulloso de que estén a mi lado en este momento
tan importante.

Gracias por ser quienes son y por creer en mí.

Mario Rosales Hart

VI
 DEDICATORIA

Dedico este proyecto en primer lugar a Dios, por la oportunidad para estudiar una carrera
por mi superación personal y alcanzar mis objetivos.
A mi esposa, por ser mi apoyo todo el tiempo y por su amor incondicional siempre.
A mi madre, que siempre ha estado a mi lado, creyendo en mí y apoyándome de todas las
formas posibles.
A mi hijo, quien es mi motor y por quien trato de ser mejor cada día.

Juan Carlos Lladó

VII
INDICE

1.- El Problema de la Investigación ................................................................................................ 2

1.1.- Antecedentes del problema ................................................................................................. 2
1.2.- Planteamiento del Problema. (Formulación problemática) ............................................. 2
1.2.1- Sistematización Problemática .......................................................................................... 2
1.3.- Objetivos. .............................................................................................................................. 3
1.3.1.- General ............................................................................................................................ 3
1.3.2.-Específicos ........................................................................................................................ 3
1.4.- Justificación. (Legal, social, técnica, académica) .............................................................. 3
1.4.2.- Justificación técnica Hardware ....................................................................................... 5
1.4.3.- Justificación técnica Software ......................................................................................... 6
1.5.- Alcance y limitaciones.......................................................................................................... 6
1.5.1 Alcance ................................................................................................................................. 6
1.5.2 Limitaciones ......................................................................................................................... 7
2.- Marco Teórico ............................................................................................................................. 8
2.1. -Fundamentación Teórica del tema del proyecto. .............................................................. 8
2.2.- Fundamentación teórica de las herramientas de desarrollo ............................................ 8
2.2.1.2 Características de los Sitios Web.................................................................................... 8
2.2.1.4 Tipos de Sitio Web........................................................................................................ 10
2.2.3. ¿Qué son las TIC? ........................................................................................................... 12
2.2.4. Sistemas Informáticos ................................................................................................... 13
2.2.5. Software ......................................................................................................................... 15
2.2.6 Metodología Orientada a Objetos .................................................................................. 17
2.2.7. Lenguajes de Programación ........................................................................................... 19
2.2.8. ¿Qué es un CMS?............................................................................................................ 21
2.2.9. ¿Qué es XAMPP? ........................................................................................................... 22
2.2.10. ¿Qué es PHP? .............................................................................................................. 22
2.2.11. Qué es HTML? .............................................................................................................. 24
2.2.12. ¿Qué es CSS y para qué sirve?...................................................................................... 24
2.2.13. Base de Datos ............................................................................................................... 24
2.2.14. Interfaces Graficas........................................................................................................ 25
2.2.15. Hardware ...................................................................................................................... 26
2.2.16 Manual de Usuario ........................................................................................................ 27
2.2.17 Manual Técnico ............................................................................................................. 28
2.2.18. Requerimiento de Software y Hardware del Proyecto. ............................................... 31

VIII
3.- Marco Metodológico. ................................................................................................................ 32
3.1.- Metodología de Investigación............................................................................................ 32
3.1.1. Tipo de Investigación...................................................................................................... 32
3.1.2 Métodos de la Investigación ........................................................................................... 32
3.1.2.1 Método Científico ....................................................................................................... 33
3.1.3 Población y Muestra........................................................................................................ 33
3.1.4 Instrumentos Recolección De La Información ................................................................ 34
3.2.- Metodología de Desarrollo ................................................................................................ 36
3.2.1.- Metodología Xp – Fase De Análisis ............................................................................... 36
3.3 Casos de Uso (Actores del Proyecto). ................................................................................. 42
3.3.1 Paciente ........................................................................................................................... 42
3.3.2 Licenciada en Enfermería ................................................................................................ 42
3.3.3 Administrador del Sitio Web ........................................................................................... 42
3.4 Gráfica de Caso de Uso ........................................................................................................ 43
3.5 Historias de Usuario ............................................................................................................. 43
3.5.1 Elementos........................................................................................................................ 44
3.6 Tarjetas de Historias de Usuario ........................................................................................ 45
3.7 Diagramas de actividades de Proyecto. .............................................................................. 52
4. Fase de Diseño ............................................................................................................................ 53
4.1 Fase de Exploración. ............................................................................................................ 53
4.2 Spike Arquitectónico. ........................................................................................................... 54
4.3 Entorno Local. ...................................................................................................................... 54
4.4 Entorno Línea o Producción. .............................................................................................. 54
4.5 Planificación Iteraciones. ..................................................................................................... 55
4.6 Diagrama de almacenamiento de Datos del Sistema. ........................................................ 57
4.7 Diagrama Arquitectónico Web. .......................................................................................... 58
4.8 Diseño y Construcción de Solución ..................................................................................... 58
4.9 Pruebas de la Solución ......................................................................................................... 61
Conclusiones ................................................................................................................................... 63
Recomendaciones ........................................................................................................................... 63
Manual de Usuario ......................................................................................................................... 64
Manual Técnico .............................................................................................................................. 96
Anexos ................................................................................................ ¡Error! Marcador no definido.
Bibliografía y Referencias de citas.................................................................................................. 116

IX
RESUMEN

El presente proyecto propone implementar un Sitio Web para la Institución Clínica Alborada
C.A localizada en la Ciudad de Guayaquil, esta propuesta se llevó a cabo para poder mejorar
el proceso de manejo del agendamiento de citas médicas que se realiza actualmente de forma
manual, razón por la cual se automatizará este proceso para que sea ágil y eficiente para los
pacientes de la clínica, sin tener pérdida de información y los procesos sean confiables.

En el proyecto en mención, se presenta un módulo de agendamiento, donde se va a diseñar

una interfaz amigable para el usuario, que le permita el agendamiento de citas médicas desde
la comodidad de su hogar u oficina, y además la auxiliar de enfermería de la Clínica podrá
ingresar los datos del paciente, médico, especialidad.

Se contará con un módulo de Usuarios, control de accesos y permisos y los requisitos nece-
sarios para iniciar el Sitio Web.

Se sistematizarán y mejorarán los procesos y flujo de trabajo del agendamiento de citas mé-
dicas. De esta manera se efectivizan los trabajos de cada usuario del sistema, impulsando
sus fortalezas y eliminando sus debilidades en los diferentes procesos a realizar.

El Proyecto de Agendamiento de citas médicas será completamente desarrollado en am-

biente Web, intuitivo, amigable y fácil de usar para los usuarios. Se podrá acceder desde
cualquier navegador moderno. El sistema podrá estar alojado en un Servidor en la red local
de la Clínica o publicado en un hosting, según lo solicite la clínica.

Este Sito web se diseñará en WordPress y MySQL como base de datos. Se utilizará adicio-
nalmente tecnología relacionada con el CMS y la Base de Datos según corresponda y sea
necesario.

1
1.- El Problema de la Investigación
1.1.- Antecedentes del problema
Algunos centros de prestación de servicios médicos, en la actualidad, aún no han logrado
sistematizar sus procesos, como es el caso del agendamiento de citas médicas, causando
muchos inconvenientes e insatisfacción a sus clientes e incluso a los médicos que trabajan
ahí, por cuanto esta gestión no se efectúa de manera eficiente por parte del personal encar-
gado.

En la Clínica Alborada, el agendamiento de citas médicas se lo realiza de forma manual, esto

genera muchos problemas tanto para la clínica como para los pacientes.

Con la automatización del agendamiento de citas médicas se espera poder superar todos
estos inconvenientes mencionados para poder contar con la información de manera sistema-
tizada y al día.

1.2.- Planteamiento del Problema. (Formulación problemática)

¿Qué efecto tendrá en la Clínica Alborada la implementación del módulo de control de agen-
damiento de citas para mejorar la atención a los pacientes y el control estadístico de la insti-
tución?

1.2.1- Sistematización Problemática

Se analizarán los procesos y procedimientos, se evaluarán problemas y soluciones en la Ins-
titución Médica CLINICA ALBORADA C.A.

- El agendamiento de citas en la clínica se lo efectúa de manera manual, debiendo el cliente

acercarse a información, verificar disponibilidad de citas, luego acercarse a caja, pagar el
valor de la consulta y posteriormente volver a información para validar el pago y confirmar
la cita, lo que toma mucho tiempo e incomoda al cliente.

- No existe información adecuada de médicos y personal de apoyo que prestan sus servicios
en la clínica.

- No se puede realizar búsquedas filtradas con parámetros exactos y una visualización inme-
diata sobre las citas diarias de los pacientes.

- Reducir tiempo de espera para las citas.

- La información proporcionada en la entrevista no es actualizada y verídica. Información

proporcionada no es confiable para el realizar el agendamiento de citas.

2
1.3.- Objetivos.

1.3.1.- General

Diseñar un Sitio Web de control de agendamientos de citas médicas utilizando herramientas

tecnológicas de cuarta generación para la Clínica Alborada.

1.3.2.-Específicos

- Analizar los diferentes tipos de Sitios Web de control de agendamiento de procesos.

- Interpretar los elementos y estructura de las Tecnologías de Información y Comunicación.

- Implementar el Sitio Web, mediante manual técnico y de usuario.

1.4.- Justificación. (Legal, social, técnica, académica)

El Sitio Web para el control de agendamiento citas médicas para la institución Clínica Al-
borada, nace de la evaluación objetiva de las necesidades y oportunidades a potencializar,
ya que permitirá controlar y agendar las citas solicitadas por los pacientes, manteniendo una
información actualizada de los horarios de atención para los usuarios que deseen una con-
sulta en la Clínica.

Este desarrollo, además de permitir un mejor servicio a los pacientes, también facilitará y
organizará el trabajo del área administrativa con un correcto manejo de la información, per-
mitiéndoles ser más eficientes y lograr atender a una mayor cantidad de pacientes que nece-
sitan agendar citas para las distintas especialidades que ofrece la clínica, evitando conges-
tionamiento en las instalaciones y pérdida de tiempo.

Se logrará optimizar el trabajo de los médicos al otorgarles una agenda ordenada, organizada,
con datos reales de los pacientes.

Adicionalmente el uso de los recursos informáticos tangibles y no tangibles que posee la

empresa sarán utilizados adecuadamente en beneficio de sus clientes logrando incrementar
su productividad, lo que le posicionará como una de las mejores clínicas de nuestra ciudad.

La implementación de este sistema informático estará basado en las exigencias tecnológicas

actuales, además de normativas legales del país y propias de la empresa.

3
1.4.1.- Justificación legal

Según la (CONSTITUCIÓN DE LA REPÚBLICA DEL ECUADOR, 2008)

SECCIÓN OCTAVA CIENCIA, TECNOLOGÍA, INNOVACIÓN Y SABERES ANCES-

TRALES.

Art. 385.

- El sistema nacional de ciencia, tecnología, innovación y saberes ancestrales, en el marco

del respeto al ambiente, la naturaleza, la vida, las culturas y la soberanía, tendrá como fina-
lidad: 1. Generar, adaptar y difundir conocimientos científicos y tecnológicos. 2. Recuperar,
fortalecer y potenciar los saberes ancestrales. 3. Desarrollar tecnologías e innovaciones que
impulsen la producción nacional, eleven la eficiencia y productividad, mejoren la calidad de
vida y contribuyan a la realización del buen vivir. CONSTITUCIÓN DE LA REPÚBLICA
DEL ECUADOR - Página 185 LEXIS FINDER - www.lexis.com.ec Concordancias: CONS-
TITUCIÓN DE LA REPÚBLICA DEL ECUADOR, Arts. 57, 340.

Art. 386.

- El sistema comprenderá programas, políticas, recursos, acciones, e incorporará a institucio-

nes del Estado, universidades y escuelas politécnicas, institutos de investigación públicos y
particulares, empresas públicas y privadas, organismos no gubernamentales y personas na-
turales o jurídicas, en tanto realizan actividades de investigación, desarrollo tecnológico, in-
novación y aquellas ligadas a los saberes ancestrales. El Estado, a través del organismo com-
petente, coordinará el sistema, establecerá los objetivos y políticas, de conformidad con el
Plan Nacional de Desarrollo, con la participación de los actores que lo conforman.

Según la (LEY ORGÁNICA DE SALUD) Ley 67 Registro Oficial Suplemento 423 de 22-
dic.-2006 Ultima modificación: 18-dic.-2015

De los servicios y profesiones de salud

TITULO UNICO

CAPITULO I

De los servicios de salud

4
 Art. 180.

- La autoridad sanitaria nacional regulará, licenciará y controlará el funcionamiento de los

servicios de salud públicos y privados, con y sin fines de lucro, autónomos, comunitarios y
de las empresas privadas de salud y medicina prepagada y otorgará su permiso de funciona-
miento. Regulará los procesos de licenciamiento y acreditación. Regulará y controlará el
cumplimiento de la normativa para la construcción, ampliación y funcionamiento de estos
establecimientos de acuerdo a la tipología, basada en la capacidad resolutiva, niveles de aten-
ción y complejidad.

Art. 181.

- La autoridad sanitaria nacional regulará y vigilará que los servicios de salud públicos y
privados, con y sin fines de lucro, autónomos y las empresas privadas de salud y medicina
prepagada, garanticen atención oportuna, eficiente y de calidad según los enfoques y princi-
pios definidos en esta Ley.

1.4.2.- Justificación técnica Hardware

El equipo de desarrollo cuenta con dos equipos portátiles para poder ejecutar la programa-
ción y todas las pruebas relacionadas, los mismos que tienen las siguientes características:

 Portátil HP Pavilion
 Procesador Intel Core I7 10700U
 Memoria Ram 16 Gb
 SSD 512Gb
 Pantalla 15.6”

10 estaciones de Trabajo con estas especificaciones:

Procesador Intel® Core™ i3-10110Y (caché de 4 M, hasta 4,00 GHz)

8 MB Intel® Smart Cache Caché

Disco duro de 1tb sata

Memoria Ram 8gb

5
A nivel de Servidores:

Con servicios en la Nube.

Todos los equipos están en red por medio de un router que les permite acceso continuo a
internet de alta velocidad

1.4.3.- Justificación técnica Software

- Sistema Operativo Windows 10

- CMS WordPress
- Lenguaje de programación PHP
- Base de Datos MySQL
Clínica Alborada cuenta con 10 Equipos con sistema operativos Windows 10 y paquetería
de Ofimática de Microsoft.

1.5.- Alcance y limitaciones

1.5.1 Alcance
Se analizarán los procesos y procedimientos, se evaluarán problemas y soluciones en la Ins-
titución Médica CLINICA ALBORADA C.A. en el área de Consulta Externa.

Se requiere que el proyecto alcance a todo el Personal Administrativo de la Clínica como:

Administrador, Médicos, Auxiliar de Enfermería, así como a los Pacientes.

El Sitio Web permitirá a la Clínica Alborada tener una mejor administración y gestión del
agendamiento de citas médicas. Cubrirá los siguientes procesos: registro, búsqueda, edición,
actualización, generación de reportes, logrando así una mejora en el modo en que se vienen
desarrollando las actividades.

El proyecto tiene como alcance, desarrollar los siguientes módulos:

Módulo de Seguridad

En este módulo se realiza el registro del paciente, del profesional o profesionales y del per-
sonal de apoyo de la clínica de tal manera que al buscar el nombre del profesional o del
personal de apoyo se genera un usuario y un rol.

El acceso se lo permitirá solo a la auxiliar de enfermería.

El acceso al sistema se lo realizará ingresando el usuario contraseña.

6
Módulo de Mantenimientos

En este módulo se realiza la administración donde se podrá agregar, modificar, eliminar

todos los registros ingresados por el usuario.

Módulo de Reportes

En este módulo se generará reportes de las citas de cada uno de los pacientes.

Una vez finalizado el desarrollo del sitio web se realizará la elaboración del manual de usua-
rio y técnico.

El presente proyecto de desarrollo se fundamenta en estos puntos:

- Optimizar el agendamiento de citas médicas en las distintas especialidades existentes en

consulta externa de Clínica Alborada.
- Reducir tiempos de espera de los pacientes para agendar una cita.
- Permitir que los usuarios puedan agendar su cita mediante la aplicación web desde su casa
o lugar de trabajo.
- Generar una agenda efectiva y confiable para los médicos especialistas.

1.5.2 Limitaciones

El Desarrollo de la aplicación web está limitado a lo siguiente:

- Agendamiento de citas médicas de los pacientes.

- Control de registros de pacientes.
- Control de registro de médicos.
- Registros de Especialidades
- Horarios de atención de consultas médicas.

En este Proyecto no se llevará a cabo la facturación de los servicios, solo se controlará la

parte de procesos de citas y registros médicos.

7
2.- Marco Teórico
2.1. -Fundamentación Teórica del tema del proyecto.
En la actualidad, debemos reconocer la importancia de la implementación de un sitio web
para cualquier empresa, ya que además de proporcionar información sobre los productos y
servicios que ofrece la misma, puede brindar opciones adicionales como en el caso de nues-
tro proyecto, que está enfocado al agendamiento de citas médicas en línea, lo que automatiza
el proceso, agiliza el servicio y mejora la atención a los pacientes de la Clínica La Alborada.

“Tener una página, sitio o portal Web trae como consecuencia un número importante de be-
neficios en relación a quien no posee una Web.” (Aquila, 2017)

2.2.- Fundamentación teórica de las herramientas de desarrollo

2.2.1 Qué son los Sitios Web
Un sitio web es un conjunto de páginas web al que se puede acceder mediante internet, con-
venientemente enlazadas y con una finalidad concreta. Se identifica por una dirección URL
única, que usualmente es la página de inicio o Home page.
Podríamos también decir que un sitio web es un conjunto de páginas web que se relacionan
entre sí, y que se encuentran alojadas en un espacio virtual del internet, y a las que se puede
acceder mediante un dominio.

Una página web es un documento accesible desde cualquier navegador con acceso a internet,
y que puede incluir audio, vídeo, texto y sus diferentes combinaciones. (Peiró, 2019)

En palabras sencillas de entender, un sitio web muestra toda la información que un negocio,
empresa o marca desea mostrar a sus visitantes, la organiza en distintas páginas web que
forman parte del sitio.

2.2.1.2 Características de los Sitios Web

Las principales características que debería tener un Sitio Web para que se mantenga bien
posicionado en los principales motores de búsqueda son:

- Contenido de valor y de fácil entendimiento: Con lenguaje sencillo, no muy técnico, que
mantenga el interés del visitante y comprenda lo que lee.
- Velocidad de carga: Si el sitio web demora mucho en cargarse, seguramente el visitante
perderá el interés y lo abandonará. Para esto, deben usarse imágenes livianas, comprimir
archivos pesados y videos ligeros cuidando la calidad de la imagen.

8
- Diseño atractivo: Es uno de los principales puntos a tomar en cuenta, ya que deben mostrar
la esencia de la empresa o marca, utilizando los colores correctos, imagen corporativa, logo.
La tipografía es muy importante para que sea legible. Una buena imagen genera confianza.
- Adaptable a todos los dispositivos: En la actualidad es indispensable que los sitios web
tengan un diseño responsivo o responsive design, es decir, que se orienten automáticamente
a los distintos tamaños de los dispositivos como celulares, tablets, etc. y a la disposición de
los mismos.
- Deben brindar seguridad al usuario: Uno de los puntos más importantes, ya que hoy por
hoy, se realizan miles de transacciones mediante sitios web, por lo tanto, deben contar con
certificados SSL, que hacen del sitio seguro y se identifican por https.
- Optimizados para motores de búsqueda (SEO): La información incluida en un sitio web,
debe estar optimizada para sea fácilmente alcanzable por los motores de búsqueda y sea
accedida eficientemente, para que los indexen a sus bases de datos.

2.2.1.3 Arquitectura de un sitio web

Arquitectura web es la jerarquización de información en un sitio web. Tal como en la arqui-

tectura tradicional se trabaja la estructura de una construcción, la arquitectura web trabaja la
estructura de una página web y las categorías por las que está compuesta para su optimiza-
ción con el posicionamiento en buscadores.

Además, está íntimamente ligada con el estudio de las palabras claves y la forma de
navegación por los diferentes contenidos que posee un sitio web. (School, 2020)

Para estructurar la arquitectura de un sitio web se debe primero trazar un mapa del sitio,
donde se van a definir los niveles de profundidad que va a tener, su jerarquía y las páginas
que va a contener.

Se recomienda utilizar una arquitectura web plana, es decir que no tenga más allá de tres
niveles de profundidad, siendo el home el nivel 0, ya que esto afecta directamente al rastreo
del sitio y a la experiencia del usuario.

Es vital saber utilizar las palabras clave que permitan al sitio posicionarse bien con los mo-
tores de búsqueda, para que sean fácilmente encontrados y el usuario pueda acceder a ellos.

9
 Gráfico 1. - De Estructura Horizontal

2.2.1.4 Tipos de Sitio Web

Según su funcionalidad:

2.2.1.4.1 Sitio de negocio o Institucional. -Donde se muestra información del negocio o

empresa, tal como misión, visión, valores, dirección, teléfonos, servicios que ofrece, redes
sociales, incluso puede incluir catálogo de productos según el giro de negocio.

2.2.1.4.2 Micrositio. - Generalmente está compuesto por una sola página web, donde ofrece
información sobre una campaña específica, servicio, evento o negocio, y solicita informa-
ción a los visitantes como correo electrónico, teléfono, nombres. Tiene una URL propia, un
diseño llamativo para cautivar a los visitantes y generalmente tiene una fecha de caducidad.

2.2.1.4.3 Blog. -Un blog tiene una connotación más informal, buscan cautivar a los visitantes
a través de una historia sencilla que se puede leer en entre 3 y 15 minutos, o generar una
conversación con ellos, puede incluir medios audiovisuales, permite comentarios y cada pu-
blicación es corta y sencilla, Son utilizados por personas influyentes, profesionales o exper-
tos en algún tema y comparten sus conocimientos con los lectores. Toda empresa debería
tener un blog donde incluyan información que mejore la experiencia de sus clientes.

2.2.1.4.4 Sitios educativos. - La finalidad de estos sitios es brindar educación en distintos

ámbitos a sus visitantes, se utilizan a nivel escolar, como también con cursos muy variados
como cocina, manualidades, programación, música, etc. Ofrecen tutoriales paso a paso para
que los visitantes sigan, además incluyen imágenes y videos que generan una experiencia de
usuario mucho más agradable e intuitiva.

Son utilizados por instituciones públicas, privadas, marcas que apoyan una iniciativa de edu-
cación, o simplemente personas que desean compartir sus conocimientos con los demás.

10
2.2.1.4.5 Sitios de comercio electrónico. -En estos sitios se muestra el catálogo electrónico
de los distintos productos que comercializa la empresa, sus características, dimensiones,
peso, bondades, funcionalidades, imágenes, incluso videos de cómo funciona o se utiliza
dicho producto. Generalmente solicitan un registro del usuario, tienen un carrito de compras
e incluyen pasarelas de pago como PayPal, o permiten realizar pagos mediante transferen-
cias, tarjetas de crédito.

Son utilizados por miles de empresas e industrias, ya que generan más ventas.

Según la forma de construcción y actualización del contenido:

2.2.1.4.6 Sitios web estáticos. - Fueron los primeros que se crearon, son sitios sencillos, con
información no modificable y no dan la posibilidad de que el usuario interactúe, únicamente
consume información.

2.2.1.4.7 Sitios web dinámicos. - Son construidos con distintos lenguajes de programación,
frameworks, plugins, que permiten incluir otras aplicaciones dentro del sitio, como blogs,
formularios, foros, encuestas, compras online. Son muy interactivos.

2.2.2. ¿Qué es un agendamiento de procesos de información?

La gestión de agendamiento de procesos de información, mediante la implementación de

una aplicación o programa de software, permite a las organizaciones tener un control ade-
cuado de las citas que se generan, y con esta información tomar las decisiones correctas y en
tiempo real para adecuar el trabajo, los recursos materiales y humanos, con el fin de atender
eficientemente la demanda de los servicios ofertados a los usuarios.

2.2.2.1 Gestión por procesos de información.

El objetivo principal de la gestión basada en procesos es la mejora continua y sistemática de

los mismos, logrando una óptima calidad del servicio, tomando como prioridad los elemen-
tos esenciales para el funcionamiento y supervivencia de las empresas.

2.2.2.2 Tipos de agendamiento de procesos de información

Entre los tipos de agendamiento que se pueden realizar mediante procesos de información
se pueden enumerar algunos, ya sea para adquirir un bien, un servicio, realizar algún trámite.

11
Ejemplos: cita para sacar la licencia de conducir, cita médica, cita para solicitar un servicio
público, cita para un spa, cita para sacar el pasaporte, cita para sacar la visa, etc.

2.2.3. ¿Qué son las TIC?

Las TIC o Tecnologías de Información y Comunicación son un conjunto de herramientas,
prácticas, conocimientos, recursos que se utilizan en el proceso de administración y distri-
bución de la información mediante equipos tecnológicos como computadores, televisiones,
teléfonos, tablets, etc.

Según el autor Thompson y Strickland (2004) definen las tecnologías de información

y comunicación, como aquellos dispositivos, herramientas, equipos y componentes
electrónicos, capaces de manipular información que soportan el desarrollo y creci-
miento económico de cualquier organización. Cabe destacar que en ambientes tan
complejos como los que deben enfrentar hoy en día las organizaciones, sólo aquellos
que utilicen todos los medios a su alcance, y aprendan a aprovechar las oportunidades
del mercado visualizando siempre las amenazas, podrán lograr el objetivo de ser exi-
tosas. (Thompson, 2004).

En la actualidad las TIC nos permiten lograr comunicación inmediata entre distintos sitos
geográficos muy distantes, fomentando la globalización y acortando distancias.

2.2.3.1 Tipos de TIC

Las TIC se pueden clasificar en:

2.2.3.1.1. Redes: Son conjuntos de equipos conectados entre sí, mediante algún medio físico
como cable, wifi, para compartir información y recursos. Algunos ejemplos son:

- Red de telefonía móvil, televisión, banda ancha, satélites, radio.

2.2.3.1.2. Terminales: Llamados también consolas, son dispositivos de hardware usados
para ingresar o mostrar datos de un sistema de computación. Ejemplo:

- Computadores portátiles, computadores de escritorio, teléfonos celulares, tablets, repro-

ductores de audio, televisores, etc.
2.2.3.1.3. Servicios: Las TIC proporcionan servicios a los usuarios, como el correo electró-
nico, banca en línea, búsqueda de información, cine, comercio electrónico, streaming, etc.

12
2.2.3.2 Características y Funcionalidades de las TIC

- Entre las principales características y funcionalidades de las TIC tenemos:

- Facilitan la comunicación e interacción entre los usuarios y la transmisión de datos entre

distintos dispositivos electrónicos.
- Al permitir la integración e interconexión de varias tecnologías, generan herramientas de
comunicación innovadoras y creativas.
- Influyen en numerosos ámbitos de la vida cotidiana como el educativo, político, social,
económico, financiero, cultural, científico e industrial, entre otros.
- Son de fácil adaptación, tomando en cuenta las preferencias y necesidades de los usuarios
y el mercado.
- Permanentemente se están actualizando e innovando.
- Las TICS son instantáneas, ya que, al realizar una acción, su resultado es inmediato. Por
ejemplo, enviar un mensaje, una búsqueda en la web, etc.
- Mediante las TICS el usuario puede interactuar con el contenido y ser un sujeto activo.

2.2.4. Sistemas Informáticos

Por sistema informático (SI) se entiende un sistema automatizado de almacenamiento, pro-
cesamiento y recuperación de datos, que aprovecha las herramientas de la computación y la
electrónica para llevar a cabo su serie compleja de procesos y operaciones.

Los sistemas informáticos son tipos de sistemas de información, es decir sistemas que se
organizan en torno al manejo de datos de diversa naturaleza, aunque no todos los sistemas
de información sean informáticos.

Los sistemas informáticos ocupan, en el mundo contemporáneo, un lugar clave para

la organización humana de sus procesos productivos y de otras naturalezas, constitu-
yéndose en una poderosa herramienta que permite el intercambio de información y
la construcción de redes, que eliminan la barrera de la distancia. (Arzaga, 2021)

2.2.4.1 Estructura de los sistemas informáticos

Un sistema informático está compuesto de tres recursos:

13
Hardware. – Que es toda la parte física, que se puede tocar de un sistema, es decir sus
componentes como son placas madre, pantallas, teclados, procesadores, memorias, disco
duro, conectores, etc… Sin estas partes el Sistema no podría funcionar.

Software. – Constituye la información y los sistemas programados, digitales, virtuales, que

no se pueden tocar, pero son indispensables para que el sistema tenga una finalidad más allá
de arrancar.

Humanware. – Nombre usado en ocasiones para nombrar al factor humano, es decir los
usuarios que utilizan una red informática, un equipo de computación o que lo programan.

2.2.4.2. Clasificación de los sistemas informáticos

Los sistemas informáticos se clasifican tomando en cuenta tres criterios:

Por su utilización: Es decir los sistemas de uso específico, que realizan tareas determinadas;
o sistemas de uso general, que ofrecen un manejo amplio de la información.

Por su volumen de procesamiento: Se pueden mencionar las estaciones de trabajo de ca-

pacidad limitada (workstations), microcomputadores (de gran capacidad), microcomputado-
res (como pequeños servidores de poca capacidad) y supercomputadoras (con enorme capa-
cidad de procesamiento).

Por la arquitectura informática de su red: Cuando el Sistema Informático forma parte de

una red, existe una relación cliente-servidor, de dos, tres o cuatro capas, dependiendo de la
cantidad y calidad de la información que es transmite.

Por su propósito: En este caso pueden mencionarse sistemas de procesamiento básico de

información, los que sirven como apoyo para la toma de decisiones, de gestión del conoci-
miento, sistemas basados en inteligencia artificial o en técnicas web.

2.2.4.3. Finalidad de los sistemas informáticos

La finalidad de los sistemas informáticos es procesar la información de forma óptima, pu-

diendo guardarla, recuperarla, imprimirla o compartirla.

Realizar tareas más ágiles, flexibles y cómodas para sus usuarios, reduciendo tiempo, costos
y esfuerzo, centralizando el control de los procesos.

14
2.2.5. Software
Software engloba todo lo intangible de un sistema informático, incluyendo los sistemas ope-
rativos, programas, aplicaciones. Es decir, todos los componentes que son necesarios para la
realización de tareas específicas.

Según la definición del IEEE, "software es la suma total de los programas de ordena-
dor, procedimientos, reglas, la documentación asociada y los datos que pertenecen a
un sistema de cómputo" y "un producto de software es un producto diseñado para un
usuario". En este contexto, la Ingeniería de Software (SE del inglés "Software Engi-
neering") es un enfoque sistemático del desarrollo, operación, mantenimiento y retiro
del software.

Ingeniería del Software, es el término que utilizó Fritz Bauer en la primera conferencia
sobre desarrollo de software patrocinada por el Comité de Ciencia de la OTAN cele-
brada en Garmisch (Alemania), en octubre de 1968, previamente había sido utilizado
por el holandés Edsger Dijkstra en su obra The Humble Programmer. Puede definirse
según Alan Davis como "la aplicación inteligente de principios probados, técnicas,
lenguajes y herramientas para la creación y mantenimiento, dentro de un coste razo-
nable, de software que satisfaga las necesidades de los usuarios". (Asensio, 2019)

2.2.5.1 Clasificación del Software

El software se divide en tres grupos:

Software de sistema: son los elementos que logran el mantenimiento del sistema total, tales
como los sistemas operativos, servidores, controladores de dispositivos, herramientas de
diagnóstico, corrección y optimización.

Software de programación: Diferentes alternativas y lenguajes para desarrollar programas

de informática: editores de texto, compiladores, intérpretes, enlazadores, depuradores, en-
tornos de desarrollo integrados (IDE).

Software de aplicación: Permite a los usuarios llevar a cabo una o varias tareas específicas
en cualquier campo de actividad: aplicaciones ofimáticas, para control de sistemas y auto-
matización industrial, software educativo, software empresarial, bases de datos, telecomuni-
caciones (Internet), videojuegos, software médico, software de diseño asistido (CAD), soft-
ware de control numérico (CAM).

15
2.2.5.2. Software Libre

Software libre es un nombre promovido por la Free Software Foundation y el Proyecto GNU,
que hace referencia al software de código abierto que brinda la libertad a los usuarios de
ejecutar, copiar, distribuir, estudiar, modificar y mejorar el software sin restricciones. No
necesariamente el software libre es software gratuito o sin costo, más bien es una cuestión
de libertad de uso.

2.2.5.3 Las Cuatro Libertades Esenciales

Las cuatro libertades que debe cumplir indispensablemente el software libre para ser llamado
así son:

- La libertad de ejecución del programa como se necesite, con cualquier propósito (libertad
0).

- La libertad de estudiar cómo funciona el programa, y cambiarlo para que haga lo que usted
quiera (libertad 1). El acceso al código fuente es una condición necesaria para ello.

- La libertad de redistribuir copias para ayudar a otros (libertad 2).

- La libertad de distribuir copias de sus versiones modificadas a terceros (libertad 3).

Esto le permite ofrecer a toda la comunidad la oportunidad de beneficiarse de las mo-

dificaciones. El acceso al código fuente es una condición necesaria para ello. (Madrid,
s/f)

2.2.5.4. Ingeniería de Software

La Ingeniería de Software es una disciplina formada por un conjunto de métodos, técnicas y

herramientas, que se utilizan para el desarrollo de software o programas informáticos.

Abarca o engloba toda la gestión de un proyecto, es decir, va desde el análisis previo, pa-
sando por el planteamiento del diseño, luego la construcción o implementación de los pro-
gramas, sin dejar de lado, las pruebas que se necesitan para su funcionamiento correcto.

16
2.2.5.4.1 Etapas de la Ingeniería de software

- Concepción. En esta primera fase se desarrolla el modelo de negocio. Es decir, conocer las
necesidades que debe de tener un software y empezamos a buscar las herramientas para cu-
brirlas.

- Elaboración. Se detalla las características de la estructura del software.

- Construcción. En este paso se empieza a elaborar de forma tangible todo aquello que, de
momento, solo se ha plasmado en forma de ideas.

- Transición. Es cuando se realiza la implementación y el desarrollo para los clientes o usua-

rios. Deben tener tiempo para familiarizarse con el nuevo software.

- Al finalizar este ciclo, se entra en otra fase llamada mantenimiento.

Es una de las etapas más importantes ya que se solucionan los problemas o errores que
puedan surgir durante su implementación y también su posterior puesta en marcha.
Además, se incorporan actualizaciones teniendo en cuenta los requisitos del cliente
con el objetivo de que puedan cumplir la mayor cantidad de tareas. (TEKNEI, 2021)

2.2.6 Metodología Orientada a Objetos

Un modelo es una abstracción de algo, cuyo objetivo es comprenderlo antes de cons-
truirlo. Dado que los modelos omiten los detalles no esenciales, es más sencillo mani-
pularlos que manipular la entidad original. La abstracción es una capacidad humana
fundamental que nos permite enfrentarnos a la complejidad. Los ingenieros, artistas y
artesanos han estado construyendo modelos durante miles de años para probar los di-
seños antes de ejecutarlos. El desarrollo de sistemas hardware y software no es una
excepción. Para construir sistemas complejos, el desarrollador debe abstraer distintas
vistas del sistema, construir modelos utilizando notaciones precisas, verificar que los
modelos satisfacen los requisitos del sistema y añadir, gradualmente, detalles para tras-
formar los modelos en una implementación. (Rumbaugh, 1996).

El análisis y diseño orientado a objetos se basa en la identificación y organización de los

conceptos del dominio de la aplicación, no en su eventual presentación en un lenguaje de
programación.

Objeto. - Un objeto es cualquier cosa, real o abstracta, de la que almacenamos datos y mé-
todos para manipularla.

17
Clase. - Una clase es una implementación de un tipo de objeto. Especifica las estructuras
de datos y los métodos de operación permitidos que se aplican a cada uno de sus objetos.

Método. - Especificar cómo manipular los datos del objeto. Los métodos en un tipo de objeto
solo se refieren a la estructura de datos de ese tipo de objeto. No pueden acceder directamente
a la estructura de datos de otro objeto.

Petición. - Una petición que solicita una acción específica debe invocarse con uno o más
objetos como parámetros.

Una vez mencionadas las ideas básicas del modelo orientado a objetos, es importante cono-
cer tres conceptos importantes que distinguen los métodos OO de la ingeniería de software
tradicional:

1.- La encapsulación encapsula los datos y las operaciones que los procesan en un objeto
simple con nombre.

2.- La herencia permite heredar las propiedades y operaciones de una clase de todas las sub-
clases y objetos instanciados a partir de ella.

3.- El polimorfismo permite que muchas operaciones diferentes tengan el mismo nombre,
reduciendo el número de líneas de código necesarias para implementar el sistema y facili-
tando los cambios cuando se producen.

Como sabemos, los objetos están compuestos por atributos los cuales describen un objeto;
básicamente, son los que definen al objeto, a la vez que clarifican lo que se representa con
el objeto en el contexto del espacio del problema.

Cada una de las operaciones encapsuladas por un objeto proporciona una representación de
uno de los comportamientos del objeto. Las operaciones definen el comportamiento del ob-
jeto y cambian los atributos del mismo.

La Programación Orientada a Objetos (POO) es un paradigma de programación, esto es, un

modelo o un estilo de programación que proporciona unas guías acerca de cómo trabajar con
él y que está basado en el concepto de clases y objetos. Este tipo de programación se emplea
para estructurar un programa de software en piezas simples y reutilizables de planos de có-
digo (clases) para crear instancias individuales de objetos. (Pérez, 2021)

El objetivo de la Programación Orientado a Objetos es ya no centrarnos en la lógica pura de

los programas, sino empezar a pensar en objetos. En sistemas de gran tamaño, es de gran

18
ayuda, ya que en lugar pensar en funciones, pensamos en las relaciones o interacciones de
los diferentes componentes del sistema.

Los programadores realizan el diseño de un programa de software ordenando piezas de in-

formación y comportamientos que tienen relación en una plantilla llamada clase.

Posteriormente, crean objetos individuales partiendo de la plantilla de clase. Todo el pro-

grama de software se ejecuta haciendo que varios objetos interactúen entre sí para crear un
programa más grande.

2.2.7. Lenguajes de Programación

Los lenguajes de programación son herramientas que permiten la creación o desarrollo de
software para computadoras, mediante los cuales se define y administra el comportamiento
de los dispositivos lógicos y físicos del equipo.

También se puede mencionar que un lenguaje de programación es el conjunto de símbolos

y palabras, a través de los cuales un usuario da instrucciones y órdenes para que la compu-
tadora los ejecute.

El objetivo principal los lenguajes de programación es escribir programas que logran la co-
municación usuario-máquina.

2.2.7.1 Clasificación de los Lenguajes de Programación

Existen diferentes clases de lenguajes de programación:

El Lenguaje Máquina: es el lenguaje que entiende directamente la computadora, utiliza el

alfabeto binario, es decir, el 0 y el 1.

Las cadenas binarias, compuestas por bits (0,1) son las que escriben las instrucciones para
que el microprocesador de la computadora entienda nuestras peticiones. El lenguaje máquina
fue el primer lenguaje de programación. Actualmente este lenguaje ya no se utiliza, debido
a su dificultad de uso y la gran cantidad de errores que se cometían al escribir cadenas bina-
rias.

19
Lenguajes de programación de bajo nivel: Son más fáciles de utilizar que el lenguaje de
máquina. Llamado también lenguaje ensamblador, es el programa informático que se en-
carga de traducir un archivo fuente, escrito en un lenguaje ensamblador por el programador,
a un archivo con código de máquina.

Este tipo de lenguajes pueden crear programas rápidamente, pero su curva de aprendizaje es
alta, son específicos del procesador de cada máquina, lo que implica que si se ejecuta el
programa en otro computador será preciso reescribir el programa desde el comienzo.

Lenguajes de programación de alto nivel: Se caracterizan porque su estructura semántica

es muy parecida a como escriben los humanos, permitiendo codificar algoritmos de una
forma mucho más natural, ya no utilizando lenguaje binario ni ensamblador.

Son más fáciles de aprender ya que usan palabras o comandos del lenguaje natural, general-
mente del inglés. Un ejemplo es BASIC, el lenguaje de programación más conocido.

Son varios los lenguajes de programación de alto nivel y tienen cada uno sus versiones, una
clasificación muy extendida desde el punto de vista de trabajar de los programas y la filosofía
de su creación es la siguiente:

Lenguajes de programación imperativos: Entre ellos tenemos el Cobol, Pascal, C y Ada.

Lenguajes de programación declarativos: El Lisp y el Prolog.

Lenguajes de programación orientados a objetos: El Smalltalk y el C++.

Lenguajes de programación orientados al problema: Son aquellos lenguajes específicos

para gestión.

Lenguajes de programación naturales: Son los nuevos lenguajes que pretender aproximar
el diseño y la construcción de programas al lenguaje de las personas.

Lenguajes de Programación Según su Generación

Lenguajes de programación de primera generación: El lenguaje máquina y el ensambla-

dor.

Lenguajes de programación de segunda generación: Los primeros lenguajes de progra-

mación de alto nivel imperativo (FROTRAN, COBOL).

20
Lenguajes de programación de tercera generación: Son lenguajes de programación de
alto nivel imperativo, pero mucho más utilizados y vigentes en la actualidad (ALGOL 8,
PL/I, PASCAL, MODULA).

Lenguajes de programación de cuarta generación: Se utilizan en aplicaciones de gestión

y manejo de bases de datos (NATURAL, SQL).

Lenguajes de programación de quinta generación: Creados para la inteligencia

artificial y para el procesamiento de lenguajes naturales (LISP, PROLOG).
(Monterde, 2017)

2.2.8. ¿Qué es un CMS?

CMS son las siglas en inglés de Content Managment System, que significa Sistema de Ges-
tión de Contenidos. Un CMS es un software online que nos ayuda a elaborar sitios web de
una forma fácil, rápida e intuitiva, a administrar contenidos dinámicos como blogs, e-com-
merce, etc, desde una interfaz gráfica y mantenerlos actualizados. Permite que un usuario,
sin conocimientos de programación, pueda elaborar sitios web gracias a los plugins y exten-
siones que ofrece, ya que estos brindan funciones adicionales según las necesidades del usua-
rio o del cliente, que van desde plugins para diseño del sitio, hasta optimizadores para los
motores de búsqueda, optimizadores de carga, seguridades, etc…Existen plugins que son
gratuitos y otros ya más completos y con más funcionalidades, tienen costo.

Se pueden encontrar una gran variedad de CMS, lo importante es saber escoger el mejor
según los requerimientos del cliente. Entre los más utilizados, se pueden mencionar
WordPress, Joomla, Drupal, Typo3.

2.2.8.1 WordPress

WordPress es el Gestor de Contenidos más utilizado a nivel mundial para la creación de

páginas web, es un software de código abierto, gratuito, creado en el año 2003 por WordPress
Foundation, que permite publicar contenido web de una manera sencilla.

WordPress está compuesto por tres partes:

Core. - Que son los archivos que se descargan desde la página oficial de Wordpress.org, y
que deberán ser ejecutados en un servidor web después de ser instalados.

21
Temas. - Son los que se encargan del diseño y la apariencia de la página web, WordPress
tiene un repositorio gratuito de más de 4000 temas gratuitos a disposición de sus usuarios,
de donde se puede escoger el que más se ajuste a lo que se va a diseñar.

Plugins. - Los plugins son funcionalidades extra que ofrece el CMS, WordPress cuenta con
un repositorio de aproximadamente 60.000 plugins gratuitos, donde se puede encontrar lo
necesario para el diseño a realizar. Algunos ejemplos de plugins son: WooCommerce para
tiendas en línea, Elementor para el diseño del sitio, Gravity Forms para formularios y mu-
chos más.

2.2.9. ¿Qué es XAMPP?

XAMPP es una herramienta que ayuda a los programadores a probar sus desarrollos en un
servidor local. Sus siglas significan X: Multiplataforma, A: Apache, M= MySQL, P: PHP,
P= Perl.

Es una aplicación multiplataforma, es decir se puede usar en Windows, Linux y macOS.

Apache es un HTTP, es decir un servidor web multiplataforma, se utiliza para entregar con-
tenido web como archivos, documento e imágenes que son solicitados al usuario.

Es ideal para realizar pruebas de proyectos desarrollados con distintas tecnologías, previo a
lanzarlos al internet.

2.2.10. ¿Qué es PHP?

El lenguaje PHP, es un lenguaje de programación que permite el desarrollo web o aplicacio-
nes web dinámicas, el cual es apto para incrustar el lenguaje HTML, siempre siguiendo al-
gunas reglas establecidas.

Además, el lenguaje PHP favorece a la conexión entre el servidor y a la interfaz del usuario.

2.2.10.1. ¿Para qué sirve PHP?

PHP puede ser utilizado para un gran número diferente de aplicaciones, puesto que es un
lenguaje de programación de código abierto, lo que significa que permite a los desarrollado-
res editar su estructura, y debido a esto, aplicarse en cualquier proyecto.

22
2.2.10.2 Ventajas de PHP

- Lenguaje libre, el cual puede ser editado fácilmente por cualquier desarrollador o pro-
gramador.
- Dispone de una sintaxis muy limpia, por lo que la curva de aprendizaje es menor que
otros lenguajes de programación.
- Permite crear entornos de trabajo fácilmente.
- Dispone de una instalación de lo más sencilla.
- Se integra de una manera muy simple en la base de datos.
- Existe una gran comunidad, la cual es muy activa, y permite que este en una constante
evolución y adaptación a las novedades.
- Es el lenguaje de programación más usado mundialmente.
- PHP es un lenguaje multiplataforma, por lo tanto, se puede usar en diversas aplicaciones
y entornos profesionales.
- El código se ejecuta en el lado del servidor, y en el navegador se ejecuta en HTML.
- Actualmente, permite ser usado en un gran número de bases de datos como: Oracle,
MySQL, Interbase, SQLite, Sybase, PostgreSQL, SQL Server, entre otras más.
- Ofrece seguridad frente a ataques informáticos llevados a cabo por hackers.
- Dispone de múltiples extensiones, por lo que es uno de los lenguajes usados en proyectos
con una alta dificultad.
- Soporta gran cantidad de datos.

2.2.10.3 Desventajas

- Se necesitan conocimientos profundos para configurar las brechas de seguridad que

puede haber en el servidor.
- El código fuente no se puede ocultar con facilidad.
- Para su ejecución, es necesario un servidor.

- Se concluye que el lenguaje PHP, es un lenguaje muy poderoso, versátil, y por ello su
uso ha ido creciendo cada vez más. Es un lenguaje de programación del lado del servidor,

23
 que permite realizar infinidad de proyectos. Su curva de aprendizaje es muy baja, siendo
perfecto para iniciar en el campo de programación.

2.2.11. Qué es HTML?

HTML (Hyper Text Markup Lenguage) es un lenguaje de marcado de hypertexto, que se

utiliza para codificar y estructurar las páginas web, mediante marcadores o etiquetas que se
escriben entre comillas angulares < >, los que indican a los navegadores de dónde obtener
los recursos para representarlos y en el orden, secuencia y forma que debe hacerlo.

Los programadores pueden crear y estructurar párrafos, enlaces, secciones en una página
web utilizando etiquetas, elementos y atributos.

Elementos son los componentes principales de una página web.

Las etiquetas indican al navegador el inicio y fin de cada elemento.

Los atributos definen las características.

2.2.12. ¿Qué es CSS y para qué sirve?

Es un lenguaje de hojas de estilo en cascada, (Cascade Style Sheets) que se usa para dar
estilo y diseñar los elementos escritos en un lenguaje de marcado como es HTML, separando
el contenido, de la representación visual del sitio.

Para aplicar estilos a un documento HTML, en la hoja CSS, el selector apunta a un elemento
HTML que deseemos estilizar, luego viene un bloque de declaración donde se incluyen una
o más declaraciones separadas por punto y coma, cada declaración debe tener un nombre de
la propiedad CSS y un valor, separados por dos puntos. Los bloques de declaración CSS
deben estar entre llaves.

2.2.13. Base de Datos

Una base de datos es la recolección organizada de información o datos estructurados, que se
guarda de forma electrónica en un sistema informático. Por lo general, está controlada por
un sistema de gestión de bases de datos (DBMS). Los datos, el DBMS, junto con las aplica-
ciones asociadas a ellos, se denominan sistemas de bases de datos.

24
Los datos se estructuran en filas y columnas en una serie de tablas para mejorar la eficacia
del procesamiento y la consulta de datos. De esta manera, se puede acceder, gestionar, mo-
dificar, actualizar, controlar y organizar fácilmente los datos. La mayoría de las bases de
datos utilizan un lenguaje de consulta estructurada llamado SQL, para escribir y consultar
datos.

SQL es un lenguaje de programación que utilizan casi todas las bases de datos relacionales
para consultar, manipular y definir los datos, además de para proporcionar control de acceso.
(ORACLE, 2014)

2.2.13.1 ¿Qué es MySQL?

MySQL es un sistema de gestión de base de datos (SGBD) de código abierto, de propiedad

de Oracle. Utiliza modelo cliente-servidor, es decir, que los ordenadores que instalan y eje-
cutan el software de gestión de base de datos se denominan clientes. Cada vez que necesitan
acceder a los datos, los clientes se conectan al servidor del sistema de gestión de base de
datos y le solicitan la información que necesitan. El servidor se la brinda siempre y cuando
tenga los derechos de acceso.

Además de utilizarse como sistema de gestión de base de datos, también es bastante

frecuente encontrarse MySQL funcionando con los sistemas operativos, servidores y
lenguajes de programación de Linux, Apache y PHP/Perl/Python para desarrollar
aplicaciones web, como webs dinámicas. LAMP son las iniciales de Linux, Apache,
MySQL y PHP/Perl/Python cuando se habla de MySQL. (Information, 2019)

2.2.14. Interfaces Graficas

La Interfaz gráfica de usuario o GUI (Graphic User Interface) es el entorno visual de imáge-
nes y objetos mediante el cual una máquina y un usuario interactúan. En los años setenta, las
GUI empezaron a reemplazar a las interfaces de línea de comando (CLI), permitiendo que
la interacción con las computadoras fuera más sencilla e intuitiva.

La principal función de las GUI es simplificar la comunicación entre una máquina o un sis-
tema operativo y un usuario. Antes de que se desarrollaran y popularizaron las GUI, solo las
personas con conocimientos profundos de informática podían usar un computador, pero las
interfaces gráficas sustituyeron la complejidad de los comandos por acciones predetermina-
das simbolizadas por elementos visuales muy sencillos de comprender.

25
Es importante contar con una muy buena GUI, ya que se considera que un 68% de los visi-
tantes que abandonan un sitio web, lo realizan debido a que la experiencia de usuario, inclu-
yendo la Interfaz, no se encuentra optimizada de acuerdo a sus expectativas y necesidades.

En la actualidad, los elementos visuales de una interfaz son muy similares en esencia, y los
diseñadores pretenden hacerlos más amigables e intuitivos, tomando en cuenta que los dis-
positivos móviles ya no requieren de ratón o puntero, ya que sus pantallas son táctiles.

Una buena GUI se caracteriza por:

- Ser sencilla de comprender y usar

- La curva de aprendizaje es rápida
- Los elementos principales son muy identificables
- Facilitar y predecir las acciones más comunes del usuario
- Está correctamente ordenada la información mediante menús, iconos, barras, etc.
- Las operaciones son rápidas, intuitivas y reversibles
- La interfaz indica claramente el estado del sistema o las operaciones, y ofrece elementos
de ayuda.
- La navegabilidad y la usabilidad son óptimas.

2.2.15. Hardware
Hardware es una palabra de origen inglés, se refiere a los elementos físicos y tangibles de
un sistema informático.

2.2.15.1. Equipos de Escritorio

Un equipo de escritorio es un computador que se utiliza en un sitio fijo, básicamente por su

tamaño, sin embargo, son muy funcionales para actividades cotidianas, ya que se pueden
encontrar en cajas registradoras, en hospitales, en bancos y en escuelas. Pueden tener distin-
tos modelos tanto físicos, como configuraciones en cuanto a su capacidad de procesamiento,
memoria, disco duro, unidades ópticas, etc...

26
2.2.15.2 Equipos Portátiles

Llamados también laptops, son equipos personales que se caracterizan por su facilidad de
transportación. Dependiendo de sus características, muchos son diseñados para soportar soft-
ware y archivos igual de robustos a los que procesa un computador de escritorio.

2.2.15.3 Dispositivos Móviles

Un dispositivo móvil es un aparato generalmente pequeño, que tiene capacidad de procesa-

miento, memoria RAM, conexión a redes, y que se diseñó con el objetivo de brindar movi-
lidad a los usuarios, es decir que desde cualquier lugar, puedan acceder a los servicios ofre-
cidos, favoreciendo de esta manera al comercio electrónico por ejemplo.

En muchas ocasiones pueden ser sincronizados con algún sistema de la computadora para
actualizar aplicaciones y datos.

Como ejemplos de dispositivos móviles podemos mencionar los teléfonos celulares, smartp-
hones, tablets, ipads, gps, entre los más utilizados.

2.2.16 Manual de Usuario

Manual es una publicación donde consta lo más importante y sustancial de una materia.
Consiste en una guía que ayuda a entender el funcionamiento de algo.

Usuario es quien utiliza o hace uso de un servicio.

Por lo tanto, un manual de usuario es un documento de comunicación técnica que busca

brindar asistencia a los sujetos que usan un sistema.

En los manuales, se encuentran las instrucciones para que un usuario pueda utilizar un de-
terminado producto o servicio, tal como se incluyen los manuales en los dispositivos elec-
trónicos, hardware de computadora y aplicaciones.

Los manuales de usuario se pueden encontrar tanto de forma física, como en formato digital.

2.2.16.1 Objetivos

- Mostrar a los usuarios finales las características y las formas de funcionamiento del servicio
brindado.
- Facilita el registro de solicitud de conectividad, y reportes de errores o fallas correspon-
dientes al producto en uso.

27
- Enseña la forma de utilizar un sistema, a través de una descripción detallada e ilustrada
mediante opciones.
- Obtener toda la información por medio de una explicación detallada e ilustrada de cada
página que lo conforman.
- Satisfacer las necesidades reales de la empresa
- Contar con instrucciones apropiadas de uso, manejo y conservación.
- Hacer uso racional y adecuado, por parte de los destinatarios.
- Brindar una adecuada flexibilidad para cubrir diversas situaciones.
- Tener un proceso continuo de revisión y actualización.
- Facilitar a través del diseño el uso y actualización.
- Debe estar formalizado las jefaturas correspondientes de la empresa.

2.2.17 Manual Técnico

El manual técnico de una solución de software o de un Sistema de Información debe estar
orientado a un público conocedor de los aspectos técnicos, tiene como propósito ilustrar so-
bre la definición, diseño, organización y estructura del sistema o solución al personal encar-
gado de mantener la prestación del servicio o servicios ofrecidos por el sistema o solución,
estos lectores incluyen desarrolladores, arquitectos, ingenieros de pruebas etc. (información,
2020)

Brinda el conocimiento del sistema desarrollado con sus características y funcionalidades

guiándolo a través del contenido y los motivos por el cual fue creado, teniendo en cuenta
que dentro del ciclo de vida de los sistemas de información la documentación técnica y de
operaciones es vital y que además es un entregable obligatorio por parte de los desarrollado-
res.

2.2.17.1 Contenido del Manual Técnico

El manual técnico debe contemplar los siguientes aspectos:

2.2.17.1.1. Descripción del Sistema de Información Desarrollado

- Índice del Contenido

- Introducción
- Objetivos del Sistema

28
2.2.17.1.2 Diseño técnico del sistema de información

Esquema o modelo de requerimientos: Reglas de negocio implementadas dentro del sis-

tema de información.

Los requerimientos conforman la definición formal del sistema y la especificación de reque-

rimientos aseguran que el software cumpla con todas las expectativas de los usuarios. En
esta fase se deben definir:

- Casos de uso del sistema.

- Historias de usuario
- Documento de requerimientos
- Acumulado del producto
- Atributos de calidad
- Preguntas de negocio

Software base del sistema y prerrequisitos:

- Requerimientos mínimos y recomendados de hardware (Disco Duro, Memoria, CPU, etc.)

- Requerimientos mínimos de software con sus respectivas marcas y versión.
- Sistema operativo de los servidores.
- Servidores de Bases de datos admitidos u otros mecanismos de persistencia de datos.
- Servidores de aplicación.
- Servidores web con su versión y sistema operativo.
- Navegadores compatibles y su versión.
- Lenguajes de programación utilizados en el desarrollo.

Componentes y estándares:

Donde es necesario describir los siguientes puntos:

- Librerías, frameworks, controladores o plugins.

- Estándares de codificación y patrones de diseño.

- Estándares de identidad corporativa y Look & Feel.

- Puertos de comunicación

- Protocolos de seguridad

29
- Interfaces con otros sistemas

Modelo de datos:

Donde debe constar el modelo de datos tanto lógico como físico. Para representar un modelo
de datos se puede utilizar:

- Modelo entidad-relación
- Modelo de red
- Modelo de base de datos orientado a objetos
- Modelo entidad-atributo-valor
- Modelo en Estrella

Funcionalidad y servicios ofrecidos:

Despliegue y configuración de los componentes que conforman el sistema de información.

Organización de componentes.

Muestra un resumen de la arquitectura física. Para esto se utilizan:

- Diagrama de componentes
- Diagrama de servicios expuesto por el sistema
- Diagramas de clases

Instalación.

Este paso es uno de los que brindan el conocimiento necesario para asegurar el paso a pro-
ducción del sistema y el control para su operación y mantenimiento.

Para la instalación se requiere:

- Pre-requisitos de instalación del sistema.

- Script de instalación de la Base de datos.
- Fuentes de instalación de los componentes de software.
- Scripts para carga inicial de datos (si aplica).
- Paso a paso para la instalación de los servidores y configuración de los aplicativos.

30
Configuración.

Se refiere a la parametrización necesaria para la puesta en marcha del aplicativo en un am-

biente productivo, la seguridad, los perfiles requeridos para su uso y roles de autenticación
y autorización, los parámetros que eventualmente requieran algunos componentes como fra-
meworks y librerías etc.

Despliegue.

Debe constar la información necesaria para la instalación y puesta en marcha del sistema de
información, identificando los servidores utilizados (aplicaciones, negocio y base de datos),
la configuración de puertos y distribución, basado en los diagramas de despliegue y de ser-
vicios definidos en la arquitectura, el que se debe referenciar en este documento.

Resolución De Problemas.

Aquí se deben considerar todos los posibles escenarios de error que puedan presentarse, sin
entrar en mayor detalle ya que se desea proveer una manera rápida de resolver una situación
de error. Basta proveer el escenario del error, los síntomas típicos, las posibles causas, el
diagnóstico y el paso a paso de la solución.

2.2.18. Requerimiento de Software y Hardware del Proyecto.

Los requerimientos técnicos a utilizar se los clasifican en 2 grupos:
Software y el Hardware.
Los requerimientos de software de nuestro proyecto de Desarrollo del Sitio Web para el
control de Agendamiento de Citas Médicas para la Institución Clínica Alborada C. A son:

XAMPP :
Servidor de aplicación: Apache
Base de datos: MySQL
Administrador base de datos: PhpMyAdmin

Sistema Gestión de Contenidos (CMS): WordPress (HTML, PHP y CSS para dar estilo
al sitio web).

31
Con respecto al Hardware se utilizarán 3 equipos portátiles con las siguientes características:

PORTATIL MARCA: HP PAVILION

- Procesador AMD Ryzen 7 5700U with Radeon Graphics 1.80 GHz

- 16.0 GB memoria RAM (15.3 GB utilizable)

- Disco Duro: 1TB sata.

- Sistema operativo Windows 10 de 64 bits.

Los cuales van a ser utilizados respectivamente por los 3 participantes de este proyecto.

3.- Marco Metodológico.

3.1.- Metodología de Investigación
En su definición pura, la metodología de investigación es el conjunto coherente y racional de
procedimientos y técnicas que se aplican de manera ordenada y sistemática en la realización
de un estudio; esta metodología determinará la forma en que los investigadores recaban, orde-
nan y analizan los datos obtenidos. (Los conceptos fundamentales de la metodología de
investigación, 2020)

3.1.1. Tipo de Investigación

Con el fin de que la investigación alcance los objetivos que hemos propuesto en este trabajo
de titulación, vamos a utilizar la Investigación de Campo.

Investigación de Campo

Según, (Arias, 2020) La investigación de campo recopila los datos directamente de la

realidad y permite la obtención de información directa en relación a un problema.

Se considera esencial este tipo de investigación para la realización de otras como son la
exploratoria y la correlacional. Sabiendo lo que buscamos, tendremos que recabar datos y
para ello realizamos un trabajo de campo.

Para esta investigación se hace uso de la técnica de encuestas y entrevistas para recopilar los
datos necesarios.

3.1.2 Métodos de la Investigación

Se realizó la investigación utilizando los siguientes métodos:

32
3.1.2.1 Método Científico
La investigación científica es un proceso donde se aplica el método científico, el cual ayuda a mejorar
el estudio, porque permite establecer contacto con la realidad con la finalidad de obtener información
relevante para entender, verificar, corregir o aplicar el conocimiento y formular nuevas teorías o
modificar las existentes e incrementar los conocimientos.

García Estrada, L. (2012). Técnicas de investigación de campo y documental: basado en com-

petencias. México D. F, Grupo Editorial Éxodo. Recuperado de https://elibro.net/es/ereader/is-
ter/153622?page=22.

3.1.3 Población y Muestra

La población en una investigación se compone por todos los elementos (personas, objetos,
organismos, historias clínicas) que participan en el tema definido y delimitado en la formu-
lación problemática. La cual se caracteriza por ser estudiada, medida y cuantificada, cono-
cida también como universo y debe delimitarse en forma clara en torno a sus características
de contenido, lugar y tiempo. Según su tipo de clasifican en Población Finita e Infinita.

Mientras que la Muestra es parte de una Población y puede ser definida como un Subgrupo
de la misma.

Para seleccionar la Muestra deben delimitarse las características de la Población para que
los resultados sean generalizables y debe ser proporcional al tamaño de la población la cual
debe ser preferentemente seleccionada por procedimientos aleatorios/probabilísticos

Gráfico 2. - De Tabla típica de Diferencias entre población y muestra.

33
3.1.4 Instrumentos Recolección De La Información
Los Instrumentos de recolección de información que vamos a utilizar en el proyecto son:
La entrevista y la encuesta.

3.1.4.1 Entrevista Definición

Se puede definir como concepto de entrevista una conversación entre dos o más personas. A
partir de esto se crean roles como son entrevistador y entrevistados. El primero de estos
busca conocer o definir información sobre un tema particular a partir de la opinión del en-
trevistado.

El entrevistador llevará el control (Introducir el tema y realizar el cierre y conclusiones) y

hará preguntas en la entrevista.

Previamente el entrevistador se preparará con una serie de preguntas con el objetivo que el
entrevistado las responda con sus respectivos fundamentos y argumento.

En conclusión, una entrevista no es una conversación casual, al contrario, es un previo

acuerdo de comunicación en el cual se lleva intereses y fines definidos los cuales los conocen
tanto el entrevistador como el o los entrevistados.

3.1.4.1.1 Propuesta de Entrevista para CLINICA ALBORADA C.A.

1) ¿Actualmente cuál es el medio de registro de agendamiento de citas médicas?

2) ¿Considera el actual método de registro de citas como adecuado y seguro?

3) ¿Quién registra el agendamiento de citas médicas?

4) ¿Cómo da a conocer y a elegir los horarios de las diferentes citas Médicas?

5) ¿Cómo establece la confirmación o cancelación de una cita médica?

6) ¿Conocen sus Pacientes los médicos, especialidades y sus respectivos horarios estable-
cidos para un agendamiento medico?

7) ¿Cuántas personas intervienen en el agendamiento medico?

8) ¿Se levanta alguna información de la satisfacción del servicio ofrecido?

34
9) ¿Cuáles son los costó actuales que incurre la clínica en el agendamiento medico?

10) ¿Existen estadísticas del agendamiento Medico?

3.1.4.2 Encuesta Definición

La encuesta se puede definir como una herramienta que permite estructurar una entrevista.
Nos permite agrupar datos y realizar muestreos y además responder interrogantes.

Podemos crear categorías y segmentos con el fin de obtener un porcentaje a partir de una
muestra.

Es utilizado en estudios de mercados como, por ejemplo:

- Saber la aceptación de un nuevo servicio o producto.

- Conocer de un producto la calidad.

- Mejoras en un servicio o producto.

- Aceptación del producto o servicio.

- Calidad vs Precio del producto o servicio.

3.1.4.2.1 Propuesta de Encuesta CLINICA ALBORADA C.A.

1) ¿En Base a su experiencia los servicios médicos ofrecido por Clínica Alborada son?

a) Malo
b) Bueno
c) Excelente

2) ¿De estas especialidades cuales son las más usas por usted?

a) Pediatría
b) Ginecología
c) Medica general

3) ¿Las instalaciones médicas son cómodas y confortables y cuentan con bioseguridad?

a) No
b) Algo
c) Totalmente

35
4) ¿La atención del personal administrativo de Clínica Alborada los define como?

a) Mala
b) Buena
c) Excelente

5) ¿Los costos vs beneficio en base al servicio recibido son?

a) Bajo
b) Altos
c) Acorde al servicio entregado

3.2.- Metodología de Desarrollo

Para el proyecto de Desarrollo de un Sitio Web para el agendamiento de citas médicas para
Clínica Alborada, vamos a utilizar la metodología ágil XP Programming.

Según, (Beck, 1999) XP es una metodología ágil centrada en potenciar las relaciones interper-
sonales como clave para el éxito en desarrollo de software, promoviendo el trabajo en equipo,
preocupándose por el aprendizaje de los desarrolladores, y propiciando un buen clima de tra-
bajo. XP se basa en realimentación continua entre el cliente y el equipo de desarrollo, comu-
nicación fluida entre todos los participantes, simplicidad en las soluciones implementadas y
coraje para enfrentar los cambios. XP se define como especialmente adecuada para proyectos
con requisitos imprecisos y muy cambiantes, y donde existe un alto riesgo técnico.

Los principios y prácticas son de sentido común pero llevadas al extremo, de ahí proviene su nombre.
Kent Beck, el padre de XP, describe la filosofía de XP sin cubrir los detalles técnicos y de implanta-
ción de las prácticas. Posteriormente, otras publicaciones de experiencias se han encargado de dicha
tarea.

3.2.1.- Metodología Xp – Fase De Análisis

3.2.1.1 Problemática

Podemos definir que en la fase de análisis el equipo del proyecto debe de tener como punto
de partida el tema y la problemática.

36
Como Tema:
Desarrollo del Sitio Web para el control de Agendamiento de Citas Médicas para la Institu-
ción Clínica Alborada C. A.

El Problema:
Actualmente el proceso de agendamiento de citas en la clínica se lo efectúa de manera ma-
nual, el personal a cargo se demora mucho en realizarlo, hasta poder verificar la disponibi-
lidad de tiempo de los doctores que atienden en las distintas especialidades, lo que causa
malestar en los clientes.

El sitio web para el control de agendamiento citas médicas para la institución Clínica la
Alborada nace de la evaluación objetiva de las necesidades y oportunidades a potencializar,
ya que permitirá controlar y agendar las citas solicitadas por los pacientes, manteniendo una
información actualizada de los horarios de atención para los usuarios que deseen una con-
sulta en la Clínica.

Este desarrollo además de permitir un mejor servicio a los pacientes, también facilitará y
organizará el trabajo del área administrativa con un correcto manejo de la información, per-
mitiéndoles ser más eficientes y lograr atender a una mayor cantidad de clientes que necesi-
tan agendar citas para las distintas especialidades que ofrece la clínica, evitando congestio-
namiento en las instalaciones y pérdida de tiempo.

¿Qué efecto tendrá en la Clínica alborada la implementación del módulo de control de agen-
damiento de citas para mejorar la atención a los pacientes y el control estadístico de la insti-
tución?

3.2.1.2 Planificación del Proyecto

En las siguientes gráficas, se puede apreciar la programación de los trabajos que se realizan
en el proyecto, los cuales tienen asignados fecha y tiempo de ejecución, podemos apreciar
en forma de tablas y también de manera gráfica.

37
En Forma de Tabla:

En Forma de Diagrama Gantt:

38
3.2.1.3 Requerimiento de Software

En la fase del análisis se debe definir qué tipo de software se va a usar para el Desarrollo del
Sitio Web para el control de Agendamiento de Citas Médicas para la Institución Clínica
Alborada C. A.

Se pueden mencionar los siguiente:

3.2.1.3.1 XAMPP

Es un paquete de software libre, el cual nos permite tener las diferente herramientas y servi-
cios a utilizar en este proyecto. De esta manera podemos trabajar con este conjunto de he-
rramienta en la parte de base de datos, lenguaje de programación y servidor web Apache.

3.2.1.3.2 MySQL
Esta es una base de datos ampliamente utilizada, la cual nos facilita el almacenamiento y la
gestión de los datos en un ambiente web.

3.2.1.3.3 WordPress

Este CMS se lo ha elegido por ser muy sencillo, práctico y potente. Además, es el principal
CMS para desarrollo de sitios web, con lo cual se está controlando a futuro el poder mantener
un soporte a largo plazo tanto del CMS como del sitio Web desarrollado.

3.2.1.3.4 PHP

Es un lenguaje de propósito general que se ejecuta del lado del servidor. Se puede definir
como uno de los mejores lenguajes de programación que proporciona gran facilidad a la hora
del desarrollo de sitios web. Además, es el lenguaje con el cual se desarrolló el CMS
WordPress.

3.2.1.3.5 HTML

Sin duda HTML esta como base de cualquier proyecto web, ya que por medio de este se
define la estructura de las páginas a desarrollar. El uso del mismo se puede hacer de forma
directa por medio de codificación o indirectamente por medio de un CMS como es en el caso
de WordPress.

39
3.2.1.3.6 CSS

Por medio de CSS se podrá dar estilos a una estructura realizada en HTML, también cabe
mencionar que el uso del CSS se da de manera directa por medio de programación o indirecta
por medio de CMS como es en este caso WordPress.

3.2.1.3.7 Dominio

Para poder referenciar y acceder a un sitio web, necesariamente deberá contar con un nombre
que sea fácil de recordar y que este asociado naturaleza del sitio web desarrollado. Este
nombre se lo conoce como Dominio.
En este caso como ejemplo el siguiente dominio:

http://www.proyectos-rosales.com/

3.2.1.3.8 Hosting

Cuando se hace referencia al Hosting, se trata de un espacio de alojamiento del sitio desa-
rrollado y que está publicado en la internet. El cual va a tener una especificación técnica
previamente analizada según la necesita del sitio a alojarse. Especificaciones técnicas como
cantidad espacios a utilizar, velocidad y cantidad de accesos de usuarios y tipos de tecnología
usada para poder desarrollar un sitio web.
Este hosting trabaja en conjunto con el dominio el cual nos permite el acceso de manera
transparente al sitio web desarrollado.

3.2.1.4 Requerimiento de Hardware

3.2.1.4.1 Computador para el Equipo de Proyecto

Con respecto al Hardware, los miembros del equipo de trabajo, van a utilizar 3 equipos por-
tátiles con las siguientes características:

40
PORTATIL MARCA: HP PAVILION

- Procesador

- AMD Ryzen 7 5700U with Radeon Graphics 1.80 GHz

- Memoria RAM

- 16.0 GB (15.3 GB utilizable)

- Disco Duro

- Disco Duro: 1TB

- Sistema Operativo

- Windows 10 y Windows 11 de 64 bits.

3.2.1.4.2 Computador para el cliente

El computador donde se podrá ejecutar el sitio web de agendamiento será un equipo de ca-
racterísticas medias, este proyecto se puede acceder mediante un navegador, desde un celu-
lar, Tablet o equipo de escritorio.

Se menciona un equipo que en cualquier hogar u oficina es encontrado sin ningún tipo de
problema:

Procesador: Intel Core I3

Memoria RAM: 4GB

Disco Duro: 500 GB

Sistema Operativo: Cualquier sistema operativo que permita ejecutar cualquier navegador
web que se esté actualmente usando.

41
3.3 Casos de Uso (Actores del Proyecto).

Los casos de uso contienen una descripción textual de todas las maneras que los actores
previstos podrían trabajar con el sitio web. Estos no describen ninguna funcionalidad interna
del sistema, ni explican cómo se implementará.

Una vez identificados los Usuarios del sistema, se exponen los casos de uso de los mismos.

3.3.1 Paciente

El paciente debe llenar un formulario en el sitio web y registrarse, donde se le asignará un

usuario y contraseña, para posteriormente agendar su cita médica con el doctor y horario a
su elección y de acuerdo a su necesidad.

3.3.2 Licenciada en Enfermería (Auxiliar de Enfermería)

La Licenciada o Auxiliar en enfermería debe ingresar con su usuario y contraseña para poder
revisar y gestionar los agendamientos realizados por el Paciente y así comunicar a los Mé-
dicos.

3.3.3 Administrador del Sitio Web

El Administrador es el encargado de generar los reportes diarios de consulta externa en base

a los datos del Sitio Web, respaldar la información diaria, crear o eliminar usuarios del sis-
tema, crear o eliminar Médicos de la lista, crear los horarios y días de atención y, por último,
tendrá comunicación con el equipo desarrollador para reportar cualquier incidencia o nuevo
requerimiento.

42
3.4 Gráfica de Caso de Uso

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

3.5 Historias de Usuario

Las historias de Usuario deben ser escritas en lenguaje común para que puedan ser entendi-
das por los clientes, desarrolladores y usuarios, representando los requerimientos con los que
debe cumplir el sitio web.

Estas historias describen las actividades de todos los integrantes del equipo y los procesos
del sitio web, comúnmente las historias de usuario se expresan de la siguiente forma:

perfil + necesidad + propósito

Se debe considerar para las historias de usuario a los Elementos, Entidades y Usuarios, los
cuales según nuestro proyecto serán los siguientes:

43
3.5.1 Elementos

Tarjetas

Estas reflejan los elementos más importantes de la historia de usuario y manifiestan el valor
que se quiere conseguir desde el punto de vitas del usuario.

Conversación

Es necesario tener una conversación sobre el contenido de las tarjetas para responder a cues-
tiones sobre el valor y sobre el resultado esperado de la implementación.

Confirmación

Acuerdo que refleja que todas las personas implicadas entienden cuáles son los elementos,
valor y resultados esperados de la historia de usuario.

Entidades

En este caso nuestra entidad es el cliente, La Clínica Alborada, para el área de Consulta
Externa específicamente.

Usuarios

Los usuarios de nuestro proyecto son: El Paciente, Licenciada Enfermera y el Administrador

del área de sistemas de la clínica.

En base a lo antes expuesto, las historias de usuario para el agendamiento de citas médicas
de la Clínica Alborada son las siguientes:

 Acceso al sistema
 Registro Paciente
 Registro de Citas Médicas.
 Registro Licenciada de Enfermería
 Gestión Citas Médicas Licenciada de Enfermería
 Gestión de Usuario por el Administrador
 Generación Reportes (Administrador)
 Respaldo de la Información (Administrador)

44
3.6 Tarjetas de Historias de Usuario

Historias de Usuarios
Nu- 1 Nombre: Acceso al Sistema
mero:
Usua- Todos los Usua- Tipo de Activi- Nueva
rio: rios dad:
(Nueva, Corrección, Mejorada)
Prueba Funcional/Acepta- Referencia a Historia Previa:
ción:
No Aplica.
Los usuarios puede ingresar al
sitio web digitando su nick y su
contraseña, previamente crea-
dos.

Programador Responsable: Iteración Asignada: 1

Mario Alberto Rosales Hart
Prioridad en Negocio: ALTO Puntos Estimados: 5 días
(Alto/Medio/Bajo)
Riesgo en Desarrollo: MEDIO
(Alto/Medio/Bajo)
Elementos a Terminar:

Base de datos (Tabla usuarios, plantillas de alta de nick y contraseñas para el registro
en el sitio web).

Descripción:

En esta iteración, los usuarios ingresan al Sitio Web mediante credenciales.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

45
Historias de Usuarios
Nu- 2 Nombre: Registro de Paciente
mero:
Usua- Paciente Tipo de Activi- Nueva
rio: dad:
(Nueva, Corrección, Mejorada)
Prueba Funcional/Acepta- Referencia a Historia Previa:
ción:
No Aplica.
El usuario puede registrar sus
datos personales (Alta) desde el
sitio web, quedando almace-
nada esta información en el
back end.
Programador Responsable: Iteración Asignada: 1
Mario Alberto Rosales Hart
Prioridad en Negocio: ALTO Puntos Estimados: 5 días
(Alto/Medio/Bajo)
Riesgo en Desarrollo: MEDIO
(Alto/Medio/Bajo)
Elementos a Terminar:
Base de datos (Tabla Paciente, Plantillas de Alta de Paciente).

Descripción:
Al ingresar en esta opción el Paciente o Usuario podrá registrar la información
personal básica y fundamental para posterior ingreso al sitio Web.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

Historias de Usuarios
Nu- 3 Nombre: Registro de Citas
mero: Médicas
Usua- Paciente Tipo de Activi- Nueva
rio: dad:
(Nueva, Corrección, Mejorada)
Prueba Funcional/Acepta- Referencia a Historia Previa:
ción:
Registro de Paciente, Acceso al Sitio Web.
El Paciente puede seleccionar
el horario, especialidad y al
doctor según su necesidad.
Programador Responsable: Iteración Asignada: 1
Juan Carlos Lladó
Prioridad en Negocio: ALTO Puntos Estimados: 4 días
(Alto/Medio/Bajo)
Riesgo en Desarrollo: MEDIO
(Alto/Medio/Bajo)

46
Elementos a Terminar:

Base de datos (Tabla Citas Médicas, Plantillas de Citas Médicas, Tabla Médi-
cos, Tabla Especialidad, Tabla Horario, Tabla Paciente, Tabla Observaciones).
Descripción:
Al ingresar a esta opción el paciente puede seleccionar, según la necesidad, la
especialidad, el médico y el horario en el sitio Web.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

Historias de Usuarios
Nu- 4 Nombre: Registro Lcda. En-
mero: fermería
Usua- Lcda. Enfermería Tipo de Activi- Nueva
rio: dad:
(Nueva, Corrección, Mejorada)
Prueba Funcional/Acepta- Referencia a Historia Previa:
ción:
No Aplica.
La Lcda. Enfermería puede re-
gistrar sus datos personales
(Alta) desde el sitio web y esta
información queda almacenada
en el back end.
Programador Responsable: Iteración Asignada: 1
Mario Alberto Rosales Hart
Prioridad en Negocio: ALTO Puntos Estimados: 5 días
(Alto/Medio/Bajo)
Riesgo en Desarrollo: MEDIO
(Alto/Medio/Bajo)
Elementos a Terminar:
Base de datos (Tabla Licenciadas, Plantillas de Alta de Paciente).
Descripción:
Al ingresar a esta opción la Lcda. Enfermería podrá registrar la información per-
sonal básica y fundamental para posterior ingreso al sitio Web.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

47
Historias de Usuarios
Nu- 5 Nombre: Gestión de Citas Médicas
mero: Lcda. Enfermería
Usua- Lcda. Enfermería Tipo de Activi- Nueva
rio: dad:
(Nueva, Corrección, Mejorada)
Prueba Funcional/Acepta- Referencia a Historia Previa:
ción:
Registro de Paciente, Acceso al Sitio Web.
La Lcda. de Enfermería podrá vi-
sualizar los horarios selecciona-
dos previamente por los pacientes,
para informar al médico y gestio-
nar la atención.
Programador Responsable: Iteración Asignada: 1
Juan Carlos Lladó
Prioridad en Negocio: ALTO Puntos Estimados: 2 días
(Alto/Medio/Bajo)
Riesgo en Desarrollo: MEDIO
(Alto/Medio/Bajo)
Elementos a Terminar:
Base de datos (Visualización de reporte Tabla del Citas Médicas, Plantillas de Citas
Médicas) (Tabla Citas Médicas, Plantillas de Citas Médicas, Tabla Médicos, Tabla
Especialidad, Tabla Horario, Tabla Paciente, Tabla Observaciones.
Descripción:
En esta opción, la Lcda. de Enfermería podrá visualizar los horarios seleccionados previa-
mente por los pacientes, para informar al médico y gestionar la atención.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

48
Historias de Usuarios
Numero: 6 Nombre: Gestión de Usuario
por el Administrador
Usuario: Administrador Tipo de Actividad: Nueva
(Nueva, Corrección, Mejorada)
Prueba Funcional/Aceptación: Referencia a Historia Previa:

El Administrador podrá gestionar los Registro en Sitio Web, Acceso al Sitio Web.
usuarios previamente registrados
para asignar permisos, realizar actua-
lizaciones, eliminaciones, otros.
Programador Responsable: Iteración Asignada: 1
Mario Alberto Rosales Hart
Prioridad en Negocio: ALTO Puntos Estimados: 5 días
(Alto/Medio/Bajo)
Riesgo en Desarrollo: MEDIO
(Alto/Medio/Bajo)
Elementos a Terminar:
Base de datos (Tabla de Usuarios, Tabla Licenciadas, Tabla Paciente, Plantillas de Alta
de Paciente).
Descripción:
En esta opción, el administrador podrá gestionar los usuarios previamente registrados
para dar permisos, realizar actualizaciones, eliminaciones, entre otros.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

49
Historias de Usuarios
Nu- 7 Nombre: Generación de Re-
mero: portes por el Ad-
ministrador
Usua- Administrador Tipo de Activi- Nueva
rio: dad:
(Nueva, Corrección, Mejorada)
Prueba Funcional/Acepta- Referencia a Historia Previa:
ción:
Registro en Sitio Web, Acceso al Sitio
El Administrador podrá ingresar a Web.
gestionar la reportería según datos
generados en base a la elección de
las citas médicas por parte de los
pacientes.
Programador Responsable: Iteración Asignada: 1
Lucía Alegría
Prioridad en Negocio: ALTO Puntos Estimados: 5 días
(Alto/Medio/Bajo)
Riesgo en Desarrollo: MEDIO
(Alto/Medio/Bajo)
Elementos a Terminar:
Base de datos (Tabla del Usuarios, Plantillas de Alta de Paciente).
Descripción:
En esta opción el administrador podrá gestionar la reportería, según datos gene-
rados en base a la elección de cita médicas por parte de los pacientes, en el sitio
web.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

50
Historias de Usuarios
Nu- 8 Nombre: Respaldos de In-
mero: formación por el
Administrador
Usua- Administrador Tipo de Activi- Nueva
rio: dad:
(Nueva, Corrección, Mejorada)
Prueba Funcional/Acepta- Referencia a Historia Previa:
ción:
No Aplica.
El Administrador puede realizar
respaldos de toda la información
del Sitio Web y sus procesos ges-
tionados en la base de datos.
Programador Responsable: Iteración Asignada: 1
Lucía Alegría
Prioridad en Negocio: ALTO Puntos Estimados: 5 días
(Alto/Medio/Bajo)
Riesgo en Desarrollo: MEDIO
(Alto/Medio/Bajo)
Elementos a Terminar:
Base de datos (Tabla Paciente, Tabla Licenciadas, Tabla Usuarios, Tabla Cita
Médica, Tabla Especialidad, Tabla Horario, Tabla Observaciones).
Descripción:
El Administrador puede realizar respaldos de toda la información del Sitio Web y sus
procesos gestionados en la base de datos.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

51
3.7 Diagramas de actividades de Proyecto.
Este diagrama de actividades constituye una matriz con todos los actores y los involucrados
del proyecto.

Especificación Caso de Uso “Desarrollo de un Sitio Web para el control de Agendamiento de

Citas Médicas Clínica Alborada C.A”

Nombre: Desarrollo del Sitio Web para El Control de Agendamiento de Citas Médicas
para La Institución Clínica Alborada C. A.
Actores: Paciente, Licenciada de Enfermería, Administrador del Sitio Web.
Procesos: Ingreso Usuario y Clave, Elección, Gestión y Agendamiento, reportearía y res-
paldo de Citas Médicas.
Flujos: Proceso, Descripción.

Actores
1) Paciente, se registra en el sitio.
3) Paciente, ingresa su usuario y contra-
seña
5) Paciente, agenda cita escogiendo la es-
pecialidad, médico y horario.
7) Lcda. Enfermería, ingresa su usuario y
contraseña en el sistema.
9) Lcda. Enfermería revisa y gestiona
agendamientos y comunica al médico.
11) Administrador, Ingresa al Sitio y
Gestiona Usuario, Horarios, reporte y
Respaldos.
Sistema
2) Creación de usuarios.
4) Verificación de login de usuarios y
contraseñas.
6) Se registra la cita médica en el sistema.
8) Verificación de login, usuario y contraseña.
10) Procesa la búsqueda de información de los
usuarios y sus respectivas citas.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

52
4. Fase de Diseño

4.1 Fase de Exploración.

Para el Desarrollo del Proyecto de Agendamiento de citas médicas para la Institución Clínica
Alborada C.A. de Guayaquil en el área de Consulta Externa.

El Alcance de proyecto se da al siguiente personal Administrativo y Médico de la Clínica

como: Administrador, Médicos, Asistente (Auxiliar de Enfermería), así como a los Pacien-
tes.

El Sitio Web muestra información de la Clínica, tal como misión, visión, especialidades,
servicios ofertados, galería de imágenes; y además ofrecerá la opción de agendamiento de
citas médicas en línea, lo que permitirá a la Institución Clínica Alborada tener un mejor
control y una búsqueda rápida y mejorada de pacientes. Este Sistema cubrirá los siguientes
procesos: registro, búsqueda, editar, actualizar, generar reportes y eliminar agendamiento de
citas médicas, logrando así agilidad en el modo en que se vienen desarrollando las activida-
des.

Con el desarrollo del sitio web, que permita a los pacientes de la Clínica Alborada agendar
citas vía remota, se logrará un mayor nivel de satisfacción del cliente, al sentir que es un
proceso que lo puede realizar desde la comodidad de su casa o lugar de trabajo.

A continuación, se detalla las personas que intervendrán en el desarrollo del sitio web de
agendamiento de citas médicas.

Miembro Grupo Rol Metodología

Mario Rosales Hart Grupo de Desarro- Desarrollo de Si-
Juan Carlos LLadó lladores del Sitio tio Web de Agen-
Lucia Alegría Web damiento de citas
médicas
Auxiliar de Enfermería Clínica Alborada Pruebas Revisión
(Consulta Externa) de Agendamiento
según las Especia-
lidades XP
Administrador (Ge- Clínica Alborada Encargado de
rente de Tics de la Clí- aprobación y
nica) pruebas del Sitio
Web de Agenda-
miento Médico.

Autores: Mario Rosales, Juan LLadó Lucia Alegría

53
4.2 Spike Arquitectónico.

Para el Desarrollo del Proyecto de Agendamiento de citas médicas para la Institución Clínica
Alborada C.A. de Guayaquil se utiliza el siguiente software:

 CMS WordPress
 Plugins de WordPress (Especializados de Agendamiento de Citas Médicas)
 Base de Datos MySQL

4.3 Entorno Local.

En el desarrollo en un entorno de Desarrollo Local se utiliza lo siguiente:

 Como Parte del Front-End CMS WordPress, el cual está basado en el lenguaje PHP
y el cual nos permite hacer uso de HTML y CSS sin ningún tipo de problema.

 Además, este proyecto se incorpora al CMS, Plugins el cual nos permite de manera
adecuada poder ampliar las funciones de nuestro diseño del proyecto de agenda-
miento de citas médicas.

 Como Back End y parte de Front End se utiliza la Base de Datos MySQL. Estas
configuraciones y diseños de tablas se componen de arreglos propias del CMS al ser
instalado y nuevas configuraciones que se da a partir de plugins utilizados.

4.4 Entorno Línea o Producción.

Para este proyecto se cuenta con el apoyo de la institución Clínica Alborada para poder re-
coger y analizar sus requerimiento y necesidades, por medio del sitio web a desarrollar se
resolverá su problemática del agendamiento de consultas externa. Sin embargo, este pro-
yecto no se implantará en esta institución.

54
Para una correcta implementación en Producción del Sitio Web, se presenta tabla de reque-
rimientos Técnicos:

HOSTING
Características Capacidad
Almacenamiento 30 GB
Transferencia de Datos Ilimitada
Dominios y Certificaciones SSL Incluye
Varios Sitios por Proyectos Incluidos
Correo Electrónicos Ilimitados
Asistencia Técnica 24/7/365
Soporta Sitio para PHP Incluye
Base de Datos MySQL

Autores: Mario Rosales, Juan Lladó, Lucia Alegría

4.5 Planificación Iteraciones.

Según las historias de usuario de nuestro proyecto se presenta la siguiente tabla de Iteracio-
nes:

Historia # Título Prioridad Jornadas

1 Acceso al sistema Alta 5
2 Registro Paciente Alta 5
3 Registro de Citas Médicas. Alta 4
4 Registro Alta 5
Licenciada de Enfermería
5 Gestión Citas Médicas Li- Alta 2
cenciada de Enfermería
6 Gestión de Usuario por el Alta 1
Administrador
7 Generación Reportes (Admi- Alta 1
nistrador)
8 Respaldo de la Información Alta 1
(Administrador)
Total: 29

Autores: Mario Rosales, Juan Lladó, Lucia Alegría

55
Se deduce que cada iteración tomara el número de jornada en base a días de trabajo consi-
derando estos días tienen 8 horas de trabajos en días laborables.

Iteración Historias Fecha Inicio Días

1 Acceso al sistema 04/07/2022 5
2 Registro Paciente 11/07/2022 5
3 Registro de Citas Médicas. 18/07/2022 4
4 Registro 22/07/2022 5
Licenciada de Enfermería
5 Gestión Citas Médicas Li- 29/07/2022 2
cenciada de Enfermería
6 Gestión de Usuario por el 02/08/2022 1
Administrador
7 Generación Reportes (Admi- 03/08/2022 1
nistrador)
8 Respaldo de la Información 04/08/2022 1
(Administrador)

Autores: Mario Rosales, Juan Lladó, Lucia Alegría

56
4.6 Diagrama de almacenamiento de Datos del Sistema.

Se presenta el gráfico donde se muestra las entidades y sus atributos. Las cuales forman parte
de la Base de Datos donde se guarda la información del Sitio Web de Agendamiento de Citas
Médicas.

Autores: Mario Rosales, Juan Lladó, Lucia Alegría

57
4.7 Diagrama Arquitectónico Web.

El diagrama Arquitectónico que se usa en el proyecto es Arquitectura Plana. Se muestra en

el siguiente gráfico el menú del Sitio Web.

Autores: Mario Rosales, Juan Lladó, Lucia Alegría

4.8 Diseño y Construcción de Solución

Por medio de los siguientes gráficos podemos observar las pantallas principales del sitio web
donde se permite realizar ingreso de información, eliminación, actualización y también di-
ferentes reportes en diferentes formatos como cvs y pdf.

Panel de Información

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

58
 Autores: Mario Rosales, Juan Lladó, Lucia Alegria

Calendario de Citas

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

Empleados

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

59
Especialidades o Servicios

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

Pacientes o Clientes

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

Notificación de envió de Correo

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

60
Lista de Pagos de las Citas

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

4.9 Pruebas de la Solución

Por medio de los siguientes gráficos, se pueden observar las pruebas de ingreso de informa-
ción como el registro de pacientes, médicos, especialidades, configuraciones generales del
agendamiento.

Prueba de Edición de datos de un Paciente.

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

61
Apariencia del formulario de Agendamiento

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

Configuración del agendamiento

Autores: Mario Rosales, Juan Lladó, Lucia Alegria

62
Conclusiones

- La estructura y los tipos de Sitio Web permitieron el avance y diseño del Proyecto de
Agendamiento de Citas Médicas.

- Que las TIC corresponde a un campo importante en el Desarrollo de Software, relacionando

a los proyectos del Sitio Web.

- Que la estructura y fases de los diferentes manuales en el desarrollo del Sitio Web permitió
con la implementación del proyecto

Recomendaciones

- Utilizar la arquitectura web tipo horizontal por que el estilo es sencillo y compacto al mo-
mento del diseño de Menús y Submenús

- Usar como Front-End, CMS WordPress y como Back-End, Mysql por ser de código
abierto, rápido, con una interfaz amigable y sencilla.

- Diseñar del Manual Técnico, Usuario para realizar diferentes actividades de procesos como
Soporte técnico y capacitación del Sitio Web a los beneficiarios.

63
5. Manual de Usuario

Manual Usuario

DESARROLLO DE UN SITIO WEB PARA EL CONTROL DE AGENDAMIENTO DE

CITAS MÉDICAS PARA LA INSTITUCIÓN CLÍNICA ALBORADA C.A.

LUCÍA ELIZABETH ALEGRÍA SALAZAR

MARIO ALBERTO ROSALES HART

JUAN CARLOS LLADÓ VILLAVICENCIO

INSTITUTO UNIVERSITARIO RUMIÑAHUI

DESARROLLO DE SOFTWARE

SANGOLQUÍ

2022

64
Contenido

Introducción ......................................................................................................................... 67
Objetivos del Manual .......................................................................................................... 67
Dirigidos a los Usuarios ...................................................................................................... 67
Opciones del Sistema .......................................................................................................... 67
1. Ingreso al sistema Pacientes y Usuarios en General........................................................ 67
2. Formulario de Agendamiento de Cita ............................................................................. 68
3. Ingreso al sistema Personal de Enfermería ...................................................................... 74
4. Ingreso al Sistema, Personal Administrativo ................................................................... 87

Lista de Figuras

Figura 1: Ingreso al Sitio Web de la Institución. Captura del Navegador......................................... 68

Figura 2: Agendamiento Cita Médica. Captura del Navegador........................................................ 68
Figura 3: Agendamiento Cita Médica. Captura del Navegador........................................................ 69
Figura 4: Agendamiento Cita Médica. Captura del Navegador........................................................ 69
Figura 5: Agendamiento Cita Médica. Captura del Navegador........................................................ 70
Figura 6: Agendamiento Cita Médica. Captura del Navegador........................................................ 71
Figura 7: Agendamiento Cita Médica. Captura del Navegador........................................................ 72
Figura 8: Agendamiento Cita Médica. Captura del Navegador........................................................ 73
Figura 9: Ingreso de Usuario y Contraseña del Sistema. Captura del Navegador............................ 74
Figura 10: Menú Opciones Perfil de Enfermería del Sistema. Captura del Navegador. .................. 75
Figura 11: Apariencia Perfil de Enfermería del Sistema. Captura del Navegador............................ 76
Figura12: Calendario de Citas Médicas del Sistema. Captura del Navegador. ................................ 76
Figura13: Visualización Filtrada por Servicio o todos los servicios. Captura del Navegador. .......... 77
Figura14: Visualización Filtrados por trabajadores o Especialistas Médicos. Captura del
Navegador. ....................................................................................................................................... 77
Figura15: Edición de Datos de la Cita Médica. Captura del Navegador. .......................................... 78
Figura16: Cambio de Estados de la Cita Médica. Captura del Navegador. ...................................... 78
Figura17: Lita de las Citas Médicas. Captura del Navegador. .......................................................... 79
Figura18: Generación de Cita Médica del Paciente. Captura del Navegador. ................................. 79
Figura19: Modificación de Cita Médica del Paciente. Captura del Navegador................................ 80
Figura20: Eliminación de Cita Médica del Paciente. Captura del Navegador. ................................. 80
Figura21: Exportación de las Citas a CSV. Captura del Navegador. ................................................. 81
Figura22: Archivo CVS Generado del Navegador. ............................................................................ 81
Figura23: Impresión en PDF. Generado del Navegador. .................................................................. 82

65
Figura24: Impresión en PDF 2. Generado del Navegador. ............................................................... 82
Figura25: Listados en Pantalla de los Pacientes. Generado del Navegador. ................................... 83
Figura26: Creación de un Paciente. Generado del Navegador. ....................................................... 83
Figura27: Eliminación de un Paciente. Generado del Navegador. ................................................... 84
Figura28: Exportación de los Pacientes a un Archivo CVS. Generado del Navegador. .................... 84
Figura29: Archivo CVS de Pacientes Generados. Generado del Navegador. ................................... 84
Figura30: Importación de Pacientes desde de un Archivo Plano. Generado del Navegador. ......... 85
Figura31: Listado en Pantalla de Pagos. Generado del Navegador. ................................................ 85
Figura32: Ingreso de Pago. Generado del Navegador. .................................................................... 86
Figura33: Cerrando Sesión. Generado del Navegador. .................................................................... 86
Figura34: Ingreso de Sesión. Generado del Navegador. .................................................................. 87
Figura35: Menú de Opciones del Perfil Administrador. Generado del Navegador. ........................ 88
Figura36: Panel Informativo. Generado del Navegador. ................................................................. 88
Figura37: Lista de Analítica. Generado del Navegador. ................................................................... 89
Figura38: Lista de Analítica 2. Generado del Navegador. ................................................................ 89
Figura39: Visualización de lista de Medico Especialistas. Generado del Navegador. ...................... 90
Figura40: Creando nuevo Personal o Médico Especialista. Generado del Navegador. ................... 90
Figura41: Edición Personal o Médico Especialista. Generado del Navegador. ................................ 91
Figura42: Programación del Horario del Especialista. Generado del Navegador. ........................... 91
Figura43: Configurando Servicios del Especialista. Generado del Navegador................................. 92
Figura44: Borrando el Especialista. Generado del Navegador......................................................... 92
Figura45: Configurando Especialidad. Generado del Navegador. ................................................... 93
Figura46: Borrado de Especialidad. Generado del Navegador. ....................................................... 93
Figura47: Configuraciones de Notificaciones. Generado del Navegador. ....................................... 94
Figura48: Configuraciones de Apariencia. Generado del Navegador. ............................................. 94
Figura49: Configuraciones del Sitio. Generado del Navegador. ...................................................... 95
Figura50: Salida del Sitio. Generado del Navegador. ....................................................................... 95

66
Introducción
Este Manual de Usuario permite describir el funcionamiento y uso del Sitio Web para el
Control de Agendamiento de Citas Médicas para la Institución CLÍNICA ALBORADA C.A.

Tiene como objetivo instruir al usuario en el uso del sistema y la solución de los problemas
que puedan surgir en la operación. Este resuelve nuestras dudas como usuario, todas las
posibles opciones que puede realizar el usuario con estas aplicaciones de manera detallada,
y mediante el uso de capturas de pantalla.

Objetivos del Manual

Garantizar el adecuado uso de sitio web, dando una guía clara y mostrando cada una de las
opciones de cada uno de los módulos.

Dirigidos a los Usuarios

Todos los usuarios que van hacer uso del sitio web de agendamiento de citas médica. Los
cuales son los siguiente: Administradores, Enfermería, Pacientes.

Opciones del Sistema

El sitio Web posee diferentes módulos los cuales presentan sus características y funcionales
las cuales se detallan a continuación:

1. Ingreso al sistema Pacientes y Usuarios en General

Se accede al Sitio Web de agendamiento ingresando previamente a cualquier navegador web
de la preferencia del usuario y en la barra de direcciones se digita la siguiente dirección web:
http://proyectos-rosales.com/

67
Figura 1: Ingreso al Sitio Web de la Institución. Captura del Navegador.

Por los Autores

En el sitio se puede navegar por las diferentes opciones donde se va a encontrar información
de la institución, personal y servicios. Además, la opción de Agendamiento de Citas.

2. Formulario de Agendamiento de Cita

El paciente accede a la Sitio Web en el cual desde el menú Agendar Cita, completa cinco
pasos, los cuales se pueden apreciar en la siguiente gráfica:

Figura 2: Agendamiento Cita Médica. Captura del Navegador.

Por los Autores

68
Primer Paso (Servicio)

Selección de la Categoría Como Categoría Predefinida consta Consulta Externa.

Figura 3: Agendamiento Cita Médica. Captura del Navegador.

Por los Autores

Selección de la Especialidad

Se debe de escoger la especialidad en base a necesidad del agendamiento.

Figura 4: Agendamiento Cita Médica. Captura del Navegador.

69
 Por los Autores

Selección de la Fecha del Agendamiento

Está como predefinida la fecha actual. Se puede escoger otras fechas según necesidad del
Paciente y proceder a dar un clic en el botón siguiente.

Figura 5: Agendamiento Cita Médica. Captura del Navegador.

Por los Autores

70
Segundo Paso (Hora)

Selección de la Fecha y Hora

Se debe de seleccionar la hora disponible que nos muestra el sitio Web, según la fecha esco-
gida previamente. En caso de no tener un horario adecuado el paciente podrá elegir en esta
misma pantalla otro día y poder definir en el horario acorde a su necesidad dando un clic en
la hora y le conduce al siguiente paso del agendamiento.

Figura 6: Agendamiento Cita Médica. Captura del Navegador.

Por los Autores

Tercer Paso (Detalles)

Datos del contacto

Formulario en el cual se debe de ingresar los datos del paciente, en este formulario todos los
campos de deben ser llenados para poder pasar al siguiente paso del agendamiento. También
se muestra el Especialista asignado automáticamente. A final, se encuentra una casilla de
verificación que se debe de marcar para aceptar el agendamiento.

71
Figura 7: Agendamiento Cita Médica. Captura del Navegador.

Por los Autores

72
Cuarto Paso (Pago)

Datos del Pago

El pago está predeterminado como pago en Clínica y el paciente lo va a realizar cuando

asista a la cita médica previo a ingresar a la atención médica. En este proceso debe de dar
clic en siguiente para aceptar y continuar al paso final.

Figura 8: Agendamiento Cita Médica. Captura del Navegador.

Por los Autores

Quinto Paso (Hecho)

Pantalla de la confirmación

Se muestra un mensaje donde indica que se ha enviado al correo de paciente los datos de la
cita. El paciente en su bandeja de entrada del respectivo correo, podrá tener los datos del
agendamiento, donde se detalla la fecha, hora, especialista y especialidad escogidos, para
que pueda presentarse a la consulta con 20 minutos de anticipación.

73
3. Ingreso al sistema Personal de Enfermería
El Sitio Web de Agendamiento Medico también posee la opción de ingreso para otros tipos
de Usuarios, que no son los usuarios generales que ingresan al sitio por información o pa-
cientes que necesitan agendar una cita médica.

Estos usuarios son el personal de enfermería el cual por medio de un acceso diferente puede
hacer gestión en base a un perfil, el cual, permite asistir al trabajo del profesional Médico o
Especialista quien va a brindar la atención al paciente.

Ingresamos el siguiente Enlace:

https://proyectos-rosales.com/wp-login.php?loggedout=true&wp_lang=es_ES

Se debe de Ingresar el Usuario y la Clave facilitada por el Administrador del Sitio de la

INSTITUCION MEDICA CLINICA ALBORADA C.A.

Figura 9: Ingreso de Usuario y Contraseña del Sistema. Captura del Navegador.

Por los Autores

74
Menú de Opciones

Permite trabajar en las principales opciones que tienen el perfil de la enfermera, en él puede
realizar configuración del aspecto y administración y el uso del Bookly plugins del agenda-
miento médico con sus respectivas opciones. Estas Opciones también estarán configuradas
para usuarios del perfil Administrativo.

Figura 10: Menú Opciones Perfil de Enfermería del Sistema. Captura del Navegador.

Por los Autores

OPCIÓN DE PERFIL

Configuración de Apariencia.

Desde esta Área se puede cambiar el aspecto de la aplicación como colores y de más opcio-
nes. Además, se puede actualizar datos del usuario, adicionar una foto y cambiar su contra-
seña.

75
Figura 11: Apariencia Perfil de Enfermería del Sistema. Captura del Navegador.

Por los Autores

OPCIÓN DE AGENDAMIENTO DE CITAS MEDICAS (BOOKLY)

Calendario

A primera vista, nos permite tener un reporte de las citas agendadas por los pacientes con
sus respectiva fecha, hora, especialidad y Especialista.

Figura12: Calendario de Citas Médicas del Sistema. Captura del Navegador.

Por los Autores

76
Figura13: Visualización Filtrada por Servicio o todos los servicios. Captura del Nave-
gador.

Por los Autores

Figura14: Visualización Filtrados por trabajadores o Especialistas Médicos. Captura

del Navegador.

Por los Autores

Al dar clic sobre una de las citas, se pueden hacer algunos cambios e incluso adicionar más
información del paciente o de la cita de ser necesario o eliminación del Paciente y de la Cita.

77
Figura15: Edición de Datos de la Cita Médica. Captura del Navegador.

Por los Autores

Otros cambios como estado de la cita como Pendientes, aprobado, cancelado, rechazado,
hecho. También el estado económico de la cita.

Figura16: Cambio de Estados de la Cita Médica. Captura del Navegador.

Por los Autores

78
Citas

Se presenta un listado de todas las citas con sus respectivos detalles, a manera de reporte
visual o en pantalla el cual puede ser filtrado por las fechas de creación, Especialidad, Espe-
cialista, Pacientes, número de orden, etc. Según se filtre este listado se podrá ejecutar otras
opciones.

Adicionalmente desde esta pantalla podemos eliminar una cita escogida de la lista o crea una
nueva cita a petición de un paciente que no lo quiera hacer él mismo desde el Sitio Web de
la Institución.

Figura17: Lita de las Citas Médicas. Captura del Navegador.

Por los Autores

Figura18: Generación de Cita Médica del Paciente. Captura del Navegador.

Por los Autores

79
Edición de Datos de la Cita

También se pueden modificar datos de citas previamente registrada.

Figura19: Modificación de Cita Médica del Paciente. Captura del Navegador.

Por los Autores

Figura20: Eliminación de Cita Médica del Paciente. Captura del Navegador.

Por los Autores

80
Exportación del Litado de Citas Medicas

Al dar Clic en el botón Exportar CSV. se puede exportar todo el listado de la Citas que se
muestran en pantalla a un formato de archivo plano como a un archivo csv.

Figura21: Exportación de las Citas a CSV. Captura del Navegador.

Por los Autores

Archivo Generado

Con este archivo se podrá trabajar en otras aplicaciones para poder generar reportaría para
la parte administrativa.

Figura22: Archivo CVS Generado del Navegador.

Por los Autores

81
Impresión de la Lista de Citas

Si se requiere imprimir la lista que se visualiza en pantalla bastara con dar clic en el botón
Imprimir con esta acción se puede imprimir físicamente a un papel o a un archivo PDF.

Figura23: Impresión en PDF. Generado del Navegador.

Por los Autores

Figura24: Impresión en PDF 2. Generado del Navegador.

Por los Autores

82
Opción de Clientes o Pacientes

Se presenta un listado de todos los clientes o pacientes con sus respectivos detalles a manera
de reporte visual o en pantalla. En esta pantalla de puede hacer una búsqueda rápida a partir
de los nombre y apellido del paciente. Adicionalmente desde esta pantalla se puede eliminar
un paciente escogiendo de la lista o crea un nuevo paciente a petición de un paciente que no
lo quiera hacer el mismo desde el Sitio Web de la Institución. Existe además la opción de
poder exportar e Importar los datos a un archivo plano tipo CVS o poder imprimir en papel
físico o en PDF.

Figura25: Listados en Pantalla de los Pacientes. Generado del Navegador.

Por los Autores

Figura26: Creación de un Paciente. Generado del Navegador.

Por los Autores

83
Figura27: Eliminación de un Paciente. Generado del Navegador.

Por los Autores

Figura28: Exportación de los Pacientes a un Archivo CVS. Generado del Navegador.

Por los Autores

Figura29: Archivo CVS de Pacientes Generados. Generado del Navegador.

Por los Autores

84
Figura30: Importación de Pacientes desde de un Archivo Plano. Generado del Nave-
gador.

Por los Autores

Pagos

Se puede observar una lista en pantalla de los pagos y sus estados, con sus respectivos pa-
cientes y servicios. Desde aquí se podrá ejecutar los pagos desde el botón Detalle. Además,
se puede filtrar la lista de pago por fecha, tipo, cliente, proveedores, servicio o estado (Los
estados pueden ser: Completados, Pendientes, Rechazado, Reembolsado).

Figura31: Listado en Pantalla de Pagos. Generado del Navegador.

Por los Autores

85
Figura32: Ingreso de Pago. Generado del Navegador.

Por los Autores

Cerrar Menú

Permite contraer el menú y tener más espacio de pantalla para poder trabajar en el área es-
cogida previamente.

Cerrar Sesión

Permite cerrar el perfil del usuario al terminar su trabajo.

Figura33: Cerrando Sesión. Generado del Navegador.

Por los Autores

86
4. Ingreso al Sistema, Personal Administrativo
El Sitio Web de Agendamiento Medico también posee la opción de ingreso para otros tipos
de Usuarios como es el Administrador.

Ingresamos el siguiente Enlace:

https://proyectos-rosales.com/wp-login.php?loggedout=true&wp_lang=es_ES

Se debe de Ingresar el Usuario y la Clave facilitada por el Administrador del Sitio de la

INSTITUCION MEDICA CLINICA ALBORADA C.A.

Figura34: Ingreso de Sesión. Generado del Navegador.

Por los Autores

Este tipo de Usuario tienen un perfil al mismo nivel del perfil creado para los usuarios de
enfermería, sin embargo, el perfil administrador posee opciones adicionales que permite rea-
lizar gestiones de tipo administrativa y configuraciones adicionales y son las siguientes: Un
panel de Información, Empleados, Servicio, Notificación de correo electrónico, Notifi-
cación SMS, Apariencia, Configuraciones.

87
Figura35: Menú de Opciones del Perfil Administrador. Generado del Navegador.

Por los Autores

Panel de Información y Analítica

En este panel se pueden ver de manera gráfica las citas aprobadas, citas que están pendientes,
total de citas y los ingresos generados.

Además, se puede filtrar por rango de fecha.

Figura36: Panel Informativo. Generado del Navegador.

Por los Autores

Adicionalmente, se presenta un reporte donde se pueden filtrar los ingresos por Especialidad
y especialista, para luego poder exportar estos datos a un archivo CSV o imprimir física-
mente en papel o generar un archivo PDF.

88
Figura37: Lista de Analítica. Generado del Navegador.

Por los Autores

Figura38: Lista de Analítica 2. Generado del Navegador.

Por los Autores

Empleados o Médicos Especialistas

Desde esta Opción se puede visualizar la lista de los Médicos Especialistas, añadir o registrar
nuevos especialistas o categorías.

De ser necesario editar los datos previamente cargado de un médico o borrar de la lista al
Médico. Todas estas acciones con sus respectivos botones de Categoría, Añadir personal,
borrar.

89
Figura39: Visualización de lista de Medico Especialistas. Generado del Navegador.

Por los Autores

Figura40: Creando nuevo Personal o Médico Especialista. Generado del Navegador.

Por los Autores

Editando Información de Un Médico Especialista

Desde aquí se puede cambiar todas las configuraciones de los médicos, desde si aparecen en
el calendario para las citas hasta sus horarios de atención y días libres. Servicios que ellos
ofrecen o borrar el especialista.

90
Figura41: Edición Personal o Médico Especialista. Generado del Navegador.

Por los Autores

Figura42: Programación del Horario del Especialista. Generado del Navegador.

Por los Autores

91
Figura43: Configurando Servicios del Especialista. Generado del Navegador.

Por los Autores

Servicio o Especialidades

En esta opción se encuentra la lista de la Especialidades Médicas, desde aquí se pueden

añadir o editar las especialidades. Además, a partir de una configuración del servicio exis-
tente se puede duplicar y crear un servicio o especialidad nuevo.

Podemos también seleccionar de la lista de especialidades y borrar la misma.

Figura44: Borrando el Especialista. Generado del Navegador.

Por los Autores

92
Editar una Especialidad

Entre algunas de las configuraciones en la edición del servicio se puede configurar el tiempo
del servicio, el margen que debe de existir entre una consulta y otra.

Figura45: Configurando Especialidad. Generado del Navegador.

Por los Autores

Borrar un Servicio o Especialidad

Se escoge de la lista la especialidad y luego un clic en el botón borrar y luego aceptar la

confirmación.

Figura46: Borrado de Especialidad. Generado del Navegador.

Por los Autores

93
Notificación de correo electrónico

Permite configurar todas las notificaciones que ofrece el sitio web de agendamiento, desde
esta opción se puede configurar por ejemplo enviar un mensaje al correo electrónico del
paciente después de su registro.

Otras notificaciones como la cancelación de una cita, notificación al personal acerca de una
cita aprobada, etc.

Figura47: Configuraciones de Notificaciones. Generado del Navegador.

Por los Autores

Apariencia

Se puede modificar el comportamiento y la apariencia del agendamiento de citas. Estas con-

figuraciones se recomiendan para un personal con un perfil técnico.

Figura48: Configuraciones de Apariencia. Generado del Navegador.

Por los Autores

94
Configuraciones.

Permite configuraciones generales a nivel del comportamiento del sitio de agendamiento

médico, se recomienda que realice estos cambios de configuración, personal técnico.

Figura49: Configuraciones del Sitio. Generado del Navegador.

Por los Autores

Cerrar Sesión

Permite cerrar la sesión del usuario.

Figura50: Salida del Sitio. Generado del Navegador.

Por los Autores

95
6. Manual Técnico

Manual Técnico
DESARROLLO DE UN SITIO WEB PARA EL CONTROL DE AGENDAMIENTO DE
CITAS MÉDICAS PARA LA INSTITUCIÓN CLÍNICA ALBORADA C.A.

LUCÍA ELIZABETH ALEGRÍA SALAZAR

MARIO ALBERTO ROSALES HART

JUAN CARLOS LLADÓ VILLAVICENCIO

INSTITUTO UNIVERSITARIO RUMIÑAHUI

DESARROLLO DE SOFTWARE

SANGOLQUÍ

2022

96
Contenido

Presentación .................................................................................................................... 99
Resumen ....................................................................................................................... 100
Objetivo ........................................................................................................................ 101
Finalidad del Manual .................................................................................................... 101
Introducción .................................................................................................................. 102
1. Aspectos Técnicos .................................................................................................... 103
1.1 Herramientas Utilizadas para el Desarrollo ........................................................ 103
1.1.1 Wordpress..................................................................................................... 103
1.1.2 Xampp .......................................................................................................... 103
1.1.3 Php................................................................................................................ 104
1.1.4 Html.............................................................................................................. 104
1.1.5 MySql ........................................................................................................... 104
1.1.6 Bookly .......................................................................................................... 104
2. Diagrama de Modelamiento ..................................................................................... 105
2.1 Diagrama de Clases ............................................................................................ 105
2.2 Diagrama de Casos de Uso ................................................................................. 106
2.3 Diccionario de Datos .......................................................................................... 107
3. Aspecto Técnico del Desarrollo del Sitio Web ........................................................ 109
3.1 Modificación Local ............................................................................................. 109
1. Requerimientos del Software ................................................................................ 114
4.1 Requisitos Mínimos ............................................................................................ 114
Bibliografía ................................................................................................................................ 115

97
 Lista de Figuras

Figura 1. Diagrama de modelado de clases .................................................................. 105

Figura 2. Diagrama de casos de uso ............................................................................. 106

Figura 3. Página web de descarga WordPress .............................................................. 109

Figura 4. Página web de descarga phpMyAdmin ......................................................... 110

Figura 5. Página web de descarga Xampp .................................................................... 111

Figura 6. Encendido del XAMPP ................................................................................. 111

Figura 7. Creación de la Base de Datos ........................................................................ 112

Figura 8: Configuración WordPress ............................................................................. 112

Figura 9: Conformación de carga de información en la base de datos ......................... 113

Figura 10: Back-End WordPres Admin........................................................................ 113

Lista de Tablas

Tabla 1. Diccionario de datos modelo usuarios ............................................................ 107

Tabla 2. Diccionario de datos modelo actividades ....................................................... 107

Tabla 3. Diccionario de datos modelo niveles .............................................................. 108

98
Presentación

Este manual está diseñado para guiar a los usuarios de soporte al sistema, el cual les hará
conocer la estructura y los requerimientos de la construcción del sitio web, en el desarrollo
del programa conectado mediante una base de datos, mostrando las herramientas necesarias
para el desarrollo y la funcionalidad del sistema de agendamiento de citas médicas.

99
Resumen

El manual resume los aspectos técnicos e informáticos del sitio web para agendamiento de
citas médicas con la finalidad de explicar la estructura del sistema al personal encargado de
administrarlo, editarlo o configurarlo.

La siguiente guía está dividida en las herramientas que se usaron para la creación del soft-
ware con una breve explicación, el cual maneja distintas funcionalidades que requieren de
hardware y software explicando que funcionamiento realiza cada uno, entregando sugeren-
cias para el correcto uso del sistema de citas.

100
Objetivo

Dar a conocer el uso correcto del sitio web de agendamiento de citas médicas en aspectos
técnicos de forma descriptiva e ilustrada sobre los componentes y funcionalidades que con-
forman el buen funcionamiento del sistema de agendamiento.

Finalidad del Manual

Este manual técnico tiene la finalidad de instruir a la persona encargada de administrar, con-
figurar o editar el software de agendamiento de citas médicas usando las debidas configura-
ciones.

101
Introducción

Se realiza este manual con el propósito de detallar el software de agendamiento de citas

médicas en términos técnicos para que el administrador, lo configure o edite de una manera
apropiada. Este documento se encuentra dividido en las siguientes secciones:

 Aspectos Teóricos: Se redactarán conceptos y definiciones de los componentes del

sitio web desde un punto de vista teórico para un mejor entendimiento del lector sobre el
funcionamiento del sistema de agendamientos de citas médicas.

 Diagramas de modelamiento: Está compuesto por diagramas e ilustraciones refe-

rentes al funcionamiento del sitio web.

 Aspecto Técnico del Desarrollo del sistema: Corresponde a la instrucción al admi-

nistrador sobre los componentes del sitio web desde un aspecto técnico en las vistas de al-
macenamiento de datos, estructura del desarrollo y recomendaciones del uso correcto del
software.

 Requerimientos de Software: Especifica los requerimientos básicos precisos para

el funcionamiento del software.

102
1. Aspectos Técnicos

El sitio web para agendamiento de citas médicas tiene la finalidad de mejorar los procesos
de consulta externa de la Clínica Alborada mediante un sistema ordenado, editable y contro-
lable de horarios, fechas y especialidades. Se recomienda que el siguiente manual sea mani-
pulado únicamente por el administrador, para velar por la seguridad de la información que
se almacena en la base de datos ya que pueden ser usados de manera incorrecta.

1.1 Herramientas Utilizadas para el Desarrollo

Es esta unidad se procede a detallar las herramientas informáticas empleadas para el desa-
rrollo del sitio web:

1.1.1 Wordpress

WordPress es un sistema de gestión de contenidos web (CMS) o content management sys-

tem, para publicar en la web de forma sencilla. Solicitado por la Clínica Alborada (cliente)
debido a su código abierto y gratuito, así como por su simplicidad a la hora de administrarlo.

1.1.2 Xampp

XAMPP es una herramienta que ayuda a los programadores probar sus desarrollos en un
servidor local y es una distribución de Apache que incluye varios softwares libres.

Su nombre está compuesto por las iniciales de los programas que lo constituyen: el servidor
web Apache, los sistemas relacionales de administración de bases de datos MySQL y Ma-
riaDB, así como los lenguajes de programación Perl y PHP.

103
1.1.3 Php

El lenguaje PHP, es un lenguaje de programación que permite el desarrollo web o aplicacio-

nes web dinámicas, el cual es apto para incrustar el lenguaje HTML, ahora bien, siempre
siguiendo algunas reglas establecidas.

Este lenguaje se usó en el desarrollo de WORDPRESS, el CMS que estamos utilizando para
el sitio web de agendamiento de citas médicas.

1.1.4 Html

HTML (Hyper Text Markup Lenguage) es un lenguaje de marcado de hypertexto, que se

utiliza para codificar y estructurar las páginas web, mediante marcadores o etiquetas que se
escriben entre comillas angulares < >, los que indican a los navegadores de dónde obtener
los recursos para representarlos y en el orden, secuencia y forma que debe hacerlo.

1.1.5 MySql

MySQL es un sistema de gestión de base de datos (SGBD) de código abierto, de propiedad

de Oracle. Utiliza modelo cliente-servidor, es decir, que los ordenadores que instalan y eje-
cutan el software de gestión de base de datos se denominan clientes. Cada vez que necesitan
acceder a los datos, los clientes se conectan al servidor del sistema de gestión de base de
datos y le solicitan la información que necesitan. El servidor se la brinda siempre y cuando
tenga los derechos de acceso.

1.1.6 Bookly

Bookly es un plugin de programación para WordPress que permite aceptar reservas online
en los webs y automatizar el sistema de reservas. Gestiona el calendario de reservas, servi-
cios, base de clientes, ahorra tiempo y dinero, todo en un solo lugar.

104
2. Diagrama de Modelamiento

2.1 Diagrama de Clases

El diagrama de clases está compuesto por las entidades y sus atributos que fueron creados
para el almacenamiento de datos del sitio web.

Figura 1. Diagrama de modelado de clases

Por los Autores

En la figura 1, se detalla a las entidades usadas para el almacenamiento de datos del sitio
web, donde cada una de ellas realiza las siguientes funciones:

105
 Usuarios: Almacena los datos de los usuarios que se registran para poder agendar la
cita médica, en este caso el paciente (cliente).

 Actividades: Registra la composición y funcionalidades de cada una de las activida-

des que se encuentran en el sitio web.

 Niveles: Almacena cada uno de los niveles que posee cada actividad del sitio web.

2.2 Diagrama de Casos de Uso

El diagrama de casos de uso detalla el papel a desempeñar en relación con el sitio web por
parte de las personas relacionadas, en este caso el actor principal es el Paciente (cliente), y
sus administradores o usuarios internos son: El jefe de Sistemas y Asistente Enfermera.

Figura 2. Diagrama de casos de uso

Por los Autores

106
2.3 Diccionario de Datos

Para el almacenamiento de datos del sitio web, se definen los campos para cada una de las
entidades relacionadas con el software.

Tabla 1. Diccionario de datos modelo usuarios

Por los Autores

Tabla 2. Diccionario de datos modelo actividades

Por los Autores

107
Tabla 3. Diccionario de datos modelo niveles

Por los Autores

108
3. Aspecto Técnico del Desarrollo del Sitio Web

En esta sección se realiza una descripción detallada sobre los aspectos técnicos del sitio web,
concerniente con la instalación de las herramientas que se necesitan para hacer modificacio-
nes requeridas de manera ordenada.

3.1 Modificación Local

Si el desarrollador necesita realizar modificaciones del software de manera local, tendrá que
realizar la instalación de componentes adicionales, inicialmente se debe instalar Wordpress
6.0.1, el cual se descarga de manera gratuita en https://es-ec.wordpress.org/down-
load/#download-install

Figura 3. Página web de descarga WordPress

Fuente: WordPress.org

109
También debemos instalar el phpMyAdmin 5.2.0 el cual se descarga de manera gratuita en
https://www.phpmyadmin.net/downloads/

Figura 4. Página web de descarga phpMyAdmin

Fuente: phpMyAdmin contributors

Para permitir la conexión con el localhost debemos instalar el Xampp y lo podemos descar-
gar de manera gratuita en https://www.apachefriends.org/es/download.html

110
Figura 5. Página web de descarga Xampp

Fuente: Apache Friends

Una vez descargados e instalados el XAMPP, el WordPress y el phpMyAdmin procedemos

en XAMPP a encender el Apache y el MySQL

Figura 6. Encendido del XAMPP

Por los Autores

111
Figura 7. Creación de la Base de Datos

Por los Autores

Figura 8: Configuración WordPress

Por los Autores

112
Cargamos la información en la Base de Datos en el localhost http://localhost/proyecto

Figura 9: Conformación de carga de información en la base de datos

Por los Autores

Ingresamos a nuestro Back-End en http://localhost/proyecto/wp-admin

Figura 10: Back-End WordPres Admin

Por los Autores

113
4. Requerimientos del Software

Se detallarán los requisitos mínimos del sistema para poder ejecutar los aplicativos usados
para modificar el proyecto de agendamientos de citas médicas.

4.1 Requisitos Mínimos

 Sistema Operativo: Windows 10

 Procesador: Intel Core i3
 Memoria Ram: 4GB
 Disco Duro: SSD 256MB
 Resolución de Pantalla: 1280 x 720 pixeles
 Periféricos: Según el dispositivo

114
Bibliografía

Atard, D. (2021). collectiveray. Obtenido de https://www.collectiveray.com/es/plugin-bookly-

sistema-de-reservas-online

epitech. (2021). epitech-it. Obtenido de https://www.epitech-it.es/que-es-

php/#:~:text=El%20lenguaje%20PHP%2C%20es%20un,y%20a%20la%20interfaz%20del%2
0usuario.

Garcia, M. (2020). nettix. Obtenido de https://www.nettix.com.pe/blog/web-blog/que-es-xampp-

y-como-puedo-usarlo/

López, B. (2022). ciudadano2cero. Obtenido de https://www.ciudadano2cero.com/que-es-

wordpress/

Noguera, B. (2022). culturacion. Obtenido de https://culturacion.com/que-es-y-para-que-sirve-

mysql/

Ramos, G. (2021). webempresa. Obtenido de https://www.webempresa.com/blog/que-es-html-

para-que-sirve.html

115
Bibliografía y Referencias de citas

(2017). En J. B. Talledo San Miguel, Instalación y configuración de aplicaciones informáticas

(pág. 187). España: Ediciones Paraninfo S.A.
Arias, E. R. (10 de 12 de 2020). economipedia. Obtenido de
https://economipedia.com/definiciones/investigacion-de-campo.html
Arzaga, C. Y. (21 de 03 de 2021). Aleph. Obtenido de https://aleph.org.mx/que-es-un-sistema-
informatico-y-sus-caracteristicas
Asensio, R. M.-B. (04 de 05 de 2019). Universidad de Murcia. Obtenido de
https://www.um.es/docencia/barzana/IAGP/IAGP2-Ingenieria-software-introduccion.html
Beck. (1999). Extreme Programming Explained: Embrace Change.
Chiluisa Pallo, A. P. (2014). Desarrollo e implementación de Inventarios y Gestión de
Laboratorios para la Facultad de Ciencias de la Escuela Politécnica Nacional. Quito.
CONSTITUCIÓN DE LA REPÚBLICA DEL ECUADOR. (2008). Obtenido de www.lexis.com.ec
Estrada, L. G. (2009). Método Científico. México: Grupo Editorial Éxodo.
GoDaddy, E. e. (04 de 10 de 2019). GoDaddy. Obtenido de https://mx.godaddy.com/blog/que-es-
un-sitio-
web/#:~:text=Un%20sitio%20web%20es%20un,de%20inicio%20o%20Home%20page.
información, G. d. (2020). DNP Dirección nacional de planeación. Obtenido de
https://colaboracion.dnp.gov.co/CDTI/Oficina%20Informatica/Sistemas%20de%20informa
ci%C3%B3n/Gu%C3%ADas%20Formatos%20Plantillas/Gu%C3%ADa%20para%20la%2
0Elaboraci%C3%B3n%20del%20Manual%20T%C3%A9cnico%20y%20de%20Operaci%
C3%B3n%20del%20Sistema.pdf?
Information, E. K. (2019).
León, M. e. (11 de 10 de 2016). core.ac.uk. Obtenido de
https://core.ac.uk/download/pdf/80531608.pdf
Letelier, P. &. (15 de 01 de 2006). Metodologías Ágiles para el Desarrollo de Software. Obtenido
de http://www.cyta.com.ar/ta0502/v5n2a1.htm
LEY ORGÁNICA DE SALUD. (s.f.).
Madrid, U. C. (s/f). ucm.es. Obtenido de https://www.ucm.es/oficina-de-software-libre/software-
libre
Monterde, U. M. (2017). Unidad de apoyo para el aprendizaje. Obtenido de
https://programas.cuaed.unam.mx/repositorio/moodle/pluginfile.php/1023/mod_resource/c
ontent/1/contenido/index.html
Oficina de Tecnologías y Sistemas de Información. (2020). GUÍA PARA LA ELABORACIÓN DEL
MANUAL TÉCNICO Y DE OPERACIÓN DE LOS SISTEMAS DE. Bogotá.

116
ORACLE. (2014). ORACLE. Obtenido de https://www.oracle.com/mx/database/what-is-
database/#:~:text=de%20datos%20aut%C3%B3nomas-
,Base%20de%20datos%20definida,bases%20de%20datos%20(DBMS).
PALACIOS, J. (2022). jeronimopalacios. Obtenido de https://jeronimopalacios.com/product-
delivery/los-elementos-una-buena-historia-de-usuario/
Peiró, R. (08 de 07 de 2019). Economipedia. Obtenido de
https://economipedia.com/definiciones/pagina-
web.html#:~:text=Una%20p%C3%A1gina%20web%20es%20un,a%20trav%C3%A9s%20
de%20c%C3%B3digo%20html.
Pérez, S. D. (26 de 11 de 2021). intelequia.com. Obtenido de
https://intelequia.com/blog/post/3072/qu%C3%A9-es-la-programaci%C3%B3n-orientada-
a-objetos
Planeación, D. N. (2020). colaboración.dnp.gov. Bogotá.
Rioja, U. I. (01 de 09 de 2021). UNIR. Obtenido de
https://mexico.unir.net/ingenieria/noticias/planificacion-proyecto/
School, T. (10 de 02 de 2020). Tokio. Obtenido de
https://www.tokioschool.com/noticias/importancia-arquitectura-
web/#:~:text=La%20arquitectura%20web%20es%20la,cara%20al%20posicionamiento%2
0en%20buscadores.
TEKNEI. (09 de 11 de 2021). teknei.com. Obtenido de https://www.teknei.com/2021/11/09/que-es-
y-que-utilidad-tiene-la-ingenieria-de-software/
Thompson, A. y. (2004). Administración Estratégica. México: Editorial Mc.
UNIVERSIA. (20 de 03 de 2020). Obtenido de
https://www.universia.net/mx/actualidad/habilidades/conceptos-fundamentales-
metodologia-investigacion-1167677.html
Menzinsky, A. (2016). scrum.menzinsky. Obtenido de https://scrum.menzinsky.com/2016/08/las-
historias-de-usuario-son-casos-de.html
Rios, J. L. (2015). vsip.info. Obtenido de https://vsip.info/xp-informe-pdf-free.html
vpvera. (2022). cybermedian. Obtenido de https://www.cybermedian.com/es/activity-diagram-a-
quick-overview/

117