Versión 3 con IAG

Tras las pruebas realizadas con Rememora v2 y el análisis de datos posterior, se han detectado problemas de usabilidad que volveremos a intentar resolver con la IAG. Se identifican todos los problemas, se los comunicamos a la IAG e implementamos la propuesta realizada. Todas estas propuestas implementadas sobre Rememora generan una nueva versión, la v3.

Problema detectado: botón volver al menú principal

Problema

Los usuarios no son capaces de encontrar la forma de volver al menú principal para cambiar de sección.

En la anterior versión, la IAG nos ofreció ubicar este botón en dos posiciones: esquina superior izquierda o esquina inferior derecha. En la v2 se optó por ubicarlo en la posición inferior derecha y en esta versión se opta por cambiarlo a la parte superior izquierda.

Prompt

Como experto en diseño de interfaces para aplicaciones para tablets y usuarios mayores de 70 años. Tengo una aplicación con dos pantallas. En la pantalla principal se muestra un menú con opciones. Cuando se selecciona una de estas opciones se muestra la segunda pantalla. En esta segunda pantalla se muestra contenido relacionado con la opción seleccionada por el usuario. Esta pantalla tiene botones grandes llegando a ocupar todo el ancho de la tablet (portrait), con 5 botones. Necesito dar la opción a los usuarios de volver desde la segunda pantalla a la primera (menú principal).

Dime de una forma precisa y con detalles cómo puedo implementar una solución visual para que el usuario pueda volver al menú principal teniendo en cuenta las características de los usuarios a los que se destina la aplicación.

Solución propuesta por la IAG

Para diseñar una interfaz amigable para usuarios mayores de 70 años, especialmente en una aplicación para tabletas que incluye navegación entre dos pantallas principales, es crucial considerar la accesibilidad, la visibilidad y la facilidad de uso. A continuación, se detalla una solución visual para implementar una opción que permita a los usuarios volver desde la segunda pantalla (donde se muestra el carrusel de fotografías) a la primera pantalla (menú principal):

Botón de Vuelta Prominente:
1. Tamaño Grande: El botón para volver al menú principal debe ser grande, considerando que los usuarios mayores pueden tener dificultades con la precisión de los toques. Un tamaño recomendado para este botón podría ser de al menos 1/10 del ancho de la pantalla para asegurar que sea fácilmente accesible.
2. Iconografía Clara: Utiliza un icono universalmente reconocido, como una flecha hacia la izquierda o el icono de una casa, que indique claramente la acción de volver al menú principal. Este icono debe tener un contraste alto respecto al fondo para facilitar su visibilidad.
3. Etiqueta de Texto: Acompaña el icono con una etiqueta de texto clara, como "Menú Principal" o "Volver", colocada debajo o al lado del icono. Elige una fuente de gran tamaño y fácil lectura, como sans-serif, con un tamaño de letra que no sea menor a 16pt para mejorar la accesibilidad.
Posición Intuitiva:
1. Coloca el botón en una esquina superior de la pantalla, preferiblemente en la esquina superior izquierda, donde los usuarios tienden a buscar opciones de navegación. Esta posición es intuitiva y fácilmente accesible sin obstruir el contenido principal de la pantalla.
Contraste y Colores:
1. Asegúrate de que el botón tenga un contraste alto con el fondo para que sea fácilmente identificable. Los colores deben ser seleccionados cuidadosamente para ayudar a los usuarios con visión reducida o daltonismo; por ejemplo, un botón azul sobre un fondo blanco ofrece un buen contraste visual.
Feedback Táctil y Visual:
1. Implementa feedback visual y táctil al interactuar con el botón. Por ejemplo, el botón puede cambiar de color o emitir una sombra cuando se toca, y la tableta puede vibrar ligeramente. Este feedback ayuda a confirmar la acción realizada por el usuario.
Instrucciones y Ayuda:
1. Considera incluir un breve tutorial o instrucciones la primera vez que el usuario inicie la aplicación, destacando cómo navegar entre pantallas y cómo utilizar el botón para volver al menú principal. Esto puede ser particularmente útil para usuarios que no estén familiarizados con las convenciones de diseño de interfaces.
Testeo con Usuarios:
1. Finalmente, pero no menos importante, realiza pruebas de usabilidad con usuarios dentro del rango de edad objetivo para recoger feedback sobre el diseño e implementación del botón de retorno. Ajusta el diseño según sea necesario para asegurar que cumple con las necesidades y preferencias de tus usuarios. Implementando estas recomendaciones, puedes crear una solución visual que no solo sea accesible y fácil de usar para los usuarios mayores, sino que también mejore la experiencia general del usuario en tu aplicación para tabletas.

