Os presento mi informe de la PEC 4, de la asignatura de Dibujo y Pensamiento Visual. En ella he analizado los métodos de representación implantados en la PEC 3 (storyboard, mapa mental y blueprint), así como el servicio que se está desarrollando (clase virtual). Para el análisis hemos usado la técnica de testeo con usuarios, concretamente un testeo de guerrilla, diferenciando dos grupos de usuarios distintos (unos testeados sobre los métodos de representación y otro sobre el servicio). ¡Espero que os guste!

Os dejo por aquí mi proyecto sobre la PEC 3 de Dibujo y Pensamiento Visual. He desarrollado una investigación y análisis sobre un posible escenario en una clase online de la asignatura de matemáticas en concreto, a través de una academia online.

¡Espero que os guste!

En este post se va a analizar la plataforma web de la Universidad Internacional de Andalucía (UNIA), concretamente el espacio web del máster de Formación del Profesorado. Este máster es de modalidad semipresencial y, por tanto, esta plataforma supone una herramienta indispensable para los estudiantes del mismo.

Dentro de esta plataforma el usuario (estudiante) puede realizar las tareas de:

• Encontrar el temario, documentos e información relativa a cada una de las asignaturas que supone el curso.
• Acceder a tareas de evaluación.
• Chat/foro con estudiantes y profesores.
• Evaluaciones recibidas.
• Consulta y modificación de información personal.
• Acceso a salas virtuales.
• Soporte y ayuda al usuario.

Metodología de análisis

Para su análisis, se ha usado los 10 principios heurísticos de Nielsen, como aplicación de metodología sin usuarios en búsqueda de analizar la usabilidad de este sitio web.

El proceso consiste en conocer cada uno de los diez principios establecidos por Nielsen en 1994, sus diez heurísticas, y tras su comprensión y análisis; se aplican estos principios a la interfaz a analizar, en este caso, la plataforma de la UNIA.

A continuación, se van a desarrollar dada una de las diez heurísticas, explicando en qué se enfocan cada una de ellas y tras ello, haremos una evaluación de estos principios en la interfaz seleccionada.

1-Visibilidad del sistema

Este principio hace referencia a la capacidad de retroalimentación que ofrece la interfaz al usuario. Se basa en mostrar al usuario la información necesaria para que en cualquier momento de la navegación sepa adónde está y hacia donde tiene que ir para alcanzar su objetivo.

En el caso de la interfaz que nos ocupa, este principio se ha aplicado, pero no de la forma más óptima.

Al entra en cualquier página secundaria, como la página de una asignatura concreta, nos aparece en la parte superior un indicador de la página en la que os encontramos y todas sus sucesoras. Sin embargo, el color, tamaño, tipografía y posición que se ha usado; hace que el usuario no identifique de forma clara e inmediata este canal de retroalimentación y se pueda encontrar perdido.

2-Empate entre el sistema y el mundo real

Se basa en introducir un lenguaje familiar al usuario, usando terminologías, iconografía, estándares, etc., pertenecientes a su ambiente socio-cultural y, por tanto, sean entendidos y reconocidos por él mismo.

En nuestra interfaz sí se implementa de forma correcta y óptima la presentación del contenido. Las razones son las siguientes:

-Hay una sola opción de idioma, el español (preestablecido), ya que todos los usuarios de esta plataforma son de origen español y dominantes del castellano (las clases son impartidas en este idioma y por tanto, se da por hecho que todos los usuarios dominan este idioma, siendo su lengua materna).

-Infografía correcta: iconos conocidos por toda la comunidad.

-Archivos en formatos estandarizados de fácil lectura: pdf, doc

 

 

 

 

 

 

3-Control y libertad del usuario

Se refiere a la capacidad de la interfaz de ofrecer salidas o retrocesos inmediatos y sencillos cuando el usuario realiza una operación no deseada por equivocación, o simplemente desea deshacer algún cambio realizado.

