Reporte Final de Residencias Profesional

TECNOLÓGICO NACIONAL DE MÉXICO
INGENIERÍA EN SISTEMAS COMPUTACIONALES
RESIDENCIAS PROFESIONALES
NOMBRE DEL PROYECTO: SISTEMA DE GESTIÓN Y CONTROL DE

GUARDERIAS IMSS
INSTITUCIÓN O EMPRESA: INSTITUTO MEXICANO DEL SEGURO SOCIAL
ALUMNA: VIRIDIANA LÓPEZ LÓPEZ
INFORME FINAL
01 DE JUNIO DEL 2017

Instituto Tecnológico de Acapulco
Índice
Introducción ....................................................................................................................... 2
Objetivo ............................................................................................................................. 3
Información de la empresa ................................................................................................ 4
Planteamiento del problema .............................................................................................. 6
Marco Teórico .................................................................................................................... 7
Descripción de actividades .............................................................................................. 15
Análisis de requerimientos ........................................................................................... 15
Casos de uso ............................................................................................................... 21
Diseño de la interfaz..................................................................................................... 22
Diseño de la base de datos .......................................................................................... 25
Esquema conceptual de la base de datos .................................................................... 26
Desarrollo ..................................................................................................................... 27
Pruebas y resultados ....................................................................................................... 34
Conclusiones ................................................................................................................... 48
Recomendaciones ........................................................................................................... 49
Bibliografía ....................................................................................................................... 50
1
Introducción
El presente informe pretende dar a conocer el avance realizado del proyecto
“Sistema de Gestión y Control de Guarderías IMSS” durante el periodo comprendido
del 6 de febrero al 6 de marzo del presente año.
Aquí se especifica el objetivo del proyecto, así como el objetivo de la realización de

las residencias profesionales.
Este documento contiene también la información relevante de la empresa en la que

se realiza el proyecto, en este caso el Instituto Mexicano del Seguro Social.
En este documento se abordan los aspectos referentes a los avances en las

actividades de análisis de requerimientos y diseño de la interfaz del sistema, las
cuales se vieron desfasadas debido a la modificación del sistema en cuestión.
2
Objetivo
El objetivo principal de las residencias profesionales es facilitar la práctica de
conocimientos teóricos adquiridos en la formación académica dentro del sector
productivo y de servicios. Además, permite ampliar las perspectivas del desarrollo
profesional, acercando al alumno al medio laboral, permitiéndole colaborar
conjuntamente con las empresas del país para formar un adecuado perfil de
egresado de acuerdo a las verdaderas necesidades profesionales del mundo actual.
Por otra parte, el objetivo del proyecto que se desarrolla, que lleva por nombre
Sistema de Gestión y Control de Guarderías IMSS, es desarrollar un sistema de
información para la automatización del autodiagnóstico del Modelo Institucional para
la Competitividad “MC” de la Guardería No. 001 Acapulco, que permita facilitar el
acceso a dicha información.
3
Información de la empresa
El IMSS, es la institución con mayor presencia en la atención a la salud y en la
protección social de los mexicanos desde su fundación en 1943. para ello, combina
la investigación y la práctica médica, con la administración de los recursos para el
retiro de sus asegurados, para brindar tranquilidad y estabilidad a los trabajadores
y sus familias ante cualquiera de los riesgos especificados en la Ley del Seguro
Social. Hoy en día, más de la mitad de la población mexicana, tiene algo que ver
con el Instituto, hasta ahora, la más grande en su género en América Latina.
Misión
La misión del IMSS es ser el instrumento básico de la seguridad social, establecido

como un servicio público de carácter nacional, para todos los trabajadores y
trabajadoras y sus familias.
Visión
Por un México con más y mejor seguridad social.
Su Delegación Estatal en Guerrero con dirección en Av. Cuauhtémoc No. 95

colonia Centro C.P 39300.
Asesor externo: Ing. Carlos Esteban Barajas Diego
Email: carlos.barajasd@imss.gob.mx
4
Organigrama IMSS Delegación Estatal en Guerrero
En la figura 1 se muestra el organigrama del instituto y se señala el área en la que se está trabajando, la cual es la
Coordinación Delegacional de Informática.
Figura 1. Organigrama IMSS
5
Planteamiento del problema

El problema original que era el control de las incidencias de los menores, tuvo que
ser modificado debido a que la institución requiere con más premura un sistema que
implemente el Modelo Institucional para la Competitividad “MC”, puesto que la
guardería No. 1 se encuentra en proceso de certificación y requiere de este sistema
para la autoevaluación del MC.
El modelo para la competitividad tiene como objetivo: obtener procesos y servicios

acordes a las necesidades y expectativas de las y los usuarios, incrementando su
satisfacción y confianza que permita el desarrollo de las capacidades y ventajas
competitivas del instituto. Este modelo cuenta con 8 criterios, que a su vez están
compuestos por sub-criterios, los cuales deben ser autoevaluados el último trimestre
de cada año como proceso de análisis para evaluar el avance en la implementación
o mantenimiento del MC con referencia a dichos criterios.
El problema reside en que esta actividad se realiza actualmente en documentos de

