• No se han encontrado resultados

Sistema Web para la red de Acción Comunitaria Compromiso MX

N/A
N/A
Protected

Academic year: 2020

Share "Sistema Web para la red de Acción Comunitaria Compromiso MX"

Copied!
111
0
0

Texto completo

(1)

Instituto Tecnológico de Colima

Departamento de Sistemas y Computación

Ing. en Sistemas Computacionales

Residente:

09460302 Enrique Isaias Barajas Rios

Correo Electrónico:

09460302@itcolima.edu.mx

Asesor interno:

Lic. Catalina Rodríguez López

Proyecto de Residencia Profesional

(2)

Página 2

(3)

Página 3

(4)

Página 4

Villa de Álvarez, Col., Semestre Enero-Junio de 2015

Contenido

1. Introducción ...10

2. Justificación ...11

3. Objetivos ...12

3.1 General ...12

3.2 Específicos ...12

4. Caracterización del área en que se participó ...13

4.1 Descripción de la empresa ...13

4.2 Actividades del área de desarrollo ...13

5. Problemas a resolver ...14

6. Alcances y limitaciones ...15

6.1 Alcances ...15

6.2 Limitaciones...15

7. Estudio de factibilidad ...16

7.1 Factibilidad Técnica ...16

7.2 Factibilidad Operativa...16

7.3 Factibilidad Económica...17

7.4 Factibilidad legal...18

8. Análisis costo-beneficio ...18

8.1 Tiempo de procesos de registro: ...18

9. Ventaja Competitiva ...19

10. Fundamento Teórico ...20

11. Procedimientos y descripción detallada de las actividades realizadas...22

11.1 Página Principal ...23

11.1.1 Log in ...23

11.1.2 Tienda...25

11.1.3 Panel de registro...25

10.1.3.1 Inicio de Registro ...26

(5)

Página 5

Requerimientos No Funcionales ...27

Reglas de Negocio de Operación ...28

11.1.3.2 Paso 1 del Proceso de Registro - Información del Mentor ...28

Requerimientos Funcionales ...33

Requerimientos No Funcionales ...34

Reglas de Negocio de Información de Mentor ...34

Reglas de Negocio de Haga clic aquí...34

11.1.3.3 Paso 2 Información de la Cuenta ...35

11.1.3.4 Paso 3 Acuerdo ...40

11.1.3.5 Paso 4 Paquete de bienvenida ...42

11.1.3.6 Paso 5 Información de envió y autopago ...43

11.1.3.7 Paso 6 Nuestro movimiento ...51

11.1.3.8 Paso 7 Confirmación ...56

Reglas Generales...59

11.1.4 Página donativos ...60

11.2 Página del Socio...60

11.2.1 Inicio ...61

11.2.1.1 Slider ...61

11.2.1.2 Mensajes...62

11.2.1.3 Acciones comunitarias ...63

11.2.1.4 Calendario ...65

11.2.1.5 Reconocimiento mensual ...65

11.2.1.6 Contacto ...66

11.2.1.7 Contenido de una noticia ...67

11.2.1.8 Nueva acción comunitaria...67

11.2.2 Página Cuenta ...69

11.2.2.1 Notificación...71

11.2.2.2 Información de la cuenta...72

11.2.2.3 Información legal ...74

11.2.2.4 Perfil...74

11.2.2.5 Contraseña...75

11.2.2.6 Dirección ...76

11.2.2.7 Nuestro movimiento...77

(6)

Página 6

11.2.2.9 Información de coaplicante. ...79

11.2.2.10 Redes Sociales ...80

11.2.2.11 Direcciones de envió y métodos de pago ...81

11.2.2.12 Reportes ...83

11.2.3 Organización ...84

11.2.3.1 Control de desplazamiento vertical. ...85

11.2.3.2 Área de notificaciones...85

11.2.3.3 Reportes de la organización. ...86

11.2.3.3.1 Visión general ...87

11.2.3.3.2 Proyección...90

11.2.3.3.3 Emprendedores...91

11.2.3.3.4 Festejados del mes ...94

11.2.3.3.5 Emprendedores por rango ...95

11.2.3.3.6 Productividad ...97

11.2.3.3.7 Autopago ...99

11.2.3.3.8 Lista de futuros emprendedores. ...100

11.2.4 Agenda ...100

11.2.4.1 Vista Día ...104

11.2.4.2 Vista Semana...105

11.2.4.3 Vista Mes ...106

11.2.4.4 Opciones de configuración...107

Conclusiones ...110

(7)

Página 7

Índice de Tablas

Tabla 1 Comparación de equipo requerido con el equipo actual en Quantum ... 16

Tabla 2 Conocimientos d el personal de Quantum ... 17

Tabla 3 Costo en la producción del sistema ... 17

Tabla 4 Costos indirectos ... 17

Tabla 5 Costos directos ... 18

Tabla 6 Análisis de alternativas para el d esarrollo del proyecto ... 19

Tabla 7 Descripción de los campos y boton es del inicio de registro ... 26

Tabla 8 Descripción de los campos y boton es de "Información del Mento r" ... 30

Tabla 9 Descripción de los campos y boton es de "Localizador de Mento r" ... 31

Tabla 10 Descripción de los campos y botones de "No tengo Mentor" ... 32

Tabla 11 Descripción de los campos y botones de "Info rma ción de la cu enta" ... 35

Tabla 12 Descripción de los campos y botones de "Acu erdo" ... 41

Tabla 13 Descripción de los campos y botones de "Paquete de Bienvenida" ... 43

Tabla 14 Descripción de los campos y botones de "Info rma ción de autopago y envió" ... 44

Tabla 15 Descripción de los campos y botones de "Método de envió" " dentro de "Información de autopago y envió" ... 46

Tabla 16 Descripción de los campos y botones de "Información de autopago tarjeta" dentro de "Información de autopago y envió" ... 47

Tabla 17 Descripción de los campos y botones en Nu estro movimiento ... 53

Tabla 18 Descripción de los campos y botones de Confirmación ... 58

Tabla 19 Descripción de la Ba rra de info rma ción del usuario ... 60

Tabla 20 Descripción de los elementos d e la sección de Mensajes ... 62

Tabla 21 Descripción de los elementos d e Acción comunita ria en Inicio ... 64

Tabla 22 Descripción de los elementos d e Contato en Inicio ... 66

Tabla 23 Descripción de los elementos d e Agregar Nueva Acción ... 68

Tabla 24 Descripción de los elementos d el menú principal ... 70

Tabla 25 Descripción de los elementos d el control vertical de dezpla zamien to ... 85

Tabla 26 Descripción del área de notificacion es ... 86

Tabla 27 Descripción de elementos del repo rte de visión general ... 89

Tabla 28 Descripción de los elementos d el Reporte d e proyección ... 90

Tabla 29 Descripción del Reporte de Emp rendedores ... 93

Tabla 30 Descripción del reporte "festejados del mes" ... 95

Tabla 31 Descripción del reporte de emp rendores por rango... 96

Tabla 32 Descripción de los elementos d e Agenda ...101

Tabla 33 Descripción de los elementos d e Opciones de Configuración ...108

Índice de Figuras

Figura 1 Estructura General del Sistema... 22

Figura 2 Diseño Gen eral de la Página Principal ... 23

Figura 3 Diseño Gen eral de Inicio de Sesión ... 24

Figura 4 Diseño general para Mensaje en contraseña al inicia r sesión ... 24

Figura 5 Diseño general para Reestablecer de contraseña ... 25

Figura 6 Diseño general del inicio de registro ... 26

Figura 7 Diseño general "Info rma ción del mentor" ... 28

