SEP TecNM

INSTITUTO TECNOLÓGICO
SUPERIOR DE TEPEACA
ANTEPROYECTO DE RESIDENCIA PROFESIONAL

“Aplicación web para impartir clases virtuales interactivas a niños

de primero de kínder”

NOMBRE DE LA CARRERA
INGENIERIA EN SISTEMAS COMPUTACIONALES

PRESENTA:
Ricardo Avila Torres

ASESOR INTERNO Y EXTERNO:

MIDS Bernardino Fuentes Solar
MC Ana Cristina Palacios García

TEPEACA DE NEGRETE, PUE. JUNIO DE 2021

 AGRADECIMIENTO

Quiero expresar mi gratitud a Dios, quien con su bendición llena siempre mi vida, A mi
madre y padre que son el pilar más importante y por demostrarme siempre su cariño y
apoyo incondicional sin importar nuestras diferentes opiniones.

Mi profundo agradecimiento a todas las autoridades y personal que hacen el Instituto

Tecnológico Superior de Tepeaca, por confiar en mí, abrirme las puertas y permitirme
realizar todo el proceso educativo dentro de sus instalaciones.

De igual manera mis agradecimientos a mis profesores en especial al ing. Damaso Canizo
Guzmán quien con la enseñanza de sus valiosos conocimientos hicieron que pueda
crecer día a día como profesional, gracias a cada una de ustedes por su paciencia,
dedicación, apoyo incondicional y amistad.
 RESUMEN

El siguiente proyecto muestra el proceso de realización del sistema para impartir clases
virtuales interactivas a niños de primero de kínder, así mismo también se podrán asignar
actividades y serán evaluadas en tiempo real y la calificación obtenida será enviada al
docente asignado.
Índice general
CAPÍTULO I INTRODUCCIÓN...............................................................................................................9
1.1. ANTECEDENTES.........................................................................................................................10
1.1.1. Herramientas e ideas empleadas para implementar la enseñanza a distancia..................10
1.1.2. Principales dispositivos usados...........................................................................................11
1.2 Planteamiento del problema......................................................................................................12
1.2.1. Hogares sin internet...........................................................................................................12
1.2.2. Sufren ansiedad o estrés 50% de estudiantes en Puebla...................................................12
1.2.3. Gastos adicionales..............................................................................................................12
1.3. Objetivos...................................................................................................................................14
1.3.1. Objetivo general.................................................................................................................14
1.3.2. Objetivos específicos..........................................................................................................14
1.4. Alcances y limitantes.................................................................................................................14
1.4.1. Alcances:............................................................................................................................14
1.4.2. Limitantes:..........................................................................................................................15
1.5. Hipótesis....................................................................................................................................15
1.6. Pregunta de investigación.........................................................................................................15
1.7. Justificación...............................................................................................................................15
CAPÍTULO II MARCO TEÓRICO..........................................................................................................16
2.1. Marco teórico............................................................................................................................17
2.1.1. Educación a distancia.........................................................................................................17
2.1.2. Horas dedicadas a la educación..........................................................................................18
2.1.3. Dificultad para desarrollar el trabajo a distancia................................................................19
2.1.4. Estrategias de trabajo a distancia.......................................................................................20
2.1.5. Recursos digitales utilizados...............................................................................................21
2.1.6. Plataformas educativas......................................................................................................21
2.1.7. Herramientas de comunicación..........................................................................................22
2.1.8. Tipos de plataformas educativas........................................................................................22
2.1.9. Sesión virtual o videoconferencia.......................................................................................23
2.1.9.1. Cómo funciona una videoconferencia.........................................................................23
2.2. Trabajos relacionados...........................................................................................................24
2.2.1. Educlan...........................................................................................................................24
 2.2.2. Smile and Learn..............................................................................................................24
2.2.3. BrainPOP........................................................................................................................25
2.2.4. Anaya..............................................................................................................................25
CAPÍTULO III MARCO METODOLÓGICO............................................................................................26
3.1. Tipo de diseño de investigación................................................................................................27
3.1.1. Cualitativo......................................................................................................................27
3.1.2. Metodología aplicada.............................................................................................................27
3.2 Población y muestra...................................................................................................................29
3.3 Instrumentos, técnicas y métodos.............................................................................................30
3.4 Procesamiento de datos (indique las herramientas o software)................................................30
3.5 Recursos materiales y de capital humano..................................................................................33
CAPÍTULO IV RESULTADOS Y DISCUSIÓN..........................................................................................34
4.1 Resultados y su discusión.......................................................................................................35
CAPÍTULO V COMPETENCIAS DESARROLLADAS...............................................................................47
5.1 Relación de las competencias específicas con la(s) materia(s) rectora(s) en la estructura
crediticia del Plan de Estudios. (Retícula).....................................................................................48
5.2 Fundamentación Académica. (Tabla Relacional de Competencias específicas de las materias
para el desarrollo del proyecto)...................................................................................................49
5.3 Fundamentación Académica. (Tabla Relacional de Competencias específicas de las materias
para el desarrollo del proyecto)...................................................................................................52
5.4 Relación de competencias específicas directas e indirectas con la materia rectora. (Grafo
dirigido de las materias)...............................................................................................................54
Conclusiones Y Recomendaciones................................................................................................55
Referencias...................................................................................................................................56
Índice de figuras
Figura 1. 1 Principales dispositivos usados............................................................................................... 10
Figura 1. 2 Gastos adicionales.................................................................................................................. 12
Figura 1. 3 Motivo por el cual no se inscribieron......................................................................................12

figura 2. 1 Encuesta sobre la educación a distancia..................................................................................16

figura 2. 2 Horas dedicadas a la educación a distancia..............................................................................17
figura 2. 3 Dificultad para desarrollar el trabajo a distancia......................................................................18
figura 2. 4 Estrategias de trabajo a distancia............................................................................................ 19
figura 2. 5 Recursos digitales utilizados.................................................................................................... 20
figura 2. 6 Función de videoconferencia................................................................................................... 22
figura 2.7. Educlan................................................................................................................................... 23
figura 2.8. Smile and Learn...................................................................................................................... 23
figura 2.9 BrainPOP................................................................................................................................. 24
figura 2.10 Anaya.................................................................................................................................... 24

figura 3. 1 Cuadro comparativo................................................................................................................ 26

figura 3. 2 Descripción gráfica de la metodología de cascada....................................................................28