hoja de cálculo, las cuales son impresas y posteriormente almacenadas en
carpetas, reduciendo el espacio en el área de trabajo debido a lo grandes que son.
además de que para sustentar la información que se brinda, se necesita de
documentos extras como son minutas, convocatorias, actas, entre otros, que en
algunos casos no son agregados a la carpeta de la autoevaluación y por esta
cuestión a menudo se traspapelan o extravían. Cabe recalcar que esta información
debe ser de fácil acceso, ya que la Coordinación Delegacional de Competitividad y
Capacitación realiza visitas de verificación a la unidad y requiere la revisión de dicha
información para poder evaluar la implementación o mantenimiento del modelo.
6
Marco Teórico
En esta sección del documento se mostrarán los temas y conceptos relevantes
utilizados para poder comprender y llevar a cabo el desarrollo del sistema, así como
las herramientas empleadas.
Tanto personas como organizaciones utilizan la información todos los días, es por
esto que el sistema que se desarrolla cumple con la función de un sistema de
información, los cuales se pueden definir como un “conjunto de componentes
interrelacionados que reúnen, procesan, almacenan y distribuyen datos e
información, Proporcionando un mecanismo de retroalimentación con el fin de
cumplir un objetivo”. (Stair & Reynolds, 2010)
Sabemos que “las finalidades de los sistemas de información como las de cualquier
otro sistema dentro de una organización son: procesar entradas, mantener
archivos de datos relacionado con la organización, producir información, reportes y
otras salidas”. (Senn, 1997)
Una vez que se ha entendido que es un sistema de información, es necesario

definir los componentes que formarán parte del mismo. Uno de los principales es
una Base de Datos, la cual es definida por distintos autores tal y como se muestra
a continuación:
“Colección de datos persistentes que pueden compartirse e interrelacionarse”.

(Mannino, 2007)
“La base de datos es una colección de información perteneciente a un mismo

contexto (o problema), que está almacenada de forma organizada en ficheros.
Dicha base de datos, está organizada mediante tablas que almacenan información
concerniente a algún objeto o suceso. Estas tablas se relacionan entre si formando
vínculos que ayudan a mantener la información de los diversos objetos de forma
ordenada y coherente (sin contradicciones)”. (López & de Castro, 2014)
7
A pesar de la falta de una definición absoluta, la mayoría de las fuentes coinciden

en que una base de datos es una colección organizada en un formato estructurado
que es definido como metadatos que describe esa estructura.
En la actualidad, las bases de datos son el elemento fundamental en las áreas que
utilizan sistemas computarizados, debido a que permite operar información de
manera organizada, segura, confiable y en grandes cantidades. Las bases de datos
facilitan no solo el registro de gran cantidad de datos. Son también el acceso a los
mismos.
Como muchos usuarios de sistemas de bases de datos no están familiarizados

con computadores, los desarrolladores esconden la complejidad de los mismos a
través de varios niveles de abstracción para simplificar la interacción de dichos
usuarios con el sistema:
 Nivel físico: Es el nivel más bajo de abstracción que describe cómo se

almacenan realmente los datos. En este tipo se describen detalladamente las
estructuras de datos complejas de bajo nivel.
 Nivel lógico: Este es el nivel más alto de abstracción el cual describe qué
datos se almacenan en la base, y qué relaciones existen entre dichos datos.
La base de datos completa se describe así en términos de un número
pequeño de estructuras relativamente simples. Aunque la implementación de
estructuras simples en el nivel lógico puede involucrar estructuras complejas
del nivel físico, los usuarios del primer nivel no necesitan preocuparse por
esta complejidad. Los administradores de bases de datos que deben decidir
la información que se mantiene en la base de datos, usan el nivel lógico de
abstracción.
 Nivel de vistas: El nivel más alto de abstracción describe sólo parte de la
base de datos completa. A pesar del uso de estructuras más simples en el
nivel lógico, queda algo de complejidad, debido a la variedad de información
almacenada en una gran base de datos. Muchos usuarios del sistema de
8
base de datos no necesitan toda esta información. En su lugar, tales usuarios

necesitan acceder sólo a una parte de la base de datos para que su
interacción con el sistema se simplifique y se define la abstracción del nivel
de vistas. El sistema puede proporcionar muchas vistas para la misma base
de datos. (Silberschatz, 2002)
Para llevar a cabo el manejo de la base de datos es necesario el uso de un lenguaje

llamado Structured Query Language mejor conocido por sus siglas en inglés SQL
(Lenguaje Estructurado de Consultas). Siendo actualmente el lenguaje estándar.
Este lenguaje permite al Sistema Gestor de Bases de Datos (SGBD) la creación de
una Base de Datos así como usuarios para ella. También permite crear tablas,
ingresar nuevos datos o bien manipular los ya existentes.
El lenguaje SQL es una herramienta para organizar, gestionar y recuperar datos

almacenados en una base de datos relacional por tanto, permite la comunicación
con el sistema de gestión de la base de datos. Es tan conocido en bases de datos
relacionales que muchos lenguajes de programación incorporan sentencias SQL
como parte de su repertorio. Entre las principales características del SQL podemos
destacar las siguientes:
 Es un lenguaje para todo tipo de usuarios (administradores, desarrolladores

y usuarios normales).
 El usuario que emplea SQL especifica qué quiere no dónde, ni cómo.
 Permite hacer cualquier consulta de datos.
 Es posible manejarlo para consultas, actualizaciones, definición de datos y
control.
Actualmente existen herramientas que facilitan la creación y administración de
bases de datos del tipo relacional, este tipo de software llamados Sistemas Gestores
de Bases de Datos (SGBD) permiten reducir el tiempo y esfuerzo durante la
elaboración y gestión bases de datos.
9
Un SGBD consiste en una colección de datos interrelacionados y un conjunto de

programas para acceder a dichos datos. La colección de datos normalmente
denominada base de datos, contiene información relevante para una empresa.
El objetivo principal de un SGBD es proporcionar la forma de almacenar y recuperar

la información de una base de datos de manera que sea tanto práctica como
eficiente. (Silberschatz, 2002)
Cada uno de los SGBD´s existentes ofrecen distintas características que les
permiten diferenciarse de los otros, aunque es cierto que comparten ciertas
funciones esenciales se diferencian también en aspectos como el tipo de licencia,
compatibilidad, disponibilidad, etc.
En este caso como sistema gestor de base datos usaremos MySQL el cual es un
sistema de gestión de bases de datos relacional desarrollado bajo licencia dual
GPL/Licencia comercial por Oracle Corporation y está considerada como la base
datos open source más popular del mundo, y una de las más populares en general
junto a Oracle y Microsoft SQL Server, sobre todo para entornos de desarrollo web,
es por esto que se eligió para el desarrollo de este sistema.
Es un sistema de gestión de bases de datos relacional, creado por la empresa sueca