Figura 8 Mensaje de erro r en Info rma ción del mentor ... 29

Figura 9 Mensaje de mentor correcto en “Info rma ción del mentor” ... 29

Figura 10 Diseño general d e “Localizador de Mentor” ... 31

Figura 11 Diseño de la Sección “No tengo Mento r” ... 32

(8)

Página 8

Figura 13 Diseño general d e "Acu erdo" ... 41

Figura 14 Diseño general d e "Paquete de Bienvenida" ... 42

Figura 15 Diseño general d e "Info rma ción de autopago y envío" ... 44

Figura 16 Diseño general "Modo de envió" d entro de "Info rma ción de autopago y envió" ... 46

Figura 17 Diseño general d e "Info rma ción de autopago" dentro de "Info rma ción de autopago y envió" ... 47

Figura 18 Diseño general de "Información de autopago tarjeta" dentro de "Información de autopago y envió" ... 47

Figura 19 Diseño general "Información Personal" en Nuestro movimiento ... 51

Figura 21 Diseño general "Información Personal-Hijos" en Nuestro movimiento ... 52

Figura 20 Diseño general "Información Personal-Talla " en Nuestro movimien to... 52

Figura 22 Diseño general "Información Personal-Redes" en Nuestro movimiento ... 53

Figura 23 Diseño general "Información Personal-2" en Nuestro movimiento ... 53

Figura 24 Diseño general d e Confirmación ... 57

Figura 25 Diseño Header de la plantilla gen eral ... 60

Figura 26 Diseño Footer de la plantilla gen eral ... 60

Figura 27 Diseño general d e Slider en Página de inicio ... 61

Figura 28 Diseño general d e Mensajes en Inicio ... 62

Figura 29 Diseño general d e Acción Comunitaria en Inicio ... 63

Figura 30 Diseño general d el calendario de Inicio ... 65

Figura 31 Diseño general d e Reconocimiento mensual en Inicio ... 66

Figura 32 Diseño general d e conta cto en Inicio ... 66

Figura 33 Diseño general d e No ticia Completa en Inicio ... 67

Figura 34 Diseño de Nu eva Acción en Inicio ... 68

Figura 35 Diseño del Menú Principal en el módulo de Cuen ta... 70

Figura 36 Diseño de No tifica ción dentro de Cuenta ... 71

Figura 37 Diseño de ventana emergente con los motivos para completar la info rma ción ... 72

Figura 38 Diseño de Información de la cuenta ... 73

Figura 39 Diseño Información Legal ... 74

Figura 40 Diseño de Perfil ... 74

Figura 41 Diseño de Contraseña ... 76

Figura 42 Diseño de Dirección ... 76

Figura 43 Diseño de "Nuestro Movimien to" ... 77

Figura 44 Diseño de "Notificaciones" ... 79

Figura 45 Diseño de "Info rmación de Coaplicante" ... 80

Figura 46 Diseño de "Redes So ciales"... 80

Figura 47 Diseño del directorio de métodos de pago ... 82

Figura 48 Diseño de "In troduce otro método de pago" ... 83

Figura 49 Diseño general d e Organización ... 84

Figura 50 Diseño del control de desplazamiento vertical ... 85

Figura 51 Diseño área de no tifica ciones ... 85

Figura 52 Lista de Fu turos Emp rendedo res ... 87

Figura 53 Diseño del reporte de visión gen eral ... 88

Figura 54 Diseño del reporte de proyección ... 90

Figura 55 Diseño del reporte de emprendedores ... 92

Figura 56 Diseño del reporte Festejado del mes ... 94

Figura 57 Diseño del reporte "Emprendedor po r rango" ... 96

Figura 58 Diseño del reporte de Productividad ... 98

Figura 59 Rangos de productividad ... 98

Figura 60 Formas de acceso a agenda ...100

Figura 61 Pantalla principal de Agenda ...101

Figura 62 Flechas de desplazamiento ...104

(9)

Página 9

Figura 64 Diseño de la vista de Semana ...106

Figura 65 Diseño general d e la vista Mes ...107

Figura 66 Diseño de Opciones de configura ción...108

Ilustración 1 Organigrama de la Emp resa Quantu m Productora de software ... 13

(10)

Página 10

1. Introducción

Los sistemas Web han tenido en los últimos años una difusión a nivel mundial porque las empresas, instituciones, universidades, entre otros, requieren brindar información a los distintos usuarios.

Antes de la construcción de una sistema Web, debemos pensar cómo debe organizarse la información y lo más importante no olvidar que la finalidad es que llegue al usuario. Como arquitectos de estas páginas debemos ponernos en el lugar de los demás, en este caso los usuarios que visitarán la Web tendrán en cuenta lo siguiente:

 Se debe crear una interfaz clara y amigable

 La información debe ser clara y precisa

 Debe presentarse información importante y relevante

(11)

Página 11

2. Justificación

En base en el contexto que maneja el Plan de Desarrollo Nacional para el manejo de las Tecnologías de Información y Comunicación (TIC) en su apartado “México Digital” el cual es el plan de acción digital que el Gobierno de la República implementará durante los próximos años. El propósito fundamental de la esta es lograr un México Digital en el que la adopción y uso de las TIC maximicen su impacto económico, social y político en beneficio de la calidad de vida de las personas. La evidencia empírica ha mostrado que la digitalización –entendida como el concepto que describe las transformaciones sociales, económicas y políticas asociadas con la adopción masiva de las TIC impacta el crecimiento del Producto Interno Bruto, la creación de empleos, la productividad, la innovación, la calidad de vida de la población, la igualdad, la transparencia y la eficiencia en la provisión de servicios públicos. La Estrategia surge como respuesta a la necesidad de aprovechar las oportunidades que la adopción y el desarrollo de las TIC crean para potenciar el crecimiento del país.

Este proyecto pretende fomentar la compra y venta de productos mexicanos, generando así una base comercial para la creación de empleos y productividad con tecnologías web innovadoras y aprovechar esta apertura de las TIC a la ciudadanía en general para que el número de posibles usuarios del sistema se incremente, solucionando además la problemática de que este proyecto se llevara de forma manual.

Con la implementación de un sistema Web, se pretende proporcionar a los usuarios la facilidad de registrar y poder realizar los procesos necesarios de forma sistematizada y automática.

Esto facilitará el proceso, lo hará más eficiente y ahorrará tiempo.

La realización de la aplicación Web contempla diversas tareas como lo son:  Registro de usuarios, ventas, etc.

 Captura de información.  Manejo de Usuarios.

(12)

Página 12

3. Objetivos

3.1 General

Implementar un sistema Web que permita administrar los procesos de compra – venta, agenda de citas, generación de reportes que se realizan dentro de la red de Acción Comunitaria CompromisoMX

3.2 Específicos

 Realizar un diagnóstico de la situación actual de los procesos

 Aplicar la metodología orientada a objetos de la Ingeniería de Software para el análisis y el diseño de la solución.

 Implementar la solución.

(13)

Página 13

4. Caracterización del área en que se participó

4.1 Descripción de la Empresa

Ilustración 1 Organigrama de la Empresa Quantum Productora de software

4.2 Actividades del Área de Desarrollo

El área de desarrollo está coordinada a través de funciones, procedimientos y políticas establecidas para administrar los recursos que los proyectos requieren para operar adecuadamente, esta es la encargada de realizar las operaciones de análisis, diseño, programación y pruebas de los proyectos de la empresa.

Di rector General Jua n Pedro Casian

Ma rquez

Admi nistrador de Proyectos Fra ncisco Naranjo

Bi rrueta

Area de Soporte

Area de Desarrollo Col i ma Ra y Avi l a