Figura 4. 1 Pantalla principal del sitio web. 36

Figura 4. 2 Inicio de sesión 36
Figura 4. 3 Error de sesión. 37
Figura 4. 4 Menú de inicio 38
Figura 4. 5 Barra de búsqueda. 38
Figura 4. 6 Formulario para registrar usuarios de tipo maestro y alumno. 39
Figura 4. 7 Lista de usuarios registrados. 39
Figura 4. 8 Base de datos de la tabla usuarios. 40
Figura 4. 9 Formulario para agregar un alumno nuevo. 41
Figura 4. 10 Alumnos registrados. 41
Figura 4. 11 Base de datos de la tabla Alumnos. 42
Figura 4. 12 Lista de actividades 42
Figura 4. 13 Actividades para realizar 43
Figura 4. 14 Ejemplo de la prueba 2 43
Figura 4. 15 Mensaje de actividad realizada. 44
Figura 4. 16 Prueba 2 deshabilitada. 44
Figura 4. 17 Tabla de calificaciones. 45
Figura 4. 18 Formulario para agregar un nuevo grado 46
Figura 4. 19 Lista de grados registrados. 46
Figura 4. 20 Base de datos de la tabla grupos. 47
Figura 4. 21 Pantalla principal para elegir entre el sistema y video-conferencia 47
Figura 4. 22 Ingresar datos para acceder a la video conferencia. 48
Figura 4. 23 Formulario con datos correctos por parte del alumno. 48
Figura 4. 24 Pestaña para acceder a video conferencia. 49
Figura 4. 25 Modo espera del invitado. 49
Figura 4. 26 Ventana para aceptar el ingreso del alumno. 50
Figura 4. 27 Ventana de la video conferencia ya funcionando. 50

Figura 5. 3 Instalando XAMPP.................................................................................................................. 30

Figura 5. 4 Panel inicial de XAMPP........................................................................................................... 30
Figura 5. 5 Iniciar Apache y MySQL.......................................................................................................... 30
Figura 5. 6 Importar base de datos........................................................................................................... 31
Figura 5. 7 Seleccionar base de datos....................................................................................................... 31
Figura 5. 8 Inicio de sistema..................................................................................................................... 32
Figura 5. 1 Estructura crediticia................................................................................................................ 47
Figura 5. 2 Grafo dirigido de las materias................................................................................................. 53
Índice de tablas

Tabla 1. Población................................................................................................................................... 29
Tabla 2 Fundamentación académica........................................................................................................ 48
Tabla 3 Tabla Relacional de Competencias...............................................................................................51
CAPÍTULO I INTRODUCCIÓN
1.1. ANTECEDENTES
Llevamos un año desde que el gobierno de Puebla cambió la educación. Desde el
17 de marzo del 2020, las clases tomaron un nuevo rumbo de manera digital, ya
que las aulas no eran un lugar seguro para docentes ni alumnos por la pandemia
del Covid-19.

Para las familias, tomar clases en línea representó todo un problema. La situación
económica y de clases sociales se agravaron más entre aquellos que no contaban
con una computadora, para que sus hijos pudieran mantenerse al día.

No solo representó un reto para los estudiantes, los mismos docentes lidiaron con
la enseñanza en línea ante una falta de capacitación tecnológica. Además,
debieron desarrollar estrategias para mantener conectados e interesados a los
niños frente al monitor.

La educación a distancia ha provocado un aumento de la deserción escolar. En

Puebla se buscan opciones para que los alumnos sigan los cursos a distancia.

Leticia Sandoval, directora de la Escuela Maximino Ávila Camacho en el municipio

de Huejotzingo, a tan solo 50 kilómetros de la capital de Puebla, asegura que
desde que concluyó el periodo vacacional de fin de año, decenas de niños ya no
retomaron sus clases a distancia y abandonaron sus estudios. (Reyes, 2020)

La SEP dijo confiar en que los padres de familia se apoyen en contenidos

diseñados para establecer rutinas diarias en el hogar durante el confinamiento.
(Reyes, 2020)

Sin embargo, en muchas las familias mexicanas esto no sucede. Diana Valencia,
profesora de un jardín de niños en el municipio de Acajete relató que durante las
primeras semanas en su plantel se trabajó vía WhatsApp, pero la nueva
instrucción ha sido que adopten una de las plataformas sugeridas por la SEP.
(Reyes, 2020)

1.1.1. Herramientas e ideas empleadas para implementar la enseñanza a

distancia
Correo electrónico

Puede emplearse como herramienta de comunicación maestro-alumno o entre

alumnos. De esta forma el docente puede asignar tareas o trabajos, así como
recibirlos, revisarlos y proporcionar retroalimentación directa a los estudiantes.
Tiene también la ventaja de que los correos pueden ser leídos y respondidos
cuando se disponga de tiempo.
Chats

El chat o conversación en línea es una herramienta de comunicación sincrónica en

el que se utilizan mensajes escritos, en otras palabras, es un medio que
permite interactuar en tiempo real, por lo que permite el intercambio de ideas y
la colaboración. Favorece también la retroalimentación, el diálogo e incluso la
evaluación formativa.

Al utilizar esta herramienta es conveniente establecer con antelación las reglas

para fomentar un entorno de respeto y el buen uso del lenguaje y de las normas
ortográficas.

Algunas herramientas que puedes utilizar para iniciar un chat académico son:

WhatsApp: Se puede utilizar en teléfonos móviles y en computadoras, permite

crear grupos, enviar y recibir mensajes y archivos en distintos formatos.

Telegram: Permite crear chats cifrados, grupos de hasta 200 personas, transferir
archivos de hasta 1 giga y almacenamiento en la nube.

Hangouts: Se pueden realizar chats y videollamadas en grupo de hasta diez

personas, ver videos de You tube durante la conversación, emitir públicamente en
vídeo un evento, hacer grabaciones y compartirlas.

1.1.2. Principales dispositivos usados.

Porcentaje de la población de 3 a 7 años inscritos en el ciclo escolar 2019–2020,
según principales aparatos o dispositivos electrónicos usados para sus actividades
escolares o clases a distancia. (INEGI, 2021) ver figura 1.1.
Figura 1. 1 Principales dispositivos usados.

(Extraído de INEGI Encuesta para la Medición del Impacto COVID-19 en la Educación).