MySQL, la cual tiene el copyright del código fuente del servidor SQL, así como
también de la marca. MySQL es un software de código abierto, licenciado bajo la
GPL de la GNU, aunque MySQL distribuye una versión comercial, en lo único que
se diferencia de la versión libre, es en el soporte técnico que se ofrece, y la
posibilidad de integrar este gestor en un software propietario, ya que, de otra
manera, se vulneraría la licencia GPL.
Características:
 El principal objetivo de MySQL es velocidad y robustez.
 Soporta gran cantidad de tipos de datos para las columnas.
 Ofrece gran portabilidad entre diversos sistemas.
10
 Implementación multihilo que permite aprovechar las capacidades de los

sistemas multiproceso.
 Flexible sistema de contraseñas (passwords) y gestión de usuarios, con un
muy buen nivel de seguridad en los datos.
 El servidor soporta mensajes de error en distintas lenguas
 Facilidad de uso.
 Es gratuito, puede obtener y modificar código fuente de MySQL.
 Capacidad de gestión de lenguajes de consulta SQL.
 Capacidad para conectar un gran número de clientes simultáneamente al
servidor.
 Disponibilidad para una amplia variedad de interfaces de programación para
lenguajes como C, Perl, Java, C#, PHP y Python.
 Dispone de control de acceso.
Por otra parte, para el lado de la interfaz se utilizará el lenguaje de marcado HTML
por sus siglas en inglés de HyperText Markup Language (lenguaje de marcas de
hipertexto), hace referencia al lenguaje de marcado para la elaboración de páginas
web. Es un estándar que sirve de referencia del software que conecta con la
elaboración de páginas web en sus diferentes versiones, define una estructura
básica y un código para la definición de contenido de una página web, como texto,
imágenes, videos, juegos, entre otros.
El lenguaje HTML es un estándar reconocido en todo el mundo y cuyas normas

define un organismo sin ánimo de lucro llamado World Wide Web Consortium, más
conocido como W3C. Como se trata de un estándar reconocido por todas las
empresas relacionadas con el mundo de Internet, una misma página HTML se
visualiza de forma muy similar en cualquier navegador de cualquier sistema
operativo. (Eguiluz, 2017)
El propio W3C define el lenguaje HTML como "un lenguaje reconocido

universalmente y que permite publicar información de forma global".
11
Incluir en una misma página HTML los contenidos, el diseño y la programación

complica en exceso su mantenimiento. Normalmente, los contenidos y el diseño de
la página web son responsabilidad de diferentes personas, por lo que es
conveniente separarlos.
CSS es el mecanismo que permite separar los contenidos y el aspecto que deben
presentar esos contenidos, definido como Hojas de Estilo en Cascada (Cascading
Style Sheets), es un mecanismo simple que describe cómo se va a mostrar un
documento en la pantalla, o cómo se va a imprimir, o incluso cómo va a ser
pronunciada la información presente en ese documento a través de un dispositivo
de lectura. Esta forma de descripción de estilos ofrece a los desarrolladores el
control total sobre estilo y formato de sus documentos.
CSS se utiliza para dar estilo a documentos HTML y XML, separando el contenido
de la presentación. Los Estilos definen la forma de mostrar los elementos HTML y
XML. CSS permite a los desarrolladores Web controlar el estilo y el formato de
múltiples páginas Web al mismo tiempo. Cualquier cambio en el estilo marcado para
un elemento en la CSS afectará a todas las páginas vinculadas a esa CSS en las
que aparezca ese elemento.
Funciona a base de reglas, es decir, declaraciones sobre el estilo de uno o más

elementos. Las hojas de estilo están compuestas por una o más de esas reglas
aplicadas a un documento HTML o XML. La regla tiene dos partes: un selector y la
declaración. A su vez la declaración está compuesta por una propiedad y el valor
que se le asigne. El selector funciona como enlace entre el documento y el estilo,
especificando los elementos que se van a ver afectados por esa declaración. La
declaración es la parte de la regla que establece cuál será el efecto.
Por la parte de la funcionalidad del sistema se utilizará PHP (acrónimo recursivo de

PHP: Hypertext Preprocessor) el cual es un lenguaje de programación de uso
general de código del lado del servidor originalmente diseñado para el desarrollo
web de contenido dinámico. Fue uno de los primeros lenguajes de programación
12
del lado del servidor que se podían incorporar directamente en el documento HTML
en lugar de llamar a un archivo externo que procese los datos. El código es
interpretado por un servidor web con un módulo de procesador de PHP que genera
la página web resultante.
Lo que distingue a PHP de algo del lado del cliente como Javascript es que el código
es ejecutado en el servidor, generando HTML y enviándolo al cliente. El cliente
recibirá el resultado de ejecutar el script, aunque no se sabrá el código subyacente
que era. El servidor web puede ser configurado incluso para que procese todos los
ficheros HTML con PHP, por lo que no hay manera de que los usuarios puedan
saber qué se tiene debajo de la manga.
Lo mejor de utilizar PHP es su extrema simplicidad para el principiante, pero a su

vez ofrece muchas características avanzadas para los programadores
profesionales.
También se hará uso de JavaScript que es un lenguaje de programación

interpretado, dialecto del estándar ECMAScript. Se define como orientado a objetos,
basado en prototipos, imperativo, débilmente tipado y dinámico.
Se utiliza principalmente en su forma del lado del cliente (client-side), implementado

