lOMoARcPSD|27487844

Elaboración De Interfaz Gráfica Y Mapa De Navegación Cumpliendo

Con Reglas De Usabilidad Y Accesibilidad app móvil.

Evidencia:GA5-220501095-AA1-EV07

Aprendiz: Oyiuso Anderson Neuto González

Instructora. Doris González Martínez

Servicio Nacional De Aprendizaje - SENA

Centro Agro empresarial Huila

Análisis Y Desarrollo De Software

Aguachica –Cesar

23 de octubre de 2023
 lOMoARcPSD|27487844

Contenido

Introducción............................................................................................................................................ 3
Propósito ............................................................................................................................ 4
Ámbito del Sistema ............................................................................................................. 4
Mapa de Navegación .......................................................................................................... 4
Perspectiva del Producto ................................................................................................... 5
Funciones del Producto.................................................................................................. 5
Requerimientos Funcionales .................................................................................................. 5
Características de los Usuarios.......................................................................................... 6
Restricciones ................................................................................................................... 6
Suposiciones y Dependencias ......................................................................................... 6
Requisitos Futuros........................................................................................................... 6
Requisitos Específicos. Requerimientos funcionales ................................................................ 7
Interfaz ............................................................................................................................... 7
Creación de la Interfaz ........................................................................................................................ 9
Paletas de Color .................................................................................................................................... 12
Requerimientos Funcionales ............................................................................................ 12
Requisitos de Rendimiento .............................................................................................. 13
Requisitos no funcionales................................................................................................. 13
Reglas de Usabilidad y Accesibilidad ....................................................................... 15
Reglas de uso .................................................................................................................................... 15
Reglas de accesibilidad ...................................................................................................................... 16
Conclusiones ......................................................................................................................................... 18
 lOMoARcPSD|27487844

Introducción.

Las funcionalidades del sistema y la accesibilidad son lo más importante para un software pues

se le podrá explotar su uso de una forma u otra según el objetivo con el que es creado. La

comprensión de los diferentes niveles de abstracción en el diseño de los datos, la selección de

estructuras y la implementación de algoritmos óptimos constituyen un perfil informático y si le

agregamos app móvil le agregamos un plus de versatilidad

También puedo mencionar que nuestro diseño es capaz de evolucionar a medida que cambien

los requerimientos del usuario, los requerimientos de app móviles y del mercado a su vez,

estamos ofreciendo un producto de fácil acceso y uso ya que será móvil, desde cualquier

dispositivo móvil pueden acceder a la interfaz de Foto Mago.

 lOMoARcPSD|27487844

Propósito

El desarrollo de este documento tiene como objetivo adquirir conocimientos y

habilidades en el diseño y elaboración de interfaces gráficas y mapas mentales

basados en app móvil nativa, con ello, además; cumplir con lo solicitado por el

documento de aprendizaje dando solución a la actividad.

Ámbito del Sistema

El nombre del proyecto es foto mago, se trata de ofrecer prestación de servicios especializado

De fotografías. El objetivo es crear ofertas sobre todo el ámbito fotográfico a nivel nacional,

exponiéndolo en los medios digitales y mediante la plataforma foto mago, en se puede

interactuar de manera fácil y sencilla donde se encontrarán staff, información, productos,

precios, solicitudes de servicio también fortalecerlo mediante una adecuación de app móvil.

Mapa de Navegación

El mapa de navegación es una vista desde una perspectiva más amplia de todo lo

que puede ofrecer mi software a desarrollar.

 lOMoARcPSD|27487844

Perspectiva del Producto

Funciones del Producto

Requerimientos Funcionales:

• Puedes acceder a la información de manera cómoda, por categorías

• Se puede generar orden de servicio por la página

• Recibe y genera información

• Realiza seguimiento del servicio, pagos, garantías y

pólizas

• Pueden elegir el tipo de servicio que requerían y con asesoría en

línea

• Staff de personal profesionales de fotógrafos.

