Manual de usuario...CRVAKER S.A de C.V. Manual de usuario. 3 Introducción La Empresa CRVAKER S.A de...
17
CRVAKER S.A. DE C.V. MANUAL DE USUARIO
Transcript of Manual de usuario...CRVAKER S.A de C.V. Manual de usuario. 3 Introducción La Empresa CRVAKER S.A de...
CRVAKER S.A. DE C.V.
MANUAL DE USUARIO
CRVAKER S.A de C.V. Manual de usuario. 1
Índice Introducción ........................................................................................................................................ 3
Acceso a la aplicación .......................................................................................................................... 4
Estructura de la página .................................................................................................................... 6
FrontEnd .......................................................................................................................................... 6
Header ......................................................................................................................................... 6
Footer .......................................................................................................................................... 7
Backend ........................................................................................................................................... 7
Header ......................................................................................................................................... 7
Footer .......................................................................................................................................... 8
Mapa de navegación del sitio.............................................................................................................. 9
Recorrido del Sitio ............................................................................................................................. 10
FrontEnd ........................................................................................................................................ 10
Home ......................................................................................................................................... 10
Categorías de productos ........................................................................................................... 11
BackEnd ......................................................................................................................................... 12
Home ......................................................................................................................................... 12
Contactos .................................................................................................................................. 12
Usuarios ..................................................................................................................................... 13
Tipos de usuario ........................................................................................................................ 13
Clientes ...................................................................................................................................... 14
Marca ........................................................................................................................................ 15
Categorías .................................................................................................................................. 15
Productos .................................................................................................................................. 16
CRVAKER S.A de C.V. Manual de usuario. 3
Introducción
La Empresa CRVAKER S.A de C.V. en búsqueda de actualización constante y dar una
mejor atención al usuario ha plasmado su idea de negocio en el ámbito web, por medio de
un sistema que le permite obtener información de sus productos así como contactarse con
ellos y así mantener una relación más cercana con sus clientes que han convertido a la
empresa en lo que es ahora.
El presente documento tiene por objetivo detallar el funcionamiento de la aplicación web de
la empresa CRVAKER S.A. de C.V. en su entorno operativo, dentro del manual encontrara
las diferentes partes que componen el sistema así como una explicación de cada uno de
sus componentes y un mapa del sitio que ayudara a comprender el recorrido general del
sistema.
Dentro de las aplicaciones web, estas se pueden separar en categorías debido a su
contenido e información que le ofrecen al usuario, el sistema web está dentro de la categoría
de catálogo de productos, este es un buen punto de partida para entender la aplicación,
dentro de ella se podrán ver las diferentes herramientas de mantenimiento de la información
(Backend) así como la interfaz del usuario final con la información recopilada dentro de los
mantenimientos (FrontEnd).
CRVAKER S.A de C.V. Manual de usuario. 4
Acceso a la aplicación
El sistema es una aplicación web por lo tanto se debe utilizar un navegador web, las
versiones mínimas soportadas para un manejo óptimo de la aplicación son:
Internet Explorer 9
Mozilla Firefox 29
Google Chrome 15
Opera 12.1
Esto es debido a las propiedades de HTML 5 y CSS 3 de la aplicación, la versión del
navegador se encuentra en el “Acerca de” que se puede encontrar en el menú principal en
la mayoría de los navegadores.
Además del acceso en navegador de PC usted puede acceder a la aplicación dentro de su
teléfono móvil o Tablet, la aplicación posee una arquitectura Responsive Web Design lo
que le permite adaptarse al dispositivo que lo este ejecutando.
Una vez ejecutada la aplicación le mostrara esta pantalla como página principal:
Figura 1. Pantalla de inicio del sistema
CRVAKER S.A de C.V. Manual de usuario. 5
La página de la figura 1 representa el home del sitio web, desde aquí podrá hacer las
acceso a las diferentes pantallas que componen la parte frontal (FrontEnd) del sistema.
Para hacer acceso a la sección trasera (BackEnd) debe acceder por medio de la URL de
la página, debe recordar mantener la raíz del sitio como se le presenta en el navegador y
escribir admin para acceder al sitio administrativo.
Figura 2. URL del sitio administrativo
Una vez dentro se le presentara una pantalla con este aspecto:
Figura 3. Formulario de login del sitio administrativo
CRVAKER S.A de C.V. Manual de usuario. 6
Estructura de la página
FrontEnd
Figura 4. Estructura del sitio frontal
Header
Figura 5. Header del sitio frontal
El header del sitio es utilizado mayormente para acceso rápido de las secciones importantes
posee 2 secciones:
Menú de navegación: Posee los enlaces internos de la página web.
Formulario de búsqueda: Busca los productos dependiendo del parámetro
enviado para la búsqueda.
Header
Contenido
Footer
CRVAKER S.A de C.V. Manual de usuario. 7
Footer
Figura 6. Footer del sitio frontal
El Footer posee la información referente a la empresa, su información básica, localización,
y sus redes sociales así como el copyright y un menú de navegación alternativo para acceso
rápido a los enlaces.
Backend
Figura 7. Estructura del sitio administrativo
Header
Figura 8. Header del sitio administrativo
El header del sitio en su sección superior tiene los accesos a los diferentes formularios de
mantenimiento de información mientras que el header inferior posee el nombre del usuario
que al darle click le muestra las opciones de usuario, además de acceso a mensajes y
comentarios hechos por los clientes.
Header
Contenido
Footer
CRVAKER S.A de C.V. Manual de usuario. 8
Footer
Figura 9. Footer del sitio administrativo
El Footer posee la información de las personas que hicieron el sitio, su nombre.
CRVAKER S.A de C.V. Manual de usuario. 9
Mapa de navegación del sitio
Dentro del mapa del sitio se detalla todo el recorrido que un usuario puede hacer dentro
de la aplicación, esto en base a la representación gráfica del menú de navegación de los
diferentes entornos del sistema.
El mapa de navegación del FrontEnd es el siguiente:
Figura 10. Mapa de navegación del FrontEnd
Dentro del mapa de navegación se puede apreciar que la pagina frontal posee 4 secciones
distintas: home, conócenos, servicios y productos cuya referencia es a la categoría de los
productos.
El mapa de navegación del BackEnd es el siguiente:
Figura 11. Mapa de navegación BackEnd
En el mapa de navegación del BackEnd se puede ver que los mantenimientos son muy
parecidos exceptuando el de usuario que posee tipos de usuario.
CRVAKER S.A de C.V. Manual de usuario. 10
Recorrido del Sitio
FrontEnd
Home
Figura 12. Home del sistema
En el home se muestra la información general de los productos, un slider administrado
desde el BackEnd que permite visualizar la información en forma grafica.
CRVAKER S.A de C.V. Manual de usuario. 11
Categorías de productos
Figura 13. Categorías de productos
La vista de categorías de productos presenta la información específica de los productos
que pertenecen a la categoría seleccionada, en tiempo real además de mostrar el detalle
de los productos.
Figura 14. Detalle de producto
CRVAKER S.A de C.V. Manual de usuario. 12
BackEnd
Home
Figura 15. Home del sitio administrativo
El home provee de los enlaces referentes a la información de los clientes.
Contactos
Figura 16. Pantalla de contáctenos del sitio administrativo
Acciones
Tabla 1. Acciones de la pantalla de contáctenos del sitio administrativo
Acción Descripción
Leer Permite ver los mensajes e información realizados por los clientes desde el formulario de contáctanos.
CRVAKER S.A de C.V. Manual de usuario. 13
Usuarios
Figura 17. Formulario de nuevos usuarios
Dentro del módulo de usuarios nos encontramos primero con el formulario de usuarios,
este funciona ingresando los datos referentes al usuario, y luego darle click a guardar, en
donde automáticamente ingresara el usuario en el caso de que pase por todos los filtros
de validación.
Figura 18. Listado de usuarios
Esta pantalla le indica los usuarios que están dentro del sistema, al darle modificar se
abrirá un formulario de usuarios igual al de la figura 17 para rellenar la información de los
usuarios.
Tipos de usuario
Los tipos de usuario son tomados como los roles donde funciona la aplicación, cada uno representa
un rol que es capaz de ser editado por un administrador, es posible modificarle sus permisos
Figura 19. Formulario de tipos de usuario
CRVAKER S.A de C.V. Manual de usuario. 14
Figura 20. Listado de tipos de usuario
Al momento de crear un tipo de usuario, el modulo posee 2 pantallas, un formulario y un
listado, el formulario funciona para ingresar la información, este es igual ya sea creando un
nuevo así como modificando la aplicación y también cuenta con un listado que funciona
para seleccionar entre los tipos existentes si se necesita modificar o eliminar.
Clientes
Figura 21. Formulario de clientes
Figura 22. Listado de clientes
El sistema posee un soporte para los clientes, usted puede almacenar los clientes con su información
importante y tenerla en nuestra base de datos, el listado de clientes funciona para la edición y eliminación
mientras que para agregar clientes se utiliza el formulario de clientes
CRVAKER S.A de C.V. Manual de usuario. 15
Marca
Figura 23. Formulario de marcas
Figura 24. Listado de marcas
Las marcas en la aplicación son guardadas individualmente para luego asignarlas a los
productos con esa marca, su funcionamiento es muy parecido a los formularios anteriores
posee la vista de formulario y listado para poder hacerle mantenimiento a los datos.
Categorías
Figura 25. Formulario de categorías
CRVAKER S.A de C.V. Manual de usuario. 16
Figura 26. Listado de categorías
Las categorías son los grupos en los que un producto puede estar unido, este se presenta
en el área frontal como un menú con todas las categorías, y sirve para filtrar todos los
productos y dejar solo los productos de interés por categoría.
Productos
Figura 27. Formulario de productos
CRVAKER S.A de C.V. Manual de usuario. 17
Figura 28. Listado de productos
El formulario de productos es el eje central dentro de la aplicación, este se ingresa igual que todos
los demás formularios con el cambio de que este permite ingresar imágenes y más campos, estos al
momento de activarlos se muestran en la página frontal como productos y detalles.
En el formulario se muestran sus comentarios y la valoración promedio del producto.