En este caso pienso que se ha implementado de forma correcta la libertad de navegación, el usuario puede avanzar y retroceder de página de forma sencilla y libre. En ciertas tareas es cierto que no se permite el retroceso, concretamente en la entrega de actividades o realización de cuestionarios, pero al ser actividades evaluables veo correcto que no se implemente esta funcionalidad, ya que se perdería la esencia y fin de la propia evaluación (llevada a cabo por el profesorado). No obstante, si introduciría alguna ventana de observaciones en las páginas de entregas y evaluación para que el estudiante pudiese comunicar algún imprevisto o error sufrido; y tenga la oportunidad de ser valorado por sus profesores.

Dentro del desarrollo de los cuestionarios sí que nos permite avanzar y retroceder de preguntas para seleccionar la respuesta deseada, y sólo es en el último paso del proceso dónde tras haber pulsado la aceptación de entrega dónde ya no podemos hacer cambios. Aquí también se implementa de forma correcta esa libertad de navegación, permitiendo al usuario una elaboración fluida de estos test. Por último, remarco como aparecen barras de estado donde identificamos la pregunta o cuestión en la que nos encontramos, las totales, y las contestadas y no contestadas; teniendo así una visión global del estado del examen durante su realización (con un tiempo limitado indicado en forma de cuenta atrás).

Finalmente, sí que quizás implementaría la funcionalidad de cancelar el envío de un mensaje por chat, al menos en un límite de 10-20 minutos tras su envío; sobre todo porque existe la posibilidad de escribir mensajes personales y comunitarios y por tanto, el usuario se puede encontrar en el apuro de haber enviado un mensaje personal a toda la comunidad por equivocación, y tal como está implementada la web ahora no es posible de subsanar el error.

4-Consistencia y estándares

Se basa en implementar un diseño de la web que sea globalmente aceptado, es decir, que el usuario encuentre un portal de navegación que le resulte familiar. Esto se consigue usando patrones e iconografía estandarizados, distribución habitual, etc.

En el caso de la web de la UNIA pienso que sí han implementado este principio de forma correcta, puesto que no encontramos elementos desconocidos ni botones en lugares no frecuentes.

Por optimizar al máximo la web si cambiaría la disposición de la página principal, que deja oculto algunos cursos y la zona de mensajes (lo vemos cuando deslizamos hacia abajo). Pondría un mayor número de ventanas emergentes de menor tamaño a las actuales pero que permitiesen ver al usuario de un vistazo todas las zonas principales.

5-Prevención de errores

Evitar que el usuario realice tareas erróneas por confusión o desconocimiento.

En la parte de cuestionarios se informa antes de comenzarlo todas las “reglas del juego” (tiempo, intentos, etc.). Por tanto, lo veo muy correcto ya que el usuario dispone de toda la información necesaria para que no comience el test sin conocer como tiene que actuar y por tanto, no se encuentre ante dudas frecuentes durante su realización.

Sí que implementaría una notificación cuando hay tareas sin realizar y queda poco tiempo para su cierre, puesto que puede ocurrir que el usuario no la haya visualizado y no sea consciente de su presencia y, por tanto, no la realice por desconocimiento de la misma.

El resto de la web creo que tiene un buen diseño que no evoca a error.

6-Reconocimiento mejor que el recuerdo

Hacer que la página delate fácilmente la ruta que debe seguir el usuario para alcanzar su objetivo y que el usuario no tenga que así recordar como usarla, sino simplemente adentrarse en ella e ir navegando con fluidez.

En el portal que nos ocupa este análisis creo que este criterio ha sido bien implementado, puesto que es fácil navegar a través de la web gracias a que con etiquetas textuales (algunas acompañadas de iconografía para enfatizar) se ha destacado y desvelado a la ventana que nos lleva cada una de las pestañas.

 

7-Flexibilidad y eficiencia de uso

Se basa en la introducción de atajos a usar los usuarios expertos para llegar de forma más inmediata a su objetivo.

En este caso, se han implementado algunos accesos directos. Estos han sido los mostrados en la columna lateral derecha, donde podemos acceder de forma directa a las actividades más relevantes: actividades próximas, visualización de valoraciones de los profesores y chat. El resto de páginas y rutas no tienen accesos directos, pero no lo considero un punto relevante ya que la web es bastante simple y tiene funcionalidades muy concretas, por lo que tal como está diseñada presenta una buena usabilidad y las rutas son en general de pocos pasos.