como parte de un navegador web permitiendo mejoras en la interfaz de usuario y
páginas web dinámicas, aunque existe una forma de JavaScript del lado del servidor
(Server-side JavaScript o SSJS). Su uso en aplicaciones externas a la web, por
ejemplo, en documentos PDF, aplicaciones de escritorio (mayoritariamente widgets)
es también significativo.
JavaScript se diseñó con una sintaxis similar a C, aunque adopta nombres y

convenciones del lenguaje de programación Java. Sin embargo, Java y JavaScript
tienen semánticas y propósitos diferentes.
Para poder trabajar con estas herramientas en conjunto se utilizará WampServer el

cual es un entorno de desarrollo web para Windows en el cual se podrán crear
13
aplicaciones web con Apache, PHP y base de datos en MySQL (motor de base de
datos).
Para la realización de los bocetos se apoyará de la herramienta MokupScreens, la

cual permite crear prototipos de tu aplicación y organizarlas en escenarios, pues
ayuda a bosquejar maquetas de la pantalla de su uso.
14
Descripción de actividades
Análisis de requerimientos
En un principio se elaboró un análisis de requerimientos para el sistema original,
para el cual se pidió la realización de un video informativo que serviría para conocer
el proceso del reporte de las incidencias de los menores.
El video se realizó y, posteriormente, se notificó la variación del sistema; por tal

motivo el análisis de requerimientos comenzó de nueva cuenta. De este proceso
se obtuvieron los siguientes requerimientos:
Requerimientos funcionales
Identificación del RF01
requerimiento:
Nombre del Autentificación de usuario
Requerimiento:
Características: Los usuarios deberán identificarse para acceder a cualquier parte del
sistema
Descripción del El sistema podrá ser consultado por cualquier usuario dependiendo
requerimiento: del módulo en el cual se encuentre y su nivel de accesibilidad.
Prioridad del requerimiento:
Alta
Efecto Si la contraseña o nombre del usuario son incorrecto se mostrará un

mensaje de “Usuario o Clave Incorrecta”. De lo contrario mostrará un
Colateral: mensaje de Bienvenida y un menú.
15
requerimiento:
Nombre del Criterios del “MC”
Requerimiento:
Características: Los usuarios podrán seleccionar cuál de los criterios necesitan

capturar.
Descripción del En la venta principal deberá poderse seleccionar de entre los 8

requerimiento: criterios del modelo a través de un botón.
Alta
requerimiento:
Nombre del Subcriterios del “MC”
Requerimiento:
Características: Cada subcriterio contará con los puntos que lo conforman para ser
rellenados.
Descripción del Una vez seleccionado uno le los criterios, se debe poder seleccionar
requerimiento: entre los subcriterios que lo componen y poder capturar la información
correspondiente en cada uno de sus puntos.
Alta
16
requerimiento:
Nombre del Documentos adjuntos
Requerimiento:
Características: El sistema permitirá adjuntar en cada punto de los subcriterios un

documento como evidencia.
Descripción del Debido a que se requiere comprobar que cada punto es cumplido se
requerimiento: necesita de documentos extras que puedan ser adjuntados en cada uno
de ellos.
Alta
requerimiento:
Nombre del Herramientas de apoyo
Requerimiento:
Características: El sistema contará con los formatos utilizados como herramientas de

apoyo en el “MC” en blanco descargables.
Descripción del Debido a que se podrán adjuntar archivos, el sistema proporcionara los
requerimiento: formatos en blanco para que el usuario los llene y posteriormente los
adjunte.
Alta
17
requerimiento:
Nombre del Evidencias
Requerimiento:
Características: El sistema permitirá descargar formatos llenos como referencia.
Descripción del Estos archivos permitirán al usuario guiarse para el llenada de los
requerimiento: formatos de herramientas de apoyo.
Alta
Requerimientos No Funcionales
Identificación del RNF01
requerimiento:
Nombre del Interfaz del sistema
Requerimiento:
Características: El sistema debe tener una interfaz de uso intuitiva y sencilla.
Descripción del El sistema presentará una interfaz de usuario sencilla para que sea de
requerimiento: fácil manejo a los usuarios del sistema.
Alta
18
requerimiento:
Nombre del Eficiencia
Requerimiento:
Características: El sistema debe ser capaz de operar adecuadamente con múltiples

usuarios con sesiones concurrentes.
Descripción del Garantizar el desempeño del sistema informático a los diferentes

requerimiento: usuarios.
En este sentido, la información almacenada o registros realizados

podrán ser consultados y actualizados permanente y simultáneamente,
sin que afecte el tiempo de respuesta.
Alta
requerimiento:
Nombre del Disponibilidad continua del sistema
Requerimiento:
Características: El sistema tendrá que estar en funcionamiento permanente.
Descripción del La disponibilidad del sistema debe ser continua con un nivel de servicio
requerimiento: para los usuarios de 7 días por 24 horas, garantizando un esquema
adecuado.
Alta
19

requerimiento:
Nombre del Seguridad lógica
Requerimiento:
Características: Los permisos de acceso al sistema podrán ser cambiados solamente por
el administrador de acceso a datos.
Descripción del Únicamente el administrador de acceso es quien podrá realizar cambios
requerimiento: en los permisos que tiene el resto de los usuarios.
Alta
requerimiento:
Nombre del Ayuda en el uso del sistema
Requerimiento:
Características: El sistema debe contar con manuales de usuario estructurados

adecuadamente.
Descripción del La interfaz debe estar complementada con manuales que especifiquen
requerimiento: con claridad la forma correcta de usar el sistema.
Alta
20
Casos de uso:
Para especificar la comunicación y el comportamiento del sistema mediante su
interacción con los usuarios a continuación, se muestran los casos de uso del
Sistema de Gestión y Control de Guarderías IMSS (ver figura 2).
Figura 2. Diagrama de casos de uso
21
Diseño de la interfaz
Para demostrar y dar una idea al solicitante de cómo iba a quedar el sistema, se
comenzó el proceso de diseño realizando unos mockup1 de las ventanas que
conformarán el sistema con los siguientes resultados:
En la ventana de inicio de sesión (ver figura 3) el usuario deberá autenticarse con

