UX-O-METER #01: Netflix vs HBO vs Prime Video
Analizamos cuál de las apps top de servicio de Video on Demand es más usable
¡Bienvenidos a UX-O-METER! La nueva serie de Interactius donde nos pondremos el mono de trabajo de experto UXer y empuñaremos nuestra lupa crítica para despedazar, ¡quiero decir analizar!, la experiencia de usuario que ofrecen aquellas apps y sitios web que forman parte de nuestro hiperconectado día a día. Vamos, lo que se conoce como un case study, aquí y en la China Popular.
En este episodio piloto “UX-O-METER 01x01”, os presentamos un análisis completo de las actuales app big three en esto del VoD (Video On Demand). Sus protagonistas son tres auténticos monstruos del celuloide: Netflix, HBO y Amazon Prime Video. ¡Preparaos para disfrutar de esta nueva saga, a caballo entre el thriller y la evaluación heurística, a la vez que salpicada por tintes de tiquismiquismo y drama!
En este caso de estudio:
1. Contexto
2. Análisis
3. Veredicto
4. Referencias
1. Contexto
Que levante la mano quién NO esté enganchado a una serie, o me atrevería a decir más de una (o dos, o ¡tres!), producida o alojada en una de estas big three del audiovisual por streaming.
La realidad es aplastante. Atrás quedan esos “maravillosos” años en que Expediente X, Friends o Cuéntame (¡OH WAIT!) se recetaban semanalmente en pequeñas monodosis televisivas. No es ningún secreto que en los últimos años ha habido una auténtica revolución en la manera, el momento y la cantidad de contenido audiovisual que devoramos, sobre todo cine y televisión , desde nuestros sofás. Según un informe de Ericsson ConsumerLab, en 2020 el 50% del consumo de TV a nivel nacional se hará a través de dispositivos móviles. ¿Las razones? ¡Pues muchísimas! Entre otras, el brutal aumento de los servicios por streaming (no nos olvidemos de Rakuten TV, Filmin, Sky, Movistar+, etc.), la imparable new wave de millenials pegados a sus smartphones, la introducción de nuevas y seductoras tecnologías como la VR, la creciente (y en cierta medida preocupante) moda por ser un “seriófilo” nivel DIOS, y sobre todo, la innegable apuesta por los contenidos de calidad.
“A día de hoy las series tienen la misma calidad de producción que una película. Actores, directores, guionistas y productores del cine, muchos de ellos de Oscar, se han ido al mundo de la televisión porque el trabajo a nivel creativo es muy interesante” afirma Vera Pereira, directora de Fox en España y Portugal.
En este sentido, nos encontramos en un momento donde los grandes compiten por ver quién presenta el “fichaje galáctico” de la temporada. Netflix facturando joyas como churros: Narcos, Stranger Things o Black Mirror; HBO y sus pesos pesados: Juego de Tronos, The Wire o The Sopranos; y Amazon Prime Video picando piedra con American Gods, The man in the high castle o Jack Ryan. La guerra está servida, ¡y nosotros encantadísimos oye!
OK, todo esto está muy bien, pero para nosotros el contenido audiovisual no lo es todo. Para ver quién sale victorioso de esta batalla competitiva, hay otras variables que se deben analizar: como por ejemplo la usabilidad, la experiencia de usuario y el diseño de sus respectivas apps móviles. ¿Palomitas, sofá y mantita listos?¡Empecemos! 🍿 🎥
2. Análisis
El siguiente análisis se ha hecho para dispositivos smartphone Android y está dividido según las pantallas principales de las 3 apps. Para cada una de ellas se resumirán los principales puntos fuertes ( ✅), mejorables (⚠️) y flacos (❌), tomando como referencia algunos de los “10 Principios Heurísticos de J. Nielsen” que ya trabajamos en pasadas publicaciones.
Login
Netflix
- ✅ Pantalla de autenticación muy simple e intuitiva. La acción de focus sobre los inputs vacíos es muy evidente, iluminando el campo en cuestión y haciendo el label más pequeño. Por otro lado, ¡Genial el uso de la funcionalidad a prueba de “dedos choriceros”: el ya extendido botón de mostrar/ocultar contraseña! Además, a medida que se va escribiendo se muestra en una fracción de segundo la última letra tecleada. Chapeau.
- ⚠️ El botón de Sign In aparentemente es perfecto, ofrece un botón gigante perfectamente pulsable y es consistente con la línea de diseño de toda la app. Sin embargo, teniendo en cuenta que la mayoría de usuarios navega con su dedo pulgar, la reachability puede resultar un poco complicada.
- ❌ Esa primera pantalla de landing comercial con el acceso al login escondido en la topbar, un poco cortarollos ¿no? Seguramente la mayoría de usuarios ya viene con la cuenta creada y pagada desde su versión desktop. ¡Vayamos al grano señor@s de Netflix!
- ❌ Es perfecto que se informe el origen de error al validar el formulario, indicando si lo que falla es el correo o la contraseña. ¿Pero hace falta hacerlo dos veces, y más aún, con un pop-up que no viene a cuento?
HBO
- ✅ La acción de focus de los inputs también es muy evidente, diseño consistente utilizando el color corporativo tanto en esta pantalla como en la de “Ayuda”, muy buena reachability del botón de “Iniciar sesión”, mega-útil la funcionalidad de mostrar/ocultar la contraseña y genial la autovalidación del formulario a medida que se escribe.
- ❌ ¿Hay algo que moleste más que un error de autenticación que no te diga en qué estás fallando? ¡Si! Que el mensaje de error desaparezca al cabo de unos segundos y deje al usuario huérfano de feedback ¡ Así no HBO!
Prime Video
- ✅ ¡Bravo! Al igual que lo hace Netflix, por fin una solución que ayuda a los usuarios desmemoriados a saber dónde están fallando. Muy buena manera de recuperarse de un error.
- ⚠️ Lo dicho, el recurso del botón mostrar/ocultar contraseña es utilísimo, pero no se si hacerlo mediante un checkbox es la mejor manera….
- ❌ ¿Señor@s de Amazon, no creéis que tener un single-sign-on para todas tus apps (market incluido) no es un poco liado? Yo venía aquí a ver series, no a comprar productos de la otra app…
- ❌ En cuanto al diseño, otra vez las misma piedra, mucha saturación de elementos, estética justita y demasiados enlaces y poco foco en lo importante: ¡autenticarse!
Perfiles y Onboarding
Netflix
- ✅ Una de las bondades de Netflix es la posibilidad de compartir una cuenta con los diferentes miembros de tu “““familia””” (ehem…) para poder tener listas de favoritos personalizadas y disfrutar de los contenidos a distintos ritmos. En este sentido, la pantalla que aparece después del login ofrece un menú de selección de perfiles muy visual y fácil de utilizar, con botones bien grandes y una buena reachability.
- ❌ ¡Vaya! Con lo bien que habíamos empezado… Ni rastro de ningún sistema de onboarding o tutorial para guiar a los first time users (los novatos, vamos) en sus primeros compases con la aplicación. Intentaremos darles un voto de confianza en base a aquella máxima de Martin Leblanc: “Una UI es como un chiste, si se tiene que explicar es que no es buena”.
HBO
- ✅ ¡Bingo! La app de HBO es la única que ofrece una experiencia de acompañamiento completa. Primero permiten que el usuario seleccione por “dónde quiere empezar” y después van apareciendo pequeñas píldoras que instruyen brevemente cómo interaccionar con los distintos elementos de la UI.
- ⚠️ Por poner alguna pega, ¿habiendo tanto espacio en pantalla por qué poner el menú de selección de perfiles tan arriba? ¡Bad reachability strikes again!
Prime Video
- ❌ Suspenso total para la app de Prime Video. Ni ofrecen la posibilidad de compartir una cuenta mediante perfiles distintos, ni una sección protegida especialmente dedicada a contenidos infantiles, ni un sistema de acompañamiento para usuarios primerizos.
Homepage
Netflix
- ✅ Netflix apuesta claramente por una página principal simple a la vez que vistosa donde el principal protagonista es un banner que ocupa dos tercios del viewport y anuncia los últimos estrenos. Por otro lado ofrece dos tipos de menús, uno exclusivo de la home en la parte superior y otro fijo para toda la aplicación.
- ✅ A medida que se hace scroll, debajo del banner principal van apareciendo una serie de bloques que agrupan los contenidos (tanto series como películas) en carruseles según géneros, recomendaciones personalizadas, favoritos, etc. El listado tiene una longitud razonable en comparación con los de las otras apps, los cuales son kilométricos e infumables. ¡Pensemos en la eficiencia de los usuarios!
- ❌ ¡Eso mismo deberíamos aplicar a la longitud de los carruseles de recomendaciones! En lugar de poner un aperitivo con 10–20 títulos destacados y una pantalla de “Ver más”, los señor@s de Netflix han creído oportuno vomitarte todos los thrillers que tienen en cartera. ¿Quién va a estar haciendo swipe lateral ad eternum?
- ✅ ¡Genial! Cuando la app detecta que te encuentras en la misma wi-fi que otro dispositivo al que hacer broadcasting, aparece un icono permanente en la esquina inferior para iniciar la proyección. Buen detalle pensar desde un principio en los usuarios que ven los contenidos en una Smart TV o bien a través de Chromecast.
HBO
- ❌ ¿Pero qué caos es este? La página principal de la app de HBO es un quiero y no puedo. Presenta una especie de banner a camino entre un collage y un carrusel, que se confunde muy fácilmente con el resto de galerías inferiores. La sensación de agobio se agrava con el uso de mayúsculas en los títulos de la secciones. ¡Recordemos: menos es más!
- ❌ ¡Cuenta la leyenda que alguien llegó al final de la página principal de la app de HBO…y para más inri, sin la ayuda de un indicador de scroll!
- ✅ Para maquillar un poco este acoso y derribo, resulta muy útil que aparezca un indicador de progreso horizontal a medida que se va haciendo scroll lateral en las galerías (ahora si y antes no, ¿por qué?). Todo lo que sea dar feedback y visibilidad del estado del sistema a nuestro usuario es una victoria.
Prime Video
- ✅ La app de Prime Video es muy resultadista en su página principal. Sin ser ninguna maravilla visual presenta un muy buen equilibrio entre el banner y las galerías de contenidos.
- ✅ El banner principal presenta 10 contenidos destacados en un carrusel de navegación circular. Buena idea utilizar la clásica y eficaz solución del indicador de bullets.
- ✅ Esta es la única aplicación de las tres que presenta solo una pequeña selección de contenidos en las distintas galerías (20 elementos). Mediante el botón de “Ver más” se pueden consultar en otra pantalla el resto de películas o series. Bravo por no agobiar al usuario con demasiada información desde el minuto cero.
- ⚠️ Como punto de mejora, debería haber consistencia en la manera que se muestran los thumbnails de los distintos contenidos. Unos son rectangulares y otros cuadrados, sin ningún criterio aparente.
Navegación
Netflix
- ✅ La app de Netflix presenta, a mi entender, el sistema de navegación más completo y práctico de las tres. Presenta dos tipos de menús principales: uno exclusivo para la home situado en la parte superior del banner y destinado a filtrar los contenidos según sean películas, series o favoritos; y otro, presente en toda la aplicación y fijado en la parte inferior donde se pueden acceder a otras funcionalidades como un “Buscador”, “Próximos estrenos”, “Descargas” y “Más acciones”. ¡Un “ole tu” bien grande para Netflix por unirse a la (necesaria) tendencia de diseñar apps con un bottom-menu, pensando de nuevo en la reachability y el extendido uso one-handed de los smartphones!.
- ✅ Dentro del menú superior existe un segundo sub-menú (ver imagen) que permite filtrar los contenidos por géneros. Brillante y usable manera de diseñar lo que aparentemente parecía un simple dropdown. ¡Aprovechemos todo el alto de pantalla y hagamos que los enlaces sean fácilmente clicables!
- ⚠️ Aunque sea de lejos la app con más funcionalidades, la pantalla de “Más” resulta ser un auténtico cajón de sastre donde han mezclado funcionalidades secundarias como la gestión de perfiles, notificaciones, ajustes, ayuda, etc., de una manera un tanto inconsistente. Además, el hecho de utilizar un icono de burger para esta sección puede llegar a ser confuso, ya que el usuario puede esperar encontrar un menú principal de contenidos y no uno de acciones secundarias.
HBO
- ❌ ¡La sensación de desamparo en la aplicación de HBO es total! Han creído oportuno solamente facilitar un menú inferior (OK buen tanto) con cuatro opciones: “Home”, “Kids”, “Mi lista” y “Buscador”. ¡Y ya está! ¿Dónde puedo filtrar los contenidos, ver los próximos estrenos, hacer ajustes, consultar mi cuenta, hacer logout etc.? ¡Ah OK!, parece ser que hay un botón en la parte superior de “Más opciones” (▪️▪️▪)… ¡BOOM! ¿En serio solo aparece un desplegable con UNA sola opción de “Cerrar sesión”? (ver imagen).
- ✅ Como único punto positivo, encuentro genial el hecho de facilitar un menú carrusel destinado a los más pequeños de la casa formado por los principales personajes de la series infantiles . ¡Esto es el diseño centrado en el usuario!(Ver imagen inferior).
Prime Video
- ⚠️ Como siempre, los señor@s de Amazon aprobando el examen, pero sin nota. En este caso apuestan por utilizar dos tipos de sistemas de navegación: una serie de pestañas en la parte superior de la pantalla principal para filtrar los contenidos entre si son series, películas o para niños; y un menú principal perenne a toda la app que se abre/contrae mediante un botón de burger y que presenta enlaces a contenidos y funcionalidades secundarias. En principio la solución es resultona, pero ¿Por qué tener duplicidad de acciones en ambos menú? ¿Por qué no pasarse a la moda del bottom menu? ¡Vamos Prime Video que hay margen de mejora!
Ficha serie/película
Probablemente esta pantalla sea una de las más importantes de este tipo de aplicaciones, o al menos la más trajinada en el día a día de un seriófilo. Ya que es dónde se eligen los contenidos a reproducir, se comprueba el estado de avance de una serie o se stalkean las futuras víctimas (“¿Uff, en serio 8 temporadas Walking Dead?”).
Netflix
- En el caso de Netflix la pantalla está bastante poblada de contenidos: un banner muy visual en la parte superior, sinopsis e información técnica de la serie, botones de acción tipo para “Añadir a mi lista”, “Calificar” y “Compartir”; y un sistema de pestañas donde por un lado se listan los episodios de cada temporada y por el otro se recomiendan contenidos adicionales como tráilers o series parecidas.
- ✅ ¡Bravo por ese de botón de play en medio del banner pensado para aquellos usuarios expertos que van por faena y quieren reanudar la serie por el capítulo en el que se habían quedado!
- ✅ ¡Buena consistencia! El listado de temporadas de una serie se muestra del mismo modo que el sub-menú de géneros hablado anteriormente: mediante un dropdown a toda pantalla.
- ✅ Los episodios de cada temporada se despliegan en un listado vertical scrollable con la siguiente información: su número y título, un thumbnail del fotograma y una barra de progreso de por donde va la reproducción, una breve sinopsis, un botón de descarga y un botón para reproducir ese capítulo en concreto. Como ahora se verá, es la app que más aprovecha el espacio en este sentido.
HBO
- La aplicación de HBO presenta una pantalla con un sistema de navegación totalmente diferente al de Netflix. En lugar de tener una sola pantalla base donde se navega entre temporadas mediante un desplegable, en este caso hay tantas pestañas como temporadas tenga la serie.
- ⚠️ El sistema de pestañas puede parecer a priori una muy buena solución, y más cuando mediante el swipe lateral se puede navegar entre ellas. Sin embargo cuando una serie tiene muchas temporadas, esta interacción de scrolling secuencial puede llegar a ser un poco drama.
- ✅ Tal y como hacen el resto de apps competidoras, utilísima la inclusión de una barra de progreso para cada episodio y un botón de “Seguir viendo” en la página principal. ¡No hay tiempo que perder en esto de ventilarse series!
- ❌ Mientras Netflix hacía muy bien los deberes aprovechando todo el ancho de pantalla para mostrar TODA la información de cada episodio, HBO nos presenta un grid con dos capítulos por línea y solamente un thumbnail y título. ¿En serio tenemos que entrar en la ficha de un capítulo para darle al play? ¡Por favor ahorremos clics (taps en este caso) al usuario!
- ❌ En mi opinión, HBO da demasiada importancia a la información y ficha técnica de la producción. Primero, mostrando una sola pestaña de sinopsis de la serie (¡pestaña principal!), y después añadiendo un buen espacio de sinopsis particulares para cada temporada. ¿Quién se atreve a leer un resumen posiblemente plagado de spoilers?
Prime Video
- La aplicación de Prime Video tiene una estructura de pantalla muy parecida a la de Netflix. Primeramente se muestra la información técnica de la serie y después a través de un desplegable se navega a través de los correspondientes episodios según temporada.
- ❌ Seguimos con lo mismo que en la mayoría de pantallas anteriores. El planteamiento estructural es genial, pero la ejecución resulta ser una amalgama de botones, elementos e información apelotonada con un diseño muy pobre. ¡Señor@s de Amazon, a cuidar la jerarquía visual y a priorizar los elementos importantes!
- ⚠️ Es curioso que esta app sea la única que no ofrezca en ninguna de sus pantallas la opción de volver atrás mediante un botón colocado en la esquina superior izquierda. Es cierto que en móviles Android al disponer de una barra de navegación de serie, esta funcionalidad no hace falta. Pero no estaría de más incorporarla.
- ✅ Genial el hecho de ofrecer todos los capítulos de una serie en un listado vertical aprovechando todo el ancho de pantalla. Y más genial aún la navegación entre temporadas a través de un despleglable, tal y como hace Netflix.
- ❌ Sin embargo, ¡no todo es oro lo que reluce! ¿Por qué teniendo bastante espacio horizontal en la zona de capítulo, se decide prescindir de sus thumbnails de fotogramas? ¿Por qué la sinopsis del capítulo tiene que forzar que aparezcan molestos acordeones?
Reproductor
¡Por fin! ¡Después de tanta pantalla, filtro y menú, llegamos al punto más importante: el de ver la dichosa película o serie! En este sentido, solo se ha analizado el reproductor de vídeo que aparece cuando se reproducen los contenidos en el propio dispositivo móvil, y no emitiendo el contenido por ejemplo a una televisión.
A destacar que las tres aplicaciones muestran un diseño y estructura muy parecidos en esta pantalla.
Netflix
- ✅ Cuando se hace tap sobre la pantalla en medio de una reproducción, aparecen por unos segundos una serie de controles. De nuevo (¡oh, sorpresa!), la app de Netflix es la que ofrece más posibilidades del trio analizado.
- ✅ Es la única que muestra el título completo del episodio en la parte superior. Aunque un seriófilo seguramente se encuentre cómodo con la famosa convención de la abreviación de “temporada-capítulo” (ej. ‘S01X01'), no está de más informar siempre al usuario de dónde se encuentra.
- ✅ Tanto el dropdown de episodios (botón de “Episodes”), como la posibilidad de saltar al siguiente capítulo (botón “Next episode”), son una excelente herramienta para aquellos usuarios expertos (y seguramente enganchados) que buscan un atajo directo a su siguiente dosis.
- ✅ “- ¿Dónde nos habíamos quedado?¿Aquí o más adelante? -¡NO! ¡Te has pasado!” Esta situación tan común se resuelve con los fabulosos botones de avanzar/retroceder 10 segundos. Tanto Netflix como Prime Video lo incorporan en la misma línea que el botón de play/pause. Bravo por pensar en la eficiencia del usuario.
- ✅ En relación con lo anterior, otra vez la dupla Netflix-Prime Video, ofrece la posibilidad de ver un thumbnail de un fotograma concreto si se hace drag encima del control (la bolita) de reproducción. ¡Utilísimo!
- ❌ No tan útil, y de forma incompresinble, es el hecho de solo disponer del tiempo que le queda a la reproducción. ¿Por qué no tenemos el tiempo parcial y total como lo hacen las otras aplicaciones? ¡Cuánta más información tenga el usuario, mejor!
HBO
- ❌ Vayamos al grano: ni botones de salto de episodio, ni botones para avanzar/retroceder unos segundos, ni título del episodio, ni previsualización de los fotogramas. ¿Tanto cuesta? ¡Estamos en la pantalla más importante de todas!
- ✅ ¡Existe alguna esperanza! Bien por permitir volver a la pantalla anterior con una flecha (recordemos que estamos con el móvil en landscape y quizás no sepamos donde está el botón atrás de Android), bien por mostrar el tiempo parcial/total de reproducción y muy bien por mostrar los controles de audio y subtítulos en una sola pantalla (y no como Netlfix que usa un sistema de pestañas).
Prime Video
- ❌ A pesar de ofrecer la mayoría de buenas features anteriormente comentadas, de nuevo el servicio de Amazon se queda a medias. Incomprensibles muchas de las decisiones tomadas: título de capítulo gigante y truncado, botón de cerrar video escondido, botón de zoom que no funciona, selección de idioma mediante un modal con un molesto iframe con scroll, etc.
- ✅ Muy interesante la opción de “Omitir intro“ que aparece al comenzar un capítulo de una serie, dándole así control y libertad total al usuario. ¡Maravillosa opción contra los cliffhangers!
- ✅ X-Ray es la joya de la corona de la aplicación de Prime Video. Se trata del servicio que proporciona información contextual en tiempo real de una serie o película a través de la base de datos del monstruo IMBD. En otras palabras, te muestra en la esquina superior izquierda (para mi gusto demasiada solapación de elementos) qué actores y actrices están apareciendo en un momento concreto de una escena. Se acabó el “¿-Mmmm en que otra peli salía este tío?” Absolutamente brutal. ¡Shut up and take my money!
3. Veredicto
Si hablamos desde el punto de vista de la calidad y variedad de los contenidos que ofrecen Netflix, HBO y Prime Video, podríamos estar horas y horas debatiendo con una birra en la mano cuál es mejor que la otra, ¡o mejor aún!, sobre si el policía de Stranger Things se parece a Lluís Homar, o si la resurrección de Jon Snow es un auténtico fraude.
Sin embargo, si tomamos todos los puntos analizados anteriormente sería un auténtico escándalo no afirmar que la aplicación que ofrece mejor experiencia de usuario es la de Netflix. Sin lugar a duda es la app más completa y atractiva de las tres. Ofreciendo un muy buen balance entre diseño visual y experiencia de uso rápida e intuitiva. Las otras dos competidoras son buenas apps, pero muestran algunas carencias que hacen que no puedan jugar en la misma liga que Netflix. A continuación adjunto una breve ficha resumen de los puntos fuertes y débiles de cada una.
Trabajos futuros
Como acciones futuras para exprimir aún más este case study sería muy interesante analizar cómo se comportan las tres aplicaciones en otros contextos de uso, como por ejemplo cuando se emiten los contenidos en un televisor a través del Chromecast o bien directamente a través de la propia Smart TV.
Por otro lado también sería muy enriquecedor someter a las apps a un test de usabilidad con eyetracking, y así obtener información cualitativa que nos diga qué puntos de la pantalla llaman más o menos la atención al usuario. Por ejemplo en la siguiente captura se pueden observar los resultados obtenidos en un test de prueba sobre la aplicación desktop de Netflix, donde se preguntaba a los usuarios cómo harían para guardarse un episodio en su lista de favoritos (botón “Mi lista”).
¡I want you to UX-O-METER!
¿Qué os ha parecido este caso de estudio ?¿Estáis de acuerdo con el veredicto? ¿Qué pain points de vuestra vida de seriófilo añadiríais? Os animo a que hagáis vuestros propios UX-O-METER’s a otras apps del sector, con otros dispositivos (¡iPhone please!) y con otros ojos críticos ¡Alucinaréis con la cantidad de UX-mini-dramas que hay escondidos en las aplicaciones de nuestro día a día! Por nuestra parte seguiremos recopilándolos en futuras entregas de la saga UX-O-METER. Stay tuned!
Sígueme en:
