Diseñando productos digitales accesibles para móvil

Desde siempre en el estudio hemos abogado por diseñar para todo tipo de personas y tipo de dispositivos, es decir, por un diseño más inclusivo y accesible.

Allá por 2007 ya hablábamos por aquí de accesibilidad y las buenas prácticas para la web móvil. Nueve años después, seguimos a vueltas con este tema en las nuevas aplicaciones para dispositivos móviles, ya sean tabletas con una pantalla mediana o móviles con una pantalla pequeña.

Captura de pantalla 2016-08-29 a las 10.21.28
Captura de la web de la Prueba de optimización de Google probando el blog del estudio

Como ya hemos comentado en otras ocasiones, habitualmente se cometen los mismos errores en el diseño móvil. En el caso de la accesibilidad, también. Por ese motivo es fundamental concienciar a los fabricantes de dispositivos móviles pero también a los desarrolladores de aplicaciones. Es necesario que tengan en cuenta los criterios de accesibilidad y usabilidad en sus productos con el fin de que sean accesibles para todo tipo de personas.

Accesibilidad en iOS

En este aspecto, Apple tiene más trabajado este aspecto, ya que la herramienta que utilizan para analizar la accesibilidad está integrada en XCode, el entorno de desarrollo para iOS, y la accesibilidad forma parte de su guía de desarrollo. Podemos usar la herramienta Accesibility Inspector para comprobar la accesibilidad de nuestra aplicación. Entre otros motivos, esta herramienta explica por qué las aplicaciones en iOS parecen menos confusas que en Android. Otra herramienta que puede usarse en XCode es el Accessibility Verifier, una herramienta que te permite comprobar algunos aspectos de accesibilidad.

En cualquier caso, después de pasar estas validaciones automáticas es recomendable hacer las pertinentes pruebas con VoiceOver en el emulador de XCode, para conseguir una audio-descripción de los contenidos que tenemos en pantalla y asegurar que no existen problemas de entendimiento.

Como referencia para conocer estas herramientas y ampliar conocimientos en este entorno, os recomendamos esta guía rápida para verificar accesibilidad en aplicaciones iOS.

Accesibilidad en Android

Desde hace un tiempo, Google está elaborando herramientas y guías gratuitas, para que tanto desarrolladores como otro tipo de personas relacionadas con lo digital, para mejorar los productos digitales en dispositivos móviles a través de iniciativas como Think With Google.

Desde el principio, Google ha apostado por fomentar aspectos de accesibilidad en los dispositivos móviles. Por ejemplo, apostando porque los sitios con una buena adaptación a dispositivos móviles puntuaran mejor en su algoritmo y aparecieran destacados en los resultados del buscador. Algo que parece que han eliminado con la creciente adaptación de todos los sitios web a dispositivos móviles, porque no hemos encontrado ningún resultado resaltado y tampoco hemos encontrado que hayan eliminado ese resaltado). Además, Google lanzó una herramienta online para comprobar si nuestro sitio web (comercio electrónico, blog o web personal) cumple los criterios que Google considera una buena web móvil. Lo ha llamado “Prueba de optimización para móviles”, con ella podemos comprobar si nuestro sitio cumple o no.

En Android publicaron a principios de año una herramienta similar a Accessibility Inspector, llamada Accessibility Scanner. Esta herramienta permite realizar un validación automática de accesibilidad para aplicaciones Android. Su objetivo es analizar las carencias de una aplicación móvil y proporcionar un listado de posibles acciones que ayuden a mejorar la accesibilidad de esa aplicación. No de forma exhaustiva ni para verificar el cumplimiento de estándares, pero ayuda a identificar y mejorar algunos aspectos de forma ágil.

En Android la accesibilidad también forma parte de la guía de desarrollo, con pautas de diseño para que los desarrolladores puedan seguir y conseguir una app más accesible.  Algunos de estos consejos son:

  • Añade textos descriptivos a todos los elementos del interfaz de tu aplicación.
  • Asegúrate que los campos o botones de la app se pueden acceder y escribir en ellos con un trackball, un pad direccional (físico o virtual) o mediante gestos.
  • Asegúrate que los avisos auditivos tienen su contraparte visual en forma de notificación o aviso visual para los usuarios sordos o con pérdidas de audición.
  • Prueba la app usando TalkBack (el asistente de voz de Android)  y Explore by Touch (otra opción de accesibilidad de Android)

Os recomendamos hojear y conocer estas guías y herramientas que, sin duda, os ayudarán a diseñar y desarrollar aplicaciones móviles más accesibles para todo tipo de personas.

Por supuesto, estas aplicaciones son útiles, pero no suficientes porque no pueden sustituir un análisis experto con pruebas en profundidad de accesibilidad. Pero sirve como herramienta de base para desarrolladores de aplicaciones y diseñadores, facilitando la identificación de posibles problemas de forma rápida.

En Torresburriel Estudio estamos especializados a diseñar y realizar tests con usuarios para diferentes productos o servicios digitales, dependiendo de los objetivos del proyecto. Contacta ahora con nosotros y hablamos :-).

Alineación de estrategias multicanal en El Corte Inglés

Uno de los aspectos más importantes para una empresa que trabaja en entorno multicanal es ofrecer una experiencia de usuario homogénea. De hecho, es una primera cuestión que siempre hay que plantear cuando abordamos un diseño de UX para un cliente.

El Corte Ingles - estrategia multicanal - tienda, web y movil
Captura de un catálogo digital de El Corte Inglés, extraída de elcorteingles.es

Hoy queremos retomar el tema de estrategia multicanal, analizando la comunicación que sigue una gran empresa en todos sus canales off y online. Por su tamaño y la diversidad de campañas que realiza en distintos medios, utilizaremos El Corte Inglés como ejemplo de análisis.

Contexto

El Corte Inglés (ECI) es una gran empresa que, en sus 75 años de historia, ha diversificado su cartera de negocio notablemente. De hecho, podemos comprobar que tiene un catálogo de productos muy amplio, junto con una gran variedad de servicios diferentes. Tener una cartera de negocio diversificada puede plantear un reto en la estrategia de comunicación, así que como ejemplo a analizar es perfecto. Eso sí, podemos comprobar que cuenta con un producto destacado, que más se centra en comunicar a través de todos los medios posibles: su negocio tradicional de moda. La gran mayoría de los anuncios que realiza a través de televisión, prensa, radio, cartelería, etc. tienen su foco en este ámbito.

Idealmente, el objetivo de una estrategia de comunicación multicanal alineada en los diferentes medios es que nuestros usuarios vean lo mismo estén en el medio en el que estén, a fin de facilitar su conversión. Por ejemplo, un usuario está paseando por la calle y puede cruzarse con un elemento publicitario de una nueva campaña. Accede desde su teléfono a la página web móvil para informarse. Lo ideal es que esta campaña también esté destacada para que el usuario pueda encontrarla fácil y rápidamente. Y lo mismo sucede con el resto de canales.

Si queremos potenciar una campaña, es necesario mantener una línea coherente en cualquier medio. Por supuesto, puede haber casos donde sea mejor tener estrategias diferenciadas por canal. Dependerá del objetivo que se pretenda conseguir, aunque hoy no trataremos este tema.

Dicho esto, nos centraremos en analizar algunas campañas de comunicación multicanal que están llevando a cabo actualmente en los diferentes medios. Así podremos comprobar si la experiencia del cliente es homogénea y se mantiene esa consistencia y continuidad.

Tiendas físicas

Estos son los carteles publicitarios que hemos encontrado estos días dentro de las propias tiendas de El Corte Inglés. Claramente, sus objetivos de comunicación dentro de tienda están centrados en reforzar el remate final de la campaña de rebajas, que finaliza el 31 de agosto. También hay una campaña transversal para comunicar su 75 aniversario.

El Corte Ingles - estrategia multicanal - Carteles tiendas fisicas
Fotografías tomadas en tiendas El Corte Inglés