su nombre de usuario y contraseña correspondiente.
Figura 3. Boceto ventana de inicio de sesión
Una vez autentificados accederán a un menú del cual podrán seleccionar entre los
8 criterios que conforman el modelo (ver figura 4).
1
Boceto básico y de baja calidad del desarrollo de una página web o el diseño de una interfaz, la finalidad de
este es el mostrar al cliente un diseño o boceto rápido y facilitar la comunicación entre cliente y
desarrollador.
22
Figura 4. Boceto ventana de selección de criterios
Como cada criterio tiene distintos sub-criterios se podrá seleccionar entre cada uno
de ellos (ver figura 5).
Figura 5. Boceto ventana de selección de subcriterios
23
Una vez seleccionado uno de los sub-criterios se podrá hacer la captura de los datos
y la selección de los archivos que se adjuntaran como evidencia (ver figura 6).
Figura 6. Boceto ventana de captura de datos
24
Diseño de la base de datos:

La base de datos almacenará las respuestas dadas a las preguntas que se plantean
en cada uno de los sub-criterios del “MC”. En la figura 7 se muestra el modelo
relacional de dicha base de datos.
Figura 7. Modelo relacional de la base de datos
25
Esquema conceptual de la base de datos:

Para describir la estructura de una base servir para describir la estructura de la Base
de Datos a continuación se muestra el esquema conceptual de la misma.
Entidad Relación
Usuario (idUsuario, NombUsuario, Password, rol)
Criterio (idCriterio, NombCriterio)
Subcriterio (idSubCriterio, Criterio_idCriterio, NombSubCrit)
Apartado (idApartado, SubCriterio_idSubCriterio, PreguntaApar)
Usuarios_preguntas (idUsuario_Preguntas, Usuario_idUsuario,

Apartado_idApartado, Respuesta, Fecha Periodo)
Evidencias (idArchivo, Archivo, NombreArch, ubicación,

Usuario_Preguntas_idUsuario_Preguntas)
26
Desarrollo:
En la parte del desarrollo se utilizaron los lenguajes HTML5, CSS3, PHP, y
JavaScript por el lado de la interfaz del sistema y para la base de datos se utilizó
MySQL, conjuntados en el entorno de desarrollo web WampServer.
A continuación, se muestra la ventana de inicio se sesión (figura 8) la cual valida al

usuario antes de entrar, esto por parte del servidor, quien hace la consulta a la tabla
de usuarios y verifica que el usuario exista y que la contraseña sea correcta como
se muestra en el código de abajo.
Figura 8. Ventana de inicio de sesión
<?php
session_start();
if (!empty($_POST)) {
if (isset($_POST["usuario"]) && isset($_POST["pass"])) {
if ($_POST["usuario"] != "" && $_POST["pass"] != "") {
require "php/conexion.php";
$user = $_POST['usuario'];
$pass = $_POST['pass'];
27
$sql = mysqli_query($con, "SELECT * FROM usuario WHERE

NombUsuario='$user'");
if ($f = mysqli_fetch_assoc($sql)) {
if ($pass == $f['Password']) {
$_SESSION['idUsuario'] = $f['idUsuario'];
$_SESSION['NombUsuario'] = $f['NombUsuario'];
$_SESSION['rol'] = $f['rol'];
if ($f['rol'] == 1) {
echo
"<script>location.href='admin.php'</script>";
} else {
echo
"<script>location.href='index2.php'</script>";
}
} else {
echo '<script>alert("CONTRASEÑA
INCORRECTA")</script> ';
echo "<script>location.href='index.php'</script>";
}
} else {
echo '<script>alert("ESTE USUARIO NO EXISTE")</script>

';
}
} else {
echo '<script>alert("LLENAR TODOS LOS CAMPOS")</script>';
}
}
}
Una vez que la sesión fue iniciada se mostrará un menú circular en el que se podrá
elegir cuál de los criterios será evaluado, tal como se muestra en la figura 9.
28
Figura 9. Ventana de selección de criterios
Para fines demostrativos seleccionaremos el criterio 1 el cual nos mostrará una

ventana como la de la figura 10, en la que se seleccionará entre los sub-criterios
que lo componen.
Figura 10. Ventana de selección de subcriterios
29
Debido a los requerimientos cambiantes del usuario se decidió que cada uno de los
apartados de los sub-criterios podrían ser llenados de manera individual y en
conjunto como se planteó en el boceto. Por tal motivo, al seleccionar uno de los sub-
criterios se desplegará un cuadro en el que hará la selección del apartado a capturar
tal y como lo muestra la figura 11.
Figura 11. Cuadro de selección de apartado
Finalmente, al seleccionar uno de los apartados se mostrará la ventana de captura

(Figura 11) en la que el usuario podrá realizar sus comentarios y adjuntar los
archivos que servirán como evidencia de lo que captura.
Cabe mencionar que como no se sabe la cantidad de archivos que requiere

adjuntar, el usuario se agregó al formulario de tipo archivo el atributo múltiple, es
decir, en ese mismo formulario se pueden seleccionar más de un archivo
permitiendo así que el usuario cargue los archivos que le sean necesarios.
También se agregó una función de JavaScript que se muestra abajo, en la cual se
realiza la validación tanto de tipo de archivo, como de tamaño; ya que los únicos
30
tipos de archivo que se podrán subir son PDF, Word, PowerPoint y Excel. Estos con
un peso no mayor a 2MB.
Figura 12. Ventana de captura de datos
var archivos1 = "";

var namearchivo = "";
var tamano = 0;
function verificafile(){
archivos1 = document.getElementById("arch").files;
for (var i = 0; i < archivos1.length; i++) {
namearchivo = archivos1[i].name;
tamano = archivos1[i].size;
var ext = namearchivo.substring(namearchivo.lastIndexOf('.') + 1);
if(ext =="EXE" || ext=="exe" || ext=="jpg" || ext=="JPG" ||
ext=="png" || ext=="PNG"|| ext=="jpeg" || ext=="JPEG" || ext=="mp4" ||
ext=="MP4" || ext=="MPEG4" || ext=="mpeg4" || ext=="AVI" || ext=="avi" ||
ext=="MPEG-4" || ext=="mpeg-4" || ext=="MOV" || ext=="mov" || ext=="WMV" ||
ext=="wmv" || ext=="3GP" || ext=="3gp"){
alert("Tipo de archivo no permitido: "+namearchivo);
return false;
31
}
if (tamano > 2097152) {
alert("No puede cargar archivos con peso mayor a 2MB:
"+namearchivo);
return false;
}
}
return true;
}
Debido a que es necesario un nombre de usuario y una contraseña para

autentificarse al entrar al sistema se requiere de alguien que los administre. Este
será el caso de los administradores quienes tendrán acceso a la ventana de
usuarios la cual muestra un crud con los datos de los usuarios registrados y las
opciones de editar, eliminar, buscar o registrar un nuevo usuario, como se muestra
en la figura 13.
Figura 13. Ventana de usuarios
Al dar clic al botón de agregar emerge un cuadro en el que se escriben los datos del
nuevo usuario y se agregan a la base de datos como se muestra en la figura 14.
32
Figura 14. Ventana de agregar usuario
Al seleccionar el botón de editar se mostrará una ventana con los datos del usuario
cargados y listos para modificarse, al darle clic al botón de actualizar se hará la
modificación como se ve en la figura 15.
Figura 15. Ventana de editar usuario
33
Pruebas y resultados
En esta parte se comentan las pruebas hechas al Sistema de Gestión y Control de
Guarderías IMSS que validan a este proyecto como resultado del problema antes
definido y, finalmente, se comentan los resultados y conclusiones de dicho proyecto,
así como el trabajo futuro que se puede elaborar.
Las pruebas realizadas sobre el sistema consistieron en evaluaciones periódicas

por el personal de la Coordinación Delegacional de Competitividad, quienes fueron
evaluando su funcionamiento y proporcionando críticas constructivas acerca de
cómo hacer más robusta la aplicación. Se prepararon un conjunto de consultas y
capturas para probar la funcionalidad. Las siguientes imágenes muestran la
funcionalidad del sistema y como responde a una consulta o captura de ejemplo.
Para la realización de pruebas se crearon dos usuarios: Un administrador y un

usuario común. Para iniciar sesión se agregan en los campos correspondientes, el
nombre de usuario y contraseña para después dar clic en el botón “Entrar” tal y
como lo muestra la figura 16.
Figura 16. Iniciar sesión
34
Si el usuario no existe o la contraseña no es correcta se mostrará un mensaje de

error como se observa en la figura 17 y regresará al usuario a la ventana de inicio
de sesión para que vuelva a ingresar sus datos; esta vez de manera correcta.
a)
b)
Figura 17. a) Mensaje error usuario; b) Mensaje error contraseña
35
Al iniciar sesión de manera correcta dirigirá al usuario a la ventana principal la cual