1.2 Planteamiento del problema
1.2.1. Hogares sin internet
Según datos del INEGI, sólo 45 por ciento de los hogares mexicanos cuentan con
una computadora, mientras que 48 por ciento no tiene internet.

Germán Pérez, psicopedagogo y catedrático de la Universidad Pedagógica

Nacional (UPN) aseguró que lo que “estamos viviendo es una alternativa para no
dejar a un lado la educación de los niños. Es una manera de dar solución
inmediata que representa un gran reto para profesores y alumnos, dado que ellos
están organizados en un sistema presencial”. (García, 2020)

Erika Mejía, profesora de un preescolar ubicado en la Ciudad de Puebla, señaló

que es imposible mantener la atención de los pequeños en una computadora, por
lo que esta modalidad no se ha aplicado en el centro en el que trabaja. Por ahora,
se ha encargado de enviar a los padres ejercicios para hacer en casa con las
instrucciones muy precisas.

Compartió que la mayoría de los padres están comprometidos con la formación de

sus pequeños y para aclarar todas sus dudas han organizado videoconferencia.
(García, 2020)

1.2.2. Sufren ansiedad o estrés 50% de estudiantes en Puebla

De acuerdo con el análisis “Resultados de la Fase Cierre del Ciclo Escolar 2020-
2021”, realizado a partir de encuestas aplicadas a los estudiantes de nivel de
educación básica por la Secretaría de Educación Pública (SEP) en Puebla, 31 por
ciento de las respuestas refiere que durante la contingencia experimenta
sentimientos de tristeza; nueve por ciento, miedo; y 10 por ciento refirió que
presenta otro tipo de sentimiento como la ansiedad y estrés.

El análisis realizado por la dependencia encargada de las políticas educativas de

la entidad muestra que tres de cada 10 estudiantes, 29 por ciento, dijo que siente
tranquilidad; mientras que solo uno de cada 10, 13% resaltó que su sentimiento
principal es de felicidad. (Bretón, 2021)

1.2.3. Gastos adicionales

Porcentaje de viviendas con teléfono y población de 3 a 7 años, en donde
realizaron gasto adicional para atender las clases a distancia debido a la COVID-
19, por tipo de gasto. (INEGI, 2021) ver figura 1.2.
Figura 1. 2 Gastos adicionales

(Extraído de INEGI Encuesta para la Medición del Impacto COVID-19 en la Educación.)

Distribución porcentual de la población de 3 a 7 años según condición de

inscripción en el ciclo escolar 2020–2021 y motivo de no inscripción, por grupos de
edad. (INEGI, 2021) ver figura 1.3.
Figura 1. 3 Motivo por el cual no se inscribieron

(Extraído de INEGI. Encuesta para la Medición del Impacto COVID-19 en la

Educación.)

Sobre los motivos detallados de no inscribirse a efecto de la pandemia por

laCOVID-19, de los 3.3 millones de personas mencionadas anteriormente, se
identifica que 26.6% no se inscribió por considerar que las clases a distancia son
poco funcionales para el aprendizaje; 25.3% debido a que alguno de sus padres o
tutores se quedaron sin trabajo. Cabe señalar que en la opción de otro se tuvo una
mención también sobre motivos económicos por la pandemia; asimismo 21.9%
reportó no inscribirse por carecer de computadora, otros dispositivo o conexión de
internet.
1.3. Objetivos

1.3.1. Objetivo general

Diseñar e implementar una aplicación web para impartir clases virtuales a un
grupo de niños y niñas de primer año de kínder, que permita compartir actividades
interactivas en tiempo real que puedan evaluadas automáticamente por la
aplicación web o por el docente.

1.3.2. Objetivos específicos

 Revisión de trabajos relacionados.

 Análisis de requerimientos.
 Propuesta y diseño de actividades a incluir en el catálogo de actividades
interactivas.
 La aplicación incluye un catálogo de actividades interactivas predefinido
sobre: habilidades de lectura y escritura, conocimiento de números y
formas, cuidado de la salud, y conocer sus emociones.
 Diseño de interfaces.
 Implementación de la aplicación web.
 Pruebas de funcionamiento de la aplicación web, tanto en versión PC como
móvil.

1.4. Alcances y limitantes

1.4.1. Alcances:
 Construir una aplicación web que sirva como plataforma educativa para
docentes de nivel preescolar que permita compartir un área de trabajo con
los infantes para evaluar el grado de comprensión de los temas estudiados.
 La aplicación web permitirá llevar un seguimiento de las actividades
realizadas por los niños, así como un pase de lista automático.
 La aplicación web permitirá que el docente evalúe en tiempo real las
actividades respondidas por los infantes cuando son compartidas por el
docente, o que sean calificadas automáticamente.
 Compartir video, habilitarlo y deshabilitarlo.
 Compartir audio.
 Dar retroalimentación a través de estrellas a los infantes cuando se califica
una actividad de forma automática.

1.4.2. Limitantes:
  El personal que opere el sistema deberá tener conocimientos básicos en
computación
 El servicio debe ser fiable e inmune a los problemas de red.
 Se requiere de un adulto para monitorear el correcto uso de la aplicación.
 La aplicación web contiene un solo libro de actividades ya predefinidas.

1.5. Hipótesis
¿Es posible crear una plataforma educativa amigable con niños de nivel
preescolar?

1.6. Pregunta de investigación

¿Es posible crear una aplicación web que sirva como plataforma educativa para
niños de nivel preescolar?

1.7. Justificación
La aplicación web aquí planteada pretende servir como plataforma educativa para
niños de nivel preescolar que cuenten con conectividad a internet, con
computadora y/o dispositivo móvil. Permitirá, además, que los niños ingresen a
sesiones virtuales de clase en donde puedan no solo compartir audio, video y ver
lo que el docente comparta en pantalla, sino que a su vez dé la opción para que el
niño o niña pueda interactuar con los contenidos compartidos por el docente.
Finalmente, la aplicación web dará la opción de que tanto el tutor del niño o niña,
así como el docente, puedan observar el avance del infante respecto a la
comprensión del tema tratado. Con esta aplicación se pretende apoyar al 26.6%
de la población que aún se encuentra trabajando en línea. (INEGI, 2021)
CAPÍTULO II MARCO TEÓRICO
2.1. Marco teórico
2.1.1. Educación a distancia
La educación a distancia adquirió una relevancia que quizás nunca había tenido.
Esta modalidad de educación se distingue porque no requiere de la presencia de
estudiantes y docentes en un mismo espacio. La educación a distancia puede
hacerse por medios muy diversos. Hace décadas los cursos por correspondencia
permitían el aprendizaje a distancia; igualmente sucedía con la entrega de
cuadernos que orientaban las tareas educativas. Posteriormente se introdujeron la
radio y la televisión; en nuestro país, de manera muy destacada, con la
telesecundaria a partir de 1968. (INEGI, 2021) ver figura 2.1.
figura 2. 1 Encuesta sobre la educación a distancia