Progra ma dor, Tester Enri que Isaias Barajas

Ri os

Area de Desarrollo Gua dalajara Gerente de Proyectos

(14)

Página 14

5. Problemas a resolver

Con la construcción de un sistema web para el manejo de la red de acción comunitaria CompromisoMX se pretende que los futuros integrantes de esta red, puedan realizar las actividades que se describen en este proyecto de una manera eficiente y para esto los principales punto que se pretenden desarrollar son:

(15)

Página 15

6. Alcances y limitaciones

6.1 Alcances

 La empresa usará la tecnología del internet para controlar los procesos realizados dentro de la Red.

 Los usuarios contarán con un sistema amigable y de fácil uso, mostrando los pasos a seguir para realizar la tarea que se requiera.

 El sistema podrá ser utilizado para altas y modificaciones de los registros, citas u otras actividades solo por usuarios autorizados y/o asignados a realizar este tipo de gestiones.

 El sistema informático podrá ser utilizado a través de navegadores web como: Chrome, Mozilla Firefox, Opera, Safari, etc.

6.2 Limitaciones

(16)

Página 16

7. Estudio de factibilidad

Para la realización del proyecto se determinó que es posible llevar a cabo el sitio Web para el Control de los procesos que se realizan dentro de la Red de Acción Comunitaria CompromisoMX. Se realizó el estudio de factibilidad para determinar si el proyecto es factible. A continuación se analiza con detalle el resultado de este.

7.1 Factibilidad Técnica

Actualmente, la empresa Quantum cuenta con diferentes tipos de equipo, a continuación en la Tabla 1, se describen los equipos con los que cuenta esta empresa para la implantación del sitio Web:

Tabla 1 Comparación de equipo requerido con el equipo actual en Quantum

Tomando en cuenta los recursos tecnológicos que se muestra en la tabla 1.1, el costo del proyecto es mínimo considerando los beneficios a mediano plazo que el proyecto tendrá. 7.2 Factibilidad Operativa

El personal administrativo que opera los programas informáticos actuales en Quantum, tiene conocimientos básicos de computación, en la tabla 2 se muestran los conocimientos actuales de los trabajadores.

Concepto Tipo Existencia en la empresa Cumple con los

requerimientos

Costo

Hardware Servidor Servidor Apache Tomcat No $3250.00

Computadora Computadora Si $0.00

Hosting .net No $2200.00

Software

Sistema Operativo Windows Seven Si $0.00

Lenguaje Groovy & Grails Si $0.00

Sistema Operativo Windows 8 Si $0.00

Otros Red Banda ancha de 20mb/s No $999.00

(17)

Página 17

Tabla 2 Conocimientos del personal de Quantum

Requerimientos de los Conocimientos del Software

Conocimiento del personal Medida para obtener el conocimiento Conocimientos básicos en Windows:

navegadores.

Se cuenta con ellos No aplica

Encender y apagar el equipo. Se cuenta con ellos No aplica Conocimientos básicos en Word Se cuenta con ellos No aplica Conocimiento básicos en

administración de recursos

Se cuenta con ellos No aplica

Manejo del nuevo sistema Ninguno Curso de Capacitación

Como se observa el personal cuenta con la mayoría de los conocimientos en computación y por tanto la implementación de uso de sistema no provocaría una dificultad para su manejo, se solucionaría con una capacitación del nuevo sistema. Por tanto, se declara que el proyecto es operativamente factible.

7.3 Factibilidad Económica

En la tabla 3 se muestra los costos que se generan por la producción del sistema según las ponderaciones que tiene cada fase de la metodología Programación Orientada a Objetos y la duración.

Tabla 3 Costo en la producción del sistema

Fases de la metodología Porcentaje Tiempo(hor as)1 Costo(pesos)2

Análisis y diseño de solución 32% 200 $11,340.00

Desarrollo del sistema 47% 300 $17,010.00

Pruebas 16% 100 $5,670.00

Proceso de implementación 5% 40 $2,268.00

Total 100% 640 $36,288.00

Durante el desarrollo del sistema se necesitan cubrir diversos costos como los que se muestra en las tablas 4 y 5.

Tabla 4 Costos indirectos

Concepto Precio unitario Cantidad Costo

Energía Eléctrica(horas) $0.62 640 $396.80

Transporte $12.00 100 $1,200.00

Papelería y consumibles $100.00 1 $100.00

Viáticos $2,000.00 1 $2,000.00

Total $3,696.80

1

Se consideró el tiempo para desarrollo del sistema es de 640 horas de acuerdo con los tiempos del programa de residencias profesionales.

2

(18)

Página 18

Tabla 5 Costos directos

Concepto Costo

Producción del envase del sistema $250.00

Gastos por capacitación $800.00

Total $1,050.00

7.4 Factibilidad legal

El sistema se elaborará bajo algunas plataformas que son de licencia libre; como lo es un Servidor Apache aunque sí será necesario Windows Seven que soporta Groovy & Grails y JavaScript, pero Quantum ya cuenta con licencias de este software por lo cual no generará ningún problema legal.

Además se cumplirán todos los documentos de acuerdo a las especificaciones de la Agencia de Aduanas y la Secretaría de Hacienda y Crédito Público.

8. Análisis costo-beneficio

Actualmente no se cuenta con sistema alguno que facilite el proceso en el área de ventas por lo que el sistema pretende agilizar y optimizar los procesos que se describen a continuación:

8.1 Tiempo de procesos de registro:

Con el proceso manual se pierde mucho tiempo al realizar todos los trámites correspondientes a la venta de los productos y generación de reportes y documentos que son necesarios para la empresa lo que da paso a una mayor pérdida de tiempo y más espacio a errores humanos.

(19)

Página 19

9. Ventaja Competitiva

En la tabla 6, se mencionan las alternativas, ventajas y desventajas para atender la problemática anteriormente mencionada.

Tabla 6 Análisis de alternativas para el desarrollo del proyecto

Alternativa Ventajas Desventajas

Continuar operando de la misma forma

 No se requiere capacitación  Mayor espacio a errores humanos

 Pérdida de tiempo

 Procesos repetitivos

 Cuello de botella al capturar la información.

Sistema Web para la Red Comunitaria

 Optimización de tiempos .

 Actualizaciones.

 Conocimiento del destino del producto, el comercializador y el productor.

 Estadísticas de la cantidad de producto que exporta la empresa.

 Comodidad para capturar y realizar la documentación

 Comunicación directa durante la generación del sistema.

 Atención durante el desarrollo del sistema.

 Diseño basado en los requerimientos del cliente.

 Interfaz amigable e intuitiva para el llenado de formato de nuevos registros

 Documentación completa del sistema

 Sistema adaptable al cliente

 Resistencia al cambio.

Comprar un sistema similar  Ahorro de tiempo de programación

 Inversión monetaria

 Sistema limitado

 Diseño no adecuado

 Poca atención al cliente

 Documentación insuficiente

(20)

Página 20

10. Fundamento Teórico

Dentro de la empresa Quantum se maneja un proceso de cuatro etapas para la creación de sistemas los cuales se pueden apreciar en la siguiente figura

Ilustración 2 Descripción de los procesos de Quantum

Definición de requerimientos

Se realiza la definición de los requerimientos del proyecto en base a las peticiones del cliente, visualizando las necesidades y las propuestas que surjan en el momento, con el fin de obtener una visión general del proyecto a desarrollar.

Análisis y Diseño

De acuerdo a la primera definición de los requerimientos se realiza una análisis de la información y una división de cada elemento propuesto con el fin de obtener de manera clara los requerimientos y actividades que se realizaran, tomando en cuenta costos y esfuerzo por parte del grupo de trabajo involucrado, en esta etapa se realiza la especificación de los requisitos y diseños previos del proyecto.