8-Diseño estético y minimalista

Eliminar toda aquella información no relevante para evitar confusión sobre su importancia respecto a la verdaderamente destacable.

Este punto pienso que también se cumple ya que sólo aparecen en la página principal aquellas pestañas de las acciones más directas y relevantes que tienen como finalidad el portal. Además, dentro de cada página secundaria nos encontramos directamente todo el contenido directo que estamos buscando, de forma clara y concisa.

Al ser una web con una funcionalidad muy específica y acotada, el diseño minimalista no es muy complicado de llevar a cabo: podemos visualizar todas las acciones relevantes de forma directa sin haber información secundaria en competencia de ubicación con la primaria (realmente prácticamente toda la información que se adjunta es primaria, por lo que aparezca toda junta no afecta al minimalismo de la web).

9-Ayuda a reconocer, diagnosticar y recuperarse de errores

No debe indicarse el código de error tras sufrir uno, si no mostrar un mensaje explicativo al usuario de qué debe hacer para subsanar el error.

En este caso, si hay algún error debido a la arquitectura de la web, el buscador nos muestra un mensaje estándar donde se indica el código de error directamente. Por tanto, esto es un aspecto negativo que para solucionarlo se debería implementar una página de muestra de datos donde aparezca un mensaje explicativo de lo ocurrido y cómo debe actuar el usuario al respecto.

10-Ayuda y documentación

Aportar al usuario uno o varios enlaces a centros y páginas de ayuda para resolver los problemas que se le pueden plantear durante el uso de la web (como acceder a una determinada página, como usar una funcionalidad, etc.).

En nuestro caso, sí se aporta un espacio con pestañas de ayuda. Además, este espacio se mantiene en cualquier página, estando por tanto presente en cualquier momento y facilitando al usuario la navegación. Por tanto, este aspecto se implementa de forma correcta.

Hallazgos negativos, ¿cómo los solucionamos?

• Canal de retroalimentación poco diferenciado: aparece una barra superior con una guía de la pestaña en la que se encuentra el usuario y todas sus antecesoras, pero su estética hace que no sea lo suficientemente diferenciada. Solución: hacer una guía más completa en la que se incluyan las ventanas sucesoras también. Para mayor diferenciación introduciría el texto en un cuadro de fondo (ahora está sobre imagen), ampliaría un poco su tamaño y pondría el cuadro de fondo en transparencia en todas las ventanas sucesoras y antecesoras, y el fondo de la ventana actual lo remarcaría sin transparencia (así el usuario localiza más fácilmente donde se encuentra).

• Posibilidad de hacer una valoración o comentario ante una actividad ya entregada, para así evitar la preocupación del usuario y saturar el chat del profesor (actualmente no hay opción de deshacer o comentar tareas ya entregadas). Implantaría una ventana de comentarios bajo cada actividad (bajo el cuadro de entrega completada).
• Eliminación de mensaje en un margen de tiempo de diez minutos tras su envío, para evitar daños personales ante equivocaciones de envío de mensajes a personas incorrectas o dudas ya resueltas.
• Cambio de estructura de página principal: introduciría pestañas nuevas, incluyendo todas las asignaturas activas del momento (y eliminando las no activas), eso en la zona central. En el lado lateral incluiría una pestaña de mensajes (sin aparecer minización de mensajes actuales), pestaña de calendario y pestaña de actividades. El encabezado no lo modificaría, lo veo correcto. Así corregiríamos el problema explicado de tener que deslizar la ventana principal para ver mensajes y actividades, quedando de cierta forma ocultos y difícil de localizar por los usuarios, aún siendo una parte fundamental de esta página. Simplificaría también las asignaturas no activas para buscar mayor minimalismo de la web (reflejar exclusivamente la información más relevante en esta página principal).
• Notificación de tareas pendientes, o barra temporal de actividades; para así aumentar la retroalimentación y facilitarle al usuario la información (recordatorio constante).
• Eliminación de texto de error (ante error del sistema, se enuncia el código de error) por un mensaje más personal y un enlace a “ayuda”.

Consideraciones de la interfaz desde una perspectiva de género e inclusión