• Puede consultar desde una app móvil todos los pasos anteriores
 lOMoARcPSD|27487844

Características de los Usuarios

Restricciones

Como mínimo, se debe hacer uso de los protocolos de intercambio de datos vía

internet. Respecto a la seguridad, se debe considerar el uso de sesiones paralimitar

el acceso a usuarios no autorizados.

El cliente no ha especificado ninguna otra limitante, y algunos de lascaracterísticas

las dejó al criterio de los desarrolladores.

Suposiciones y Dependencias

 Interfaz de usuario (UI) bien diseñada.

 Tiempo de carga rápido.
 Protección sólida de datos.
 Excelente soporte al usuario.
 Integraciones incorporadas.
 Aplicaciones Móviles... · Se origina una preocupación constante por estar conectados y
enterarse de todo lo que está ocurriendo, ya sea en el mundo engeneral,

Requisitos Futuros

Para mejora del producto se va a generar un espacio virtual de manera didáctica en

donde el usuario pueda crear d i s e ñ o d e l a a p p m o v i l y mejorar condiciones de

la prestación del servicio para mejorar continuamente el software,ofreciendo una

mayor comodidad de él, dándole diferentes alternativas y versatilidad, y facilitando

la compresión de la página lo máximo posible,

 lOMoARcPSD|27487844

Requisitos Específicos. Requerimientos funcionales

 Puedes acceder a la información de manera cómoda, por categorías En este punto se lleva acabo
lo mencionado acerca de la interfaz en el mensaje de inicio, es decir, que la información
categorizada se verá en un recuadro en la parte izquierda de la pantalla, representando las áreas
ya mencionadas

 Interfaz sencilla e intuitiva.

 Multiplataforma.
 Seguridad.
 Actualizaciones y modo offline.

Se puede adquirir la prestación de servicio a través de la página en app móvil no requieres un

equipo fijo Esto hace referencio a área de gestión de servicios en donde se lleva a cabo los

diseños y actualización de mejoras del software. Almacenarán todas las ordenes de compras

realizadas parasu posterior verificación y aceptación de orden de servicio. Da los vínculos para

recolección derequisitos. Estos vínculos se encuentran en la información de la empresa

ubicada como una categoría de la página, para que así, si el cliente lo desea, rellenen

cuestionario que estará relacionado a como se sintió con respecto a la página y que cree que

se debería mejorar, adicional a esto, también la opción de apoyar un producto futuro donde

podrán crear sus propios diseños del producto con asesorías del staff de la plataforma

Interfaz

La interfaz gráfica con la que el usuario final interactúa deberá ser intuitiva de manera que, sin

un manual de uso, el usuario identifique rápidamente los componentes y las seccionesdel

sistema. La interfaz además deberá contar con colores agradables a la vista para que el

usuario pueda trabajar por horas con el mismo sin problemas. De igual forma, la interfaz deberá

ser compatible con los navegadores más comunes

 Mensaje de bienvenida

Este tendrá un inicio de bienvenida con el logo de la empresa de fondo más una frase que brinde

seguridad y tranquilidad al futuro comprador

 lOMoARcPSD|27487844

 Menú

Este se encontrará a mano izquierda con títulos cortos para que el usuariose pueda guiar

fácilmente, con un rectángulo que solo ocupara el lado izquierdo.

Este menú tendrá

Inicio

Lista de deseos del usuario

Diseños del producto más comprados

Todos los diseños

Buscar un diseño especifico

Área de carrito

Información sobre la empresa

Acerca del servicio de entrega

 Búsqueda de diseños especifico

Este contara con un sistema de etiquetas para buscar ya sea #colores,#talla, #diseño, etc.

 Área generación de servicio

Este contara con un ciclo de compra, es decir, un paso a paso, si quiere hacer uso del servicio

de entrega o si prefiere ir a reclamarlo, el valor totalcon un recibo para validar la compra y

horario de atención.

 Información de la empresa.

Se mostrará el logo en un lado, se describirán las labores realizadas para laelaboración del