Definición de requerimientos

Análisis y diseño

Implementación y mantenimiento

(21)

Página 21

Desarrollo y pruebas

Desarrollo del proyecto de forma iterativa, al grupo de desarrollo se le indican las

actividades que tiene que realizar indicando tiempos y fechas de entrega, el desarrollo se base en entregas parciales al cliente (Hitos), estas entregas deberán de cumplir la validación por parte del tester y las pruebas unitarias realizadas por los mimos programadores. Las actividades que resulten fallidas serán reasignadas hasta su finalización.

Implementación y Mantenimiento

Implementación del proyecto en el ambiente productivo del cliente, en esta fase si existen incidencias se dará el seguimiento de las mismas hasta su cierre.

El mantenimiento se le otorgara al cliente mediante los entregables otorgados y capacitaciones.

Las asignaturas que me aportaron el conocimiento para poder realizar este proyecto son:

 Programación web

 Interfaz Hombre Máquina

 Fundamentos de desarrollo

 Desarrollo de proyectos de software

 Planificación y modelado

(22)

Página 22

11. Procedimientos y descripción detallada de las actividades realizadas.

En esta sección se describirá de forma detallada cada una de las actividades realizadas en esté proyecto de residencia, así mismo se indicara como se aplicaron los conocimientos previos para llegar a una solución, además contara con el análisis y diseño general de cada uno de los módulos a realizarse dentro del proyecto, así como un documento en PDF en el cual se darán los detalles de lo que se pretende hacer para completar todo el sistema, con un diccionario de datos, casos de uso, imágenes y esquemas, especificaciones técnicas, descripción de los roles del usuario y el administrador; la codificación del sistema así como los manuales pertenecen a la empresa por lo que no se incluirán dentro de este documento. El proyecto consistirá en el desarrollo de algunos de los módulos que conforman el proyecto de “Red de acción comunitaria CompromisoMX” estos son: Página Principal, Pagina de socio esta última se conformará por los sub-módulos de inicio, cuenta, organización y agenda los cuales contarán con una interfaz web dinámica que permita a los clientes y al administrador de la empresa consultar las actividades realizadas por los clientes, así como su progreso dentro de las actividades que se deben realizar, cabe mencionar que la funcionalidad de algunas secciones de los módulos a desarrollar dependen de la alimentación de datos por parte de otros módulos contemplados en la estructura general los cuales se desarrollarán posteriormente. En la figura 1 se especifican los módulos y sub-módulos a desarrollar dentro de la estructura completa del proyecto:

Figura 1 Estructura General del Sistema

(23)

Página 23

encabezados, colores, tamaño de la organización, numero de niveles, nombres de cada nivel, porcentajes de regalías, porcentajes de ganancias, edición de fórmulas, etc.

11.1 Página Principal

Es la que se mostrará al ingresar al dominio del sitio. Su función principal es de carácter informativo y debe de transmitir la imagen corporativa de la organización. Esta página tiene enlaces al log in mismo que llevara al Back office (página del socio), panel de registro el cual llevara al proceso de registro para usuarios, página donativos donde usuarios y no usuarios del sistema podrán donar al sistema y la tienda donde los usuarios podrán comprar y vender sus productos en la figura 2 se muestra el diseño general de esta sección.

Figura 2 Diseño General de la Página Principal

11.1.1 Log in

(24)

Página 24

Figura 3 Diseño General de Inicio de Sesión

En caso de que el usuario olvide su usuario o contraseña el sistema emitirá un mensaje a este para que reescriba su contraseña de manera correcta como se muestra en la figura 4.

Figura 4 Diseño general para Mensaje en contraseña al iniciar sesión

(25)

Página 25

Figura 5 Diseño general para Reestablecer de contraseña

Requerimientos Funcionales

El Sistema debe contar con un panel de log in para todos aquellos usuarios registrados. Durante el proceso de log in se deberá proporcionar el usuario y contraseña proporcionados en el proceso de registro.

Una vez que el usuario ingrese correctamente los datos requeridos se ingresa a la página del socio.

Requerimientos No Funcionales

Solo se deben poder ingresar al sistema los usuarios registrados. 11.1.2 Tienda

Este enlace nos permitirá accesar la tienda virtual en donde se podrán visualizar los productos que se tienen a la venta sin necesidad de registrarse, sin embargo solo los usuarios registrados podrán efectuar compras (la construcción de esta sección no está contemplada en este proyecto).

11.1.3 Panel de registro

(26)

Página 26

10.1.3.1 Inicio de Registro

Existen dos opciones para registrarse:

o Colaborador Social (CS)

o Emprendedor Social Independiente (ESI)

Un CS es aquella persona que se registra solo para participar en la red de acción comunitaria y en recibir mensualmente sus productos pero no está interesado en formar parte de la red de distribución.

Como ESI formas parte de la red de acción comunitaria, el sistema Red de Distribución en el cual tendrá su organización u organizaciones, recibir mensualmente el paquete de productos y muchos beneficios más.

En la figura 6 se muestra el diseño general de esta sección.

Figura 6 Diseño general del inicio de registro

En la tabla 7 se describen los elementos que componen la figura anterior. Tabla 7 Descripción de los campos y botones del inicio de registro

Tipo de Elemento Nombre Descripción

Imagen Logotipo de la Organización Es el logotipo de la organización y de la marca del producto a distribuir. (Aparece en todas las pantallas).

Select Idioma Selecciona el idioma en el que se

mostrara la página.

(Aparece en todas las pantallas). Etiqueta Mensaje de Bienvenida ¡Felicidades! Usted ha sido invitado

a formar parte del Movimiento COMPROMISOMX. Hagamos juntos que las cosas sucedan.

(27)

Página 27

como: Colaborador Social (CS) o Emprendedor Social Independiente (ESI).

Radio Select Colaborador Social Selector para activar el tipo de usuario “Colaborador Social” para

integrarse al movimiento. Radio Select Emprendedor Social Selector para activar el tipo de

usuario “Emprendedor Social Independiente” para integrarse al

movimiento.

Text Box Descripción de Colaborador Social Nuestros CS son aquellas personas generosas que contribuyen positivamente al movimiento COMPROMISOMX y reciben mensualmente productos mexicanos elaborados con prácticas de comercio justo. Su participación nos ayuda a llevar a cabo acciones sociales en beneficio de nuestro país y a generar una mejor economía para los productores mexicanos. Como Cs usted gozará de atractivos descuentas en la tienda social y podrá participar en nuestras actividades y eventos. Text Box Descripción de Emprendedor Social

Independiente.

Como usted está iniciando su propia empresa social y forma parte de nuestra red en acción. Nuestro compromiso es ayudarlo a desarrollarse personal, social, profesional y económicamente, a su vez usted tendrá la oportunidad de ayudar a más personas.

Botón Siguiente Botón que valida la información

ingresada y las selecciones que el usuario haya realizado. Si todo es correcto al dar clic sobre el botón y validar el sistema permitirá pasar a la siguiente sección del registro.

Requerimientos Funcionales

El Sistema debe contar con un panel de registro para todos aquellos interesados en formar parte del grupo social.

Durante el proceso de inscripción se deberá poder elegir el tipo de cliente que se desea ser. Una vez seleccionado el tipo de cliente, el proceso de inscripción se inicia.

Se deben describir cada uno de los pasos del proceso de inscripción. Requerimientos No Funcionales

(28)

Página 28

Reglas de Negocio de Operación

Una vez seleccionado el tipo de cliente, el proceso de inscripción se inicia. Se deben describir cada uno de los pasos del proceso.

