Archivo de la categoría: usabilidad

Mediamarkt escucha a sus usuarios y hace cambios en su web

Después de su estreno el pasado jueves 30 de Agosto, la web de mediamarkt ha tenido fallos y problemas que han sido comentados en las redes sociales, y que han mermado la satisfacción de los usuarios que accedían a la misma llamados por la potente campaña en televisión que dura a dia de hoy, con muchos anuncios en todas las cadenas generalistas, llamando a los usuarios a entrar en la web y comprar sus productos.

Web de Mediamarkt
Web de Mediamarkt

Despues del post que escribí el 31 de Agosto, llamado La importancia de los Tests de Usabilidad y los Beta Testers: La nueva web de Mediamarkt, y de establecerse un interesante debate sobre usabilidad en los comentarios del post, a raíz de un primer post en el Blog de Javamachine ( Media Markt: ejemplo de como NO se lanza una web ) parece ser que mis comentarios han llegado a oídos de los responsables de la web.

Mediamarkt nos ha escuchado! Parece ser que sí, ya que aparte de que ya no hay tantos comentarios negativos en las redes sociales, y se cargan todas las imágenes de los productos, he podido observar un par de cambios significativos a raíz de mi post.

En mi post comenté lo curioso que era ver 2 banners no clicables y que no tenian un link asociado, a pesar de que los banners eran de 2 servicios importantes en la funcionalidad de la web, ya que eran las preguntas frecuentes y una Guía de Compra. Los banners que vi en la web cuando escribí el post han sido cambiados por otros dos mas «marketinianos» y mas enfocados como Call to Action (CTA), llamando a la acción de hacer clic en ellos, y que esta vez si son 2 enlaces a sendos servicios.

Podemos ver el efecto de cambio que ha habido en las fichas de producto a raíz de mi post del pasado 31 de Agosto.

PAGINA DE PRODUCTO EL DIA DEL POST

Aspecto Landing Producto el dia del post
Aspecto Landing Producto el dia del post

PÁGINA DE PRODUCTO 1 DIA DESPUES DEL POST

Landing de producto con los 2 banners cambiados en el sidebar
Landing de producto con los 2 banners cambiados en el sidebar

El cambio es evidente, por lo que esta claro que los responsables de la web de mediamarkt se han hecho eco de la opinión de los usuarios de la web y se han puesto las pilas para arreglar todo lo que no estaba bien. Me alegro por ello.

El tema de los colores ya es otra guerra, en la que el color rojo debe predominar al ser el color corporativo, y la marca es lo más importante. No comparto la opinión respecto a los iconos de compartir en redes sociales, que creo que deberian mantener sus colores, especialmente los azules de facebook y twitter, que son los mas usados en las webs, y al mantener su color se hacen más visibles, y al resaltar más el usuario los puede encontrar más fácilmente, y de esta forma hay más posibilidades de que sean usados.

Iconos sociales en rojo
Iconos de redes sociales en rojo

Si la función de dichos botones es ser clicados para que los usuarios viralicen los contenidos de la web en sus perfiles sociales, no sé hasta que punto se estará consiguiendo esto, todo desde mi punto de vista con mi opinión personal, sin ánimo de ofender a nadie y a modo de reflexión personal.

Al respecto del tema de los iconos de compartir en redes sociales, con una herramienta de creación de heatmaps se podria ver si los usuarios estan haciendo clic en los botones…si se ven clics en los botones seria que el rojo no los esconde y todo va bien. Un buen test en el caso en el que no hubiesen clics seria cambiar los colores de los iconos y esperar a tener mas datos para generar un nuevo heatmap de la página. Estaria bien también analizar los clics que recibian los 2 banners anteriores vs los 2 nuevos banners del sidebar.

También se podrian hacer combinaciones de Tests A-B con Heatmaps para ver la efectividad de distintas landings a nivel de conversión y si mejora o no la tasa de clics y que zonas són las que reciben más clics, para que haciendo cambios de estructura o diseño de las landings mejoraran los distintos KPIs de la web.

La importancia de los Tests de Usabilidad y los Beta Testers: La nueva web de Mediamarkt

Hoy MediaMarkt ha anunciado a bombo y platillo que estrenan página web en la que se podran comprar todos sus productos. Durante todo el dia hemos podido ver anuncios en TV que valen una pasta, y lo primero que puedes hacer al verlos en pensar en ir a la web a ver como se ve la nueva web de Mediamarkt.

Los Problemas de la web de Mediamarkt
Los Problemas de la web de Mediamarkt

Cuando he entrado por primera vez me he encontrado con la página de mantenimietno «Estamos maquillando la nueva web, cari», por lo que me ha extrañado. Una búsqueda rapida en twitter me ha desvelado lo que estaba pasando: la web estaba fallando. Varios SEOs estaban dando cuenta de ello, publicando pequeños tests online que habian hecho en los que se veia como la web tardaba mucho en cargar, no cargaba algunas imagenes, etc.

Podemos ver como una ficha de producto tardaba 13 segundos en cargar, así como la carga de una pagina daba errores de programación. En mis tiempos de Programador en Atos Origin, en la sección de Major Events, que estuve en el equipo de Los Juegos Olímpicos de Beijing (Major Events se encarga de todo el software de los JJOO desde siempre, tambien en Londres 2012), estuve 1 mes entero dedicando todas mis horas de trabajo al testing de una de las aplicaciones de la intranet de perodistas. Alli se testeaba todo muchas veces antes de darlo por bueno.

Con esto quiero hacer hincapié en La importancia del testing de las aplicaciones antes de lanzarlas, cosa que es este caso no se ha tenido mucho en cuenta, a la vista de lo sucedido. Se tiene que hacer mucho testing antes de lanzar nada, tanto de Funcionalidad como de Usabilidad.

En el Blog de Java Real Machine han hecho un buen estudio del caso de la web de MediaMarkt y sus problemas, en un muy buen post titulado Media Markt: ejemplo de como NO se lanza una web.

Despues de tener tantos problemas, el Community Manager estaba muy ajetreado atendiendo las quejas de los usuarios cabreados, tanto en su twitter como en su facebook.

Según mi punto de vista, es muy arriesgado lanzar una campaña en television para que luego la web no cumpla con las expectativas que esta generando en los usuarios, dispuestos a entrar y comprar sus productos online desde el primer día.

Aparte de que deberian haber hecho mucho Testing Funcional para no tener fallos el dia del estreno, tambíen deberian haber hecho Tests de Usabilidad. Despues de un dia con fallos, la web esta operativa despues de haber tenido que ponerla en mantenimiento varias veces el dia de su estreno para solucionar los problemas.

Añadiendo observaciones a las hechas ya en el post de Java Real Machine, comparando 2 landings del mismo producto, entre mediamarkt y la fnac, por ejemplo, se aprecian muchas diferencias.

Estamos de acuerdo que el rojo es el color corporativo de MM, pero porque lo usan tanto? Con la cantidad de colores que usan en los anuncios de TV y en los folletos, e incluso en la pagina de mantenimiento, porque no sucede algo parecido en la web de venta de productos? Solo hay negro, blanco y rojo.

Incluso los iconos de las redes sociales son rojos, además de las migas de pan y de la opcion de puntuar con estrellitas…no seria mejor combinar mas colores? seria mas agradable a la vista, y el contraste de colores daria mas relevancia al producto…con tanto color rojo no se distinguen los botones y la funcion de cada uno.

En este caso de landing, hay una cosa que me escama. En muchas de las landings aparecen 2 banners en el sidebar, Estos banners son imágenes estáticas no clicables. Son los 2 banners de Guia de Compra y Preguntas Frecuentes…para encontrar ambas opciones hay que irse al footer…no seria mas usable que los banners fuesen links a ambos servicios?

Asimismo, tal y como se ha comentado bastante en twitter, aparecen muchas imágenes de producto que no se cargan.

Hay un gran libro de Usabilidad para Websites, de Steve Krug, que se llama Don’t Make Me Think, que trata de muchos temas de usabilidad para webs de una forma muy amena dando muchos ejemplos. Pues bien, yo creo que la idea central del libro es buenisima…en internet, una Web Usable no nos tiene que hacer pensar como interactuar con ella, tanto la navegación como la funcionalidad debe ser fácil de entender.

Si comparamos el Look&Feel usado en esta landing con la landing del mismo producto en la web de la fnac, por ejemplo…vemos muchas diferencias. Me atreveria a asegurar que cuando se hizo esta web debieron hacer sus tests de usabilidad correspondientes. Podemos ver como la combinación de colores hace mas claro que es y para que es cada link y cada botón, no hay que adivinarlo.

Si rascamos un poco podremos encontrar muchos casos como este. Hay un caso curioso de un restaurante de Barcelona que se anuncia en la radio, y a pesar de que no es TV, anunciarse en la radio no tiene que ser barato. Los anuncios de este restaurante braseria son muy graciosos, por lo que gracias a este CTA tan efectivo, te dan ganas de ir a ver su web, porque al final del anuncio en radio dicen su web. De forma muy extraña he oido muchas veces el mismo anuncio, hara como varios meses…ahora ya no tanto…lo que es bastante chocante es que despues de invertir en publicidad en radio, al ir a visitar su web te encuentras con cosas asi…la web en construcción.

ACTUALIZACIÓN

Al cabo de 1 dia d escribir este post, Mediamarkt recogió todo el feedback de sus usuarios y empezaron los cambios en la web. Entre los cambios que hizo, esta el cambio de los 2 banners a los que me refiero en este post, cambiando el banner y añadiendo un link…

Landing de producto con los 2 banners cambiados en el sidebar
Landing de producto con los 2 banners cambiados en el sidebar

Todo el cambio está bien comentado en el siguiente post que escribí, llamado Mediamarkt escucha a sus usuarios y hace cambios en su web.