En el caso de la publicidad fuera de tienda, el objetivo es ligeramente diferente. A continuación podéis ver el enorme cartel que aparece en la fachada del Centro Comercial Grancasa, de Zaragoza. En este caso, la comunicación está centrada en presentar la nueva colección de moda femenina aunque sin olvidar su aniversario, que aparece en un discreto segundo plano.

El Corte Ingles - estrategia multicanal - Cartel exterior gran tamaño
Fotografía tomada en el exterior del Centro Comercial Grancasa (Zaragoza)

Catálogos comerciales digitales y físicos

A continuación analizaremos los catálogos comerciales. En la siguiente imagen podéis ver los últimos catálogos que han publicado. Se pueden hojear y descargar en la sección de Catálogos digitales de su web.

El Corte Ingles - estrategia multicanal - Catalogos digitales
Captura extraída de elcorteingles.es sobre sus catálogos digitales

Aunque todos los catálogos son descargables, en el establecimiento físico sólo pudimos encontrar los dos últimos catálogos en papel. Ambos correspondían a la campaña de Vuelta al cole. Además, estaban en un departamento totalmente diferente al que corresponde según ese tipo de producto. Algo destacable es que esos dos catálogos en papel tienen formatos muy diferenciados, posiblemente por ir destinados a un público objetivo diferente. En este medio no centran la comunicación en un producto o sección destacado (moda), sino que desarrollan catálogos mucho más segmentados. La segmentación es por campañas o secciones de la tienda física: moda y material escolar para la vuelta al cole, electrónica, rebajas en hogar, moda, etc.

En cuanto a los catálogos digitales, cabe destacar una buena integración entre canales que lleva a cabo. Efectivamente, el catálogo digital no es solamente un documento PDF. La experiencia de uso es similar a leer un catálogo en papel, con un formato que permite hojearlo. Pero, además, también integran de forma transparente la navegación dentro del propio catálogo, incorporando enlaces directos a las fichas de producto de la tienda online. Una buena decisión de diseño que ayuda a mantener la continuidad.

Sitio web / Tienda online

En la página principal de su sitio web lo más destacado es el remate final de las rebajas. Esta decisión está alineada con la comunicación en las tiendas físicas. Además, segmentan esta campaña de rebajas en moda por tipo de perfil y por los productos principales, facilitando al usuario el acceso a la información que más pueda interesarle.

El Corte Ingles - estrategia multicanal - Home destacado 1
Captura de la página principal de elcorteingles.es (1 de 3)

En segundo lugar, muestran las rebajas de distintos tipos de productos, con secciones destacadas para el público femenino (bolsos, carteras, lencería, sandalias).

El Corte Ingles - estrategia multicanal - Home destacado 2
Captura de la página principal de elcorteingles.es (2 de 3)

Finalmente, se encuentra la campaña de Vuelta al cole, segmentando por tipo de producto (informática, deportes, mochilas y moda).

El Corte Ingles - estrategia multicanal - Home destacado 3
Captura de la página principal de elcorteingles.es (3 de 3)

De modo que, a pesar de los múltiples tipos de productos y servicios disponibles en elcorteingles.es, en su página principal también se han centrado en las dos campañas vigentes (rebajas y vuelta al cole), como en otros canales.

Canal de Youtube

En cuanto a su canal de Youtube, podemos comentar varios aspectos. Para empezar, se trata de un canal generalista donde comunican temas muy diversos. Hacen una segmentación por temática: moda, supermercado, tecnología, deportes, hogar, etc.

En cuanto a los contenidos destacados, el foco está sobre el vídeo promocional de las rebajas de verano, su campaña destacada en este momento. Sin embargo, para destacar su segunda campaña vigente (Vuelta al cole) utilizan el recurso de la imagen de portada. En cuanto a su aniversario, utilizan la foto de perfil para maximizar esa comunicación sin más intrusiones al usuario.

El Corte Ingles - estrategia multicanal - YouTube
Captura extraída del canal de Youtube de El Corte Inglés

Y en la sección de vídeos, podemos ver que actualmente los esfuerzos van destinados a promocionar la nueva campaña de “Vuelta al cole”.

El Corte Ingles - estrategia multicanal - YouTube ultimos videos
Captura extraída del canal de Youtube de El Corte Inglés

Facebook / Twitter

En otras redes sociales generalistas, en concreto Facebook y Twitter, podemos comprobar que siguen la misma estrategia de comunicación que en Youtube. La única diferencia que hemos podido comprobar es que utilizan una cuenta de Twitter @elcorteinglesMN para moda masculina, con mensajes más segmentados a ese público objetivo.

Se trata también de canales donde se tratan temáticas muy diversos. Destacan su segunda campaña vigente, Vuelta al cole, utilizando el recurso de la imagen de portada. Y en cuanto a su aniversario, de nuevo utilizan la foto de perfil como recurso.

El Corte Ingles - estrategia multicanal - Facebook
Captura extraída de la página de Facebook de El Corte Inglés

El Corte Ingles - estrategia multicanal - Twitter
Captura extraída de la cuenta de Twitter de El Corte Inglés

Aplicaciones móviles

Para nuestra sorpresa, aquí hay diferencias sustanciales con el resto de canales. Las aplicaciones móviles de ECI siguen una estrategia totalmente diferente, e incluso parecen perseguir unos objetivos distintos.

El Corte Ingles - estrategia multicanal - Apps
Captura extraída de la sección de descargas de aplicaciones en la página web

En la imagen podemos ver que cuentan con una sección de descargas. Hay disponibles cinco aplicaciones para iPhone y Android, y tres de ellas para iPad, destinadas a las siguientes temáticas:

  • Supermercado de El Corte Inglés.
  • Catálogos digitales, para consulta.
  • Información sobre dos centros de El Corte Inglés: Castellana, en Madrid, y Diagonal, en Barcelona.
  • Catálogo de juguetes de ECI y juegos para niños, que ayuda a elaborar listas de regalos pero no incluye venta online.
  • Tagus, para lectura de libros electrónicos.

Sólo la primera aplicación permite la compra de productos de tienda, y sobre una sección concreta: el supermercado. Aparentemente, el canal móvil no es una prioridad para ECI, que centra sus esfuerzos de comunicación y venta en otros canales. Resulta chocante, por ejemplo, que ninguna aplicación esté enfocada a la venta online de moda, como ocurre en el resto de canales.

Conclusiones

En ECI disponen de una estrategia de comunicación multicanal que mantiene cierta coherencia de conjunto. Funcionan sobre la base de campañas y existe solapamiento de varias de ellas, aunque siempre hay una destacada. En este momento, su campaña destacada es el remate final de rebajas, que finaliza el próximo 31 de agosto. En segundo lugar, centran la comunicación en la siguiente campaña que, por fechas, será la campaña de Vuelta al cole. Y, por último, anuncian el 75 aniversario de ECI, ya que es un evento presente durante todo el año 2016, pero que ya potenciaron durante los meses anteriores.

Se puede comprobar que la moda es el principal segmento de venta de El Corte Inglés y, por ello, es el producto más visible en las campañas que realiza en todos los medios en los que se encuentra la empresa, a excepción de en las aplicaciones móviles. En lo relativo a redes sociales, la mayoría de sus canales son generalistas y ofrecen poca segmentación de contenidos.

Es muy destacable la continuidad que han conseguido entre el catálogo en formato digital y la tienda online. Incorporando enlaces directos a las fichas de producto de la tienda online, lo que facilita una integración transparente al usuario.

En el caso del entorno móvil, la estrategia está menos enfocada en venta y muestra una segmentación completamente distinta. Esta decisión pierde una buena oportunidad porque una batería de aplicaciones tan sesgada y segmentada impide que un usuario descargue una aplicación con un catálogo amplio de productos, que pueda personalizar según sus preferencias y realizar compras en la tienda online.

En Torresburriel Estudio trabajamos los procesos de diseño de producto digital para lograr los objetivos definidos junto con nuestros clientes. Si quieres que exploremos la posibilidad de optimizar tu producto digital contacta con nosotros ahora mismo para conocer tu proyecto.

