Mockup_Movil - shiomar-salazar/MISW-PF-Grupo1-Backend GitHub Wiki

MockUp de Navegacion de la Plataforma Movil

El siguiente mockup de navegacion se realizo pensando en le plan Premium Anual con todas las caracteristicas liberadas, en el backlog de historias de usuario se puede ver el detalle de las vistas segun el plan del usuario.

En el siguiente enlace se encuentra el mockup de Aplicacion movil SportApp:

https://marvelapp.com/prototype/6gac06c

Digrama General de la Aplicacion

En el siguiente diagrama se han omitido algunas transiciones "hacia atras" con la intencion de se vean los flujos mas significatios, la navegacion mas real se ve en el enlace de la seccion anterior.

MockUp_Movil

Haga click para ver la imagen en grande

Nomenclatura del Prototipo

Elemento Significado Justificacion
Cuadro Verde Imagen de Stock Se esperan poner imagenes pero en el mockup aun no se tiene clara la versiion final escogida
Fondo Blanco Imagen de fondo con patrones Se esta diseñando una imagen de fondo que ayude a constrastar los textos y los elementos de la aplicacion, pero por ahora sera representada con fondo blanco
Colores de Botones Limitacion de la Herramienta En la herramienta los botones y algunos otros elementos estan representados en color gris, esto es porque se esperan hacer validaciones de flujo y navegacion sin que los colores o diseño grafico afecte

Elementos Implementados de Usabilidad

Condicion de Usabilidad Pantalla Justificacion
Accesibilidad Pantalla de Detalles de Eventos En esta pantalla se espera poner los textos de accesibilidad para el uso de lectores de pantalla y asi poder apoyar el registro de eventos de los usuarios.
Localizacion Pantalla de Sugerencias En esta pantalla solo se esperan desplegar sugerencias de servicios que estan localizados en la cercania de los usuarios.
Internacionalizacion Pantalla de Perfil de Usuario En esta pantalla se desea poner una opcion para poder cambiar el idioma de la aplicacion para poder ayudar a las personas a comprender los concepto en el idioma que se les facilite.

Retroalimentacion de Pruebas con Usuarios

Perfil Puntos a Favor Puntos en Contra
Mujer 34 años, Oficinista, Actividad Fisica Media Diseño simple y navegable con facilidad, tiene las funcionalidades accesibles y buenas recomendaciones Otras aplicaciones en el mercado tienen mas tiempo y funcionalidades.
Hombre 32 años, Oficinista, Actividad Fisica Baja Aplicacion facil de usar y entender, no representa una gran labor usarla ni alimentarla con datos. Apartado de sugerencias deberia estar mas llamativo y tener mas deportes y actividades.
Hombre 23 años, Estudiante, Actividad Fisica Alta Aplicacion ligera y con navegacion sencilla. Apariencia limpia y directo para su uso. No muy especializada y funcionalidades ofrecidas muy limitadas.
Mujer 62 años, Jubilada, Actividad Fisica Baja Aplicacion facil de navegar con botones grandes y textos legibles. Falta de color y diseño muy aburrido.

Guia de Navegacion para usuarios