se muestra en la figura 18.
Figura 18. Ventana principal
La diferencia al iniciar sesión siendo usuario administrador, es que se podrá dar de

alta a nuevos usuarios, modificarlos o eliminarlos dando clic en el botón de
administrar que aparecerá en la ventana principal como se ve en la figura 16.
Figura 19. Administrar usuarios
36
Al dar clic en el botón llevará al usuario a una nueva ventana en la que se mostrará
la lista de usuarios existentes, en la cual podrá elegir entre crear un nuevo usuario
y editar o eliminar alguno de los existentes como se muestra en la figura 20.
Figura 20. Ver lista de usuarios existentes
Para agregar un nuevo usuario deberá dar clic en el botón “agregar” y llenar el
formulario que aparece con los datos que se piden (Figura 21). Cabe recalcar que
la asignación de roles es muy importante puesto que, es mediante estos, que se
define si el nuevo usuario será común o administrador, así, para asignar un usuario
común se deberá asignar el valor 2 y para administradores el valor 1.
Figura 21. Agregar usuario
37
Una vez que los datos del nuevo usuario se guardaron en la base de datos,
aparecerá un mensaje de que, se agregó correctamente como se muestra en la
figura 22.
Figura 22. Mensaje usuario agregado exitosamente
Si ocurre algún error no se podrán agregar los datos del nuevo usuario y se mostrará
un mensaje como lo muestra la figura 23. Esto puede ser ocasionado si sobrepasó
el número de caracteres del nombre de usuario o contraseña ya que, la longitud de
estos campos es de 15 caracteres y 8 respectivamente.
Figura 23. Mensaje no se pudo agregar usuario
38
Si se desean modificar los datos de algún usuario basta con dar clic en el botón
“Editar” que se encuentra al final de la fila del usuario deseado. Mostrará un
formulario con los datos del usuario seleccionado listos para su modificación, una
vez satisfecho con el cambio el usuario deberá dar clic en el botón “Actualizar”,
como se muestra en la figura 24.
Figura 24. Formulario editar usuario
Una vez que la modificación en la base de datos se realizó, se manda un mensaje

de que la actualización fue exitosa, tal como se ve en la figura 25.
Figura 25. Mensaje de usuario actualizado exitosamente
39
Si se desea borrar uno de los usuarios existentes, el usuario deberá dar clic en el
botón “Eliminar” que se encuentra al final de la fila del usuario deseado. Para realizar
la acción, antes se pedirá la confirmación de la misma como se muestra en la figura
26.
Figura 26. Confirmación de eliminación de usuario
Una vez que el usuario ha sido eliminado de la base de datos aparecerá un mensaje
de que ha sido eliminado exitosamente tal como se ve en la figura 27.
Figura 27. Mensaje usuario eliminado exitosamente
40
Para la captura de datos es necesario agregar una descripción de las actividades