Diseño de producto físico y digital

Hoy vamos a hablar sobre el diseño de producto desde una perspectiva diferente, más personal. Para los que no me conocéis, estudié Diseño de producto en el ámbito industrial. Después de varios años trabajando como freelance en el diseño de productos físicos, empecé a trabajar en el sector digital.

Quienes trabajamos en disciplinas creativas aplicamos el diseño como medio para buscar una solución en nuestro campo. Un diseñador de producto en el ámbito industrial, como es mi caso, trabaja la conceptualización de un objeto desde una idea. Y lo hace según una metodología que comienza con la detección de un problema o necesidad y termina con la construcción de una solución a dicho problema.

Diseño de producto físico y digital
Foto extraida de Pixabay

El diseño de producto físico sigue una metodología definida, donde la fase de investigación tiene un gran peso. En esta fase inicial es importante investigar sobre posibilidades de los materiales, colores, formas y tendencias, que deberemos llevar a prototipos en papel o en una herramienta 3D. Esta metodología es análoga para realizar una investigación y análisis de las necesidades y expectativas de los usuarios en un ámbito digital, que se concretará en sketches, wireframes o mockups con interacción.

Al conceptualizar un objeto se abarcan muchos campos diferentes y todos ellos desconocidos, dependiendo de la tipología del proyecto. Esto obliga a mantener una actitud de aprendizaje continuo. Supongamos, por ejemplo, el diseño de un mobiliario ecológico. El diseñador necesitará investigar sobre la ergonomía del cuerpo, pero también prototipar en materiales renovables o reciclados y que respeten el medio ambiente. En cambio, si el producto es un juguete infantil, el campo de investigación cambiará completamente. Habrá que respetar unas normativas de seguridad por edad, peligrosidad o materiales del juguete. Las empresas de fabricación de ambos productos son distintas y tienen unas características técnicas que no pueden pasarse por alto y que no tiene por qué conocer el diseñador.

Por ello, en la fase de producción y fabricación del prototipo físico también es de gran importancia la colaboración con especialistas que nos ofrezcan una opinión más acertada respecto a los materiales más adecuados. Pero, en sus diferencias, digamos que la metodología del diseño físico y del diseño digital no son tan diferentes en cuanto a fases y al rigor necesario para aplicar esa metodología. Incluso podrían llegar a ser complementarias.

Comparativa de metodología de trabajo en diseño de producto físico y digital

Cuando me introduje en el mundo digital enfocado a la experiencia de usuario, descubrí un mundo donde en vez de hablar de materiales o formas, se hablaba de dispositivos móviles, interfaces y terminología técnica. Ámbito con el que no estaba familiarizada, pero donde sí era posible aplicar mis conocimientos de diseño de producto físico al mundo digital. Pese a las diferencias entre ambas, existe cierta complementariedad entre las dos disciplinas.

Existen fases similares, pero con algunas diferencias en su proceso de trabajo entre el diseño de producto físico y digital:

  • El desarrollo y descarte de ideas es similar en ambas, utilizando diferentes técnicas de creatividad.
  • En ambos casos, la investigación es crucial para determinar los objetivos del producto, quiénes serán sus usuarios y cuáles son sus necesidades y expectativas respecto a ese producto. Quizá sea una disciplina mucho más extendida en el caso de los productos físicos, donde aspectos como los materiales, especificaciones de ergonomía, formas o normativas legales pueden condicionar definitivamente el proyecto.
  • En los primeros prototipos, el proceso difiere. En un entorno digital, trabajaremos desde el prototipo (sketch) en papel hasta el mockup, pasando por los wireframes. En el mundo físico, también abarcamos un prototipo o boceto en papel o herramienta digital (CAD, Illustrator, Rhinoceros, etc) pero, dependiendo del proyecto, puede abarcar incluso una primera maqueta real del producto, que llamamos primer prototipo funcional. Estas maquetas pueden tener variaciones y permiten la experimentación con distintos materiales.
  • Algo también diferente es el proceso de pruebas con usuarios durante el proceso. Por cuestiones de coste, no es habitual que  haya pruebas con usuarios reales en la etapa de prototipado, sino que es la experiencia de expertos (ingenieros, diseñadores, fabricantes de materiales, etc.) la que determina lo que es factible y qué alternativa funcionará mejor. Algo que en entorno digital se plantea de una forma distinta, porque las pruebas son fundamentales a lo largo de todo el proceso de trabajo
  • Finalmente, los entregables del proyecto. Por supuesto, el proceso de diseño de producto físico puede acabar en un diseño digital en 3D. Pero es muy habitual que el proceso termine en la fabricación de una unidad para las pruebas finales y, en función de esos resultados, decidir la fabricación final de una tirada que se comercializará.

Al margen de la preocupación por satisfacer las necesidades del proyecto, un profesional del diseño en cualquier ámbito debe estar al día en las tendencias de diseño. Y eso no excluye otros aspectos de base como la psicología del color, iconografía o retoque fotográfico. Ese “fondo de armario” no solo es recomendable, sino necesario. Sin embargo, cuando nos decantamos por un ámbito, podemos caer en la tentación de centrarnos en una metodología o técnica concreta. En mi opinión, es un error olvidar esos fundamentos, a la vez que nos enriquecemos con prácticas y experiencias de otras disciplinas.

En definitiva, ¿porqué no beneficiarnos de lo mejor de ambos mundos para obtener mejores resultados? Podemos reutilizar lo aprendido siempre que las características del proyecto nos lo permitan. Y, además, saber aplicarlo en el trabajo diario, lo que nos ayudará a marcar la diferencia y obtener mejores resultados.

En Torresburriel Estudio desarrollamos las capacidades técnicas de tu equipo en temas de diseño de producto digital, a través de nuestros cursos online y presenciales. Contacta con nosotros, y cuéntanos tus necesidades.

Entender la madurez del cliente en proyectos de UX

Hemos comentado que el papel de la experiencia de usuario en las organizaciones es cada vez más estratégico. Muchas empresas ya perciben la UX como un medio para mejorar sus objetivos comerciales, reforzar su diferenciación de marca y lograr una mejor experiencia de cliente.

El diseñador de UX conoce perfectamente (o debería) que se trata de una práctica holística, integral. Intervienen muchas disciplinas e impacta en múltiples áreas del negocio. Pero la realidad es que la UX resulta compleja y puede ser difícil de valorar fuera del rol o el ámbito del diseño.

Madurez del cliente: brocha gorda o pincel finoFotografía de Francisca Ulloa

Como sabemos, entender al usuario final es un aspecto crítico en cualquier proyecto de UX. La forma en que entendemos su contexto determina en buena parte la calidad del resultado de diseño. Del mismo modo, en UX es fundamental entender y adaptarse al “contexto” durante el proceso de trabajo con nuestro cliente. Al inicio del proyecto, puede ser crítico conocer qué nivel de madurez tiene: qué enfoque tiene hacia la experiencia del usuario y cómo la aborda.

Entender y adaptarse al nivel de madurez del cliente

Comprender ese nivel de madurez es un primer paso para abordar y proporcionar enfoques que mejoren UX. Las organizaciones suelen ir evolucionando, en un proceso que va desde la hostilidad inicial a la confianza generalizada en las metodologías de diseño centrado en el usuario.

El tamaño y tipo de cliente también puede tener una influencia capital en el resultado. Nuestro trabajo puede variar significativamente si trabajamos con una empresa tradicional alejada del diseño y la tecnología, una empresa tecnológica, o una startup. Cada una tiene su contexto, con ventajas y desventajas. En empresas tradicionales, por ejemplo, es probable que necesitemos abordar el proyecto con un cierto nivel de cautela. Completamente distinto a una empresa más joven o con un enfoque más tecnológico. En otros casos, la UX puede estar insuficientemente valorada, por esa hostilidad inicial que comentábamos o por la segura resistencia al cambio.