(Extraído de INEGI. Encuesta para la Medición del Impacto COVID-19 en la

Educación.)

Llama muy positivamente la atención que, en el promedio de las regiones, 85.2 %

de los maestros esté llevando a cabo la educación a distancia. Sin embargo, las
diferencias regionales son marcadas. (INEGI, 2021)
2.1.2. Horas dedicadas a la educación

figura 2. 2 Horas dedicadas a la educación a distancia

(INEGI. Encuesta para la Medición del Impacto COVID-19 en la

Educación.)

En el promedio de las regiones, el tiempo dedicado por los maestros a la

educación a distancia es bajo en comparación con la duración de la jornada
escolar: 45.7 % de los maestros dedica dos horas diarias o menos. (INEGI, 2021)
ver figura 2.2.
2.1.3. Dificultad para desarrollar el trabajo a distancia

figura 2. 3 Dificultad para desarrollar el trabajo a distancia

(INEGI. Encuesta para la Medición del Impacto COVID-19 en la Educación.)

En promedio, casi la mitad de los docentes considera muy difícil o difícil desarrollar
el trabajo a distancia. (INEGI, 2021) ver figura 2.3.
2.1.4. Estrategias de trabajo a distancia

figura 2. 4 Estrategias de trabajo a distancia.

(INEGI. Encuesta para la Medición del Impacto COVID-19 en la

Educación.)

Deben destacarse de manera especial las clases virtuales puesto que permiten el
trabajo sincrónico de los maestros con todos sus alumnos. Esta puede ser una
ventaja importante para lograr mejores resultados en la educación a distancia por
la posibilidad de verse los rostros, compartir ideas, dudas y respuestas y otros
elementos que facilitan y pueden hacer el aprendizaje más fluido y divertido.
(INEGI, 2021) ver figura 2.4.
 2.1.5. Recursos digitales utilizados
figura 2. 5 Recursos digitales utilizados.

e
s
c
u
e
l
a
s

(INEGI. Encuesta para la Medición del Impacto COVID-19 en la

Educación.)

El recurso más utilizado es WhatsApp seguido del correo electrónico. Este

resultado puede explicarse porque son recursos más conocidos entre los maestros
y las familias. Además de ser conocidos, no requieren de un uso tan intensivo de
datos como los demás recursos. Para muchas familias el pago del servicio de
datos representa una proporción muy significativa del presupuesto del hogar.
(INEGI, 2021) ver figura 2.5.

2.1.6. Plataformas educativas

Una plataforma educativa virtual es un programa que engloba diferentes tipos de
herramientas destinadas a fines docentes. Su principal función es facilitar la
creación de entornos virtuales para impartir todo tipo de formaciones a través de
internet sin necesidad de tener conocimientos de programación.

En realidad, son programas que permiten hacer tareas como: organizar contenidos
y actividades dentro de un curso online, gestionar las matriculaciones de los
estudiantes, tener un seguimiento de trabajo durante el curso, resolver dudas y
crear espacios de comunicación interactiva, evaluar los progresos de los alumnos,
etc.

Pueden utilizarse para gestionar de manera integral formaciones a distancia o

como un complemento de la docencia presencial. Aunque cada vez más se
emplean para crear espacios de discusión y trabajo para grupos de investigación,
o para implementar comunidades virtuales y redes de aprendizaje en torno a
temas de interés común. (Reyes, 2020)

2.1.7. Herramientas de comunicación

Para favorecer el intercambio de información y la participación de los alumnos, es
muy importante que este tipo de plataformas incluyan diferentes herramientas
comunicativas como pueden ser:

 Sistemas de mensajería instantánea: permiten contactar con el tutor para

resolver dudas.
 Envío de archivos: Permite enviar archivos al tutor para su corrección.
 Avisos: Mensajes enviados por el tutor a todos los alumnos a lo largo del
curso.
 Foro: Permiten que se compartan e intercambien ideas.
 Chat: Permite la comunicación en tiempo real entre alumnos y/o el tutor.
 Tutorías On-line: El tutor puede convocar tutorías para que los alumnos
resuelvan sus dudas.

2.1.8. Tipos de plataformas educativas

Existen diferentes tipos de plataformas educativas según el tipo de actividad al
que estén destinadas.

Plataformas educativas comerciales. Han sido creadas por empresas o

instituciones educativas con fines lucrativos. Suelen tener muy buena fiabilidad y
asistencias técnicas eficaces. Requieren del pago de una cuota, generalmente
anual que da acceso a las sucesivas actualizaciones. Las más importantes tienen
cantidad de módulos especializados diferentes que permiten que adaptes la
plataforma totalmente a tus necesidades. Algunas de las más conocidas son:

 WebCT
 FirstClass

Plataformas de software libre. Son creadas sin fines lucrativos. Sus ventajas
principales son que el programa es libre para ser usado con cualquier finalidad, es
posible adaptarlo a tus necesidades o distribuir copias y no es necesario pagar
para tener acceso a las actualizaciones. Algunas plataformas educativas de
software libre son, por ejemplo:

 Moodle
 Claroline
2.1.9. Sesión virtual o videoconferencia
La Video Conferencia es un sistema interactivo que permite a varios usuarios
mantener una conversación virtual por medio de la transmisión en tiempo real de
video, sonido y texto a través de Internet.

Estos sistemas están especialmente diseñados para llevar a cabo sesiones de

capacitación, reuniones de trabajo, demostraciones de productos, entrenamiento,
soporte, atención a clientes, marketing de productos, etc.

Beneficios de la videoconferencia

 Disminuye las distancias, reduciendo tiempos y costos.

 Favorece y aumenta a la productividad de los equipos de trabajo.
 Fortalece la participación y relación entre las personas.
 Mejora los sistemas de información y comunicación.
 Acelera el proceso de toma de decisiones y resolución de problemas.

