You are on page 1of 9

MANUAL DE USUARIO

DEPARTAMENTO DE ELÉCTRICA Y ELECTRÓNICA

PROYECTO DE VINCULACIÓN
PÁGINA WEB

AUTORES

MILTON NICOLAY CHASILLACTA CANENCIA


BRYAN ANDRES CHAUCA VERA
EDISON PAUL MUÑOZ VEGA
TUTOR

ING. PAUL MEJÍA

ABRIL 2018 – AGOSTO 2018


SANGOLQUÍ
UNIVERSIDAD DE LAS FUERZAS ARMADAS E S P E

MANUAL DE USUARIO
1 A CCEDER A LA P ÁGINA W EB
La página Web se encuadra en línea y es posible acceder a esta desde cualquier parte del mundo. Se
trabajó con un servidor gratuito con dos limitantes.

 La primera, es la no personalización total del dominio de la página


 La segunda, es el tiempo que permanece activa la página. Trabaja 23 horas al día permaneciendo
una hora diaria fuera de servicio, se la configuró de 3:00 a 4:00 am.

1.1.1 A CCEDER DESDE EL E NLACE


El enlace de la página web es el siguiente:

http://perritosespe.000webhostapp.com/

1.1.2 A CCEDER DESDE UN CÓDIGO QR


El código QR de la página web es el siguiente:

2 E STRUCTURA G ENERAL DE LA P ÁGINA W EB


La página web tiene un menú de navegación superior (Figura 1) que permanecerá presente en todo
momento, facilitando la interacción con los usuarios.

Figura 1. Menú de navegación superior

En el menú de navegación superior mostrado en la Figura 1 se puede apreciar cinco opciones, las
cuatro primeras es para el uso de visitantes de la página web, mientras que la última opción es de uso
exclusivo para administradores.

Nota: Si un usuario ingresa a la pestaña de administrador, no logrará hacerlo completamente porque


se necesita de un usuario y contraseña que solo los administradores conocen.

1|Página
UNIVERSIDAD DE LAS FUERZAS ARMADAS E S P E

2.1 ¿C ÓMO ACCEDER A LAS DIFERENTES VENTANAS ?


Como ya se mencionó, cualquier usuario que visite la página web puede navegar libremente por las
cuatro primeras ventanas, solo dando un clic sobre la opción a la que desee ingresar.

El usuario puede ingresar a cualquiera de estas 4 ventanas.

3 E STRUCTURA DE LA PÁGINA W EB PARA V ISITANTES

3.1 V ENTANA : INICIO


La ventana de INICIO (Figura 2) es mostrada inicialmente al ingresar en la página web, esta es la
página por defecto.

Está compuesta por un título en la parte superior y una breve descripción del contenido de la ventana.
En la sección izquierda se adjuntan datos importantes de contacto de las personas a cargo del
proyecto.

Los datos que se consideró de importancia son:

 Dirección donde se está realizando el proyecto.


 Un correo electrónico para inquietudes
 Los números telefónicos de las personas a cargo del proyecto

2|Página
UNIVERSIDAD DE LAS FUERZAS ARMADAS E S P E

Figura 2. Ventana de Inicio

3.2 V ENTANA : MASCOTAS


En esta ventana se almacena los datos de todos los perros registrados. Cuenta con un menú para una
búsqueda personalizada. Este menú cuenta con dos campos:

Figura 3. Menú de búsqueda

Cada perro, al ser registrado en la base de datos se le asigna de manera obligatoria un nombre (puede
ser igual al de otros perros) y un código (valor único para cada perro). Como se muestra en la Figura
4

3|Página
UNIVERSIDAD DE LAS FUERZAS ARMADAS E S P E

Figura 4. Base de datos de los perros

3.2.1 B USCAR POR C ÓDIGO


Se debe ingresar el ID del perro con el que está registrado en la base de datos. Este campo es mucho
más preciso al momento de la búsqueda, está enfocado principalmente para el manejo de los
administradores.

3.2.2 B USCAR POR N OMBRE


Se debe ingresar el Nombre del perro con el que está registrado en la base de datos. Este campo no
es tan preciso debido a que puede existir más de un perro con el mismo nombre. Esta búsqueda está
enfocada principalmente para el manejo de los usuarios.