producto, como puede apoyar a la empresa respondiendo un cuestionario y quienes son los

empleados actuales en la empresa, facilitado así por ser una empresa pequeña.

 Sistema de Inicio de Sesión

El usuario deberá introducir un nombre de usuario y un password previamente registrado y

dado de alta por algún usuario administrativo. El password deberá tener no menos de 8
 lOMoARcPSD|27487844

caracteresy será sensitivo al uso de mayúsculas y minúsculas o El nombre de usuario deberá

ser formado por las iniciales del nombre y el apellido paterno completo y el año de nacimiento

en 2 dígitos-8. Ejemplo Fernando Pérez, el usuario sería: o Al quinto intento fallido de inicio de

sesión, el sistema bloqueará automáticamente ese usuario por untiempo determinado (15

minutos).

Creación de la Interfaz

Se desea elaborar una pantalla que permita validar un usuario

Diagrama de Flujo
 lOMoARcPSD|27487844

Se elabora una pantalla que permita ingresar nombres, apellidos, cédula, fecha de nacimiento

de un usuario.

Diagrama de flujo
 lOMoARcPSD|27487844

● Se desea dibujar una pantalla en donde se informe de posibles errores a un usuario.

Diagrama de flujo
 lOMoARcPSD|27487844

Paletas de Color

Requerimientos F u n c i o n a l e s

 Puedes acceder a la información de manera cómoda, desde un dispositivo móvil.

En este punto se lleva a cabo lo mencionado acerca de la interfaz mediante una app nativa

móvil, recibiendo información e interactuando con el sistema de foto mago, categorizando el

diseño y mejorando su usabilidad y accesibilidad, en cualquier momento, en cualquier lugar.

 Da los vínculos para recolección y generación de información.

Estos vínculos se encuentran en la información de la empresa ubicada como una categoría de

la página, para que así, si el cliente lo desea, rellenen en un cuestionario que estará

relacionado a como se sintió con respecto a la página y que cree que se debería mejorar,

adicional a esto, también la opción de apoyar un producto futuro donde podrán crear sus

propios diseños del producto.

 lOMoARcPSD|27487844

 Puedes elegir si puedes pedir que te hagan un envió o ir a

recogerlo personalmente.

Esto se encuentra en las opciones del área del pedido para darle más libertad al cliente

para que le llegue el producto finalizado de la prestación del servicio o el recogerlo en la sede

 Puedes elegir el tipo de producto que quieres.

Puede escoger la prenda de vestir, talla, color, diseño.

Requisitos de Rendimiento

Requisitos del sistema (servidor)

Hardware: Windows 7, Windows 8, Windows 8.1, Windows 10 o una version posterior. Un

procesador Intel Pentium 4 o superior compatible con SSE3.

Software: acceso a

internet Otros: gran

almacenamiento

Requisitos del Sistema.

descargar aplicaciones en Google Play es una tarea más que sencilla. Simplemente hay que ir a
la tienda, buscar el nombre o navegar por las diferentes categorías y pulsar un botón verde.
Internet móvil, internet página Chrome o google Permisos, licencia y condiciones de uso. Hay
que ser claros y explícitos a la hora de solicitar permisos

Requisitos no funcionales.
 lOMoARcPSD|27487844

Esta optimizado

Debido a que se ignora la capacidad de cómputo de algunos usuarios, se requiere de otro

factor: eficiencia para no malgastar recursos, en el caso de poseer un dispositivo móvil

lento.

Informa al equipo de que hay un pedido o fallo en la plataforma

El cliente también desea sentirse respaldado no solamente por un manual, sino por

alguien que solucione sus dudas, soporte humano que pueda explicar a fondo el

funcionamiento de su producto. Es muy importante y sobre todo después de un tiempo

cuando alguno de los usuarios finales comience a formular preguntas o haga algún

movimiento inesperado.

Tiene su propio sistema de seguridad siendo este, el cuidado de las cuentas de

usuario.