2.1.9.1. Cómo funciona una videoconferencia

Los flujos de audio y video se entregan de un usuario a otro dependiendo de si es

posible conectar directamente a los usuarios dentro de la red local o por Internet.
Si es posible la conexión directa, el flujo de medios pasa por la ruta de red más
corta sin pasar por el servidor. En esta situación, el servidor desempeñará solo
una función técnica ayudando a los usuarios a conectarse entre sí desde
diferentes subredes y transmitiendo la información de servicio.

figura 2. 6 Función de videoconferencia.

(Martinez, 2020)
2.2. Trabajos relacionados

2.2.1. Educlan

Edad: +3 años.

El canal infantil de Radio Televisión Española (RTVE), trata de llevar el colegio a

casa a través de Educlan, una iniciativa dirigida a los más pequeños, para que
puedan continuar con su formación de una manera amena. Las principales
editoriales educativas del país colaboran con este proyecto de manera
desinteresada: han cedido una selección de sus mejores materiales educativos a
fin de complementar los materiales implementados por las administraciones
educativas.

figura 2.7. Educlan (Fundación reimagina, 2019)

2.2.2. Smile and Learn

Edad: De 3 a 12 años.

La plataforma educativa ofrece más de 5.000 actividades organizadas en apps y

vídeos, que permiten trabajar contenidos curriculares, convirtiéndose en una
inmejorable herramienta de refuerzo. Por 4,99 euros al mes o 35 euros al año, los
niños tendrán acceso a miles de actividades y vídeos en un entorno 100% seguro.

figura 2.8. Smile and Learn (Fundación reimagina, 2019)

2.2.3. BrainPOP

Edad: De 9 a 12 años.

A través de las películas animadas de BrainPOP, los niños tendrán la oportunidad

de explorar cientos de materias de manera directa en su móvil o tablet. Ciencias,
matemáticas, inglés, ingeniería, tecnología, artes, música o salud son algunas de
ellas. También se relacionan con eventos actuales, hechos históricos y cifras.
Cada película se combina, al final, con un cuestionario interactivo. De esta
manera, los niños podrán poner a prueba sus nuevos conocimientos.

figura 2.9 BrainPOP (Fundación reimagina, 2019)

2.2.4. Anaya

Edad: +3 años.

La reconocida editorial Anaya pone a disposiciones de los niños una amplia gama
de actividades para hacer en casa. Desde descubrir y colorear las habitaciones de
los personajes favoritos de los cuentos, hasta averiguar cuánto se sabe acerca de
los cuadros del Museo del Prado, hacer recetas divertidísimas y recrear una
cámara oscura para llevar a cabo un taller de estampación. Y cómo no, también
pone a disposición de pequeños, y no tan pequeños, las mejores
recomendaciones de lectura.

figura 2.10 Anaya (Fundación reimagina, 2019)

CAPÍTULO III MARCO
METODOLÓGICO
3.1. Tipo de diseño de investigación.

3.1.1. Cualitativo

Según (Fait, 2012). Datos cualitativos: son datos que miden o calculan un algo para llegar
a un punto en su investigación.
Datos cuantitativos: son los que nos dan el enfoque o el punto de vista de la muestra o de
una variable hacia lo que nos dice la investigación.

La aplicación web que se realizó pertenece al tipo de diseño cualitativo ya que es posible
obtener información sobre cómo se percibe la usabilidad de la aplicación web.

figura 3. 1 Cuadro comparativo

3.1.2. Metodología aplicada

Metodología de Cascada

La metodología en cascada es un modelo lineal de diseño de software que emplea un

proceso de diseño secuencial. El desarrollo fluye secuencialmente desde el punto inicial
hasta el punto final, con varias etapas diferentes. Según (Ble, 2013).

Se optó por la metodología en cascada ya que para la realización del sistema se

necesitaba llevar a cabo un proceso controlado, la metodología en cascada fue la que
mejor cumplía las expectativas ya que lleva una serie de pasos para el desarrollo óptimo
del software, los pasos que se siguieron fueron los siguientes:
Planteamiento, iniciación, análisis, diseño, construcción, pruebas, implementación y
mantenimiento.

Planteamiento: En esta parte se tiene que tener fijo lo que queremos lograr con el
sistema, localizar el problema a resolver.

Iniciación: Cuando se halla localizado el problema a resolver, lo que sigue es iniciar con
varias propuestas que cumplan con las características del software a realizar.

Análisis: Se analiza cada propuesta buscada anteriormente y se tiene que seleccionar la

más factible y que mejor cumpla el servicio que se requiere, En esta fase se hace un
análisis de las necesidades del cliente para determinar las características del software a
desarrollar, y se especifica todo lo que debe hacer el sistema sin entrar en detalles
técnicos. Hay que ser especialmente cuidadoso en esta primera fase, ya que en este
modelo no se pueden añadir nuevos requisitos en mitad del proceso de desarrollo.

Diseño: En diseño se empezó a realizar en Uizard para hacer la simulación de cómo

podrían ir cada una de las interfaces, En esta etapa se describe la estructura interna del
software, y las relaciones entre las entidades que lo componen, para que no hubiese
pérdida de tiempo.

Construcción: Ya que se crearon las interfaces, el color de cada botón, etiqueta, tabla etc.
Empezamos con la elaboración del sistema tal cual.

Pruebas: Los elementos, ya programados, se ensamblan para componer el sistema y se

comprueba que funciona correctamente y que cumple con los requisitos, antes de ser
entregado al usuario final.

Implementación: Es la fase en donde ejecutamos el sistema, para ello tuvimos que haber
realizado exhaustivas pruebas para comprobar que el sistema no falle. La programación
es el proceso que lleva de la formulación de un problema de computación, a un programa
que se ejecute produciendo los pasos necesarios para resolver dicho problema.

Mantenimiento: Una vez que se desarrollaron todas las funcionalidades del software y se
ha comprobado que funcionan correctamente, se inicia la fase de instalación y
mantenimiento. Se instala la aplicación en el sistema y se comprueba que funcione
correctamente en el entorno en que se va a utilizar.
A partir de ahora hay que asegurarse de que el software funcione y hay que destinar
recursos a mantenerlo. El mantenimiento del software consiste en la modificación del
producto después de haber sido entregado al cliente, ya sea para corregir errores o para
mejorar el rendimiento o las características.

figura 3. 2 Descripción gráfica de la metodología de cascada.