Por supuesto, el diablo está siempre en los detalles. El diseño y la UX pueden transformar las organizaciones pero no olvidemos que hablamos de cambio. Como tal, habrá resistencias y conseguir esa consolidación puede llevar un periodo largo de tiempo. Si ese cambio afecta a la cultura estaremos, sin duda, ante un cambio de mayor complejidad. Los cambios se producen a través de las personas, y estaremos apuntando hacia una nueva organización y forma de hacer las cosas.

En definitiva, la madurez en UX se asemeja a una orquesta. Demuestra un esfuerzo de equipo que necesita coordinación y mucha práctica para una ejecución cada vez más afinada.

Casi siempre una buena estrategia de trabajo es conseguir pequeñas victorias lo más rápido posible y comunicarlas a todos los implicados. Aplicar cambios incrementales donde el cliente vea rápidamente la relación coste vs. beneficio. Al entender el contexto, seremos capaces de aprovechar mejor las inercias y poner en marcha esos cambios con la mínima fuerza posible. Aprovechar el viento a favor, si lo hay.

En un proceso de transformación las cosas siempre empeoran antes de mejorar. Para ver resultados, también hay que tener un margen suficiente de paciencia. Es necesario superar la etapa de estrés que generará nuestro trabajo, mientras se consolida ese cambio que permita nuevamente un equilibrio.

En Torresburriel Estudio apoyamos el rediseño de tu producto digital, con un proyecto de acompañamiento donde aplicamos metodologías de diseño centrado en el usuario. Contacta con nosotros, y cuéntanos tu proyecto. Te enviaremos una propuesta adaptada a tus necesidades y presupuesto.

Entrevista a Ismael Monzón, alumno del curso de diseño de Producto

Como algunos ya sabréis, el pasado mes de junio lanzamos la primera edición del curso online de Diseño de producto de nuestra marca de formación UX Learn, que fue todo un éxito.

Por ello, el 12 de septiembre empezamos la 2ª edición, así que el próximo lunes 29 de agosto abriremos inscripciones en la página de UX Learn.

Diseño de producto
Captura extraída de la página web de nuestro curso online de Diseño de producto.

Si te interesa formarte en diseño de productos digitales y quieres conocer qué opinan nuestros alumnos sobre este curso, no te pierdas la entrevista que realizamos a Ismael Monzón (@imonzon), Responsable de Proyectos Web y antiguo alumno de nuestro curso online de Diseño de producto y de nuestra formación presencial de usabilidad y experiencia de usuario.

1. ¿Qué motivos te llevaron a inscribirte en el curso de Diseño de Producto?

Hace unos años asistí a un taller presencial de usabilidad que impartió Daniel y lo que aprendí me ha resultado muy útil. Cuando vi la información del curso de Diseño de Producto pensé que podía ser interesante ampliar los conocimientos que ya tenía así como profundizar en una metodología de trabajo contrastada por vuestro trabajo en el estudio.

El hecho de tener que desarrollar un proyecto de forma obligatoria y recibir el feedback correspondiente también supuso un aliciente. Me resulta más fácil interiorizar el aprendizaje de forma práctica que únicamente con contenidos teóricos.

2. ¿Qué opinas del contenido del curso? ¿Te parece un contenido adaptado a las exigencias del mercado?

Para mí, combinar teoría y práctica supone un acierto. Por un lado, los apuntes y las lecturas recomendadas permiten conocer la base; por el otro, durante el desarrollo del proyecto es donde asimilas ese conocimiento. Me ha gustado porque es una forma de poder practicar con “red de seguridad” antes de aplicarlo a un proyecto real o de mayor envergadura.

La estructura del curso también resulta útil, tanto si eres especialista o más polivalente. La división por módulos para cada una de las etapas ayuda a tener una visión global de todo el proceso, pero al mismo tiempo también permite que puedas profundizar en un área determinada (definición del proyecto, diseño de interacción, gestión de proyectos…) si esa es tu especialidad.

3. El curso de DP es muy amplio y abarca desde la idea de producto hasta el lanzamiento y mejora del producto una vez lanzado, ¿qué fases del proceso encajan mejor en tu trabajo diario?

Últimamente estoy bastante centrado en el tema de las métricas, analizando cómo funcionan las webs de la empresa en la que trabajo. Con la información que obtenemos tratamos de optimizarlas, desarrollando nuevas funcionalidades y solucionando los problemas que encontramos.

Por otra parte, he trabajado en varios side projects (aunque han acabado pronto por falta de tiempo). Sigo teniendo el interés en trabajar en este tipo de proyectos, ya que me permite conocer cosas diferentes a las que hago en mi día a día. Lógicamente, aplicaré lo aprendido en el curso en el próximo que participe.

4. ¿Cómo aplicas los conocimientos que adquiriste en tu ámbito profesional?

Como comentaba, actualmente estamos centrados en la optimización de las webs de la empresa en la que trabajo. A partir de los datos que obtenemos, suelo trabajar en la definición de nuevas funcionalidades, desarrollando las historias de usuario y elaborando documentos de especificaciones para el equipo de IT. En ocasiones puntuales también hago wireframes y mockups, así como test de usuarios de guerrilla.

5. ¿La metodología online de UX Learn te facilitó el estudio? ¿Cómo describirías la experiencia de “estudiar a tu ritmo”?

Que el curso fuera online fue decisivo para inscribirme, ya que sabía que lo podría compatibilizar con mi trabajo y vida personal. No obstante, creo que en cualquier formación (online o presencial) el grado de aprovechamiento depende mucho del interés que tengas.

El factor “estudiar a tu ritmo” requiere una motivación que a veces resulta complicado encontrar. Cuando lees que tienes que dedicar 65 horas puedes pensar que al ser online serán menos… pero si quieres aprovechar todos los contenidos y trabajar a fondo en el proyecto, realmente son algunas más. Eso sí, cuentas con la ventaja de poder organizarte como prefieras y sin necesidad de depender de unos horarios fijos, algo que siempre ayuda a encontrar un hueco para dedicarle al curso.

6. Si fueras el profesor, ¿qué modificaciones harías sobre el curso?

La parte de contenidos es muy completa y no haría cambios, aunque podría estar bien favorecer la interacción entre los alumnos con la creación de debates o correcciones “peer to peer” (además de las del profesor). Pienso que esta parte es donde la formación presencial tiene ventaja y sería una forma de reducirla.

Aunque durante el curso vas “con la lengua fuera”, contrastar ideas sobre metodología, formas de resolver problemas, etc. con personas con perfiles distintos al tuyo (conocimientos, experiencia, sector en el que trabajan) siempre es interesante.

7. Como profesional del sector, ¿qué importancia le das al Diseño de Producto en entornos digitales?

Creo que es algo fundamental si quieres conseguir que tu proyecto tenga éxito. Poco a poco va cobrando la importancia que merece, aunque pienso que se ha avanzado más en las etapas de la construcción del producto (por ejemplo, trabajando con wireframes o aplicando metodologías ágiles como Scrum) que en la parte de definición.

Por ejemplo, son muchos los proyectos de ecommerce que empiezan preguntando por la tecnología para montar la tienda online en lugar de plantear una propuesta de valor y hacer números para comprobar la viabilidad. Iniciar el proceso definiendo qué problema vas a solucionar, a qué clientes te diriges, cómo vas a medir si funciona o no… así como validar esas hipótesis con usuarios es un aspecto clave para evitar desperdiciar tiempo y recursos construyendo un mal producto que llevará el proyecto al fracaso.

No olvides que la semana que viene abrimos el plazo de inscripción de las 20 plazas de la 2ª edición del curso online de Diseño de producto. Puedes dejarnos tu dirección de correo aquí para que te avisemos en cuanto abramos inscripciones.

Análisis de la web de LaLiga

Ya ha comenzado el Campeonato de Liga 2016-17, y hoy vamos a analizar la página web oficial de LaLiga. Esta web fue presentada hace pocos meses y en su comunicado oficial  la propia Liga de Fútbol Profesional hacía énfasis en algunos aspectos del rediseño:

Con un aspecto muy remodelado y un interfaz mucho más intuitivo, la nueva web de LaLiga expone innovación y vanguardismo a partes iguales. La categorización del contenido estará clasificada en distintas pestañas que te ayudarán a encontrar la información que estás buscando. Las noticias, los reportajes y las entrevistas ahora los observarás organizados en diferentes niveles y las imágenes tomarán un papel mucho más protagonista del que tenían hasta el momento. Además, podrás disfrutar con todos los datos de los jugadores y los equipos con las estadísticas oficiales de LaLiga.

Así que hoy vamos a analizarla para ver si cumple las expectativas que el comunicado transmitía de hacer una mejor web para los aficionados, analizando la página principal del sitio.

Captura de pantalla 2016-08-18 a las 11.40.21

Página principal

El primer vistazo descubre una web compleja, con un diseño moderno y muy ambiciosa en cuanto a contenidos. Incluye tanto información institucional y relacionada con la Liga de Fútbol Profesional (LFP) como información de actualidad de equipos de Primera División (noticias, horarios de partidos, resultados, clasificaciones, etc), Segunda División y la competición de Liga Femenina, así como otras competiciones no organizadas por la LFP como Champions League, Europa League, Supercopa de España y Europa o Mundial de Clubes.

Este alcance de contenidos encaja muy bien con su objetivo de convertirse en referente en todo lo relacionado con fútbol profesional en España, incluyendo estadísticas de las competiciones. Sin embargo, quizá se echa de menos una arquitectura de información y organización de páginas más segmentadas, puesto que se ponen al mismo nivel la competición de Primera División (que ahora se denomina LaLiga Santander, por su patrocinador), que acapara la mayor parte de la atención del aficionado, con otras competiciones de menor alcance mediático.

Precisamente esta gran amplitud de contenidos sin mayor segmentación que el menú de navegación resulta en una estructura general de página principal algo caótica, puesto que el visitante que accede por primera vez puede ver menús que se repiten (ver apartado Navegación), además de un carrusel de grandes dimensiones que ocupa buena parte del espacio visible sin hacer scroll.

El logotipo de la página incluye un tagline en inglés “The Best Together” (“Lo mejor, juntos”), lo que, sin duda, ayuda a crear imagen de marca internacional. El diseño pivota sobre tarjetas que funcionan como contenedores. Se trata de un método muy flexible, que aligera lo estético y a la vez permite ordenar bien el contenido, con la intención de comunicar la información al usuario de una manera muy tranquila, sin estridencias y de forma clara.

Algo que creemos que es mejorable es que las redes sociales no aparecen en este espacio visible, y es necesario buscarlas en el pie de página, con iconos en blanco y negro que tampoco ayudan a destacarlas. Un aspecto que, en una web de la dimensión mediática de LaLiga, debería haberse tenido en cuenta. Todo ello, por supuesto, suponiendo que sea un elemento nuclear de su estrategia online, que no lo sabemos.

El widget con información en tiempo real de LaLiga está bien diseñado y resulta de gran utilidad para seguir en directo la actualidad de los partidos. Quizá echamos en falta la posibilidad de embeberlo en otras webs para que ese contenido se viralice con más facilidad.

Desde el punto de vista de accesibilidad, podemos ver a simple vista que el uso del color puede resultar confuso para personas con deficiencias en la percepción visual. Por ejemplo, en los colores de los gráficos de estadísticas. Por ese motivo, hemos usado una herramienta como Examinator, que nos ofrece una puntuación de accesibilidad. La web de LaLiga saca un aprobado justo (5,3 sobre 10), lo que resulta sorprendente en una página de este alcance global y en una competición tan seguida por millones de aficionados.

Barra de noticias destacadas

En la parte superior, la web incluye una barra de noticias destacadas, que van pasando de forma similar a un teletipo de un canal de noticias. Esta solución de diseño puede resultar muy útil para seguir en tiempo real la actualidad de los partidos. En el estudio vemos preferible adoptar una solución similar que evite la animación, dando la opción al usuario de navegar por la noticias si así lo desea. Esto ahorraría recursos y, además, evitaría distracciones innecesarias.

Además, en el momento de redactar este post sólo hay una noticia destacada, que aparece repetida múltiples veces, algo que ayuda a generar confusión.

Navegación

La web tiene varios menús de navegación, en concreto cuatro menús diferentes. Hay un preheader que incluye información relacionada con LaLiga, un menú principal (sticky cuando hacemos scroll), un menú de navegación para las noticias (debajo del carrusel de imágenes) y, finalmente, un menú en el pie de página. Los tres primeros son visibles sin hacer scroll.

Sobre todo, es confuso para un visitante entender que LaLiga Santander es la Primera División española, mientras que LaLiga 1|2|3 es la Segunda División. Además, en el caso del menú de navegación de noticias, se utilizan los mismos rotulados y logotipos para hacer el filtrado de noticias por competición, lo que genera cierta confusión en la navegación.

Carrusel

La web de LaLiga utiliza un carrusel para mostrar las noticias más destacadas. La utilización de carruseles tienen muchas implicaciones desde el punto de la usabilidad. En el caso de LaLiga, no pasa automáticamente (algo poco recomendable) pero incorpora demasiados elementos (recomendable un máximo de cinco), lo que esconde buena parte de la información que contiene.

En lo relativo al diseño visual, el contenido de la imagen activa del carrusel es estrecho y no ocupa todo el espacio disponible, por lo que a simple vista parece un espacio desaprovechado.

Localización

Aparte del idioma por defecto (castellano), la web de LaLiga muestra contenido en inglés. Apostar por una página web internacionalizada es una buena decisión para reforzar la estrategia de posicionamiento de una competición con este alcance..

Por alcance, también podría haberse abordado otros idiomas con gran afición a los equipos españoles, como el árabe o el chino. La cantidad de anunciantes de estas zonas en camisetas de los equipos da una idea del alcance que tiene LaLiga en lugares como Oriente Medio o Asia. Por lo tanto, una localización en chino y árabe sería recomendable para un mejor posicionamiento al público de esos países. Suponemos que será un desarrollo a medio plazo que, sin duda, redundará en mejorar su imagen en todo el mundo.

Web móvil

También hemos analizado la versión móvil de este sitio web. Algo que resulta desconcertante es que, usando el mismo móvil pero diferentes navegadores, el menú hamburguesa desplegable se comporta de maneras completamente diferentes. En un caso (Chrome), se desplaza con el contenido y en otro caso (navegador basado en Webkit), debes llegar al final del contenido de la página para conseguir el desplazamiento vertical del menú desplegable. Además, el menú no se superpone sobre el contenido sino que lo desplaza a la derecha, lo que obliga a volver arriba al icono del menú hamburguesa para ocultar el menú y seguir navegando.

En este caso, el contenido se adapta mejor que en la versión escritorio a la disposición de pantalla del dispositivo móvil. Las imágenes del carrusel se adaptan perfectamente a la disposición de página, tanto en horizontal como en vertical. Las redes sociales aparecen destacadas en el menú principal, más visibles que en el caso de escritorio.

Conclusiones

En definitiva, un buen trabajo de gestión de rediseño y contenidos pero con algunos aspectos mejorables en usabilidad y accesibilidad que, sin duda, mejorarían sensiblemente la experiencia de un aficionado que busca información de actualidad de LaLiga española.

En una web como esta hay que cuidar tanto la calidad de la información que se muestra como el acceso a ella. Si cuidamos ambas, el usuario tendrá una experiencia agradable que al final creará un hábito en él, lo que permitirá que un sitio web como éste se posicione como referencia de los aficionados, tanto españoles como extranjeros.

John Maeda, el diseñador de lo simple

El perfil de John Maeda era uno de los que teníamos pendientes en nuestra lista de diseñadores. Adelantamos su perfil ante la fantástica noticia de su contratación por parte de Automattic, la empresa responsable de productos como WordPress o Woocommerce.