11.1.3.2 Paso 1 del Proceso de Registro - Información del Mentor

En este primer paso del proceso el usuario debe ingresar el nombre o ID del mentor para poder continuar el proceso de registro, en la figura 7 se puede observar el diseño general de esta sección.

Figura 7 Diseño general "Información del mentor"

(29)

Página 29

Figura 8 Mensaje de error en Información del mentor

(30)

Página 30

En la tabla 8 se describen los elementos que componen la figura anterior. Tabla 8 Descripción de los campos y botones de "Información del Mentor"

Tipo de Elemento Nombre Descripción

Barra de menú Menú El menú describe los pasos

para realizar la inscripción. Se debe marcar o resaltar el paso que se esté ejecutando en ese momento.

Etiqueta Paso 1 Información del Mentor.

Form Información del Mentor Contiene los campos del

formulario a llenar. Text área Nombre de usuario o ID del Mentor Aquí se introduce el

nombre de usuario o ID del mentor..

Texto Mentor Encontrado “El nombre del Mentor es

correcto”.

Texto Mentor no encontrado “El nombre del Mentor no

existe”.

Imagen Mentor Encontrado Figura en miniatura que

represente que el nombre de Mentor que se introdujo es correcto.

Imagen Mentor no encontrado Figura en miniatura que

represente que el nombre de Mentor que se introdujo es correcto.

Text área ID del Mentor Aquí se introduce el Id del

Mentor

Texto ID de Mentor Encontrado El Id del Mentor es

correcto.

Texto ID de Mentor no Encontrado El Id del Mentor es

incorrecto.

Imagen Mentor Encontrado Figura en miniatura que

represente que el nombre de Mentor que se introdujo es correcto.

Imagen Mentor no Encontrado Figura en miniatura que

represente que el nombre de Mentor que se introdujo es incorrecto.

Texto-link En caso de no recordar el nombre de usuario o ID de su Mentor haga clic aquí.

Ayuda para buscar nombre de usuario o id de Mentor

Link En caso de no tener Mentor haga clic aquí

Liga a un formulario donde el interesado pondrá su información de contacto

Botón Siguiente Manda al siguiente paso de

registro

(31)

Página 31

Si el nuevo usuario no recuerda el nombre de su mentor, podrá dar clic en el enlace que aparecerá abajo con el texto “Click aquí”, el cual servirá para pasar a la sección de Localizador de Mentor para poder realizar una búsqueda por medio de ciertos datos de la persona para encontrarlo como se muestra en la figura 10.

Figura 10 Diseño general de “Localizador de Mentor”

En la tabla 9 se describen los elementos que componen la figura anterior. Tabla 9 Descripción de los campos y botones de "Localizador de Mentor"

Tipo de Elemento Nombre Descripción

Input Text Nombre (s) Recibe el Nombre (s).

Obligatorio

Input Text Apellido Se introduce el Apellido o

apellidos del Mentor. Obligatorio

Select Estado Se selecciona el estado en

el que está registrado. Opcional

Select Ciudad Este campo es opcional.

Opcional

TextArea Teléfono Este campo es opcional.

Opcional

TextArea Email Este campo es opcional.

Opcional

(32)

Página 32

existe alguien registrado con la información proporcionada Texto Favor de completar todos los campos

con asterisco (*), los cuales son obligatorios.

El mensaje aparecerá cuando se haga clic en el botón Buscar y no se han llenado por lo menos los dos campos obligatorios (Nombre (s) y Apellido).

Si el nuevo usuario no cuenta con un mentor, podrá dar clic en el enlace que aparecerá abajo con el texto “Click aquí”, el cual servirá para pasar a la sección de No tengo Mentor donde podrá ingresar sus datos personales al sistema para poder conseguir un Mentor y así poder integrarse a la comunidad de CompromisoMX como se muestra en la figura 11.

Figura 11 Diseño de la Sección “No tengo Mentor”

En la tabla 10 se describen los elementos que componen la figura anterior. Tabla 10 Descripción de los campos y botones de "No tengo Mentor"

Tipo de Elemento Nombre Descripción

Texto Mensaje (Va en un lado) ¿No cuenta con un Mentor?

(33)

Página 33

dentro del movimiento COMPROMISOMX. Si usted no cuenta con un Mentor favor de llenar el siguiente formulario. Formulario Formulario de contacto Contiene el conjunto de

campos y elementos para que el interesado los llene y se envíen a la

administración.

Input-Text Nombre Campo de texto para

introducir nombre completo del interesado. Obligatorio

Input-Text Número de Teléfono Campo de texto para

introducir el número telefónico del interesado. Obligatorio

Select País Mostrar la lista de países

para seleccionar. (Países de Latinoamérica).

Obligatorio

Select Estado Mostrar los estados del país

para seleccionar. Obligatorio

Text-Select Ciudad Selector Autocompletado

de las ciudades en base al CP indicado. Obligatorio

Input-Tex Código Postal Recibe el código postal y

carga las ciudades que corresponden a este para seleccionar en el siguiente campo. Obligatorio

Requerimientos Funcionales

Para inscribirse se necesita de un Mentor, es decir la persona que le invitó a formar parte del grupo. El interesado debe proporcionar el Nombre de Usuario del Mentor o bien el ID del Mentor. Se debe verificar que los datos del Mentor existan y sean los correctos, en caso de que el interesado no recuerde el nombre de usuario o id, debe existir la opción que permita hacer una búsqueda del Mentor a través de un formulario donde deberá proporcionar información personal del Mentor haciendo ver que en verdad lo conoce pero desconoce exactamente el nombre de usuario o id de este.

Para aquellas personas que no conocen el Nombre de su Mentor o quieren suscribirse y no tienen uno debe existir un link que los lleve a un formulario donde registrará su información de contacto e intereses para que posteriormente se le envíe información detallada de la empresa y alguien se ponga en contacto con él.

(34)

Página 34

Al momento de registrarse o registrar a un nuevo socio el sistema identificará automáticamente el equipo al que pertenece el Mentor y lo asignará al nuevo emprendedor; viéndolo de otra manera son 50 árboles y cada árbol inicia con sus 5 ramas y así sucesivamente.

El sistema debe registrar:

 Nombre del equipo al que pertenece.  Nombre del Miembro Selecto Requerimientos No Funcionales

 Se debe verificar directamente en los registros de la base de datos que el Mentor exista realmente y si no es así no permitir continuar con el proceso.

 Buscar en un solo campo de texto el Nombre de Usuario o ID del Mentor. Reglas de Negocio de Información de Mentor

Para verificar el Mentor o ID se debe validar al momento de terminar de escribir y a un costado marcar con un icono verde si fue encontrado y la leyenda de “Mentor Encontrado”, en caso contrario deberá aparecer un icono de alerta con la leyenda de: “Nombre de usuario o ID del Mentor no existe”. Esto debe ocurrir de manera automática sin necesidad de contar con algún botón de verificar. El botón Siguiente solo debe mostrar el siguiente paso si el nombre de usuario del Mentor o su ID es correcto, en caso de no existir no deberá realizar acción alguna.

Reglas de Negocio de Haga clic aquí

Esta ventana es de tipo modal (pop-up) de tamaño pequeño, de tal forma que no cierra la ventana principal del registro.

Se escribe el primer nombre o ambos nombres, esto va a depender de cómo se encuentre registrado el Mentor.

Al igual que el campo anterior se pueden introducir ambos apellidos o el primero ya que igual dependerá del registro del Mentor.

Al someter la búsqueda en base a esta información solo debe mostrar aquellos resultados que coincidan exactamente con la combinación de nombre y apellido, esto para evitar mostrar resultados que no tienen nada que ver.