3.2 Población y muestra.

Los avances tecnológicos que se han generado a través de la informática han causado un
gran impacto social en las instituciones educativas; es por ello que muchas de estas, se
han adaptado a los cambios y han visto la necesidad de automatizar sus procesos.

La institución educativa, tiene alrededor de 120 alumnos, distribuidos en los diferentes

años de educación básica (de primero a tercero), a su vez cuenta con 6 profesores y 1
persona que trabaja en el área administrativa, que deben llevar toda la información
académica en forma simultánea, por la presión ejercida por los alumnos y padres de
familia.
Tabla 1. Población
Director 1

Docentes 6

Administración 1

Alumnos 120

TOTAL 127

3.3 Instrumentos, técnicas y métodos.

Entrevista uno a uno

Las preguntas fueron:

1. ¿De qué tipo de empresa se trata? 

2. ¿Existe ya un sitio web de la empresa?
3. ¿Por qué cambiar o crear el sitio web ahora?
4. ¿Qué mejoras habrá?
5. ¿Qué estadísticas tendrá?
6. ¿Cuáles son y cómo se medirán?
7. ¿Cómo serán las imágenes y textos?
8. ¿Cuáles serán los colores y logotipo?
9. Ejemplos de diseños que gustan 
10. ¿De cuánto será el plazo a finalizar el proyecto?
11. ¿Sera funcional o no?

3.4 Procesamiento de datos (indique las herramientas o software)

Manual de instalación

Como primer paso tenemos que instalar el software XAMPP que consiste principalmente
en el sistema de gestión de base de datos MySQL, el servidor web Apache y los
intérpretes para lenguajes de script PHP y Perl. Como se muestra en la figura 5.3.
 Figura 3. 1 Instalando XAMPP.

Una vez instalado XAMPP lo que sigue es ejecutarlo, al ejecutarlo aparecerá una interfaz
con varias opciones y botones figura 5.4.

Figura 3. 2 Panel inicial de XAMPP.

Lo que tenemos que hacer es activar solo los botones de Apache y MySQL dándole clic
en START una vez que los dos botones se ponen en color verde, se podrá utilizar sin
ningún problema. Figura 5.5.

Figura 3. 3 Iniciar Apache y MySQL

Una vez iniciado Apache y MySQL lo que sigue es importar nuestra base de datos esto se
hace abriendo el navegador que más use en este caso lo haremos desde Google chrome
e ingresaremos con localhost/phpmyadmin figura 5.6.

Figura 3. 4. Importar base de datos

Ya estando dentro de php nos vamos a la parte del menú que dice importar que esta de
color rojo, una vez dándole clic seleccionaremos nuestra base de datos que creamos en
este caso se llama video y le damos en continuar, figura 5.7.

Figura 3. 5. Seleccionar base de datos.

Estructura general de la base de datos

figura 3. 8 Estructura general de la base de datos

Cuando se halla importado la base de datos, tenemos que abrir una pestaña nueva en un
navegador, y tenemos que poner http://localhost/final para ir al inicio del sistema. Figura
5.9.

figura 3. 9 Inicio de sistema.

3.5 Recursos materiales y de capital humano.
Las características mínimas para poder ejecutar el sistema son las siguientes:

 Procesador Intel (Celeron) Inside.

 2.16 GHz.

 Memoria RAM 4.00 GB.

 Sistema operativo Windows 7 64 bits.

 Almacenamiento 401 GB
CAPÍTULO IV RESULTADOS Y
DISCUSIÓN
4.1 Resultados y su discusión.
A continuación, se muestra la pantalla principal la cual es para elegir entrar al sistema o
realizar una video-conferencia. Figura 4.1.

Figura 4. 1 Pantalla principal del sitio web.

Al elegir sistema se muestra una ventana de acceso, el administrador, maestro o alumno
debe de introducir su nombre de usuario y contraseña correspondiente y presionar el
botón Entrar como se muestra en la Figura 4.2.

Figura 4. 2 Inicio de sesión

Una vez que el sistema ha comprobado que los datos son correctos, el sistema mostrara
la página de inicio, si el usuario o la contraseña son erróneos muestra un mensaje de
contraseña o usuario incorrectos, como se muestra en la Figura 4.3.

Figura 4. 3 Error de sesión.

Una vez que los datos son correctos el sistema abre la página de inicio, la cual cuenta con
un menú con diversas opciones correspondientes a su función, Figura 4.4.

Figura 4. 4 Menú de inicio

En la página de inicio además de contar con un menú, también tiene una barra de
buscada la cual hace más fácil encontrar a un alumno o maestro mediante su id, usuario o
rol, el cual son datos únicos. Figura 4.5.

Figura 4. 5 Barra de búsqueda.

En la opción “usuarios” existen dos opciones, crear usuario nuevo y lista de usuarios, al
seleccionar la primer opcion se muestra un formulario, figura 4.6. El administrador debe
llenar todos los datos para agregar un nuevo usuario.

Figura 4. 6 Formulario para registrar usuarios de tipo maestro y alumno.

En la segunda opción “lista de usuarios” se muestra una lista con todos los usuarios
registrados figura 4.7, los usuarios se guardan en la base de datos.

Figura 4. 7 Lista de usuarios registrados.

Los nombres de usuario se guardan en una tabla llamada “usuarios” la cual registra el
nombre de usuario, el tipo de usuario y su contraseña, esta última se guarda con la
función MD5, su función es encriptar la contraseña. Figura 4.8.

Figura 4. 8 Base de datos de la tabla usuarios.

En la pestaña “Alumnos” existen dos opciones nuevo alumno y lista de alumnos, al
seleccionar la primer opcion se muestra un formulario, figura 4.9. El administrador debe
llenar todos los datos para agregar un nuevo alumno.

Figura 4. 9 Formulario para agregar un alumno nuevo.

En la segunda opción “lista de alumnos” se muestra una lista con los alumnos registrados,
figura 4.10, los alumnos se guardan en la base de datos.

Figura 4. 10 Alumnos registrados.

Los alumnos se guardan en una tabla llamada “generales” la cual registra el id, el nombre,
apellido y grado. Figura 4.11.

Figura 4. 11 Base de datos de la tabla Alumnos.

En la pestaña “Actividades” existen tres opciones lista de actividades, agregar actividades
y lista de calificaciones, al seleccionar la primer opcion se muestran las actividades ya
predefinidas, figura 4.12. El administrador debe llenar todos los datos para agregar un
nuevo alumno.