realizadas en torno a la implementación del modelo de competitividad de acuerdo
al criterio que se está trabajando como se muestra en la figura 28.
Figura 28. Área de comentarios
Para cargar archivos como evidencia, el usuario deberá dar clic en el botón “Elegir
archivos” el cual abrirá un explorador de archivos en el que se seleccionarán los
archivos deseados. Cabe mencionar que la carga puede ser múltiple, como se
muestra en la figura 29.
Figura 29. Selección de archivos
41
Existe una restricción de tipo de archivos, la cual dicta que los formatos aceptados
son: PDF y de la paquetería Office, archivos de Word, PowerPoint y Excel, por lo
que si se intenta cargar un archivo de otro tipo se mostrará un mensaje de que ese
tipo de archivo no es válido como se muestra en la figura 30.
Figura 30. Mensaje tipo de archivo no permitido
Existe también una restricción de tamaño de archivos, por lo que si se intenta subir
uno de más de 2MB aparecerá un mensaje especificando que no se pueden cargar
archivos con peso mayor a 2MB, como se ve en la figura 31.
Figura 31. Mensaje de tamaño de archivo no permitido
42
Para evitar esto, se agregó el atributo accept para que a la hora de abrir el
explorador de archivos solo muestre los formatos válidos. Por eso al ver en la
esquina del explorador, dirá “Archivos personalizados”. Como se ve en la figura 32.
Figura 32. Archivos personalizados
Si se desea hacer capturas de periodos anteriores, se puede modificar la fecha con

el calendario que aparecerá al dar clic al formulario de fecha. Que se desliza debajo
del área de comentarios como se muestra en la figura 33.
Figura 33. Modificación de fecha
43
Si todo va bien y los archivos son válidos, entonces se registrará la captura en la

base de datos y se mostrará un mensaje de que se agregó exitosamente como se
ve en la figura 34.
Figura 34. Mensaje de datos agregados exitosamente
Para consultar los datos que se han capturado, el usuario deberá seleccionar el
criterio, el sub-criterio y el periodo que desea buscar en la parte izquierda de la
pantalla principal. Posteriormente, al dar clic en el botón “Consultar” como se
Figura 35. Consultar datos capturados
44
Se mostrará una nueva ventana en la que se enlistan los datos de las capturas
realizadas según los filtros que se seleccionaron con anterioridad, tal como se
Figura 36. Lista de datos capturados
Los archivos adjuntados están disponibles para descargarse, dando clic sobre la
liga del nombre del archivo que se desee como se ve en la figura 37.
Figura 37. Descarga de archivos
45
La barra de navegación cuenta con herramientas de apoyo, los cuales son formatos
para implementar los criterios del “MC”; estos son formatos en blanco, descargables
para su llenado y están organizados según el criterio que se desee trabajar tal como
se muestra en la figura 38.
Figura 38. Descarga de herramientas de apoyo
De igual manera se cuenta con evidencias, tales como los formatos descargables
de ayuda para el llenado de las herramientas de apoyo. Es decir, formatos llenados
correctamente con anterioridad que servirán como guía y que están disponibles para
descargar como se observa en la figura 39.
Figura 39. Descarga de evidencias
46
Por último, se encuentra también en la barra de navegación un apartado de ayuda

en el cual se pueden descargar tanto la norma del modelo de competitividad como
la guía de implementación del mismo y el manual de usuario del sistema. como se
Figura 40. Ayuda del sistema
Al dar clic al archivo que desee revisar se abrirá en una nueva pestaña como lo
muestra la figura 41.
Figura 41. Visualización de formatos de ayuda
47
Conclusiones
Una vez concluido el tiempo asignado a las residencias profesionales se puede decir
que este proyecto cumplió con todos los objetivos propuestos, ya que mejoró el
proceso de implementación y mantenimiento del Modelo Institucional para la
Competitividad en la Guardería No. 001 de Acapulco, pues les permite realizar la
captura de los criterios que componen dicho modelo de manera más rápida y
eficiente, también evita el almacenamiento de tantos papeles en carpetas que solo
ocupaban espacio en las oficinas, además permite tener acceso rápido a la
información cada vez que se realiza una supervisión. Esta herramienta beneficiará
de manera considerable a la Guardería ya que no se había implementado algo igual
antes, resultando una innovación la cual les permitirá estar a la vanguardia y mejorar
su nivel de competitividad.
En cuanto a la experiencia recibida puedo concluir que la realización de residencias

profesionales es muy útil, ya que acerca al alumno al campo laboral y a tener una
visión más realista de lo que es un verdadero trabajo, fuera del área teórica a la que
se está acostumbrado en la escuela, puesto que se afronta a nuevos retos y existe
el riesgo latente de que haya inconvenientes que habrá que solucionar.
En este caso, se presentó el problema de la adecuación del proyecto, debido a que

la Guardería No. 001 Acapulco se encuentra en proceso de certificación y tenía más
prioridad una herramienta que ayudará con el autodiagnóstico del Modelo para la
Competitividad, dejando de lado el enfoque anterior sobre el reporte de las
incidencias de los menores, esto se vio reflejado en los tiempos del proyecto, puesto
que ya se llevaba un avance en el análisis de requerimientos de la primer propuesta,
y al realizarse la adecuación se tuvo que volver a comenzar esta fase, a pesar de
eso se logró concluir el sistema en tiempo y forma, solo con un poco de desface en
los tiempos programados.
48
Recomendaciones
Este proyecto resultó completo y funcional, sin embargo, en un futuro se podrían
implementar mejoras al sistema. En primera instancia realizar las adecuaciones
conforme al avance y evolución del Modelo de Competencias, puesto que éste es
actualizado cada cierto tiempo por la institución, además se propone como trabajo
a futuro:
 Integrar una agenda para la organización de actividades de la unidad, que