Los campos nombre y apellido deben ser marcados con asterisco rojo como indicador de que son campos obligatorios.

Ciudad, teléfono y email son opcionales.

El mensaje “Favor de completar todos los campos con asterisco (*), los cuales son obligatorios.” aparecerá en una ventana pop-up ubicándose en la parte central de la pantalla. Tal ventana debe incluir un botón Cerrar para desaparecer el mensaje.

(35)

Página 35

11.1.3.3 Paso 2 Información de la Cuenta

En esta sección el usuario deberá proporcionar todos los datos marcados como Obligatorios por el sistema atreves de las pantallas que aparecen en este proceso (para mayor información de esta sección favor de ver el manual de usuario de este módulo) en la figura 12 se muestra el diseño general de esta sección.

Figura 12 Diseño general para "Información de la cuenta"

En la tabla 11 se describen los elementos que componen la sección de Información de la cuenta.

Tabla 11 Descripción de los campos y botones de "Información de la cuenta"

Tipo de Elemento Nombre Descripción

Frame Información de la cuenta

Input-Text CURP Clave Única de Registro

de Población. Obligatorio

Input-Text Nombre (s) Nombre o Nombres del

interesado. Obligatorio

Input-Text Primer Apellido Primer Apellido del

interesado. Obligatorio

Input-Text Segundo Apellido Segundo Apellido del

Interesado.

Texto Fecha de nacimiento Fecha de nacimiento.

(36)

Página 36

Select Fecha de Día de nacimiento Día en el que nació conforme lo marca el acta de nacimiento

Select Fecha de nacimiento Mes Mes en el que nació

conforme lo marca el acta de nacimiento

Select Fecha de nacimiento año Año en el que nació

conforme lo marca el año de nacimiento

Select Idioma Se seleccionar el idioma

de preferencia del usuario. Obligatorio

Radio buttons Genero Seleccionar el género.

Obligatorio

Texto Nota Todo el material que

usted reciba estará en el idioma seleccionado.

Select Text-Autocomplete País Seleccionar el país donde

se encuentra. Solo países de Latinoamérica. Obligatorio

Select Text-Autocomplete Estado Seleccionar el estado al que pertenece.

Obligatorio

Select Text-Autocomplete Ciudad Escribir la ciudad en la que se ubica su domicilio. Obligatorio

Input-Text Código Postal Se ingresa el código

postal. Obligatorio

Select Tipo de asentamiento Permite elegir el tipo de

asentamiento: colonia, fraccionamiento, unidad habitacional, barrio, poblado, ejido, etc., predeterminar colonia. Obligatorio

Select InputText-Autocomplete Nombre de Colonia Ingresar o seleccionar el nombre del asentamiento del usuario. Obligatorio

Input Text Calle Escribir la calle en la que

vive el usuario. Obligatorio

Input Text Lote Escribir número o lote

donde vive el usuario. Obligatorio

Input Text Numero Exterior Escribir número o lote

donde vive el usuario. Obligatorio

Input Text Numero Interior Escribir número o lote

donde vive el usuario. Obligatorio

Input Text Manzana Escribir manzana o

(37)

Página 37

Input-Text Cruzamientos Cruzamientos del

domicilio. Obligatorio

Input-Text Referencias Escribir las referencias

especificas del domicilio

Input-Text Teléfono móvil Escribir número de tel.

celular.

Botón Solicitar Clave Botón que solicita se

envíe la clave al núm. celular proporcionado. Input-Text Código de verificación Campo para introducir el

código de verificación y validar el número. Obligatorio solo en caso de proporcionar

teléfono

Botón Verificar clave Verifica que la clave del

campo código de verificación sea la misma que se generó al solicitar clave.

Texto Mensaje de verificación de clave La clave es incorrecta. Texto Mensaje de verificación de clave La clave es correcta.

Input Text Teléfono casa Escribir Número de

teléfono de casa. Opcional

Input Text Otro teléfono Escribir Otro número de

teléfono Opcional

Campo Correo electrónico Campo obligatorio. Debe

registrar el correo electrónico del usuario. Sera el correo principal con el que se activara la cuenta y se le harán llegar las notificaciones Botón Solicitar clave verificación correo

electrónico

Botón que envía clave de verificación al correo proporcionado en el campo correo electrónico Campo Ingresar clave verificación correo

electrónico.

Campo de texto para verificar que la clave recibida en el correo proporcionado es la misma que se envió mediante el botón de verificación de clave.

Frame Creación de la cuenta A partir de aquí se toman

los datos para usuario y contraseña

Input-Text Nombre de usuario Escribir el que será el

nombre de usuario del usuario. Obligatorio Texto Nombre de usuario Disponible Nombre de usuario está

disponible

(38)

Página 38

disponible

Imagen Nombre de usuario Disponible Figura en miniatura que represente que el nombre de usuario está

disponible. Obligatorio Imagen Nombre de usuario no Disponible Figura en miniatura. que

represente que el nombre de usuario no está disponible Obligatorio

Texto El nombre de usuario es demasiado

largo

El nombre de usuario es demasiado largo Obligatorio

Texto El nombre de usuario es demasiado

corto

El nombre de usuario es demasiado corto Obligatorio

Texto El nombre de usuario es incorrecto El nombre de usuario es incorrecto, verificar que cumpla con las

especificaciones. Obligatorio

Texto Especificaciones nombre de usuario Por favor elija un nombre de usuario fácil de recordar con las siguientes

especificaciones: mínimo 6 y máximo 20 caracteres, indistinto mayúsculas y minúsculas, caracteres de (A-Z) y (0-9). No se permite espacios (_-).

Input-Password Contraseña Escribir la que será la

contraseña del usuario Obligatorio

Texto La seguridad es débil Seguridad débil

Texto La seguridad es mediana Seguridad mediana

Texto La seguridad es fuerte Seguridad fuerte

Texto La contraseña es incorrecta Contraseña incorrecta, verifique las

especificaciones Especificaciones para la contraseña

Input- Password Revisar Contraseña Volver a escribir la contraseña Obligatorio Texto Indicaciones para contraseña Por su seguridad la

contraseña debe tener al menos 6 caracteres y por lo menos una letra mayúscula y un número.

Texto Aviso La información solicitada

es confidencial.

Link Aviso de Privacidad Términos, condiciones de

uso y privacidad

Texto Favor completar todos los campos

con asterisco (*), los cuales son obligatorios.

(39)

Página 39

(40)

Página 40

Requerimientos Funcionales

Recabar la información necesaria para crear la cuenta de Registro del Nuevo Emprendedor. Debe obtenerse la información suficiente para ponerse en contacto con el emprendedor su información básica y elegir su nombre de usuario y contraseña.

Requerimientos No Funcionales

La información deberá validarse y registrarse en tiempo real, haciendo lo más rápida esta operación.

Señalar los campos que sean obligatorios para poder tener el registro de ellos. Validaciones Especiales

Número Telefónico Celular: Para validar el número telefónico al momento de ingresar el número en el campo, el sistema deberá enviar a través de un mensaje de texto un código de activación al teléfono celular proporcionado en el campo “Tel Celular”.

Para que el sistema envié la clave de activación al número celular el usuario deberá dar clic en el botón “solicitar clave”.

Clave de activación: deberá ser de 4 dígitos aleatorios, combinación letras y números. Cada vez que el usuario de clic en el botón “solicitar clave” el sistema deberá enviar una clave diferente

El usuario deberá ingresar el código en el campo “código de verificación”.