A partir de ahora, Maeda trabajará como Global Head, Computational Design and Inclusion (Responsable Global de Diseño computacional e Inclusión), pero su trayectoria es digna de mención. Entre otras cosas, es más que recomendable su magnífico libro Las leyes de la simplicidad, donde recoge buena parte de las claves que equilibran la simplicidad y la complejidad en los negocios, la tecnología y el diseño y que se han impuesto en el diseño en los últimos años.

2016-08-19-original
John Maeda en el World Economic Forum

Resumen biográfico de John Maeda

En el resumen que aparece en su perfil de Linkedin, Maeda describe su trayectoria con tanta precisión que solo es necesario copiar y aprender:

John Maeda es un ejecutivo americano, diseñador, tecnólogo. Actualmente aconseja sobre a startups tecnológicas en Kleiner Perkins Caufield & Byers, la firma líder mundial de capital riesgo en Silicon Valley. Además, Maeda está en los consejos de Sonos y Wieden+Kennedy, además de en el consejo técnico de Google.

Estudió en el MIT originalmente como ingeniero, Maeda posteriormente ganó un doctorado en diseño. Por eso, él se unió al MIT Media Lab en 1996 y continuó su MBA después de ser numerario. Abandonó el MIT en 2008 para convertirse en el 16º Presidente de la Rhode Island School of Design. Durante su estancia en el RISD, Maeda abogó a nivel nacional porque la educación STEM (Ciencia, Tecnología, Ingeniería y Matemáticas) se convirtiera en STEAM (añadiendo Arte).

Como autor y hablante internacionalmente reconocido, los libros de Maeda incluyen Las leyes de la simplicidad, Código Creativo y Rediseñando el liderazgo. Ha sido ponente en el TED, en el Foro Económico Mundial y en multitud de empresas y universidades sobre la convergencia de la tecnología, los negocios y el diseño.

John Maeda es más que un científico, un filósofo o un artista visual. Llegó al diseño desde la programación y la investigación en software y computación. Su planteamiento subraya la importancia del binomio diseño-tecnología como factor clave para el éxito de algunas de las empresas más competitivas de la actualidad. Hasta hace bien poco, la solución para cada nuevo problema en el mundo tecnológico era más tecnología, ahora es tecnología con la ayuda del diseño.

Y fue uno de los primeros diseñadores en formar parte de un consejo de administración y su trabajo principal en KPCB ha consistido en ayudar a las startups en las que invertía el fondo a introducir el diseño en su metodología de trabajo. Ya sabéis, aquí comulgamos con esto. 🙂

En definitiva, el hecho es que el trabajo de Maeda es responsable de haber cambiado algunas formas de pensar, desde la asimilación del diseño como una inversión para las empresas y no solo como belleza o presentación visual.

Diez leyes de la simplicidad

Este es su trabajo más conocido y reconocido. En todos sus trabajos destaca la coherente aplicación de una filosofía basada en la simplicidad y la claridad.

Ahí van sus diez leyes para la simplicidad (extraídas de su blog lawsofsimplicity.com):

  1. REDUCIR: La manera más sencilla de alcanzar la simplicidad es usando una reducción razonada.
  2. ORGANIZACIÓN: La organización permite que un sistema complejo parezca sencillo. Maeda explica que hay tres estrategias para conseguir la simplicidad en la vida real: A) Comprar más espacio, una casa mayor. B) Apartar todo lo que no necesitas. C) Organizar tus objetos vitales en un sistema coherente.
  3. TIEMPO: Ahorrar tiempo hace parecer las cosas más simples. Si forzamos a que alguien espere, hacemos que parezca más complejo.
  4. APRENDER: El conocimiento lo simplifica todo. Un simple tornillo puede que no parezca tan simple como piensas, si no sabes cómo utilizarlo.
  5. DIFERENCIAS: La simplicidad y la complejidad se necesitan entre sí. Hacer que parezca sencillo un diseño requiere hacer que su complejidad sea accesible.
  6. CONTEXTO: Lo que se encuentra en la periferia no es superfluo, sino muy relevante. Hay mensajes que rodean y complementan aquello que diseñamos.
  7. EMOCIÓN: Cuantas más emociones, mejor. Debemos emocionar con nuestro diseño.
  8. CONFIANZA: Debemos confiar en la simplicidad, porque es un camino seguro para la comunicación.
  9. FRACASO: No siempre es posible hacer algunas cosas de manera simple. A veces, el fallo es un ingrediente necesario para el éxito o para conseguir algo bello.
  10. LA ÚNICA: La simplicidad consiste en eliminar aquello que es obvio y añadir lo importante.

Presentaciones de John Maeda

Durante dos años, Maeda se encargó en KPCB de presentar un resumen de gran calidad sobre el estado del diseño en el sector tecnológico. En 2016 la presentó en el SXSW, que podéis ver en video en la sección siguiente.

Design in Tech 2016

Design in Tech 2015

Algunos videos de John Maeda


Presentación de Design in Tech 2016

Una charla donde cuenta su trayectoria

Charla de John Maeda en el TED

Diseño de interfaces para niños

Desde hace tiempo, ha habido un cambio en el ocio de los niños y utilizan cada vez más productos digitales. En algunas ocasiones con la dirección guiada de sus padres, pero muchas otras aprenden a manejar dispositivos e interfaces de forma autónoma, con su propia intuición.

El uso que este público hace de la tecnología ha ido evolucionando hacia un entorno fundamentalmente móvil. En este caso, el Mobile-Only es toda una realidad, no una tendencia a medio plazo. Debido a la posibilidad de interfaces táctiles es más sencillo para estos pequeños usuarios interactuar con el dispositivo usando sus dedos.

2016-08-18-2
Foto extraída de  pixabay.com

Los más pequeños desarrollan cada vez más estas destrezas digitales, y ese instinto lo llevan a todo lo que hacen en su día a día. Tanto que podríamos decir que son cómo esponjas que recopilan información continuamente.  Seguro que os habéis preguntado alguna vez cómo a esa edad son capaces de usar estos dispositivos con tanta facilidad. Esa realidad nos conduce cada vez más a enfocar la experiencia de usuario al ámbito infantil-juvenil en el diseño de interfaces.

Principios de diseño para niños

En el mercado existen una amplia gama de productos infantiles, derivados de los constantes cambios en el gusto de los niños, la rotación de personajes de actualidad y, por supuesto, de la creciente presencia de tecnología en su vida cotidiana.

Cuando realizamos un diseño para este público tan particular, no sólo hay que tener en cuenta la presencia de una buena experiencia de usuario. Como explicaba hace tiempo Yusef Hassan hablando de diseño web orientado a niños, “los niños tienen habilidades, preferencias y necesidades diferentes al usuario medio”, por lo que el diseño de productos digitales destinados a este tipo de audiencia requiere de la adopción y adaptación metodológica necesaria para asegurar su experiencia.

Es decir, en un contexto donde es mucho más complejo realizar investigación de usuarios y conocer sus expectativas, debemos guiarnos por una serie de principios que nos ayuden a tomar mejores decisiones de diseño. Karina Ibarra, madre y diseñadora de UX, propone tener en cuenta una serie de principios del diseño enfocado a niños. A continuación os mostramos estos principios, que complementamos con algunos más de nuestra cosecha:

  1. Simplicidad: El diseño debe ser sencillo, intuitivo, con el menor texto posible y con iconos fáciles de reconocer para un usuario de esta edad. Por tanto, también es recomendable incluir audio e interacción.
  2. Metas centradas: Los niños deben reconocer de manera rápida la meta que han de conseguir en el juego, para evitar problemas de entendimiento y abandono por aburrimiento.
  3. Honestidad: Transparencia total cuando se trata de diseñar para niños. Los niños son confiados por naturaleza, asi que no tiene lógica diseñar sin ser honestos con ellos.
  4. Diversión: Debemos tener presente que un juego debe ser divertido para ellos, porque en caso contrario perderán el interés por él. No hay que olvidar que “la diversión es la base de cualquier juego”, tanto para adultos como para niños.
  5. Desafíos: Otro punto clave que no podemos pasar por alto, es introducir la presencia de retos o desafíos que motiven a los más pequeños durante la utilización del juego. Debemos conseguir que se sientan motivados a la hora de superar las diferentes actividades que se proponen, consiguiendo que se sientan satisfechos al alcanzar ese resultado.