Figura 4. 12 Lista de actividades

En la parte superior izquierda se puede observar el nombre del alumno, esto es de suma
importancia ya que es el nombre con el que se registra la prueba realizada y su
calificación, en la parte central están una serie de pruebas en color verde y otras en color
rojo, esto con el fin de que al contestar una prueba esta se deshabilite y no permita
volverla a realizar.

Figura 4. 13 Actividades para realizar

La siguiente prueba (prueba 2) trata de colocar el número de la cantidad de animales, en
este caso se colocó un número de manera erronea, ahora veamos como se califica de
manera automática.

Figura 4. 14 Ejemplo de la prueba 2

Al enviar la prueba, muestra un mensaje de que la actividad se realizó y redirige al menú
de las actividades.

Figura 4. 15 Mensaje de actividad realizada.

Ahora se puede observar que la prueba 2 se deshabilita y no se podrá volver a realizar.

Figura 4. 16 Prueba 2 deshabilitada.

Dentro del menú al seleccionar la parte de calificaciones enlaza a la siguiente pantalla, en

la cual muestra el nombre del alumno, prueba, titulo, puntos obtenidos y la calificación. En
la figura 4.14 intensionalmente colocamos una respuesta erronea por lo cual solo cuatro
estan correctas, si observamos en la tabla tenemos cuatro aciertos y la calificacion es
ocho.
 Figura 4. 17 Tabla de calificaciones.

En la pestaña “Grados” existen dos opciones nuevo grado y lista de grados, al

seleccionar la primer opcion se muestra un formulario, figura 4.12. El administrador debe
llenar los datos para agregar un nuevo grado.

Figura 4. 18 Formulario para agregar un nuevo grado

En la segunda opción “lista de grados” se muestra una lista con los grados registrados,
figura 4.13, los grados se guardan en la base de datos.

Figura 4. 19 Lista de grados registrados.

Los alumnos se guardan en una tabla llamada “generales” la cual registra el id, el nombre,
apellido y grado. Figura 4.14.
 Figura 4. 20 Base de datos de la tabla grupos.
Por otra parte en la pagina principal tenemos la opción “Video Conferencia” la cual su
función es crear una video conferencia en tiempo real. Figura 4.15.

Figura 4. 21 Pantalla principal para elegir entre el sistema y video-conferencia

Al seleccionar video conferencia el sistema abre la siguiente pestaña, en la cual se agrega

el nombre del alumno, el id de la llamada y la contraseña de acceso, estos dos últimos
serán proporcionados por el maestro o maestra mediante un mensaje de texto. Figura
4.16

Figura 4. 22 Ingresar datos para acceder a la video conferencia.

En la figura 4.17 se muestra la página con datos correctos para poder acceder.

Figura 4. 23 Formulario con datos correctos por parte del alumno.

Al ingresar con datos correctos (figura 4.17) continua con la siguiente pantalla con el fin de activar
o desactivar cámara y micrófono si así de desea y presionar “entrar” (figura 4.18).
 Figura 4. 24 Pestaña para acceder a video conferencia.

Por parte del alumno se accede en modo espera hasta que el anfitrión lo admita, esto con
el fin de que no entren personas no deseadas. Figura 4.19.

Figura 4. 25 Modo espera del invitado.

Por parte de maestro o anfitrión en la parte inferior derecha se puede observar una
ventana emergente, con el fin de aceptar o rechazar el acceso del niño o niña.
 Figura 4. 26 Ventana para aceptar el ingreso del alumno.

En la siguiente ventana se puede observar en la parte derecha dos participantes, el

primero que es el anfitrión y el segundo es el alumno.

Figura 4. 27 Ventana de la video conferencia ya funcionando.

CAPÍTULO V COMPETENCIAS
DESARROLLADAS
5.1 Relación de las competencias específicas con la(s) materia(s) rectora(s)
en la estructura crediticia del Plan de Estudios. (Retícula)

Figura 5. 6 Estructura crediticia

5.2 Fundamentación Académica. (Tabla Relacional de Competencias
específicas de las materias para el desarrollo del proyecto)

Tabla 2 Fundamentación académica

Nº Asignatura Competencia específica de Competencias a desarrollar y

la asignatura aplicar en el proyecto de
Residencia, Tesis… etc.
(proyecto que aplique)

1 Programación web Desarrollar aplicaciones Desarrollar una aplicación web

web que involucren que involucre lenguaje de
lenguajes de marcas, de maquetado, del lado del servidor
presentación, del lado del con la integración de servicios
cliente, del servidor, con la web.
integración de servicios
web.

2 Tópicos avanzados de Desarrollar soluciones de Desarrollar diferentes interfaces

programación software utilizando con el uso de las herramientas de
programación concurrente, Html5 y css3.
programación de eventos,
que soporte interfaz gráfica
e incluya dispositivos
móviles

3 Programación Diseñar e implementar Se utilizó programación orientada

orientada a objetos objetos de programación objetos mediante lenguaje de
que permitan resolver programación PHP.
situaciones reales y de
ingeniería

4 Ingeniería de software Desarrollar soluciones de Se desarrolló una solución de

 software, considerando los software, haciendo uso de una
aspectos del modelo de metodología y aplicándola en la
negocios, mediante la solución.
aplicación de la
metodología adecuada a la
naturaleza del problema.

5 Gestión de proyectos Gestionar proyectos de Se implementó un cronograma de

de software software aplicándolos actividades para el desarrollo de
elementos, técnicas y la aplicación.
herramientas, en apego a
los compromisos de costos,
tiempo y alcance.

6 Fundamentos de Aplicar modelos, técnicas y Se implementaron diagramas

ingeniería en software herramientas para cada una UML para la funcionalidad de la
de las etapas de ciclo de aplicación.
vida de desarrollo de
software

7 Administración de base Tener la capacidad de Se aplicó un sistema de gestión

de datos seleccionar SGBD para la de base de datos para el
implementación y desarrollo del sistema.
administración de sistemas
de base de datos, aplicando
esquemas de seguridad,
rendimiento y alta
disponibilidad en distintas
plataformas.

8 Taller de base de datos Crear manipular base de Se emplearon instrucciones SQL

datos utilizando distintos
Para la manipulación de la base
SGBD considerando
de datos.
elementos de integridad y
seguridad para el
tratamiento de la
 información en distintas