Cambios en el diseño Los cambios que se van a realizar en el diseño tras la propuesta de la IAG son:

Se mueve el menú principal a la esquina superior derecha, se cambia el diseño como cualquier otro botón, se añade el texto volver.

Problema detectado: menú de navegación (avanzar/retroceder)

Problema

Existe un problema generalizado en todas las secciones: los usuarios no saben cómo pasar de un archivo multimedia a otro o reproducir y pausar un archivo multimedia en el caso de vídeos, música o audios.

Además, este problema impide a los usuarios poder visualizar todos los archivos multimedia de la aplicación y por tanto saber cuántos archivos multimedia existen en cada una de las secciones.

Para resolver este problema general, lo contextualizamos con una de las secciones de la aplicación: fotos. Esta opción no tiene los botones de reproducir o pausar.

Prompt

Actúa como un experto en diseño de interfaces y experiencia de usuario. En una aplicación para tablet y para usuarios mayores de 70 años tiene dos pantallas:

La primera pantalla muestra cuatro botones (fotos, vídeos, música y audios) que representan las funcionalidades que tiene la aplicación.
Cuando se selecciona fotos, la aplicación muestra otra pantalla donde se puede ver en la parte superior izquierda un botón con la etiqueta ‘Anterior’ y otro en la derecha con la etiqueta ‘Siguiente’. En el centro se muestra una galería de fotos y en la parte superior izquierda existe un botón con un icono de una casa. Cuando el usuario quiere visualizar fotos, debe pulsar el botón avanzar. Si desea retroceder en las fotos ya vista, debe pulsar el botón volver. Y si el usuario quiere volver al menú principal, debe pulsar sobre el botón que tiene el icono de la casa.

El usuario presenta problemas a la hora de navegar entre las distintas fotografías. El usuario desconoce cuántas fotografías existen.

Describe de forma precisa y detallada cómo podemos resolver el problema con el menú de navegación de fotografías siendo lo más importante la experiencia de usuario.

Solución propuesta por la IAG

Para abordar este problema de usabilidad en tu aplicación destinada a usuarios mayores de 70 años, es esencial simplificar y hacer más intuitiva la navegación por la galería de imágenes. Aquí te propongo una solución detallada que combina claridad visual con facilidad de uso:

Aumentar la visibilidad de las opciones de navegación
1. Indicadores de navegación grandes y claros.
2. Implementa flechas de navegación grandes a ambos lados de la imagen central. Estas flechas deben ser visibles sin opacar la imagen principal y tener un contraste alto con el fondo para que sean fáciles de identificar.
3. Considera usar íconos con tamaño considerable y colores contrastantes (por ejemplo, blanco sobre fondo oscuro o negro sobre fondo claro) para asegurar que sean visibles para personas con visión reducida.
Incorporar un indicador de la cantidad de fotografías.

Cambios en el diseño

Los cambios que se van a realizar en el diseño tras la propuesta de la IAG son:

1. Se colocan los botones de navegación a los lados del visualizador (fotos).
2. Se añade una etiqueta que muestre la posición actual del archivo y el número total de archivos que contiene la galería. Estos cambios se aplican a todas las secciones: fotos, vídeos, música y audios.

Problema detectado: menú de navegación (reproducir/pausar)

Problema