Por nuestra parte, quizá añadiremos la importancia del diseño visual y color, parte importante si tenemos en cuenta interfaces destinadas a este público, donde los iconos y la utilización de colores tienen una importancia capital. También todos los aspectos relacionados con el aprendizaje como último objetivo. No olvidemos que se trata de conseguir que los niños se diviertan aprendiendo, pero también que aprendan mientras se divierten.

En su propuesta, Karina también resalta un aspecto que consideramos fundamental. A la hora de realizar un diseño infantil, hay que incluir en la metodología tests con usuarios reales. Desde luego, el punto de vista de un niño jamás podremos obtenerlo desde un planteamiento de un adulto. Aunque con estos “usuarios”, las pruebas también se convierten en una dificultad añadida en el proyecto, porque no puedes esperar que sigan tus instrucciones al pie de la letra.

Ejemplo: juego online de Dora Exploradora

Un ejemplo de diseño para niños que cumple ampliamente estos principios de diseño es es el juego online de Dora Exploradora.

Una vez iniciado el juego podemos observar la presencia de elementos muy simples que componen el diseño de la interfaz. Desde la primera pantalla hasta la última, destacan los colores brillantes, la tipografía y la iconografía adaptadas a los más pequeños. Los iconos tienen una clara conexión con el mundo real, porque los niños pequeños todavía no tienen desarrollada una gran cantidad de modelos mentales para comprender iconos abstractos.

retocada

El uso de recursos de animación y audio es fundamental en este caso, por el público al que va dirigido. Habitualmente, un niño aprende a leer en su lenguaje nativo alrededor de los seis años y le lleva 2-3 años comprender mensajes sencillos que estén escritos. Éste es un detalle sumamente importante cuando se considera la navegación y el contenido en esta interfaz pensada para niños. En muchos casos, sus padres les enseñan en los primeros usos. Luego, como repiten esas acciones de forma autónoma y los botones se mantienen en su sitio, aprenden lo que hace cada botón.

Si analizamos el comienzo del juego, nos daremos cuenta de la importancia que tiene las metas a conseguir. Está presente desde el primer momento. Y Lo hacen desde un punto de vista más divertido, para que aquellos usuarios que escuchen la presentación del juego se sientan motivados por empezar y superar las diferentes actividades como un reto.

Además, antes de comenzar a jugar, hay un proceso de aprendizaje clave para el pequeño usuario, dónde debe conocer cómo manejar el personaje a través de explicaciones auditivas y animaciones. Durante el juego, también podemos ver cómo la se mantiene la coherencia visual en todo el interfaz, a medida que el pequeño jugador va superando desafíos.

En Torresburriel Estudio apoyamos el rediseño de tu producto digital, con un proyecto de acompañamiento donde aplicamos metodologías de diseño centrado en el usuario. Contacta con nosotros, y cuéntanos tu proyecto. Te enviaremos una propuesta adaptada a tus necesidades y presupuesto.

UX Week 2016

La pasada semana tuvo lugar en San Francisco UX Week 2016, un evento de UX en el cual durante una semana tuvieron lugar una serie de charlas con ponentes de primer nivel como Alan Cooper, Cindy Gallop, Amber Case, Jesse James Garret o Peter Merholz.

Las temáticas de las charlas fueron variadas: Burning Man, diseño para niños de cuarto grado, diseño para mujeres, el ecosistema de la UX y diversos talleres sobre creación de personas, estrategia de experiencia de usuario o visualización de datos.

2016-08-17-original
Captura de parte de la web de UX Week 2016

La primera charla fue a cargo de Amber Case sobre tecnología sosegada. Habló de los dispositivos conectados para casa, lo que tradicionalmente se llamaba domótica y ahora ha pasado a denominarse IoT para el hogar. Amber explicó que no se necesitan dispositivos inteligentes, sino humanos más inteligentes que los usen. “No necesitamos ser un administrador de sistemas en nuestra propia casa“, aseveró refiriéndose a la complejidad de muchos de estos aparatos para el hogar. Para ello, enumeró sus ocho principios de la tecnología sosegada:

  1. La tecnología debe requerir la menor cantidad de atención posible.
  2. La tecnología debe informar y tranquilizar.
  3. La tecnología debe empoderar la periferia.
  4. La tecnología debe amplificar lo mejor de la tecnología y lo mejor de la humanidad.
  5. La tecnología debe respetar las normas sociales.
  6. La tecnología puede comunicar, pero no necesita hablar.
  7. La cantidad de tecnología correcta es la mínima cantidad necesaria para resolver un problema.
  8. La tecnología debe usar lo cercano y lo lejano.

Después nombró como ejemplo el comedero automático de gatos que mató alguno al caerse los servidores y sobre quién cargaba con la culpa por ello. Case finalizó la charla con dos frases que impactaron al auditorio, “deberían multar a los sitios web de 3MB” y “todo el mundo es recompensado por hacer cosas nuevas, pero debemos recompensar más por mejorar las cosas antiguas“.

La siguiente charla fue de Emileigh Barnes sobre el diseño de un sitio web del gobierno federal para niños de cuarto grado. Barnes comenzó la charla con un idea fuerza muy potente: que “no debemos confundir una audiencia cautiva con audiencia interesada“. Barnes explicó las dificultades de lectura para esta audiencia y puso un ejemplo de un texto de la web antigua. Por ejemplo, un niño de cuarto grado no entiende qué es un código postal. Así que abogó por un rediseño completo de contenidos, empezando por convencer al gobierno federal de que eliminaran el término “federal” en el sitio web.

Barnes aseveró que hacer una buena estrategia de contenidos es esencial en sitios como el que tuvo que diseñar y postula que, en cualquier sitio, el contenido debería ser lo importante. “Hay que ajustar el tono a la audiencia“. Barnes acabó la charla refiriéndose a el entorno gubernamental es un entorno que no favorece los cambios, ni hacer las cosas de la forma más correcta:  “El gobierno es un sitio donde si cambias algo y funciona realmente bien, igual recibes una tarta“.

Nichole Sorochan realizó una interesante charla hablando de un tema que nos interesa mucho en el estudio y del que probablemente hablemos pronto: la importancia de diseñar para mujeres y cómo hacerlo. “Preguntaros cuál es la única visión que lo femenino puede ofrecer en lugar de ¿Por qué no hay más mujeres en X?” Dijo que lo femenino y masculino no está relacionado únicamente con el género, sino con características personales. Algunas de ellas están muy marcadas en uno u otro género, como la competitividad o la capacidad de escucha. Pidió a la audiencia que se imaginaran lo que serían capaces las mujeres si se sintieran libres y seguras para expresarse por sí mismas.

La siguiente charla fue la gurú de diseño Irene Au, que trabajó en Google y Yahoo!, que comenzó con una frase impactante: “El diseño es como un frigorífico, no lo notas si funciona pero apesta si no lo hace“. Si algo se diseña con un propósito, ese propósito debe estar bien comunicado al usuario. Otra frase muy comentada es que “el miedo es el gran enemigo de un buen diseño“.

La última charla del día fue la de Alan Cooper, creador de las personas. Comenzó la charla enseñando una foto suya en un anuncio de 1977, explicando que “tenemos el poder de moldear la manera en la que vivimos“.  Para ello, “sirve primero a las personas y en segundo lugar al negocio“. Hablando de fidelidad y de producto: “La gente ama tu producto por lo que es, no por lo que cuesta“. Para finalizar dijo que si alguien estaba en un empresa que sólo estuviera en esto por el negocio, mejor cambiate de empresa.