Al ingresar su código en el campo, el usuario debe hacer clic en el botón verificar clave. Si el código de activación no es el correcto, debe aparecer un mensaje que indique que: “La clave de activación proporcionada es incorrecta, verifique su clave”.

Si el código de activación es correcto debe aparecer a un costado un gráfico que diga: Clave verificada correctamente.

Correo electrónico: Validar que el correo electrónico proporcionado es verídico, se enviara un correo electrónico a la cuenta de correo especificada con una clave de autentificación, el usuario deberá entrar a su cuenta copiar la clave y pegarla en el campo de validación de correo electrónico.

11.1.3.4 Paso 3 Acuerdo

(41)

Página 41

Figura 13 Diseño general de "Acuerdo"

En la tabla 12 se describen los elementos representados en la figura anterior. Tabla 12 Descripción de los campos y botones de "Acuerdo"

Tipo de Elemento Nombre Descripción

Frame Acuerdo con asociado Marco que delimita el

espacio donde ira el acuerdo

Text Area Acuerdo Redactar el acuerdo.

(PENDIENTE TAN PRONTO SE TENGA SE LE ENVIARÁ)

Frame Aceptación de asociado Marco que delimita el

espacio donde se marca que está de acuerdo

Checkbox Aceptación de asociado Acepto el reglamento

descrito en el acuerdo exhibido arriba. Obligatorio

Frame Firma Digital Área de texto para

ingresar iniciales como firma

Texto Ingresa tus Iniciales, representan una firma digital.

Favor de ingresar su nombre, tendrá el valor de una firma digital.

Texto Firma digital Favor de ingresar su

(42)

Página 42

una firma digital.

Botón Regresar Regresa al paso anterior.

Requerimientos Funcionales

En este paso se debe mostrar en pantalla el acuerdo del socio lo suficientemente legible y cómodo para la lectura del cliente.

Debe existir un botón o forma para que el cliente marque que ha leído y está de acuerdo con el acuerdo del cliente selecto.

Para finalizar este proceso se requiere que el cliente ingrese sus iniciales a manera de firma digital.

El acuerdo del cliente que se muestre en pantalla será el mismo para los dos tipos de registros.

Requerimientos No Funcionales

El acuerdo del cliente debe mostrarse en un área de texto de tamaño mediano con un scrollbar para poder ir recorriendo el contenido del acuerdo.

Utilizar un cuadro o forma para pantalla general para cada una de las 3 secciones: Acuerdo del socio, Aceptaciones del socio S, Firma Digital.

Si el usuario no marca la casilla de verificación y aceptación de que ha leído el acuerdo y lo acepta, si no cumple no podrá avanzar al siguiente paso.

Al dar clic en siguiente y validar que acepto el acuerdo pasar al paso 5. 11.1.3.5 Paso 4 Paquete de bienvenida

En esta sección el sistema otorga un paquete de bienvenida al nuevo usuario como se muestra en la figura 14.

(43)

Página 43

En la tabla 13 se describen los elementos mostrados en la figura anterior. Tabla 13 Descripción de los campos y botones de "Paquete de Bienvenida"

Tipo de Elemento Nombre Descripción

Frame CONTENEDOR En este se encontraran la lista de

productos que posiblemente se puedan incluir en el paquete de bienvenida.

Etiqueta Descripción y nombre Aquí se incluirá el nombre del producto y la información que de una breve explicación de lo que trate dicho producto.

Imagen Foto de producto Aquí se contendrá una imagen del producto para verlo como será físicamente.

Botón Siguiente Permite ir a la siguiente sección

del formulario de registro una vez que haya completado y cumplido la condición de esta sección.

Reglas de negocio

En este caso los productos para el paquete de bienvenida estarán predeterminados por la organización (por definir los productos que se podrán incluir en el paquete de bienvenida). Los productos se mostraran en forma de lista descendente contando con una barra deslizadora para la navegación de dicha lista.

11.1.3.6 Paso 5 Información de envió y autopago

(44)

Página 44

Figura 15 Diseño general de "Información de autopago y envío"

En la tabla 14 se muestra la descripción de los elementos de la figura 15.

Tabla 14 Descripción de los campos y botones de "Información de autopago y envió"

Tipo de Elemento Nombre Descripción

Checbox Utilizar información Utilizar mi información de contacto de dirección para mi Información de envío

Frame Información de Envío Esta será la dirección a la

cual enviaremos sus productos

Input-Text Nombre (s) Nombre o Nombres del

Socio Obligatorio

Input-Text Primer Apellido Primer Apellido del socio

Obligatorio

Input-Text Segundo Apellido Segundo Apellido del

socio Obligatorio

Select País Seleccionar el país donde

se encuentra Obligatorio

Select Estado Seleccionar el estado al

que pertenece Obligatorio Select Text-Autocomplete Ciudad o Municipio Escribir la ciudad en la que

se ubica su domicilio Obligatorio

Input-Text Código Postal Se ingresa el código postal

Obligatorio

Select Colonia Permite elegir el tipo de

(45)

Página 45

Select InputText-Autocomplete Nombre de Colonia Ingresar o seleccionar el nombre del asentamiento del usuario Obligatorio

Input Text Calle Escribir la calle en la que

vive el usuario Obligatorio

Input Text Lote Escribir numero o lote

donde vive el usuario Obligatorio

Input Text Numero Exterior Escribir numero o lote

donde vive el usuario Obligatorio

Input Text Numero Interior Escribir numero o lote

donde vive el usuario Obligatorio

Input Text Manzana o bloque. Escribir manzana o bloque

donde vive el usuario Obligatorio

Input-Text Cruzamientos Cruzamientos del

domicilio Obligatorio

Input-Text Referencias Escribir las referencias

especificas del domicilio Obligatorio

Input Text Teléfono Casa Escribir Número de

teléfono de casa Obligatorio

Texto Aviso La información solicitada

es confidencial.

Link Aviso de Privacidad Términos, condiciones de

uso y privacidad

Botón Atrás Regresa a la pantalla

anterior

Botón Siguiente Pasa a recoger datos de

facturación

Texto Favor de completar todos los campos

con asterisco (*), los cuales son obligatorios.

Aparece un mensaje en cada interfaz “Dirección de envío”, cuando se haga clic en el botón Siguiente y no se han llenado todos los campos obligatorios.

(46)

Página 46

Figura 16 Diseño general "Modo de envió" dentro de "Información de autopago y envió"

En la tabla 15 se describen los elementos que componen la figura anterior.

Tabla 15 Descripción de los campos y botones de "Método de envió" " dentro de "Información de autopago y envió"

Tipo de Elemento Nombre Descripción

Frame Método de Envío Se deben mostrar las opciones

de envió

Tabla Tabla de descripción de métodos Se compone de 4 campos: “Método de envío”, “envío”, “manejo”, “flete aduanal”. Aparecerán sin cargos. Radio-button Método de envió Envió terrestre Obligatorio

Envió Precio de envió Obligatorio

Manejo Precio de manejo Obligatorio

Flete aduanal Precio de flete aduanal

Obligatorio

(47)

Página 47

Figura 17 Diseño general de "Información de autopago" dentro de "Información de autopago y envió"

Figura 18 Diseño general de "Información de autopago tarjeta" dentro de "Información de autopago y envió"

En la tabla 16 se describen los elementos de las figuras anteriores.

Tabla 16 Descripción de los campos y botones de "Información de autopago tarjeta" dentro de "Información de autopago y envió"

Tipo de Elemento Nombre Descripción

Frame Información de facturación Contiene todos los

campos referentes a la facturación

(48)

Página 48

para facturar: Tarjeta de crédito o tarjeta de débito (predeterminado: tarjeta de crédito)

Chec box Guardar información de autopago para su uso en un futuro