El requisito más importante que el sistema va a poseer es la estabilidad, si el producto

corre el riesgo de cambiar o dañarse ¿qué seguridad tenemos para con el cliente? Una

buena característica entonces será asegurar la integridad del dato.

Usa cuentas de usuario para poder guardar correctamente la información del

cliente,la cual estará disponible en todo momento.

Viene de la mano con el requisito anterior la disponibilidad, es vital que el usuario tenga

acceso a los datos en cualquier momento posible.

 lOMoARcPSD|27487844

Se genera un recibo de acuerdo a la compra el cual es dejado como un pdf.

La documentación también es necesaria para que el usuario sea capaz de resolver dudas

menores que vayan surgiendo sobre la marcha en el uso de su nuevo sistema, debe ser

completa, pero al mismo tiempo no tan extensa para que pueda ser consultada con

facilidad y realmente sea útil.

Se puede abrir únicamente una categoría a la vez.

Esto es para evitar errores y que se sature la página por tantas acciones a realizar por

cada usuario.

Reglas de Usabilidad y Accesibilidad

Reglas de uso

 Facilidad de aprendizaje:

Se puede emplear una unidad de tiempo para determinar lo que demoran los usuarios en

usarla de manera correcta y realizar las operaciones básicas y comunes.

Se puede emplear una unidad de tiempo para determinar lo que demoran los usuarios en usarla

de manera correcta y realizar las operaciones básicas y comunes.

 Facilidad y eficiencia de uso:

Se puede usar una unidad de tiempo para establecer cuando tiempo se demora un usuario en

realizar una operación completa de su quehacer con la herramienta de trabajo.

 Facilidad de recordar el funcionamiento:

 lOMoARcPSD|27487844

Capacidad de recordar las características forma de uso de un sistema se debe usar para

volver a emplearlo en el futuro.

 Frecuencia y gravedad de errores:

Los mensajes de error a los usuarios para apoyarlos cuando deban enfrentar los errores

cuando se comenten errores determinados en el sistema. Ejemplo de un error

predeterminado. Un sistema de compra que no permita avanzar si no se ha seleccionado

ningún producto.

 Satisfacción subjetiva:

Indica lo satisfechos que quedan los usuarios después haberusado el sistema debido al

diseño presentado y es subjetiva porque depende de la percepción de cada usuario.

Reglas de accesibilidad

 Definir con simplicidad y claridad la estructura de los contenidos.

Generalmentela recomendación es organizarlos de acuerdo con una jerarquía y consistente

temáticamente o según las relaciones y procesos de negocio de la aplicación.

 Establecer un diseño “limpio”:

Correcta tipografía, imágenes y recursos gráficos que hagan fácil al usuario encontrar lo que

busca, separando los contenidos con una clasificación lógica.

 Ceder el control al usuario:

 lOMoARcPSD|27487844

Los usuarios no sienten una experiencia positiva si en algún momento se sienten perdidos

mientras interactúan con el sistema. Se debe Garantizar que el usuario sepa dónde se

encuentra y cómo acceder a otro enlace funcionalidad.

 Facilitar la interacción:

Permitir que el usuario pueda desarrollar varias acciones de forma fácil e intuitiva aporta a la

satisfacción, sin embargo, si estas opciones no se presentan como un diseño limpio, se puede

lograr un efecto adverso.

 lOMoARcPSD|27487844

Conclusiones

Aprendizaje y ejecución de los mapas de navegación bajo los estándares de accesibilidad y

usabilidad de la app móvil con interfaces gráficas para interacción con el usuario cliente

dejándonos claro este proceso el propósito los objetivos en la graficas establecidas en el

software foto mago, es el compromiso y la viabilidad del proyecto donde se va dando forma y se

ve solidificado la versatilidad y el uso de app móvil para su uso desde cualquier lugar a

cualquier momento por voluntad del usuario a disponer del uso del software claro está bajo los

marcos legales del territorio nacional donde se use y la políticas i internas del mismo software.