Como parte del ejercicio de prototipado, presento a continuación el wireframe de una de las páginas de marca.com.
Esta herramienta permite visualizar cómo se distribuyen los elementos en pantalla y cómo se estructura la interacción del usuario con el contenido.
En este caso, he trabajado sobre la página principal, destacando los componentes clave y su jerarquía dentro del diseño actual del sitio. Se trata de un prototipo de baja fidelidad.
Adjunto el enlace al wireframe
En este post realizaremos un análisis heurístico de la interfaz de la página web de Twitch. Twitch es una plataforma de transmisión en vivo y video bajo demanda, conocida principalmente por sus transmisiones de videojuegos, pero también por otros tipos de contenido como música, arte y charlas. Debido a su naturaleza interactiva y dinámica, la usabilidad de la interfaz es fundamental para garantizar una experiencia fluida para los usuarios. Aplicaremos los principios heurísticos de Jakob Nielsen para evaluar su usabilidad.
Para realizar este análisis, hemos seguido los siguientes pasos:
Ejemplo positivo: Cuando se está transmitiendo un video en vivo, Twitch muestra un indicador claro de que el video está en directo, y una barra de progreso con la duración de la transmisión.
Ejemplo negativo: A veces, al cambiar de calidad de video, no se muestra claramente que la calidad se ha actualizado hasta que el video comienza a cargarse de nuevo.
Propuesta de mejora: Implementar una confirmación visual inmediata (como un pequeño icono o mensaje) que indique que la calidad de video ha sido cambiada.
Ejemplo positivo: Los menús y las categorías en Twitch están claramente etiquetados con nombres familiares y fáciles de entender, como «Juegos», «Música» y «Charlas».
Ejemplo negativo:Twitch utiliza una moneda virtual llamada «Bits» para que los espectadores puedan donar a los streamers. Sin embargo, la plataforma no deja clara la equivalencia entre Bits y dinero real en todo momento. Los usuarios deben buscar información externa o hacer cálculos manuales para entender cuánto están realmente donando.
Propuesta de mejora: Mostrar de manera clara y visible la conversión de Bits a dinero real en la interfaz antes de la compra o al realizar una donación, para que los usuarios comprendan exactamente cuánto están gastando y cuánto recibe el streamer.
Ejemplo positivo: Twitch permite a los usuarios pausar, adelantar y retroceder en los videos de transmisión bajo demanda, lo que les da total control sobre su experiencia de visualización.
Ejemplo negativo: En la plataforma de Twitch, cuando un usuario se encuentra navegando por contenido en vivo, no hay una forma sencilla de retroceder o saltar hacia el inicio de una transmisión en vivo si se ha perdido el comienzo, lo que limita la libertad de navegar. No hay una barra para iniciar la transmisión desde el principio.
Propuesta de mejora: Ofrecer una opción de retroceso en transmisiones en vivo o una función de «retransmisión» para que los usuarios puedan acceder al contenido desde el inicio si lo desean.
Ejemplo positivo: El diseño de la barra lateral y el reproductor de video sigue convenciones de plataformas de video, como YouTube, lo que facilita la adaptación del usuario.
Ejemplo negativo: Las opciones de configuración del perfil están distribuidas de manera inconsistente en el menú de usuario. A veces se encuentran en un lugar diferente dependiendo de si el usuario está en su canal, en el menú de «ajustes» o en la página principal.
Propuesta de mejora: Unificar el acceso a las configuraciones de usuario en un solo menú para que los usuarios no se pierdan buscando las opciones de personalización.
Ejemplo positivo: Twitch muestra advertencias claras cuando un usuario intenta realizar una acción no permitida, como interactuar con un canal restringido.
Ejemplo negativo: Al hacer clic en el chat de un canal sin estar conectado, no siempre hay un mensaje claro que informe al usuario de que debe iniciar sesión para participar.
Propuesta de mejora: Incluir un mensaje emergente o un texto en el chat para informar al usuario de que debe iniciar sesión para interactuar.
Ejemplo positivo: Los videos que el usuario ha visto recientemente están fácilmente accesibles desde su página de inicio, lo que permite un acceso rápido sin tener que recordarlos.
Ejemplo negativo: Cuando un usuario visita un canal que sigue, no siempre es evidente si está en vivo o si hay nuevos videos disponibles, lo que puede generar confusión.
Propuesta de mejora: Colocar un indicador visual más destacado que indique si un canal está transmitiendo en vivo o si hay nuevo contenido en el canal.
Ejemplo positivo: Twitch ofrece varias opciones de interacción para usuarios avanzados, como atajos de teclado para controlar el reproductor, y ajustes rápidos para cambiar la calidad del video.
Ejemplo negativo: En muchos casos, los espectadores solo pueden ver un stream en la calidad que el streamer ha configurado (por ejemplo, 1080p), sin opciones para reducir la resolución si tienen una conexión lenta. Esto limita la accesibilidad y la experiencia del usuario, ya que algunos pueden experimentar lag o buffering constante sin una alternativa para ajustar la calidad manualmente.
Propuesta de mejora: Permitir que todos los usuarios puedan elegir entre varias opciones de calidad de video, independientemente de si el streamer es afiliado o partner, asegurando una mejor experiencia para aquellos con conexiones más lentas.
Ejemplo positivo: El diseño de la interfaz es limpio y visualmente agradable, con un fondo oscuro que facilita la visualización del contenido sin distracciones.
Ejemplo negativo: En Twitch, los anuncios aparecen de forma automática durante los streams sin previo aviso, lo que interrumpe el contenido en momentos clave. A diferencia de otras plataformas que permiten «picture-in-picture» o pausas estratégicas, en Twitch el usuario pierde completamente lo que está ocurriendo en el stream durante la duración del anuncio. Esto puede ser especialmente frustrante en transmisiones de eSports o momentos importantes en los juegos.
Propuesta de mejora: Implementar un sistema de previsualización del anuncio donde los usuarios sean informados de cuándo se reproducirá un anuncio, permitir que los anuncios sean menos intrusivos, como una opción de «picture-in-picture», donde el stream continúe en una esquina mientras se muestra la publicidad, dar más control a los streamers para decidir cuándo insertar anuncios sin afectar la experiencia del espectador.
Ejemplo positivo: Si la transmisión no se carga correctamente, Twitch proporciona mensajes claros que explican que el video no está disponible o que hay un problema con la conexión.
Ejemplo negativo: Cuando un error de conexión o buffering ocurre, no siempre se ofrece información sobre la causa del problema, lo que puede dejar a los usuarios confundidos.
Propuesta de mejora: Proveer mensajes de error detallados, como información sobre la calidad de la conexión o la disponibilidad del servidor, y pasos sugeridos para corregir el problema.
Ejemplo positivo: Twitch tiene una sección de preguntas frecuentes y soporte técnico accesible desde su página de ayuda.
Ejemplo negativo: La ayuda no está fácilmente accesible desde todas las páginas de la plataforma. Por ejemplo, al ver una transmisión en vivo o cuando se navega por el chat, no hay un acceso rápido a la sección de ayuda..
Propuesta de mejora: Incluir un acceso rápido a la documentación de ayuda desde todas las páginas de Twitch, tal vez en el menú de usuario o en la barra lateral.
El análisis heurístico de Twitch ha revelado tanto puntos fuertes como áreas de mejora. La plataforma ya ofrece una gran experiencia para la mayoría de los usuarios, pero algunos aspectos, como la falta de retroceso en transmisiones en vivo y la configuración dispersa, pueden mejorar significativamente la usabilidad. Implementando las propuestas de mejora, Twitch podría ofrecer una experiencia aún más fluida y accesible para su gran base de usuarios.
Hola a todos, os presento un escenario del usuario Marc y su user journey. He elegido este escenario porque considero que es una situación cotidiana para una investigador y profesor de universidad, y pone en gran valor la usabilidad de la aplicación para móvil de la Biblioteca de Catalunya.
A continuación presento el user journey asociado al escenario:
Espero que os guste, un saludo.
Jessica Valdés.
Una experiencia que realizo a diario es ir al trabajo al hospital. Voy en mi propio automóvil, aparco en el parking público del hospital, ficho la entrada, enciendo el ordenador, mientras tanto escucho los mensajes del contestador que hayan podido dejar en el turno de noche, abro el correo, contesto a los mensajes importantes, abro los programas que utilizo e imprimo los registros diarios.
2. Actualización de equipo informático.
Pública (Esta publicación se ha generado automáticamente y la puede ver todo el mundo)
¡Hola!
si lees esto es que ya tienes activado tu propio Folio, el portafolio con tecnología WordPress donde podrás publicar no sólo todo lo que quieras sobre ti y tus proyectos propios sino también las PECs y actividades de tus asignaturas a lo largo de los estudios.
Te invitamos a explorarlo ya personalizarlo tanto como quieras para hacértelo tuyo.
Este es un espacio de trabajo personal de un/a estudiante de la Universitat Oberta de Catalunya. Cualquier contenido publicado en este espacio es responsabilidad de su autor/a.