En la web a tratar considero que, el lenguaje y entorno es respetuoso e inclusivo, gracias a las herramientas expuestas, aunque se podría optimizar este aspecto.

En el apartado de datos personales, en el campo de nombre, ya que debemos introducir nuestro nombre legal y no nuestro nombre social. Desgraciadamente hay muchos usuarios que en su DNI se refleja un nombre con el que no se sienten identificados y aquí no se da la oportunidad de expresarse y poder ser identificados con el nombre que ellos mismos se identifican. Sin embargo, la web subsana esto implantando otra ventana de datos adicionales, donde ahora sí podemos introducir el nombre con el que queremos que nos llamen. Considero que el término de nombre adicional no es el más adecuado, aunque valoro la oportunidad de expresar otros nombres a sus usuarios.

Respecto al sexo, no se pregunta, así que en este aspecto veo la web inclusiva (con o sin quererlo) ya que no se hace una diferenciación de este aspecto de la persona.

Os dejo mi propuesta de diseño especulativo: Tell-work.

Un objeto tan cotidiano y común como es un bolígrafo, lo he sometido a descontextualización. He pensado varios posibles escenarios de usos alternativos con un enfoque tecnológico y futurista, así cómo una búsqueda de una herramienta de comunicación a distancia.

El resultado ha sido este producto: un objeto con forma de bolígrafo cuya función es servir de interfaz comunicativa entre un equipo de trabajo. Gracias a él, podremos eliminar las situaciones de tener simultáneamente dos equipos móviles: personal y de trabajo.

DIAGRAMAS DE FLUJO
En los diagramas de flujo adjuntos, se ha representado la secuencia de actividades que deben de realizar los usuarios representados en los escenarios desarrollados anteriormente para alcanzar sus objetivos descritos.
En todos ellos identificamos como task flow los pasos de inciar sesión, por lo que debemos invertir recursos en hacer esta etapa de interacción lo más óptima posible, adaptándose a cualquier usuario de la app. El resto de flujos pertenecen son de tipo user flows, ya que en la app se pueden realizar muchas funciones específicas no coincidentes para todos los objetivos de los usuarios.
A continuación, se adjuntan los distintos diagramas.

 

REFERENCIAS Y ANÁLISIS CRÍTICO

Se han seleccionado dos app destinadas a la visualización, búsqueda, compra y reserva de eventos musicales y artísticos; con el fin de analizarlos y evaluarlos para poder extraer información valiosa para nuestro proyecto relativa a la arquitectura que debemos buscar.

Dichas app son Evenbrite y Songkick, ambas competidoras directas entre ellas, al ser muy similares. Estas app son dos de las más populares dedicadas al entorno de eventos en la actualidad.

Para su análisis, en primer lugar hemos creado un diagrama de flujo para cada una de ellas, sobre la realización de una misma actividad: buscar un evento y comprar una entrada.

Los diagramas obtenidos, serán evaluados mediante heurísticas relativas a la interacción app-usuario y usabilidad, haciendo un análisis crítico de los mismos.

A continuación, se exponen los diagramas.

Análisis mediante heurísticas:

En cada punto exponemos una de las diez heurísticas de Nielsen, evaluando comparativamente su presencia en cada una de las apps:

• Visibilidad del estado del sistema: Songkick tiene mayor eficiencia en este punto, ya que en la página principal podemos ver los eventos añadidos de forma directa y la información está más simplificada, lo cual facilita la intuitividad de la navegación. Evenbrite expone demasiada información sin diferenciar bien grupos, por lo que supone una sobrecarga informativa para el usuario que no le permite conocer el estado actual de forma óptima. En ambas tenemos marcadores para ver en que sección estamos y son usadas óptimamente.
• Consistencia sistema-mundo real: Evenbrite usa mayor iconografía, la cuál es muy intituitiva. Songkick usa más texto, bastante escueto. Ambas n opresentan problemas de ordenamiento y expresión de la información.
• Control y libertad del usuario: El cambio de una sección a otra es directo, gracias a tener en ambas siempre presente la barra de secciones. Esto las optimiza en cuanto a la libertad de navegación, pues en cualquier momento podemos pasar a otro lugar de forma fácil y sencilla.
• Consistencia y estándares: SongKick presenta una estrucutura más consistente que Evenbrite, ya que todas sus imágenes y páginas tienen forma de cuadrículas lxl. Evenbrite, en cambio, combina estilos más distintos en cada una de sus secciones, lo cuál hace más farragosa la navegación.
• Prevención de errores: ambas incluyen mensajes y notificaciones en el inicio de sesión incorrecto (falta de dato o clave/usuario incorrecto, entre otros). Igualmente, notifica cuando se está haciendo una búsqueda de algo no registrado y avisa de eventos cancelados o con algún otro imprevisto (tras ser guardados).
• Reconocer en vez de recordar: ambos incluyen listas de búsquedas anteriores en las barras del buscador, sistema de notificaciones, sincronización con google calendar. Respecto a la nomenclatura e iconografía, usan iconos globalmente conocidos y populares, lo que facilita la navegación. En todas sus secciones incluyen barra de apoyo de las secciones disponibles, lo que nos facilita saber donde estamos y adonde podemos ir.
• Flexibilidad y eficiencia de uso: La barra de secciones supone un gran atajo visual, en ambas.
• Estética y diseño minimalista: presente en ambas, pero más eficiente en SongKick (más repetición de patrones cuadriculados y proporciones más similares entre imágenes del mismo nivel; información escueta, aunque podemos aumentar para conocer más).
• Ayuda al reconocimiento y solución de errores: ambas expresan mensajes de datos incorrectos para el inicio de sesión, imposibilidad de conectar a facebook (o spotify en Evenbrite), así como búsquedas no encontradas.
• Ayuda y documentación: ambas cuentan con secciones de ayuda en la sección del usuario. Evenbrite cuenta con una pestaña enfocada a los problemas con entradas, lo cuál es muy positivo ya que está muy ajustada a la funcionalidad de la app.

Tras el análisis profundo de webs de videollamadas con fines educativos en la PEC 3, mediante la implementación de metodologías centradas en el DCU (cuestionarios y benchmarking), hemos sintetizado la información obtenida en el Canvas presentado en la imagen adjunta. De él, concluimos los siguientes puntos a mejorar en el producto analizado, utilizado por nuestros usuarios objetivos investigados.

Vemos como el problema del trato personal sigue sin cubrirse por las plataformas actuales: ofrecen muchas herramientas de presentación de ideas y contenidos, pero sigue fallando el sentir un trato personal y cercano. Es el mayor punto a mejorar. Esto se debe a distintos hechos: no poder ver a los compañeros, no poder hacer comentarios individuales y personales, sentir sensación de una sobrexposición o intimidarse, entre otros aspectos.

Como punto fuerte y positivo, se resalta las eficientes herramientas disponibles para generar explicaciones ilustradas y apoyadas en pizarras, contenidos visuales y esquemas. El soporte técnico tampoco supone un problema, los usuarios suelen saber cómo usar estas webs y lo hacen sin dificultadas (excepto puntuales contratiempos).

 

En el desarrollo de la fase de definición y organización del etiquetado del proyecto de desarrollo de una app para el festival Mutek, hemos comenzado con una aplicación de la técnica Card Sorting abierto (al suponer un producto nuevo), cómo análisis de las estructuras mentales interiorizadas por nuestros usuarios.

Para ello, le hemos proporcionado a un grupo de seis usuarios distintos, un total de diecinueve tarjetas correspondientes a distintas informaciones que se han establecido que debe contener la plataforma. Las agrupaciones realizadas por los usuarios, así como los títulos establecidos por ellos para cada una de dichas agrupaciones, han sido analizados. Las conclusiones obtenidas de dicho análisis han sido que se diferencian tres grupos principales relativos a información sobre los eventos, las entradas y los artistas. Además, se incluye un apartado destinado a atención al cliente. Cada uno de estos grupos contiene una serie de informaciones diferenciadas relativas (en base a las estructuras de los usuarios), lo cuál reflejamos en el siguiente diagrama de árbol de contenidos. Se puntualiza que algunos contenidos muy concretos han sido cambiados de grupo, bajo criterios de diseño e interacción.