4|Página
UNIVERSIDAD DE LAS FUERZAS ARMADAS E S P E

Para confirmar el campo que se ingresó, solo es necesario dar un clic en el botón Buscar

Nota: Si no se competa ninguno de los dos parámetros, el usuario deberá dar un toque en la opción
Ver Todos para mostrar todos los perros registrados en la base de datos.

A continuación, se muestra la ventana donde están registrados los perros (Figura 5).

Figura 5. Ventana de MASCOTAS

3.3 V ENTANA : AYÚDANOS


La ventana ayúdanos, se muestra las forma como los usuarios que visitan la página puedan aportar
para seguir colaborando con el proyecto donde se muestra como pueden donar recursos económicos
mediante depósitos bancario así como materiales e implementos para el refugio. Se encuentran los
números de los instructores los cuales pueden ser contactados para recibir las respectivas donaciones.

Figura 6. Ventana de AYUDANOS

5|Página
UNIVERSIDAD DE LAS FUERZAS ARMADAS E S P E

3.4 V ENTANA : SERVICIOS


En la ventana servicio se proporciona información de la ayuda que se brinda con la finalidad de tratar
sobre la potencial disminución de un problema de ámbito de salud pública que acarrea la presencia
de perros en situación de abandono dentro de la Universidad de las Fuerzas Armadas ESPE.

Así como también se realiza un diagnóstico y monitoreo de como el perrito se comporta ante esta
situación y como se desenvolvería para una posible adopción posterior.

Se brinda charlas de concientización para toda la comunidad en general de la parroquia de Sangolqui


sobre una adecuada esterilización de los perritos y gatos.

Figura 7. Ventana de SERVICIOS

4 E STRUCTURA DE LA PÁGINA W EB PARA A DMINISTRADORES


Esta ventana es para el uso exclusivo de los administradores, se necesita de un usuario y una
contraseña para acceder a las opciones de configuración de la página.

4.1 ¿C ÓMO ACCEDER A LA VENTANA DE A DMINISTRADOR ?


Para ingresar a la ventana de administradores se debe dar clic en la opción Administradores del menú
superior.

6|Página
UNIVERSIDAD DE LAS FUERZAS ARMADAS E S P E

Luego, se desplegará una ventana donde se debe ingresar el usuario y la contraseña de acceso:

Usuario admin@ejemplo.com

Contraseña 123456

Estos son los datos del administrador, se debe ingresar esta información al menú que se muestra a
continuación

4.2 O PCIONES DE CONFIGURACIÓN PARA LA BASE DE DATOS


Una vez dentro de la ventana de Administrador, el menú superior cambia, solo se mostrará las
opciones para el acceso a las ventanas que se pueden modificar. Además, la opción de la derecha
Cerrar sesión funciona para salir de las ventanas de administrador.

Ventanas para opciones de


Salir de las
configuración
ventanas de
Administrador

4.2.1 V ENTANA : REGISTRO


En esta ventana se encuentra una tabla con todos los perros y la información de registro de cada uno,
además se tiene dos botones al final de la fila de cada animal registrado: Modificar y Eliminar

4.2.1.1 MODIFICAR

7|Página
UNIVERSIDAD DE LAS FUERZAS ARMADAS E S P E

Al dar clic en esta opción se tiene la capacidad de modificar todos los campos del animal como:

 Código
 Nombre
 Edad
 Sexo
 Tamaño
 Esterilizado
 Dependencia a Medicamentos
 Limitaciones Físicas
 Enfermedades Pre-existentes
 Fecha Desparasitación
 Fecha Vacuna

Al terminar la modificación de todos los campos tipo texto, se tiene la opción de cambiar la foto del
registro del perro dando clic en Seleccionar archivo y escoger una imagen tipo JPG, JPGE o PNG no
mayor a 250 KB

Para guardar los cambios se debe dar un clic en el botón Guardar

4.2.1.2 ELIMINAR
Si se selecciona este botón, se eliminará de la base de datos el perro al que corresponda esa fila.

Figura 8. Ventada de Registro

8|Página