permita alertar a los usuarios del sistema de eventos que hayan sido
programados y estén próximos a ocurrir.
 Implementar la generación de reportes de los datos capturados, es decir que
en automático la información que se consulta sea dada en formato PDF listo
para imprimir.
49
Bibliografía
Alarcón, V. F. (2026). Desarrollo de sistemas de información : una metodología
basada en el modelado. México: Edicions UPC.
Coordinación de Modernización y Competitividad. (2016). Norma que establece las

disposiciones para la implementación y mantenimiento del modelo
institucional para la competitividad "MC". México: Instituto Mexicano del
Seguro Social.
Eguiluz, J. (4 de Marzo de 2017). LIBROSWEB. Obtenido de

http://librosweb.es/libro/xhtml/
López, I., & de Castro, M. (2014). Gestión de bases de datos. Madrid: Garceta grupo
editorial.
Mannino, M. (2007). Administración de bases de datos: Diseño y desarrollo de

aplicaciones 3 ed. México, D.F.: McGRAW-HILL.
Senn, J. (1997). Análisis y diseño de sistemas de información 2 ed. México:

McGRAW-HILL.
Silberschatz, A. (2002). Fundamentos de bases de datos 4ta edición. España:

McGraw-Hill.
Sommerville, I. (2005). Ingeniería de software. México: Addison-Wesley.
Stair, R., & Reynolds, G. (2010). Principios de sistemas de información: Un enfoque

administrativo 9 ed. México, D.F.: Cengage Learning.
50

Reporte Final de Residencias Profesional

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Reporte Final de Residencias Profesional

Cargado por

Copyright:

Formatos disponibles

TECNOLÓGICO NACIONAL DE MÉXICO

INGENIERÍA EN SISTEMAS COMPUTACIONALES

NOMBRE DEL PROYECTO: SISTEMA DE GESTIÓN Y CONTROL DE

INSTITUCIÓN O EMPRESA: INSTITUTO MEXICANO DEL SEGURO SOCIAL

ALUMNA: VIRIDIANA LÓPEZ LÓPEZ

01 DE JUNIO DEL 2017

Información de la empresa ................................................................................................ 4

Planteamiento del problema .............................................................................................. 6

Marco Teórico .................................................................................................................... 7

Descripción de actividades .............................................................................................. 15

Análisis de requerimientos ........................................................................................... 15

Casos de uso ............................................................................................................... 21

Diseño de la base de datos .......................................................................................... 25

Esquema conceptual de la base de datos .................................................................... 26

Pruebas y resultados ....................................................................................................... 34

Aquí se especifica el objetivo del proyecto, así como el objetivo de la realización de

Este documento contiene también la información relevante de la empresa en la que

En este documento se abordan los aspectos referentes a los avances en las

La misión del IMSS es ser el instrumento básico de la seguridad social, establecido

Por un México con más y mejor seguridad social.

Su Delegación Estatal en Guerrero con dirección en Av. Cuauhtémoc No. 95

Asesor externo: Ing. Carlos Esteban Barajas Diego

Organigrama IMSS Delegación Estatal en Guerrero

Figura 1. Organigrama IMSS

Planteamiento del problema

El modelo para la competitividad tiene como objetivo: obtener procesos y servicios

El problema reside en que esta actividad se realiza actualmente en documentos de

Una vez que se ha entendido que es un sistema de información, es necesario

“Colección de datos persistentes que pueden compartirse e interrelacionarse”.

“La base de datos es una colección de información perteneciente a un mismo

A pesar de la falta de una definición absoluta, la mayoría de las fuentes coinciden

Como muchos usuarios de sistemas de bases de datos no están familiarizados

 Nivel físico: Es el nivel más bajo de abstracción que describe cómo se

base de datos no necesitan toda esta información. En su lugar, tales usuarios

Para llevar a cabo el manejo de la base de datos es necesario el uso de un lenguaje

El lenguaje SQL es una herramienta para organizar, gestionar y recuperar datos

 Es un lenguaje para todo tipo de usuarios (administradores, desarrolladores

Un SGBD consiste en una colección de datos interrelacionados y un conjunto de

El objetivo principal de un SGBD es proporcionar la forma de almacenar y recuperar

Es un sistema de gestión de bases de datos relacional, creado por la empresa sueca

 Implementación multihilo que permite aprovechar las capacidades de los

El lenguaje HTML es un estándar reconocido en todo el mundo y cuyas normas

El propio W3C define el lenguaje HTML como "un lenguaje reconocido

Incluir en una misma página HTML los contenidos, el diseño y la programación

Funciona a base de reglas, es decir, declaraciones sobre el estilo de uno o más

Por la parte de la funcionalidad del sistema se utilizará PHP (acrónimo recursivo de

Lo mejor de utilizar PHP es su extrema simplicidad para el principiante, pero a su

También se hará uso de JavaScript que es un lenguaje de programación

Se utiliza principalmente en su forma del lado del cliente (client-side), implementado

JavaScript se diseñó con una sintaxis similar a C, aunque adopta nombres y

Para poder trabajar con estas herramientas en conjunto se utilizará WampServer el

Para la realización de los bocetos se apoyará de la herramienta MokupScreens, la

El video se realizó y, posteriormente, se notificó la variación del sistema; por tal

Identificación del RF01

Nombre del Autentificación de usuario

Prioridad del requerimiento:

Efecto Si la contraseña o nombre del usuario son incorrecto se mostrará un

Identificación del RF02

Nombre del Criterios del “MC”

Características: Los usuarios podrán seleccionar cuál de los criterios necesitan

Descripción del En la venta principal deberá poderse seleccionar de entre los 8

Prioridad del requerimiento:

Identificación del RF03