La charla más comentada del evento fue la de Cindy Gallop, con el provocador título “Rediseñando el futuro del sexo a través del sextech“. Comenzó también fuerte: “el futuro de tu negocio es hacer las cosas bien y ganar dinero“. Cuando tienes una startup que va a cambiar el mundo, tienes que moldear el mundo a tu manera y no al revés, porque “el miedo a lo que otra gente piense es la cosa más paralizante del mundo“. Sobre el papel de las mujeres que había resaltado Sorochan, Gallop explicó que las mujeres desafían el status quo porque nunca han estado en él y que se puede hacer mucho negocio tomando a las mujeres en serio, dos ideas que causaron gran cantidad de comentarios. La charla finalizó con otra frase para enmarcar: “Una de las maneras más rápidas de hacer que la gente piense diferente sobre algo es cambiar el lenguaje“.

Storify

Para acabar hemos realizado un Storify con los mejores tuits e imágenes del evento, donde aparece toda la información del evento y de las charlas si queréis complementar la información de este artículo.

En Torresburriel Estudio realizamos proyectos de consultoría en diseño de experiencia de usuario para tu producto digital, aplicando metodologías de diseño centrado en el usuario. Contacta con nosotros, y cuéntanos tu proyecto.

Diseñando UX para negocios consolidados

Parece razonable pensar que, cuando trabajamos para una empresa con una larga trayectoria y un negocio consolidado, necesitaremos abordar el proyecto con más cautela que cuando trabajamos para una empresa más joven o menos tradicional. La experiencia de usuario en muchos casos no es suficientemente valorada, porque la empresa tiene un producto o servicio que ya “funciona” y se suele tener la mentalidad de “si funciona, no lo toques”. Esto puede ser aplicable en algunos caso, pero no siempre.

wonderlic2
Captura de Wonderlic en escritorio y móvil. ©Fuzzy Math

Parte de nuestro trabajo como diseñadores de experiencia de usuario consiste en hacer visible a los gestores de la empresa que su producto debe cubrir las necesidades del cliente (usuario) y que, si no lo hacen o lo hacen mal, habrá otra empresa que ocupe ese lugar. Por supuesto, también hablamos de la necesidad de introducir en sus procesos de diseño de producto, la mejora continua y estar atento a las necesidades cambiantes de sus usuarios para tratar de satisfacerlas.

Principios para trabajar con empresas consolidadas

En el estudio hemos trabajado en muchas ocasiones con empresas consolidadas. Ahí van algunas lecciones aprendidas:

  • Céntrate siempre en mostrar los beneficios del cambio que propones, y no tanto el proceso: si puedes poner ejemplos de casos de éxito de un sector que el cliente pueda entender, mejor. No enseñes metodología, enseña ejemplos prácticos al cliente.
  • No intentes cambios radicales que puedan afectar a la cultura de la empresa: muchas veces, los diseñadores hacemos propuestas demasiado radicales en empresas que no están preparadas para asimilarlas. Es mejor conseguir pequeñas victorias lo más rápido posible y comunicarlas a todos los implicados, aplicando cambios incrementales donde el cliente vea rápidamente la relación coste vs. beneficio.
  • Comunícate en un lenguaje entendible por tu cliente: los diseñadores a veces usamos un lenguaje “técnico”, algo “muy nuestro” al que nuestros clientes no suelen estar acostumbrados. Intenta usar un lenguaje lo más entendible posible, elimina ambigüedades y explica lo que se pretende conseguir de la forma más clara posible. Y, sobre todo, explica bien las consecuencias que esos cambios tendrán y qué mejoras verá el usuario con ellas.
  • Intenta que los cambios permanezcan: es habitual que después de hacer un trabajo, el cliente vuelve a su flujo habitual de trabajo cuando el trabajo del diseñador finaliza. Intenta que eso no ocurra y que los cambios se consoliden, aplicando conocimientos y prácticas que estén alineados con su cultura empresarial y con el diseño centrado en el usuario.

Rediseñando la plataforma de Wonderlic

Sobre este tema de diseñar para una empresa consolidada hemos encontrado un caso bastante paradójico de Wonderlic, una empresa dedicada a elaborar tests de aptitudes (tests de inteligencia, tests emocionales, etc…) que se utilizan en las entrevistas de trabajo.

Como habréis supuesto, hasta hace poco tiempo estos tests se realizaban con papel y bolígrafo y después se corregían a mano con una plantilla de respuestas correctas, algo muy tradicional. Posteriormente, pasaron a la posibilidad de hacerlos en un aula informatizada, para ahorrar tiempo y hacer la corrección de manera automática y dar la posibilidad de elaborar informes automáticos sobre las personas que completaban el test.

Mark Baldino ha trabajado con Wonderlic para elaborar su última versión de este tipo de tests, WonScore. Una plataforma unificada y escalable para hacer pruebas de aptitudes para selección de personal de una manera simple e intuitiva.

Mark trabajó con un proceso de diseño centrado en el usuario en cuatro fases, análogo al que veíamos recientemente en el estándar ISO 9241:

  1. Especificar el contexto de uso: Mark se entrevistó con los clientes y hicieron un análisis experto de usabilidad de la plataforma existente, con un análisis heurístico de la plataforma, sus aplicaciones y procesos.
  2. Especificar los requerimientos: Mark y su equipo sintetizaron los hallazgos en unas personas orientadas a objetivos y unos mapas de recorrido (journey maps en inglés) e identificaron todos los asuntos claves como la necesidad de una mejor toma de decisiones tanto de grupo como de personal, un entendimiento rápido de los datos y una guía contextual dentro de la interfaz. Dentro de la investigación se hicieron preguntas como: ¿Quién usa esta herramienta? ¿Cómo responderán las usuarios a los cambios que se implementarán? ¿Los usuarios encontrarán los cambios intuitivos o difíciles de seguir? Se imaginaron un test de aptitudes para una oferta de trabajo para una horquilla entre 5 a 20 candidatos y que sus puntuaciones determinarían su posición.
  3. Elaborar la solución de diseño: El equipo de Fuzzy Math creó una hoja de ruta de la experiencia de usuario que unía la gente, los procesos y las funcionalidades de la futura plataforma. Hicieron varios sprints de diseño siguiendo metodologías ágiles que incluían diferentes funcionalidades: diseño de la arquitectura de la información, wireframes/prototipado, diseño visual, investigación validada por los usuarios y el código responsive del front-end.
  4. Testear los diseños: Después de las tres fases y de conocer la cultura, los procesos y los objetivos compartidos de Wonderlic a través de las entrevistas con stakeholders, el sketching colaborativo y ejercicios de priorización, se hicieron pruebas con los diseños hasta acabar en el diseño definitivo.

Como resultado del proceso, Baldino explica qué aprendió de los tests con usuarios, que resume en las siguientes ideas:

  • No asumas. Los usuarios pueden no conocer cosas, aunque tú creas que sí: en demasiadas ocasiones damos por hecho que las personas tienen conocimientos que no tienen. En el caso de Wonderlic, se comprobó que los usuarios que conducen los tests no tienen los conocimientos adecuados sobre evaluación de la personalidad y habilidades cognitivas.
  • Mejora la claridad de la información y la usabilidad: Durante la investigación de usuarios se descubrió que los resultados tenían que ser más claros y más usables para poder dirigirse a un público más amplio.
  • Cambia lo probado y verdadero por algo nuevo: en la versión inicial, se les enviaba un resumen en PDF a los gestores de personal con todos los resultados del test. En lugar de eso, usaron todo el potencial de la web 2.0 para mostrar esa información de una manera más visual y agradable, con ventanas llenas de información cuando el usuario hacía clic sobre los gráficos.

Las lecciones de Mark nos parecen válidas y perfectamente aplicables a buena parte de los trabajos del estudio, especialmente cuando tenemos que enfrentarnos a un proyecto con empresas que tienen un negocio consolidado desde hace décadas y necesita adaptarse a un entorno digital o multicanal de una manera rápida e inocua para su actividad.

En Torresburriel Estudio apoyamos el rediseño de tu producto digital, con un proyecto de acompañamiento donde aplicamos metodologías de diseño centrado en el usuario. Contacta con nosotros, y cuéntanos tu proyecto. Te enviaremos una propuesta adaptada a tus necesidades y presupuesto.