Este problema está relacionado con el menú de navegación. Este caso concreto trata sobre el problema que tienen los usuarios para reproducir/pausar un archivo multimedia como puede ser un vídeo, una canción o un audio.

Para resolver este problema, lo contextualizamos con una de las secciones de la aplicación: vídeos. Esta opción tiene los botones de reproducir o pausar.

Prompt

Actúa como un experto en diseño de interfaces y experiencia de usuario. En una aplicación para tablet existe una pantalla que muestra un reproductor de vídeos. Esta pantalla muestra en la parte superior un menú de navegación centrado con cuatro acciones. La primera acción sirve para ir al anterior vídeo y tiene el texto asociado: “Anterior”. La segunda opción permite pausar el vídeo y tiene el texto asociado: “Pausar”. La tercera opción permite reproducir el vídeo y tiene el texto asociado: “Reproducir”. La cuarta opción permite pasar al siguiente vídeo y tiene el texto asociado: “Siguiente”. Debajo de este menú de navegación se encuentra la zona donde se reproduce el vídeo.

Los usuarios tienen problemas para reproducir y pausar vídeos.

Describe de forma precisa y detallada cómo podemos resolver el problema recién comentado siendo lo más importante la experiencia de usuario.

Solución propuesta por la IAG

Para abordar las dificultades que las personas mayores de 70 años están enfrentando al reproducir y pausar videos en una aplicación para tablet, es crucial simplificar la interacción y hacerla lo más intuitiva posible. Aquí hay una estrategia ajustada para este grupo demográfico:

Botón de Reproducción/Pausa Único y de Gran Tamaño

Icono Universal y Tamaño Ampliado: Utilice un botón grande de reproducción/pausa que alterne entre dos estados claramente diferenciados. Por ejemplo, el ícono de un triángulo para 'Reproducir' y dos barras verticales para 'Pausar'. Este botón debe ser suficientemente grande para que sea fácilmente seleccionable por usuarios con posibles limitaciones en la destreza manual.

Simplificación y Claridad Visual.

Limitar Opciones: Elimine las opciones innecesarias y mantenga solo lo esencial en pantalla para evitar la sobrecarga de información. Por ejemplo, puede que no sea necesario tener botones separados para 'Siguiente' y 'Anterior' si los usuarios solo necesitan reproducir y pausar videos.
Feedback Visual y Auditivo: Proporcione una confirmación visual clara, como un cambio de color o un borde resaltado alrededor del botón cuando esté activo. Un sonido suave de feedback también puede ayudar a confirmar que la acción ha sido realizada.

Educación Intuitiva

Instrucciones en Pantalla: Ofrezca instrucciones breves y concisas en pantalla que expliquen cómo usar el botón. Utilice un lenguaje simple y una tipografía grande y legible. Por ejemplo, una etiqueta que diga "Toque para reproducir/pausar" puede ser de gran ayuda.

Pruebas y Formación Personalizada

Pruebas de Usabilidad Centradas en el Usuario: Realice pruebas de usabilidad específicas con el grupo demográfico objetivo para obtener comentarios directos y ajuste el diseño según sea necesario.

Soporte y Asistencia

Soporte Accesible: Asegúrese de que la ayuda esté disponible fácilmente en la aplicación para aquellos que tienen dificultades. Puede ser un botón de ayuda visible o la opción de contactar a un asistente para soporte adicional.

Al implementar estas soluciones, se atienden las necesidades específicas de usabilidad y accesibilidad para las personas mayores, quienes pueden requerir una mayor claridad visual, instrucciones simplificadas y soporte adicional para navegar por las funcionalidades digitales de una aplicación de tablet.

Cambios en el diseño Los cambios que nos propone la IAG están muy relacionados con la propuesta anterior. Los cambios aquí quedarían así:

En el menú de navegación sólo estaría el botón reproducir y pausar.

Resumen de mejoras para Rememora v3

Con las propuestas ofrecidas por la IAG se crea una nueva versión etiquetada como v3 la cual contiene los cambios vistos en apartado anteriores y que se resumen aquí:

Nueva ubicación y texto para el menú principal.
Nueva ubicación para los botones de navegación (anterior y siguiente) para todas las secciones.
Los botones de reproducir y pausar se quedan como únicos botones disponibles en la parte superior.

Métricas de la aplicación

Con los cambios propuestos por la IAG se realizan las modificaciones en la aplicación y se crea una nueva versión: v3. A continuación, se realiza una nueva prueba (P4) con 10 usuarios de la Muestra B de los cuales, 5 ya participaron en la prueba anterior (usuario 1, 2, 3, 4 y 5), y otros 5 son usuarios que participan por primera vez. Los datos obtenidos por los usuarios pueden verse en el Anexo 8 y en la siguiente tabla se recoge un resumen de esos datos.

Cuestionario de usabilidad de la aplicación

Al acabar la prueba con la aplicación, se realiza el cuestionario de usabilidad a los participantes de esta prueba P4. Los valores obtenidos se reflejan en las tablas siguientes.

Análisis de los datos obtenidos

De los resultados obtenidos de la prueba P4 y que se recogen en las tablas del apartado anterior sacamos el siguiente análisis:

Funcionalidades completadas (VAR-FUN)

Esta variable mide el número de funcionalidades completadas y no completadas. De las 8 funcionalidades que hemos medido en la prueba con la aplicación, todas han sido finalizadas por al menos un usuario. En el mejor de los casos, hay una funcionalidad que ha sido completada por el 100% de los usuarios. En el peor de los casos, hay una funcionalidad que sólo ha sido completada por el 20% de los usuarios.

Tiempo en ejecutarse las funcionalidades (VAR-TIM)

Según datos obtenidos de la tabla de resultados de la P3:

El 16% de las funcionalidades realizadas han sido completadas en un tiempo inferior a 10 segundos (poco).
El 74% de las funcionalidades realizadas han sido completadas en un tiempo superior a 10 segundos e inferior a 30 segundos (normal).
El 10% de las funcionalidades realizadas han sido completadas en un tiempo superior a 30 segundos. Nota: De las funcionalidades que no han podido ser completadas no se dispone de una clasificación basada en el tiempo.

Errores cometidos al ejecutar las funcionalidades (VAR-ERR)

Según los datos recogidos en la tabla de resultados de la P4 la funcionalidad de pausar un archivo multimedia es la que más errores provoca (3).

Usabilidad en la aplicación (VAR-TEST)

Según los datos reflejados en la tabla de resultados del cuestionario (SUS) la versión inicial o Rememora v3 el 10% de la Muestra B ha valorado positivamente la usabilidad de la aplicación y un 90% la ha valorado con una usabilidad negativa.

Variables a medir

Comparativa entre la v2 y la v3

Conclusiones

Tras el análisis de la prueba P4 entre Rememora v2 y v3 con la Muestra B se sacan las siguientes conclusiones:

La v3 ha mejorado en un 17% el número de funcionalidades completadas por los usuarios.
La v3 ha bajado en un 10% el tiempo medio que tardan los usuarios en completar las funcionalidades.
Los usuarios de la v3 han cometido menos errores (6).
El cuestionario de usabilidad evalúa con un 10% menos de usuarios que la califican con una usabilidad positiva pero aumenta ligeramente los puntos de usabilidad.

Se puede decir que Rememora v3 ha mejorado la v2.

Si valoramos los cambios producidos por la IAG para mejorar los problemas resultados tenemos que:

La nueva ubicación del botón para volver al menú principal (superior izquierda) ha mejorado la posición anterior (inferior derecha).
La nueva ubicación de los botones para avanzar y retroceder (laterales del reproductor) ha mejorado la anterior posición (superior lateral).
No se aprecian mejoras en los botones de pausar y reproducir un archivo multimedia.
La nueva etiqueta con la información sobre el número de archivos multimedia disponible ha mejorado la anterior solución (ir pasando los archivos e ir contando).