Pantalla Inicial Evento de Transicion Resultado Observaciones
Inicio de Sesion. Click en Boton de Inicio de Sesion. Ingreso a la aplicacion y visualizacion de pantalla de Home. Se requiere una contraseña previamente registrada en la plataforma web.
Pantalla de Home. Click en Boton de Registar en la seccion de Alimentacion. Despliegue de la Pantalla para el Registro de Alimentacion del Dia.
Pantalla de Alimentacion del Dia Click en Boton de Registrar. Guardado de la informacion de la alimentacion del usuario para dicho dia. La informacion debe ser completamente llenada.
Pantalla de Home. Click en Boton de Registar en la seccion de Entrenamiento. Despliegue de la sub-pantalla de entrenamiento del dia.
Sub-pantalla de entrenamiento del dia. Click en el Boton de Monitorear. Despliegue de Sub-pantalla de Monitoreo de Entrenamiento.
Sub-pantalla de Monitoreo de Entrenamiento. Hacer click en el boton de Empezar. Inicio de Temporizador de Entrenamiento con los botones de Alerta y Detener. Solo posible para usuarios del plan premium intermedio de pago mensual.
Sub-pantalla de Monitoreo de Entrenamiento. Hacer click en el Boton de Alerta. Despliegue de pantalla de Alerta de emergencia enviada. Solo posible para usuarios del plan premium intermedio de pago mensual.
Pantalla de Alerta de emergencia. Hacer click en boton de regresar. Regreso a pantalla de Home. Solo posible para usuarios del plan premium intermedio de pago mensual.
Sub-pantalla de Monitoreo de Entrenamiento. Hacer Click en el boton de detener. Despliegue de Pantalla de Registro de Resultado. Solo posible para usuarios del plan premium intermedio de pago mensual.
Sub-pantalla de entrenamiento del dia. Hacer click en el boton de Ingresar Resultado. Despliegue de Pantalla de Registro de Resultado.
Pantalla de Registro de Resultado Hacer Click en el Boton de Registrar. Guardado de la informacion del entrenamiento del usuario para dicho dia. La informacion debe ser completamente llenada.
Pantalla de Home. Click en Boton de Cancelar en la seccion de Entrenamiento. Actualizacion del Plan de entrenamiento para consderar un dia de Descanso.
Pantalla de Home. Hacer click en las flechas de la seccion de Eventos Cerca de ti. Actualizacion de las sugerencias de eventos segun la region del usuario.
Pantalla de Home. Hacer click en el Boton de Ver Mas de la seccion de Eventos Cerca. Despliegue de listado de eventos en la region del usuario.
Pantalla de Listados de Sugerencias Hacer Click en el menu desplegable de Ciudad. Cambio de Eventos con Localizacion por ciudad y moneda.
Pantalla de Listados de Sugerencias Hacer Click en el boton de Ver Mas de un evento. Despliegue de Pantalla de Detalle de Evento.
Pantalla de Detalle de Evento. Hacer click en Boton de Registrarse. El usuario se registra al evento seleccionado y se despliega pantalla de Home. Solo posible para usuarios del plan premium de pago Anual.
Pantalla de Home. Hacer click en las flechas de la seccion de Mis Proximos Eventos. Actualizacion de los eventos registrados del usuario. Solo posible para usuarios del plan premium de pago Anual.
Pantalla de Home. Hacer click en el Boton de Ver mas de la seccion de Mis Proximos Eventos. Despliegue de la Pantalla de Mis Eventos. Solo posible para usuarios del plan premium de pago Anual.
Pantalla de Mis Eventos. Hacer Click en el Boton de Ver mas de un evento. Despliegue de Pantalla de Detalle de Evento. Solo posible para usuarios del plan premium de pago Anual.
Pantalla de Home. Hacer Click en el Boton de Ver mas de la seccion de Plan de Entrenamiento. Despliegue de Pantalla de Plan de Entrenamiento.
Pantalla de Plan de Entrenamiento. Hacer Click en boton de Editar. Despliegue de Pantalla de Editar Plan de Entrenamiento.
Pantalla de Editar Plan de Entrenamiento. Hacer Click en Boton de Guardar. Actualizacion de Plan de Entrenamiento. La informacion debe ser completamente llenada.
Pantalla de Home. Hacer Click en el Boton de Ver mas de la seccion de Plan de Alimentacion. Despliegue de Pantalla de Plan de Alimentacion.
Pantalla de Plan de Alimentacion. Hacer Click en boton de Editar. Despliegue de Pantalla de Editar Plan de Alimentacion.
Pantalla de Editar Plan de Alimentacion. Hacer Click en Boton de Guardar. Actualizacion de Plan de Alimentacion. La informacion debe ser completamente llenada.
Pantalla de Home. Hacer click en el Boton de Perfil. Despliegue de Pantalla de Perfil de Usuario.
Pantalla de Perfil de Usuario. Click en la Bandera de U.S.A. Despliegue de la pantalla de Perfil de usuario en Ingles.
Pantalla de Perfil de usuario en Ingles. Click en la Bandera de "Español". Despliegue de la pantalla de Perfil de usuario en Español.
Pantalla de Perfil de Usuario. Hacer Click en el Boton de Mejorar a Premium. Despliegue de Pantalla de Mejorar Plan.
Pantalla de Mejorar Plan. Click en el boton de Mejorar a Plan Premium Mensual. Actualizacion del Perfil de Usuario con el nuevo plan. Pantalla unicamente de desarrollo.
Pantalla de Mejorar Plan. Click en el boton de Mejorar a Plan Premium Anual. Actualizacion del Perfil de Usuario con el nuevo plan. Pantalla unicamente de desarrollo.
Pantalla de Mejorar Plan. Click en el boton de Mejorar a Plan Gratuito. Actualizacion del Perfil de Usuario con el nuevo plan. Pantalla unicamente de desarrollo.
Pantalla de Perfil de Usuario. Click en el Boton de Cerrar Sesion. Cierre de Sesion y regreso a Pantalla de Inicio de Sesion.