Guardara los datos para ser utilizados en la próxima operación del cliente Opcional

Select Tipo de tarjeta El cliente debe

seleccionar el tipo de tarjeta que maneja. (American Express. VISA o MasterCard.

Obligatorio

Input-Select Banco Deben aparecer las

Instituciones Bancarias. Definir Bancos

Input-Text Número de tarjeta El cliente debe ingresar

aquí su # de tarjeta Obligatorio

botón Ayuda con el número de tarjeta Abre una ventana con una imagen que muestra donde encontrar el número de tarjeta Select Expiración de tarjeta -Mes El cliente debe poder

seleccionar el mes de expiración de la tarjeta de crédito Obligatorio. Meses en formato del 01- al 12

Select Expiración de tarjeta -Año El cliente debe poder seleccionar el año de expiración de la tarjeta Obligatorio. Años en formato 00-99

botón Ayuda con la expiración de tarjeta Abre una ventana con una imagen que muestra donde encontrar la fecha de expiración

Input-Text CVV2 Código de seguridad

Obligatorio

botón Ayuda con el código de verificación Abre un ventana con una imagen de muestra donde encontrar el código de verificación

Chec box Utilizar mi información de contacto de dirección para mi dirección de facturación

Utiliza la dirección de contacto rellenando los campos con esa dirección Input-Text Nombre (s) Titular de la tarjeta Nombre o Nombres del

Socio Obligatorio Input-Text Primer Apellido Titular de la tarjeta Primer Apellido del socio

Obligatorio

(49)

Página 49

Select País Seleccionar el país donde

se encuentra

Select Estado Seleccionar el estado al

que pertenece Obligatorio

Select Text-Autocomplete Ciudad o Municipio Escribir la ciudad en la que se ubica su domicilio

Input-Text Código Postal Se ingresa el código

postal Obligatorio

Select Asentamiento Permite elegir el tipo de

asentamiento: colonia, fraccionamiento, unidad habitacional, barrio, poblado, ejido, etc., predeterminar colonia Obligatorio

Select InputText-Autocomplete Nombre de Colonia, fraccionamiento...

Ingresar o seleccionar el nombre del asentamiento del usuario Obligatorio

Input Text Calle Escribir la calle en la que

vive el usuario Obligatorio

Input Text Lote Escribir numero o lote

donde vive el usuario Obligatorio

Input Text Numero Exterior Escribir numero o lote

donde vive el usuario Obligatorio

Input Text Numero Interior Escribir numero o lote

donde vive el usuario Opcional

Input Text Manzana Escribir manzana o

bloque donde vive el usuario Obligatorio

Input-Text Cruzamientos Cruzamientos del

domicilio Obligatorio

Input-Text Referencias Escribir las referencias

especificas del domicilio Obligatorio

Input Text Tel Residencial Escribir Número de

teléfono de casa Obligatorio

Texto Aviso La información solicitada

es confidencial.

Link Aviso de Privacidad Términos, condiciones de

uso y privacidad

Botón Siguiente Pasa a la siguiente

ventana, enviando datos a validación

Texto Favor de completar todos los campos

con asterisco (*), los cuales son obligatorios.

(50)

Página 50

Requerimientos Funcionales

Debe de recoger los datos necesarios de su domicilio postal.

Debe recoger los datos de facturación para que se le cobre el producto Este paso 6 se debe dividir en dos:

Primero se debe recoger la información de envió y una vez completa y validada solicitar la información de autopago en la misma pantalla

Requerimientos No Funcionales

Los datos se deben recoger a través de un formulario

La información debe ser validada antes de ingresarla a la Base de datos

Los campos de dirección deben ser claros, precisos y obligatorios para tener la dirección exacta.

Si la dirección de Envió es la misma que la dirección de contacto ofrecer la opción que indique que es la misma y autocompletar

Si la dirección es diferente a la de contacto mostrar los campos en blanco para rellenar Se debe validar toda la información de facturación, núm. de tarjeta, expiración, etc.

Se debe solicitar dirección de facturación, mismo proceso que el anterior, si es la misma dirección de contacto poder marcarlo, en caso contrario los campos en blanco para rellenar con la información exacta de facturación.

Antes de pedir la información específica de facturación hay que pedir que seleccione el método de envió

Es obligatorio seleccionar un método de envió, si no es así no se debe permitir continuar Reglas de negocio

Debe aparecer seleccionado y predeterminado el tipo de envío terrestre. Las otras dos opciones están para su uso en un futuro.

Cuando el usuario marque la forma de pago tarjeta de crédito, se le deberá de pedir si es VISA o MasterCard. En caso de que la información no pase por algún motivo el proceso de validación se deberá mantener en la página actual e indicar con el mensaje: “La información que nos proporciono es incorrecta, por favor revisar que:

 Observación 1. No de tarjeta Incorrecto

 Observación 2. Tipo de tarjeta incorrecto

 Observación N” Expiración de la tarjeta Incorrecto

 Observación CVV Incorrecto

 Nombre del Titular de la Tarjeta Incorrecto

 La información Bancaria es Incorrecta

 Así por todos los campos que no cumplan con el proceso de validación

(51)

Página 51

También se debe marcar de color rojo directamente los campos que no han superado este proceso de validación.

Al realizar las correcciones se debe volver dar clic en el botón de siguiente y si cumple las condiciones pasar al paso 6: Nuestra Comunidad, si no lo cumple se repite el mismo proceso hasta que lo cumpla

11.1.3.7 Paso 6 Nuestro movimiento

En esta sección se requiere información del usuario para la configuración de la cuenta, asi como para establecer el contacto con esté. Según el género seleccionado en este paso se configurara la cuenta del usuario, la información que el usuario tendrá que proporcionar se muestra en las figuras 19, 20, 21, 22, 23.

(52)

Página 52

Figura 21 Diseño general "Información Personal-Hijos" en Nuestro movimiento

(53)

Página 53

Figura 22 Diseño general "Información Personal-Redes" en Nuestro movimiento

Figura 23 Diseño general "Información Personal-2" en Nuestro movimiento

En la tabla se muestran detalladamente los elementos que conforman las figuras anteriores. Tabla 17 Descripción de los campos y botones en Nuestro movimiento

Elemento Nombre Descripción

Información Personal

Referencias

Documento similar

"No porque las dos, que vinieron de Valencia, no merecieran ese favor, pues eran entrambas de tan grande espíritu […] La razón porque no vió Coronas para ellas, sería

Sanz (Universidad Carlos III-IUNE): "El papel de las fuentes de datos en los ranking nacionales de universidades".. Reuniones científicas 75 Los días 12 y 13 de noviembre

(Banco de España) Mancebo, Pascual (U. de Alicante) Marco, Mariluz (U. de València) Marhuenda, Francisco (U. de Alicante) Marhuenda, Joaquín (U. de Alicante) Marquerie,

Tome el MacRm media libra de Manecca de puerca ,media Je Manmca de Bac media de A- yre Rolado ,media de Azeyre Violado, y re poMc'tn holla vi- driadaafuegommfo,paza que

The part I assessment is coordinated involving all MSCs and led by the RMS who prepares a draft assessment report, sends the request for information (RFI) with considerations,

Se estima una distancia de más de 11 millones de años luz hablando de una cantidad de sistemas solares que no tendrían espacio en nuestra mente y esto solo hablando del grupo

A medida que las organizaciones evolucionan para responder a los cambios del ambiente tanto para sobrevivir como para crecer a partir de la innovación (Stacey, 1996), los

“La unificación de la clasificación de empresas otorgada por las CC.AA.”, “La unificación de criterios en la acreditación de los servicios de prevención de riesgos