plataformas.

9 Programación de base Conectar una base de Se emplearon instrucciones SQL

de datos datos utilizando un lenguaje para la conexión de base de
de programación datos y lenguaje PHP.
actualizado, así como ser
capaz de programar un
sistema con diferentes tipos
de arquitecturas.
5.3 Fundamentación Académica. (Tabla Relacional de Competencias
específicas de las materias para el desarrollo del proyecto)

Tabla 3 Tabla Relacional de Competencias

No. Asignatura Competencia de la Competencia a desarrollar y
asignatura aplicar en el proyecto de
Residencia, Tesis… etc. (el
que aplique)

1. Programación de Conectar una base de Elaboración de tablas

base de datos. datos utilizando un adecuadas a los
lenguaje de requerimientos obtenidos en
programación la institución, de esa forma
actualizado, así como se pudo partir para la
ser capaz de programar creación de la base de
un sistema con datos.
diferentes tipos de
arquitecturas.

2. Gestión de Gestionar proyectos de Se investigaron diversos

proyectos de software aplicándolos proyectos para la
software. elementos, técnicas y organización al desarrollar
herramientas, en apego el sistema
a los compromisos de
costos, tiempo y alcance.

3. Ingeniería de Desarrollar soluciones Analiza la forma del campo

software. de software, laboral en el cual se va a
considerando los establecer el sistema, para
aspectos del modelo de una mejor adaptación de
negocios, mediante la acuerdo a las
aplicación de la características establecidas.
metodología adecuada a
la naturaleza del
problema.

4. Programación Desarrollar aplicaciones Se desarrolló un sistema

Web. web que involucren escolar para una escuela
lenguajes de marcas, de primaria, en las plataformas
presentación, del lado de programación PHP y
del cliente, del servidor, HTML
con la integración de
servicios web.

5. Tópicos Desarrollar soluciones Al realizar las interfaces

avanzados de de software utilizando responsivas capaces de
 programación programación visualizarse en cualquier
concurrente, dispositivo.
programación de
eventos, que soporte
interfaz gráfica e incluya
dispositivos móviles

6. Programación Diseñar e implementar En la interacción de los

orientada a objetos de programación datos de las diferentes
objetos. que permitan resolver tablas para la realización de
situaciones reales y de las diversas funciones.
ingeniería

7. Administración de Tener la capacidad de En la organización de las

base de datos. seleccionar SGBD para diferentes tablas de la base
la implementación y de datos, en base a la
administración de prioridad de cada una.
sistemas de base de
datos, aplicando
esquemas de seguridad,
rendimiento y alta
disponibilidad en
distintas plataformas
5.4 Relación de competencias específicas directas e indirectas con la
materia rectora. (Grafo dirigido de las materias)

Figura 5. 7 Grafo dirigido de las materias

Conclusiones Y Recomendaciones

El sistema es amigable y sin duda es fácil de usar. Es confiable debido a que los datos de
la base de datos son reales, y al momento de generar altas y bajas de datos, si no fueran
correctos el sistema permite editar y corregir cualquier dato al instante.

Al final se lograron culminar positivamente los objetivos del proyecto que se propusieron
al inicio, y el sistema beneficiara a más de una persona dentro de una institución.
Referencias
George Reyes, Carlos Enrique. (2021). Competencias digitales básicas para garantizar la
continuidad académica provocada por el Covid-19. Apertura, 13(1), pp. 36-51.
http://dx.doi.org/10.32870/Ap.v13n1.1942

Mancera Carlos, Sera Leslie. (2021) gasto público en educación y evaluación de

programas educativos. https://educacion.nexos.com.mx/

de la Cruz Flores, G. (2020). El hogar y la escuela: lógicas en tensión ante la COVID-

19. Educación y pandemia. Una visión académica. Ciudad de México: UNAM, 39-46.

Lucio, P. B., Zimerman, A. A., Altamirano, C. A. L., Alcaraz, V. A. L., & Domínguez, J. L.
C. (2020). Encuesta Nacional a Docentes ante el COVID-19. Retos para la educación a
distancia. Revista Latinoamericana de Estudios Educativos (México), 50, 41-88.

Rioja Romo, J. E. (2020). Análisis del proceso de supervisión del proyecto" Encuestas en
Hogares" del Instituto Nacional de Estadística y Geografía (INEGI) para control y toma de
decisiones.

López, J. T. M., Martínez, L. R., & Coria, A. E. I. (2020). Grado de escolaridad en México y
su impacto sobre la mortalidad por Covid-19: una breve reflexión. Archivos en Medicina
Familiar, 23(2), 63-65.

LLOYD, M. W. (2020). Desigualdades educativas y la brecha digital en tiempos de

COVID-19.

Ramírez, M. L., & Rodríguez, S. A. (2020). Trayectorias escolares en la educación

superior ante la pandemia ¿continuar, interrumpir o desistir?

Schmelkes, S. (2020). La educación superior ante la pandemia de la COVID-19: el caso

de México. Universidades, 71(86), 73-87.
Martínez, Y. M., & Gamboa, L. A. A. (2020). Covid-19, pobreza y educación en Chiapas:
análisis a los programas educativos emergentes. Revista Internacional de Educación para
la Justicia Social, 9(3), 61-82.

FLORES, G. D. L. C. (2020). El hogar y la escuela: lógicas en tensión ante la COVID-19.

Ballesteros, M. G. D. (2020). Igualdad educativa y postpandemia.

Vidal Ledo, M. J., Barciela González Longoria, M. D. L. C., & Armenteros Vera, I. (2021).
Impacto de la COVID-19 en la Educación Superior. Educación Médica Superior, 35(1).

Castillo Olivares, J. M. D., & Castillo Olivares, A. D. (2021). El impacto de la COVID-19 en

el profesorado de educación superior y sus concepciones sobre la evaluación. Campus
virtuales: revista científica iberoamericana de tecnología educativa.

De Giusti, A. (2020). Policy Brief: Education during COVID-19 and beyond. Revista

Iberoamericana de Tecnología En Educación y Educación En Tecnología, (26), e12-e12.

Martínez, Y. M., & Gamboa, L. A. A. (2020). Covid-19, pobreza y educación en Chiapas:

análisis a los programas educativos emergentes. Revista Internacional de Educación para
la Justicia Social, 9(3), 61-82.