Proyecto: rediseño de Simply Online

Bueno pues otro proyecto que está ya en producción y del que podemos contar algunas cosas del trabajo que hemos realizado para llevarlo al estado en el que se encuentra actualmente.

Se trata, de nuevo, de un proyecto del ámbito del ecommerce, en este caso de un supermercado. Porque no todo es hype y tiendas mega-molonas. La gente sigue comprando sus cosas de comer y de limpiar en los sitios de siempre, y éstos permiten (o lo intentan) que lo sigamos haciendo por internet.

DV Simply Anonimo
Página principal de Simply Online cuando el usuario está autenticado

Es el caso de Simply, que en su ecommerce Simply Online decidió dar un paso adelante en cuestiones de diseño y optimización y, entre otras cosas, nos contrató la parte conceptual y visual. Y abordamos el proyecto no sin un componente extra de ilusión. ¿Quién no ha comprado tantas y tantas veces en Simply? Yo reconozco que me hace ilusión trabajar en proyectos así, qué le vamos a hacer.

Lo que hemos hecho en Simply, de la mano de sus responsables del canal online, ha sido una reconceptualización de las pantallas y los procesos que gestionan y que guían al usuario a través de su ecommerce. Empezando por la página principal, pasando por la selección de producto, y finalizando por el propio carrito de la compra.

Una propiedad digital como de la Simply, que tiene un producto con una serie de condicionantes, implica una serie de limitaciones o requerimientos que hay que considerar de una forma bastante seria cuando se trata de abordar un trabajo de diseño. El producto final que el usuario ve es el producto de una serie de combinaciones internas, que ahora no es necesario detallar, que hacen que ése sea el que es. ¿Qué quiero decir con esto? Que la carga de trabajo que supone comprender y considerar una serie de cuestiones internas en este sector no es un tema menor, en absoluto. Las implicaciones que a nivel de diseño y a nivel de experiencia de uso son extraordinariamente interesantes si las observamos desde una perspectiva profesional.

Pero no me quiero enrollar mucho más con esto. Es mejor y más útil que os cuente qué es lo que hemos hecho, y cómo:

  • Hemos repensado la página principal para:
    • facilitar el inicio de la compra
    • enseñar producto
    • comunicar mejor las fortalezas de Simply online
  • Hemos hecho transparentes los procesos de petición de datos:
    • Cuando se quiere conocer la ubicación del usuario
    • Cuando se quiere completar un proceso de compra sin estar registrado
    • Cuando se quiere conocer una información de producto
    • Cuando el usuario se quiere autenticar (si previamente está registrado)
  • Hemos optimizado la información y diseño del carrito de la compra
    • Para promocionar y facilitar la finalización de la compra
    • Para facilitar el uso de cupones
    • Para facilitar la percepción de los descuentos aplicados
    • Para servir de ayuda en el propio proceso de la compra

¿Cómo lo hemos hecho? Hemos utilizado las técnicas básicas de análisis etnográfico y diseño conceptual que solemos usar en el estudio:

  • Entrevistas con usuarios para conocer el primer nivel de patrones de uso
  • Entrevistas con stakeholders para conocer de primera mano los procesos internos del sector alimentación
  • Entrevistas con responsables técnicos y logísticos del canal online para conocer y consolidar todo lo que tiene que ver con producto, envío y patrones de uso
  • Diseño de wireframes, validado paso a paso con responsables del proyecto en el cliente
  • Diseño visual de patrones que a partir de una pantalla se extiendan como objetos de utilización en todo el site
  • Coordinación con el equipo de desarrollo e integración

Wireframe de la página principal

El foco está puesto especialmente en el inicio del proceso de compra a través de un CTA claro y evidente, el producto genérico y el producto específico, empaquetado en ofertas y promociones.

WF Simply Home User
Wireframe de la página principal de Simply Online cuando el usuario está autenticado

Wireframe de la página principal cuando se piden datos

El objetivo de algunas pantallas está basado en la exitosa interacción con el usuario, como el momento en el que se solicita el código postal de éste. Se solicita un dato, y a la vez se muestra con claridad por qué se pide, qué ventajas ofrece para el usuario, y algunos de los beneficios complementarios que supone el canal online.

WF Simply Home
Wireframe de la página principal de Simply Online cuando se necesita un dato específico por parte del usuario

Diseño visual del detalle de la petición de datos

DV Simply CP
Diseño visual del detalle cuando se necesita un dato específico por parte del usuario

Detalle del diseño visual de producto

DV Simply Ofertas
Diseño visual del detalle cuando se quiere mostrar producto, detalle y acceso a compra

Wireframe para hacer transparente la compra

Lo que más nos interesa en este punto es que el usuario haya podido navegar por el surtido de producto, configurado un carrito y efectuado el inicio del checkout. Los datos los pedimos sólo cuando es imprescindible, y de una forma razonable.

WF Simply Cart
Detalle cuando se desea que el usuario introduzca sus datos para completar una compra

El proyecto en nuestra parte, como pasa tantas veces, lo hemos llevado a cabo gracias al trabajo de las buenas gentes del equipo: @lizano, @veniabi y yo mismo. La integración y el código front han sido obra del equipo de Hiberus Internet.

Si queréis ver más pantallas y wireframes, hemos dejado un álbum en Flickr: Rediseño de Simply Online.

Como decimos siempre en estos casos, estaremos encantados de escuchar lo que queráis decir.

Proyecto: rediseño de Cestalia

Otro proyecto en el que hemos trabajado en el estudio y que ve la luz después de varios meses de trabajo.

En este caso se trata de lo que llamamos un ecommerce de bajo alcance. Lo llamamos de bajo alcance porque se trata de un tipo de proyecto que tiene un dominio de audiencia limitado, pero muy cualificado y francamente optimizado.

Cestalia es una empresa que se dedica a la creación y distribución de lotes y cestas de navidad. Nuestro cometido en el proyecto ha sido, desde el inicio, plantear un rediseño del ecommerce orientado a la maximización de las ventas a través del canal web. La empresa, en todo caso, también tiene canales tradicionales de venta, si bien el canal web es el principal en cuanto a pedidos.

DV Cestalia Home
Captura de pantalla de la página principal de Cestalia

Lo que hemos planteado en el proyecto es una apuesta por varios elementos que influyan decisivamente no tanto en la decisión de compra, como en la operativa de la misma.

Una de las mejores decisiones que el cliente ha tomado, siguiendo nuestro consejo, es la de cuidar los copys y los mensajes. Sirva un ejemplo de la descripción que de ellos mismos hacen:

Somos una PYME, con 12 empleados y sede en Zaragoza, que llevamos 7 años haciendo exclusivamente lotes y cestas de navidad. No somos los números 1, ni la empresa más grande del sector. Y esta situación le beneficia a usted, porque somos ambiciosos y nos obliga a esforzarnos cada día en mejorar. Porque queremos llegar a ser, con ayuda de nuestros clientes, los números 1.

No es sencillo encontrar empresas (y clientes) que tengan la capacidad de transparencia como la que nos hemos encontrado en Cestalia, esa es la verdad.

En términos de interfaz hemos planteado una serie de elementos que son las claves, a nuestro entender, del rediseño:

  • Minimización del menú de navegación de forma que éste sea exclusivamente operativo.
  • Dotar del máximo protagonismo a las imágenes de los lotes, para contribuir decisivamente a la visualización de los mismos, proporcionando un componente aspiracional (si es que podemos hablar de aspiracional en este contexto).
  • Aumento significativo de la importancia y relevancia de los CTA desde el inicio.
  • Mostrar sin complejos la USP en todas las pantallas del site.
  • Dotar de espacio relevante al contenido referido a los servicios implícitos de Cestalia.
  • Carrito de la compra que acompaña todo el tiempo a la experiencia de compra.
  • Checkout en una sola pantalla, dando todo el protagonismo a la inserción de datos.

Nuestro trabajo ha sido la conceptualización del site (yo mismo y @veniabi), el diseño visual (@lizano) y la realización de las maquetas HTML (@superwillyfoc). La implementación e integración en la plataforma ha sido un trabajo del equipo de Hiberus Internet.

Algunas de las imágenes que cuentan la historia de este proyecto:

Utilizamos el sketching para conceptualizar algunos procesos de la parte responsive

Sketch Cestalia
Dibujos que utilizamos para empezar a definir algunos procesos para la parte responsive del ecommerce

Hicimos análisis de situación con el diseño anterior

Revisión de pantallas
Una de las partes más divertidas fue la de hacer análisis a partir del diseño anterior

Algunas propuestas las diseñamos con el cliente, sobre el diseño anterior

Análisis de pantallas
Con la colaboración del cliente, el análisis sobre el diseño anterior fue una gran herramienta

Gran parte de las decisiones de diseño las tomamos sobre los wireframes

WF Cestalia Home
Un elemento importante en el proceso de trabajo fue que algunas cuestiones las descartamos tras analizar los wireframes

WF Cestalia Checkout
Aunque otros wireframes permanecieron intactos después del proceso de análisis y validación

Apostamos por la máxima transparencia de forma consistente en todo el ecommerce

DV Cestalia About Us
Una de las apuestas fuertes fue la de mostrar la empresa de una forma diferente, abierta y transpartente, dándole relevancia

Tratamos de que la inclusión de datos no tuviera distracciones

DV Cestalia Checkout
La pantalla de Checkout no tiene nada que no sea elementos para completar la acción

Como siempre, estaremos encantados de escuchar vuestras opiniones al respecto.

Curso “Interaction Design” (II)

Retomando el post anterior en el que os conté la primera parte del curso “Interaction Design” al que asistí en ITANNOVA (Instituto Tecnológico de Aragón), hoy escribo sobre las dos sesiones siguientes en las que estuvo con nosotros @saertus hablándonos, principalmente, del diseño de interacción en apps y el prototipado de éstas.

Andrés Botero comenzó nombrando una serie de Principios básicos para un UX, tales como:

  • Todo lo que hacemos tenemos que testearlo, ya que no somos usuarios modelo.
  • La experiencia no tiene por qué basarse sólo en el sistema, sino que se basa en todo lo demás (en el antes, el después,…). La experiencia es holística.
  • Hay que preguntarse siempre el porqué de todo lo que se hace en la realización de un proyecto y pensar en todas las situaciones posibles, no sólo en la más cómoda.

Posteriormente tratamos los Wireframes, que separó en dos grupos:

  • Lo-Fi Wireframes: tienen poco nivel de detalle y carecen de contenido. En estos se pueden añadir comentarios explicativos.
  • Hi-Fi Wireframes: son de alta calidad y contienen prácticamente todo. Son el resultado de la segunda fase de diseño de wireframes.

Seguidamente nos explicó dos conceptos sobre el contenido que se encuentra en los sitios web:

  • Macrocopy: hace referencia a la voz y el tono del lenguaje del contenido.
  • Microcopy: se trata de los textos pequeños que aparecen en todo el sistema.

El contenido de un site es muy importante a la hora de abordar los wireframes, ya que en la mayoría de las ocasiones nos podemos encontrar con que el contenido ha afectado de alguna forma a la estructura de los wireframes que hemos construido.

Dadas las explicaciones, diseñamos los wireframes de nuestra app con más detalle y Andrés nos habló sobre distintos tipos de patrones de interacción para que los reflejásemos también en nuestros diseños, tal y como podéis ver a continuación.

Wireframes incluyendo las interacciones de la app.
Diseño de algunos Wireframes del proyecto reflejando las interacciones dentro de la app.

En cuanto a los patrones de interacción, nos mostró diversos estándares que podemos encontrar en múltiples dispositivos: sitios webs, móviles, televisores, etc.

Por si a alguien le interesa consultar patrones de interacción os indico tres webs que nos recomendó @saertus:

  • uxarchive.com: muestra muchísimos tipos de interacción para apps.
  • capptivate.co: muestra interacciones de movimiento también para apps.
  • patterntap.com: son patrones para diferentes dispositivos, aunque más para desktop.

Tras esto, y con la finalidad de adquirir nuevas ideas de cara a la construcción de los prototipos de un proyecto, nos explicó en qué consiste el concepto deconstrucción. Se trata básicamente de fijarse con mucho detalle en las cosas que componen una web. Y si esto lo hacemos con un sitio que nos gusta podemos obtener buenas ideas.

Otro de los temas que tratamos fue el de los gestos que hacemos al interactuar con los productos digitales, que no paran de evolucionar. Cada vez hay más productos con los que interactuamos: móviles, relojes, etc. Y lo importante es que los gestos que se hagan para dicha interacción sean intuitivos para los usuarios.

Otro aspecto importante a la hora de diseñar un producto digital es lo que se conoce como Storytelling. Cuando se presenta un producto a un cliente, este pide una serie de explicaciones o cuando se vaya a vender el producto al usuario, no basta con enseñarlo simplemente, sino que hay que contar la historia que ha sido construida anteriormente siguiendo una serie de pasos. Esto es básicamente en lo que consiste el Storytelling. Y acompañándolo está el Screenflows, una herramienta muy útil de cara a mostrar las pantallas y contar la historia.

Y ya pasamos a hablar del prototipado y las distintas formas que hay de construir los prototipos:

  • Papel: se hacen los diseños sobre papel y la interacción se consigue poniendo los dibujos unos sobre otros según corresponda. Otra forma es con la app PopApp que os conté en el post anterior.
  • Herramientas web
  • HTML / CSS /JS
  • Quartz Composer: Se trata de una herramienta de diseño de Apple.
  • Origami: Es similar al anterior, pero con una “capa” por encima para hacerlo más sencillo y vistoso para el diseñador.

Andrés nos recomendó diversas herramientas y aplicaciones para realizar prototipos y os las pongo a continuación:

  • Fluidui: es un software para construir prototipos de aplicaciones móviles.
  • Gomockingbird: es una herramienta online que sirve para prototipar tanto sitios web como aplicaciones.
  • Balsamiq: se trata de una herramienta para sitios web y aplicaciones, como la anterior.
  • Invision: es una aplicación para prototipar y además pueden trabajar simultáneamente varias personas y se poner hacer comentarios sobre el prototipo.
  • Framer: permite pasar los diseños de Photoshop a Framer para dotarlos de interacción. Está pensado fundamentalmente para app, pero también sirve para ordenador.
  • Flinto: Es más sencillo y es muy útil para prototipos rápidos y sencillos de apps.
  • Pixate: Es más potente que Flinto y funciona con capas como Photoshop. Y es un pack: se instala en el ordenador y se puede visualizar en el móvil.

Y por último, hablamos de otros temas como son:

  • Las animaciones, que en numerosas ocasiones son las responsables de que una app brille más que otra, de ahí su importancia.
  • El universo multidispositivo, en constante evolución y crecimiento.
  • Los inputs methods, que también existe una gran variedad que sigue creciendo. Existen muchas formas de interactuar con los productos digitales: la voz, el teclado, el ratón, las pantallas táctiles, etc.
  • El Responsive Design, lo cual dió pie a hablar también del conocido “Mobile First”, tema que ya hemos tratado en este Blog tiempo atrás en el Post “Cómo diseñar una Web Mobile”.

Así que ya véis que el curso “Interaction Design”, en su conjunto, abarcó un gran temario, y a mí personalmente me gustó mucho, tanto el curso en sí como los profesionales que lo impartieron :)

Proyecto: diseño de IberCaja Aula en Red

Hace pocas semanas que se ha puesto en producción un proyecto en el que hemos participado en el proceso de rediseño. En este caso se trata de un proyecto de la Obra Social de IberCaja llamado IberCaja Aula en Red. Como es costumbre en esta casa, os contamos lo que hemos hecho en el proyecto y estaremos encantados de recibir el feedback que os parezca oportuno, si es que os parece oportuno.

El encargo del cliente fue abordar un proceso de rediseño que llevase al proyecto a obtener:

  • mejores resultados a la hora de conseguir leads en forma de contactos
  • unidades didácticas abiertas y completadas

El objetivo de la web es proporcionar a alumnos y personal docente una serie de actividades complementarias para la formación en las aulas y en los espacios de tiempo no lectivos de forma que las materias vistas en diferentes niveles educativos estén presentes de forma activa, de cara a la consolidación de los conocimientos. En ese contexto, lo que se propone tanto a estudiantes como al personal docente, es una serie de unidades didácticas con las que complementar lo visto en las aulas.

Nuestro objetivo en la parte de diseño ha sido proporcionar una experiencia transparente para el acceso a las unidades didácticas, a la formación complementaria para personal docente y a los concursos orientados a estudiantes.

El principal reto que tuvimos que afrontar fue la organización de los contenidos disponibles en dos planos:

  • El acceso a las unidades didácticas en función del perfil de usuario: estudiantes, personal docente, y padres y madres.
  • El consumo de las unidades didácticas de apoyo a los contenidos del aula, entendiendo consumo como el proceso mediante el cual las y los estudiantes desarrollan una actividad formativa complementaria al aula, poniendo el foco exclusivamente en su acción.

En ese sentido las pantallas clave propuestas, y su diseño, se han basado en enfocar desde el inicio en esos planos:

  • Proporcionar acceso a unidades didácticas en función de dos criterios: nivel educativo y tipo de contenido
  • Proporcionar acceso a formación complementaria en función de perfiles de usuario: personal docente y alumnado
  • Poner el foco en la actividad del alumnado cuando se trata de fomentar su actividad con las unidades didácticas
  • Dotar de toda la información necesaria de la manera más sencilla, pero a la vez más completa, cuando se trata de conseguir leads en ámbitos de formación para personal docente

El resultado es el que se puede experimentar en la web que actualmente existe en producción: IberCaja Aula en Red.

El desarrollo del trabajo, entre otras cuestiones, lo hemos llevado a cabo en coordinación con la dirección de la Obra Social de IberCaja, el personal de IberCaja y sus centros, así como el Centro de Cálculo Bosco, que es quien en su momento diseñó e implementó los elementos interactivos que despliegan la funcionalidad de las unidades didácticas.

Nosotros desarrollamos nuestra metodología de trabajo en proyectos en los que queremos asegurar la mejor experiencia de usuario:

  • Sesiones grupales con el cliente en las que planteamos la investigación previa para dotar al proyecto de objetivos definidos y claros, aplicando la famosa regla SMART
  • Una arquitectura de la información consistente y alineada con los stakeholders identificados
  • El diseño de unos wireframes con los que asegurar que todos los actores del proyecto permanecían alineados en todo momento
  • El diseño de una línea visual consistente con los requerimientos internos
  • El despliegue en visual de todas las pantallas que conforman los procesos del sitio web

¿Cómo lo hicimos? Así:

Wireframe de la página principal

Wireframe página principal. Ibercaja Aula en Red.

Wireframe de una unidad didáctica

Wireframe de Ficha de contenido didáctico. Ibercaja Aula en Red.

Wireframe de la página de formación para docentes

Wireframe de Ficha de curso profesor. Ibercaja Aula en Red.

Visual de la página principal

Página principal. Ibercaja Aula en Red.

Visual de unidad didáctica

Modelo de ficha didáctica. Ibercaja Aula en Red.

Visual de unidad didáctica en modo trabajo

Modelo de ficha didáctica en simulación. Ibercaja Aula en Red.

Visual de formación para docentes

Modelo de ficha de actividad para profesores. Ibercaja Aula en Red.

Como siempre, insisto, estaremos encantados de escuchar, o leer, lo que tengáis que decir.

Curso “Interaction Design” (I)

Después de casi dos meses sin escribir por aquí os cuento mi experiencia en un curso sobre Interaction Design al que asistí a finales de octubre que organizaba ITANNOVA (Instituto Tecnológico de Aragón).

El curso lo impartieron @EsterSerrano y @saertus, dos diseñadores de la empresa Designit, y sinceramente me encantó, tanto el contenido que vimos como la metodología que utilizaron ambos al impartir las clases.

Aunque tenía sus partes teóricas, fue un curso fundamentalmente práctico, que es la mejor forma de aprender de verdad.

Los dos primeros días estuvimos con Ester Serrano y los dos últimos con Andrés Botero. Y lo que hicimos fue, trabajando por equipos y partiendo de un sitio web real, desarrollar todos los pasos que se deberían seguir a la hora de diseñar un producto digital, empezando desde el estudio del producto hasta el prototipado del mismo.

Comenzamos con @EsterSerrano llevando a cabo un Briefing del proyecto para conocer mejor el producto y definir sus funcionalidades y clasificarlas en tres grupos:

  • Must have: son funcionalidades totalmente necesarias.
  • Incremental: no son tan fundamentales.
  • Delighter: son aspectos que el usuario no espera, pero en el momento que los conoce los quiere tener siempre.

Cabe decir que estos “delighters” con el tiempo se acaban convirtiendo en “incrementales” y posteriormente en “must have”.

A continuación pasamos a realizar un Benchmark con el fin de conocer todos los aspectos de la competencia y otros sitios web que, aunque no sean competencia, sirvan de ayuda para el proyecto a abordar.

También hicimos una Lluvia de ideas para que seamos capaces de generar numerosas ideas cuando trabajemos en el diseño de un producto digital. Ideas de todo tipo por muy absurdas que parezcan inicialmente, ya que de ahí siempre se puede sacar algo valioso.

Tras la generación de ideas llevamos a cabo la Creación de personas, atendiendo a aspectos como las necesidades que tiene la persona, sus motivaciones, preferencias, barreras o el objetivo que quiere satisfacer con el sitio web.

Posteriormente creamos un Mapa de empatía con la finalidad de conocer en mayor detalle a la persona. Para ello abordamos seis categorías:

  • Qué piensa
  • Qué ve
  • Qué dice
  • Qué hace
  • Qué siente (preocupaciones, miedos, …)
  • Qué oye

Y para finalizar la primera sesión creamos lo que se conoce como Customer Journey, que consiste en describir el viaje detallado de un cliente cuando está en conctacto con el producto o servicio diseñado. En este viaje se decriben tres momentos: antes, durante y después del contacto. Y suelen crearse dos Customer Journey: uno en el que se de un escenario favorable para el usuario y otro en el que le vaya mal algo.

Además de los momentos citados, se pueden utilizar otras dimensiones:

  • Emociones del usuario
  • Artefacto que utiliza
  • Espacios en los que se encuentra
  • Stackholders que intervienen

Para continuar con el Customer Journey, en la segunda sesión pasamos a identificar la pantalla que se encuentra detrás de cada momento, indicando el nombre de ésta. Cabe decir que no tiene por qué ser una única pantalla, pueden ser más, pero eso lo desarrollamos en una fase futura.

En la siguiente fotografía podéis ver el resultado de la mayoría de las fases realizadas hasta el momento.

Primeras fases del diseño de un producto digital
Primeras fases del diseño de un producto digital: Benchmark, Creación de personas, Mapa de empatía, Customer Journey, Identificación de pantallas.

Tras la identificación inicial de pantallas realizamos el Flujo de pantallas, que se compone de tres elementos:

  • Historias de uso: es un resumen de lo que quiere el usuario. (Hecho ya en fases anteriores).
  • Escenarios de uso: es la historia con un mayor nivel de contexto.
  • Casos de uso: consiste en desgranar una a una las historias del usuario de forma que obtengamos un guión de lo que hace el usuario en la web. Y este proceso es el que nos permite obtener los flujos de pantalla.

Este flujo lo representamos dibujando un mapa de pantallas, tal como se muestra en siguiente imagen, destacando en cada una la acción principal (CTA) que enlaza con la siguiente pantalla, mediante la inclusión de botones.

Flujo de pantallas de un producto digital.
Representación del Flujo de pantallas.

Del mismo modo que en el Customer Journey, no sólo hay que pensar en escenarios favorables, por ello es conveniente representar errores importantes que puedan suceder durante el proceso.

Una vez terminado el Flujo de pantallas de nuestro proyecto, Ester nos habló sobre dos puntos básicos antes de pasar al diseño de los Wireframes: los Principios de la Gestalt y los Heurísticos de Nielsen, una serie de normas básicas sobre diseño y usabilidad, respectivamente.

Y para terminar la sesión tratamos el Diseño conceptual, donde Ester nos explicó la diferencia entre dos tipos de Wireframes y elaboramos los de nuestro proyecto, como os enseño más abajo.

  • Wireframe conceptual: en él sólo se representa el contenido, sin tener en cuenta otros aspectos como la navegación.
  • Wireframe detallado: en él se plantea ya cómo va a ser el aspecto, cómo se presentarán los distintos elementos (la ubicación, el tamaño, etc.).

Wireframes de un producto digital.
Wireframes del producto digital.

Además, para poder interactuar con nuestros Wireframes, nos enseñó una aplicación que me gustó mucho, llamada Popapp.In. Esta aplicación permite convertir en prototipos unos simples Sketches de la app de un proyecto. Lo único que hay que hacer es fotografiar con el móvil los dibujos sobre papel del proyecto y posteriormente POP permite seleccionar los botones de las distintas pantallas para enlazarlos con otras y así poder interactuar con la app diseñada. Me parece super interesante y útil para muchas ocasiones.

En general, las dos sesiones con Ester Serrano me gustaron mucho. Muchos temas ya los conocía, pero nunca está de más volverlos a tratar. Además, nunca había elaborado todas las fases del diseño de un proyecto concreto teniendo que tomar, junto con mis compañeros de equipo, todas las decisiones, lo cual cambia mucho todo y deja ver nuevas cosas.

En el próximo post os contaré cómo fueron las otras dos sesiones del curso con Andrés Botero, en las que nos centramos más en los prototipos de los proyectos.

CX Meeting, encuentro de experiencia de cliente

Bueno, pues un mes después de contar que llevaba yo mucho tiempo sin escribir, vuelvo a la carga con un post de esos que mola mucho escribir. Y es que ayer mismo tuve la oportunidad de asistir a un evento, privado, llamado CX Meeting:

Encuentro especializado en experiencia de cliente basado en casos reales, actuales y que tienen su clave en la innovación para la diferenciación y generación de resultados.

Ni qué decir tiene que ya sólo con las personas que han liderado la organización de este evento ya me podía hacer a la idea de que me iba a gustar lo allí visto y escuchado. Y la realidad lo confirmó.

El encuentro se basó en las experiencias de varias empresas en torno a la experiencia de cliente, o lo que es lo mismo, al cuidado, atención, detalles y método de trabajo orientado a mejorar el servicio que se proporciona a los clientes en el seno de un producto o servicio.

Dicho así puede que sorprenda que en esta casa, donde hablamos de experiencia de usuario, estemos mirando a los paisajes de la experiencia de cliente. Nada más lejos de la realidad. Estamos hablando de un mismo campo de trabajo: la mejora de la experiencia de usuario. Porque usuario es cliente, es ciudadano, es prescriptor, es candidato, es consumidor… El hecho diferencial radica en que los límites de las experiencias que ayer nos contaron las empresas asistentes no se quedaba en lo digital sino que lo transcendía, y nacía y aterrizaba en lo offline.

Y de ahí que me gustara, y mucho.

No es la primera vez que en este blog hablamos de propias experiencias de trabajo en las que hemos constatado que el trabajo de mejora de experiencia de usuario en el entorno digital nos lleva por los caminos del offline. De hecho hablamos de ello en UX Zaragoza aportando 3 casos en los que ese camino se había producido. Por ello, escuchar experiencias de empresas grandes y consolidadas como Iberia, ALSA, Opticalia o Bosch me gustó especialmente.

Vamos a repasar lo que más interesante me pareció de las experiencias que compartieron los asistentes a CX Meeting.

Para empezar fueron unos monstruos del diseño de servicios quienes abrieron la jornada: Fjord.

@stereochromo nos habló de lo que hacen en las oficinas de Fjord Madrid y nos contó cómo a través de un método de trabajo son capaces de convencer a sus clientes de que el diseño visual es sólo el 10% del trabajo en un proyecto, pese a que ese proyecto sea un proyecto de diseño.

David Arconada, de Iberia, nos contó de una forma excelente cómo están abordando las mejoras en experiencia de cliente en la compañía. Las claves: detalles de mejora en experiencia de cliente que se introducen dentro de procesos que ya existen y que, aporto, tienen un coste de implementación extraordinariamente poco significativo (especialmente si los comparamos con la ganancia en términos de fidelización). Fue la ponencia que más me gustó.

Virginia Fernández, de ALSA, nos explicó cómo incorporar la experiencia de cliente dentro de una compañía de transporte de viajeros por carretera, desde el momento en el que el departamento es unipersonal hasta que se consolida como equipo de trabajo estable y, lógicamente, más poblado de efectivos. Relató de una forma brillante cómo la mejora en la percepción del servicio se logra a través de una comunicación explícita y sistematizada de los procesos que ya se estaban ejecutando en la empresa. Virginia comunica estupendamente.

Jaime Compadre, de Bosch, nos contó cómo vender una plancha. Suena un poco a broma si lo dejamos con ese titular, pero desarrolló de forma amena y muy efectiva cómo a través de la investigación de usuarios se puede consolidar un naming para producto que es mucho más eficaz, comprensible y adoptable por parte de los usuarios.

Víctor Gonzalo, de Opticalia fue el golpe encima de la mesa del evento. Con un carisma extraordinario y una forma de comunicar que no pasaba desapercibida, detalló la estrategia seguida en Opticalia para alinear las expectativas de los usuarios cuando se compran unas gafas en el campo de la moda, de forma que se alejase del campo de la medicina o de la prótesis. Me pareció francamente brillante.

Mercedes Carreras, de la Xunta de Galicia, fue otro de los descubrimientos que hicieron que mi cerebro funcionase revolucionado después de su intervención. Contó cómo la Xunta de Galicia está implementando servicios en el ámbito sanitario que están pensados para adaptarse a las necesidades de los usuarios, ciudadanos en este caso, de forma que sean los servicios los que estén a disposición del usuario y no al contrario. Francamente esperanzador.

Dolors Pou, de User Zoom, ya conocida en los ámbitos de la UX y de este blog, nos contó cómo utilizar las herramientas de investigación de usuarios para resolver el ciclo completo de mejora de un producto digital (en el caso que nos contó, un e-commerce de gran dimensión). De un plumazo Dolors saltó del discurso que podemos escuchar en cualquier encuentro de usabilidad y UX a un discurso centrado en los servicios y en la experiencia global de cliente.

@abarbero estuvo hablando de Feebbo, y lo hizo con una naturalidad pasmosa. Me recordó a esas veces en las que cuando era estudiante y llegaba a un examen sabiendo que me iba a salir bien porque lo llevaba tan bien preparado y no me quedaba ninguna duda de que todo iba a ir bien. Me pareció especialmente brillante cómo contó que Feebbo interviene sólo en los contextos en los que el usuario es susceptible de contestar una encuesta dentro de un proceso de compra, localización de información o contratación de un servicio.

Hubo más, pero estas ponencias son las que más me gustaron y las que más me hicieron pensar. Y eso es algo que hace mucho que no me sucedía en un evento, la verdad.

Como conclusión lo que me quedó muy claro es que pude constatar que cuando hablamos de la experiencia de usuario debemos pensar, una y otra vez, en que el entorno digital no es sino una extensión del entorno offline. O si le queremos dar la vuelta, el entorno digital no lo debemos separar del entorno offline, ya sea porque los prestadores de servicios digitales tienen siempre una serie de condicionantes que residen en lo offline o, atención, porque los usuarios siempre, y digo siempre, tienen condicionantes que habitan en el offline. Porque hasta la fecha no se conoce ser humano que no sea de carne y hueso.

Obvio, pero conviene no olvidarlo.

Diferencia entre Arquitectura de la Información y Diseño de UX

¿Todo el mundo tiene clara la diferencia entre lo que es la Arquitectura de la Información y el Diseño de Experiencia de Usuario? Darren Northcott nos cuenta en su post “The Difference Between Information Architecture and UX Design” las diferencias entre estos dos campos y profesiones, además de proporcionarnos útiles consejos para comenzar en ambas, a pesar de que él mismo se define como un “arquitecto de experiencia de usuario”.

Yo he decidido hacer una traducción adaptada de este post, que os muestro a continuación.

Darren comienza su post exponiendo las definiciones que da la Wikipedia en versión inglesa de estos dos términos. Así, la Arquitectura de la información es “el arte y la ciencia de organización y etiquetado de sitios web… para apoyar la usabilidad”. Y la Experiencia de usuario es “la forma en la que una persona se siente al utilizar un producto, sistema o servicio. (Esto incluye) las percepciones de una persona en aspectos prácticos como la utilidad, facilidad de uso y eficiencia del sistema.”

De modo que en lo que respecta a su definición, la Experiencia de Usuario toma a la Arquitectura de la Información como su fundamento y lo lleva al siguiente nivel.

Planteado esto, Darren continúa exponiendo cinco apartados diferentes, como os muestro a continuación.

La arquitectura de información se refiere a la estructura

La arquitectura de la información es un término relativamente viejo. Viejo en el sentido de la web y de la progresión tecnológica.

La AI se centra en la organización y estructura del contenido de forma que el usuario pueda navegar por él. Digitalmente hablando, las variaciones son muchas, podemos tener desde un simple y sencillo sitio hasta un sistema de información complejo.

Los arquitectos de la información trabajan para crear estructuras de contenidos usables de complejos conjuntos de información. Y esto lo hacen utilizando multitud de métodos de diseño centrados en el usuario: tests de usabilidad, investigación y creación de “personas”, y diagramas de flujo de usuarios, entre otros.

Dicho esto, parece que el diseño de UX está de moda. Y el motivo es que la AI sólo comprende una pequeña parte de la experiencia general del usuario.

La experiencia de usuario se refiere a las emociones

¿Entonces qué es la experiencia de usuario? Los diseñadores de experiencia de usuario llevan un paso más allá la arquitectura de la información de un sitio, considerando no sólo su navegación, sino también la habilidad del usuario para realizar una acción, con el fin de facilitarle esta tarea. Para hacer esto, utilizan el diseño centrado en el usuario para generar una cohesión, previsible y deseable, que afecte a su público objetivo.

Esencialmente, los diseñadores de UX trabajan para hacer cosas más profundas, clasificando a sus usuarios en un nivel emocional. El diseño de UX añade un contexto y una historia del comportamiento natural de un usuario, lo que les permite llevarse algo de su experiencia.

Así pues, la Experiencia de Usuario es algo que abarca un gran espectro. Es como tomar una taza de Arquitectura de la Información, mezclado con una pizca de usabilidad, una pizca de estrategia de contenido y mucha creatividad. O, aún más simple, UX es el niño fruto del amor entre un director creativo y un arquitecto de información. Muchas veces esto significa quitar cosas quedándote sólo con la esencia de lo que el usuario necesita.

Haciéndolo fácil y cool

Si aún no estás completamente confundido, probablemente estés pensando que es necesaria una buena AI para tener una buena UX. Exacto. Otra forma de verlo es que los diseñadores de Experiencia de Usuario consideran la Arquitectura de la Información, pero que los arquitectos de información no consideran necesariamente toda la experiencia de sus usuarios.

Una experiencia usable es fácil, simple y permite hacer la tarea. Una experiencia atractiva hace todo eso e incluso impacta al usuario de forma duradera. Esa es la diferencia entre pensar “Ha sido fácil” y “Ha sido genial”, tras haber estado en un sitio haciendo algo.

Esa es la diferencia entre aplicaciones como Wunderlist y Clear.

Comparativa entre Wunderlist y Clear
Comparativa entre Wunderlist y Clear

O entre Skethbook y Paper.

Comparativa entre Sketchbook y Paper
Comparativa entre Skethbook y Paper

Las aplicaciones antiguas son herramientas buenas, fáciles y usables. Pero las nuevas no sólo son fáciles y usables, sino que también son divertidas y atractivas.

Esto es todo el planteamiento

En cuanto al flujo de trabajo de estas dos disciplinas abarcan enormes proporciones y tienen grandes diferencias.

Las necesidades de un arquitecto de información pueden ser investigar los objetivos de los usuarios y llevar a cabo algún tipo de análisis de la competencia. Y al final generan flujos de página, wireframes y, por supuesto, mapas de los sitios web. Se pueden incluir también como tareas hacer algún test de usabilidad, refinamiento y revisiones.

Los diseñadores de UX, a pesar de que tienen en cuenta el flujo de trabajo de la AI, también pueden considerar los objetivos emocionales del usuario final. Su comparación competitiva puede ser más alrededor de los modelos de interacción, en lugar de la estructura y el diseño.

Conclusión

La UX se basa en los fundamentos de la AI, con el objetivo de llevarla al siguiente nivel, tanto creativo como emocional. Esta es la diferencia clave que define cómo las aplicaciones, sitios web y productos de hoy en día son diseñados, al contrario de como eran diseñados los de antes.

Para aquellas personas que estén interesadas en conocer más del tema, Darren Northcott incluye una lista con diferentes recursos al final de su post.

Mucho tiempo sin escribir, de nuevo

Bueno pues no he desaparecido. Aunque lo parezca, que lo parece.

Desde hace varios meses lo que esta casa era, es otra cosa. Ya no es el blog de Daniel. O mejor dicho, ya no es sólo el blog de Daniel. O de @torresburriel. Desde hace varios meses podéis ver que por aquí escribe Verónica, que es la persona que se ha unido al estudio. Porque lo que desde 2003 era un blog personal/profesional ha terminado siendo la web del estudio que he montado.

He de reconocer que la comunicación de todos estos cambios no ha sido la mejor. En casa del herrero, cuchillo de palo. O eso dicen.

Torresburriel Estudio y UX Learn son las apuestas profesionales que ocupan mi tiempo, en mucha más medida de lo que pensé en su momento, desde hace años. Y así va a seguir siendo.

Quizá no escribo en el blog con la frecuencia que me gustaría, pero en todo este tiempo he tratado de seguir compartiendo lo que sé y lo que sigo aprendiendo en otros canales, Twitter generalmente. Aunque el firme propósito (formulado más de una vez, lo sé) es seguir haciéndolo aquí, en el blog.

Lo cierto y verdad es que el volumen de trabajo que manejamos deja poco margen para alimentar el blog, y eso siempre es bueno. Nos está dando la posibilidad de aprender un montón de todos los clientes con los que trabajamos, y nos está proporcionando una experiencia extraordinaria. Obviamente, nos ayuda también a pagar las facturas, que no es un tema menor.

En todo caso tenía la necesidad de escribir un poco para decir que seguimos aquí, que somos fácilmente localizables y que el trabajo de diseño de experiencia de usuario sigue siendo lo mejor que sabemos hacer. Pese a que no podemos dedicar todo el tiempo que nos gustaría sólo a lo estrictamente técnico-profesional, este blog va a seguir siendo ese sitio donde vamos a continuar publicando lo que hacemos, lo que aprendemos y lo que nos gusta y nos llama la atención.

Por el momento, y después de haber abandonado las retros semanales, seguimos embarcados en varios proyectos de diseño, formación y consultoría. 2014 está siendo un buen año profesional y trabajamos ya para planificar lo que haya de venir en 2015.

Cómo diseñar una web mobile

En estos meses de verano hemos estado trabajando con dos sitios web, uno de ellos dedicado a temas culturales y otro a temas de educación, para abordar el diseño de la versión mobile de cada uno. Y es que contar con una web mobile ahora es algo más que fundamental.

¿Y cómo debemos abordar el diseño de una web mobile? De manera general podemos distinguir dos formas:

  • Adaptar la web desktop a la versión mobile, es decir, construir una web responsive.
  • Llevar a cabo un diseño mobile first.

Mobile First vs Web Responsive
Diseño de una Web Responsive vs Mobile First

¿Qué es esto de mobile first? Se trata de comenzar un proyecto de diseño por la pantalla más pequeña e ir adaptándolo posteriormente a las más grandes. De esta forma lo que conseguimos es centrarnos en lo más importante, aquello imprescindible para la web de acuerdo a los objetivos que tenga, que se verá reflejado en la web mobile. Y así, al diseñar las webs del resto de dispositivos, no habrá más que aumentar el tamaño de los elementos e incorporar otros, si es necesario, conforme vaya creciendo el tamaño de la pantalla con la que se esté trabajando.

¿Pero esto siempre es factible? Tengo que decir que no. Es cierto que sería lo ideal y lo más aconsejado. Actualmente es vital que pensemos en todos los dispositivos posibles a través de los cuales nuestros usuarios pueden entrar en el sitio web, ya que no sabemos con cual lo van a hacer. Y además, cada vez hay más dispositivos y, por tanto, más tamaños de pantallas diferentes a los cuales hay que adaptar los sitios web, y utilizar la técnica de mobile first sería la mejor opción de optimizarlos.

Sin embargo, no siempre nos encontramos con la situación de partir de un proyecto desde cero en el cual poder abordar primero su versión móvil. Más bien sucede lo contrario. En la mayoría de los casos nos encontramos con clientes que ya tienen su web desktop y lo que quieren es adaptarla a la versión mobile.

En este caso la forma de trabajar es diferente y llevaremos a cabo acciones de diseño distintas dependiendo de los objetivos que se quieran satisfacer con la web mobile.

  • En un primer lugar habrá que seleccionar las pantallas que se desean incorporar en la versión móvil, dado que puede que no todas las que están en la versión desktop sean necesarias. Puede que haya pantallas innecesarias de acuerdo a los objetivos propuestos.
  • De forma similar, también habrá que eliminar los elementos (desde pequeños detalles hasta apartados completos) que no sean necesarios, nuevamente según los objetivos.
  • Por supuesto, se deberá diseñar una nueva cabecera, pie de página y el menú principal.
  • En general, habrá que adaptar todo el contenido:
    • Reduciendo el ancho.
    • Adaptando la tipografía.
    • Aumentando el tamaño de determinados elementos y/o destacándolos (mediante listas, recuadros, etc.) para que puedan verse fácilmente en la pantalla de menor tamaño y para que se pueda interactuar con ellos de forma táctil sin problemas.
    • Colocando un elemento debajo de otro, nunca en horizontal si esto va a complicar la interacción con ellos. Por ejemplo cuando hay varias opciones para seleccionar en un formulario.
    • Lista de opciones de un formulario en web desktop
      Lista de opciones de un formulario en web desktop

      Lista de opciones de un formulario de web mobile
      Lista de opciones de un formulario en web mobile

    • Creando botones en los casos en los que se facilite la interacción. Por ejemplo, un enlace a “ver más imágenes” puede convertirse en un botón en la versión mobile ya que, de esta forma, se ve más y es más fácil presionar el botón con el dedo.
    • Botón para ver más elementos
      Sustituir el enlace de “Ver todos los patrocinios” por un botón en la versión mobile de la web.

    • Además, se pueden crear nuevos elementos de interacción. Por ejemplo, en los datos de contacto, el número de teléfono puede ir seguido de un icono que permita llamar directamente al pulsarlo.

      Cabecera de una web mobile
      Cabecera de una web mobile con un icono junto al teléfono para llamar directamente al presionarlo.

      O por ejemplo, si en la versión desktop hay un mapa, en la mobile podemos quitarlo y poner un botón que lleve a la aplicación de Google Maps directamente.

    • Enlace directo a la app de Google Maps
      Botón con enlace directo a la app de Google Maps.

  • Y por supuesto, habrá que comprobar que todo se ha adaptado correctamente. Para ello tendremos que visualizar la web en todos los dispositivos posibles. Además podemos ayudarnos de herramientas como el Simulador de iOS donde podemos comprobar como se vería la web en un iPhone o un iPad. Aquí podéis consultar otros emuladores para testear el sitio web en dispositivos Android, Nokia, etc.
  • Simulador iOS
    Simulador iOS.

Estos son aspectos que yo tengo en cuenta, pero seguro que vosotros podéis contarnos otras acciones que lleváis a cabo a la hora de abordar el diseño de una web mobile.

Y en cuanto a lo comentado sobre el mobile first, ¿qué opináis?

Primera edición de UX Zaragoza

El pasado viernes 11 de julio celebramos la primera edición del evento UX Zaragoza, un proyecto nuestro, de Torresburriel Estudio, en el que además colaboraron Cachirulo Valley y Etopia.

En UX Zaragoza contamos con cuatro charlas sobre diseño de servicios y experiencia de usuarios, que paso a resumiros a continuación.

Adriano Latorre y Pablo Jimeno – Las cosicas del Lean UX

@adrianolatorre y @pablojimeno nos hablaron del proyecto que están llevando a cabo, Spines, e introdujeron la idea de “¿Cómo se integra la UX en un desarrollo ágil de producto?”. Ellos mismos respondieron que no lo saben, pero por eso mismo han estado cuatro meses experimentando. Decidieron llevar a cabo una Inception en Canfranc con el fin de entender el problema del proyecto y generar una serie de hipótesis acerca de éste. Tras esto, los pasos que siguieron fueron los siguientes:

  • Determinación de iteraciones.
  • Preocupación constante por la priorización.
  • Elección y uso de herramientas:
    • Daily (para las reuniones online)
    • Retrospectiva
    • Automatización
    • Mapas mentales
    • Wireframes
    • Guía de estilo
    • Backlog enriquecido
    • Accountability
    • All Together Now…
  • Hipótesis y validación:
    • Entrevistas
    • Experimentos
    • La métrica correcta
    • Dificultades            

Y terminaron concluyendo lo siguiente:

“Si la experiencia de usuario es algo que afecta a casi todos los aspectos de tu aplicación, ¿por qué no vas a permitir que se encargue todo el equipo, todo el tiempo, de ella?”

Podéis ver su presentación aquí.

Guillermo Latorre – La locura, esa facultad fundamental

@Superwillyfoc comenzó su ponencia diciéndonos que en las empresas habría que probar cosas nuevas dentro de un equipo de trabajo, habría que investigar e invertir en mejorar la experiencia de trabajo, dado que hacer estas “probatinas” o locuras conlleva numerosas ventajas. En Cuéntica, la empresa de la que Guillermo es socio fundador, han probado a hacer cosas nuevas y esto es lo que les ha aportado:

  • Motivación
  • Diversión y comodidad
  • Ideas
  • Solución de problemas eficaz y eficientemente
  • Creación de Equipo
  • Conocimiento de necesidades

Posteriormente nos habló y recomendó muchísimas herramientas que sustituyen a las “típicas y populares”, pero que tienen, incluso, más utilidades y ventajas que estas otras.

Dado el montón de herramientas que nos mostró no pude hacer otra cosa que hacer fotos todo el tiempo, por si acaso, aunque luego nos dijo que colgaría su presentación. Así que os cuento brevemente algunos detalles sólo de unas pocas.

Mapbox es una herramienta que sirve como sustituta de Google Maps y que además incluye nuevas cualidades: permite modificar un mapa como uno quiera, permite ponerlo en un sitio web sin problema, es totalmente responsive, etc. 


En cuanto a CMS’s, tenemos al gran WordPress, pero… resulta que Guillermo opina que el HTML está volviendo.


Independientemente de ello, nos recomendó dos CMS específicos para algo concreto:

  • Ghost es un CMS específico para Blogs.
  • Cinemática es específica para crear una página de vídeos donde puedes integrar tu canal de YouTube o de Vimeo.

Cambiando de tipología de herramientas por completo, tenemos, por ejemplo, a Freckle que sirve para imputar las horas trabajadas.

Y para que descubráis todas las demás herramientas que nos presentó os dejó aquí su presentación.

Como nota deciros que las que están marcadas en azul son las que Guillermo más recomienda y las marcadas en verde son españolas.

Daniel Torres Burriel – Service design de pueblo

@torresburriel nos mostró tres ejemplos de tres clientes con los que ha trabajado, con la finalidad de que conociéramos las implicaciones que tiene sobre toda la empresa la aplicación de conocimientos de diseño.

El primer caso que nos contó fue el de Cuéntica, cuyas implicaciones fueron las siguientes:

  • Cambio en la concepción de los servicios.
  • Cambio en los roles internos.  
  • Modificaciones en la estructura física de las instalaciones.

Como vemos, la aplicación de conocimientos de diseño sobre una empresa puede acarrear grandes cambios sobre esta.

En segundo lugar nos habló sobre Maestrex, cuyo objetivo era rediseñar el sitio web, lo que supuso estas implicaciones:

  • Aprendizaje de herramientas para la gestión de redes sociales. No hay que olvidar que estos clientes son expertos en lo que respecta a su ecommerce, y no tienen porqué saber de redes sociales.
  • Diseño de objetos para clientes en espacios de tiempo entre jornadas de aventuras.
  • Incremento de las interacciones post-venta en plataformas sociales, que genera nuevos leads.

Y por último, nos expuso el caso de la Fundación Genes y Gentes, en cuya web había que cambiar numerosas cosas y por ello se decidió tirarla y construirla de nuevo. Las implicaciones que tuvo fueron las siguientes:  

  • Cambio total en la orientación de la inversión: de la edición de libros a las campañas de publicidad online.
  • Modificación de las pautas de organización interna del trabajo: uso de herramientas de gestión digital.
  • Más personas involucradas en la organización.

Y para terminar, Daniel nos explicó los pasos que hay que seguir en un proceso de Service Design:

  • Inmersión
  • Ideación
  • Hipótesis
  • Prototipado
  • Validación
  • Análisis y corrección      

Os muestro seguidamente su presentación para que podáis echarle un vistazo.


Verónica Traynor – Falla rápido y barato, falla investigando  

 @verotraynor comenzó reflexionando sobre las pruebas de usabilidad, sosteniendo que cuando se hacen este tipo de pruebas se confunde lo que el usuario ve con lo que el usuario comprende, que no es lo mismo, en absoluto.

Así, para saber lo que un usuario ha visto (si hay visto una cosa determinada o no) nos podemos servir del proceso eye tracking. Pero esto lo hacemos con una simple máquina, por lo tanto no nos dice luego qué es lo que el usuario ha comprendido. Nos da resultados de lo que ha visto, pero ¿lo ha comprendido? Para ello debe haber gente que analice e interprete estos resultadosSin embargo, por el hecho de ser personas las que se encargan de esto, sacan percepciones subjetivas.

De modo que lo que se debe hacer a la hora de hacer pruebas de usabilidad son dos cosas:

  • En primer lugar, hay que generar hipótesis, hay que pensar por qué pasan determinadas cosas.
  • Y en segundo lugar, hay que comprobar estas hipótesis estudiando los datos reales (de analytics, etc.).        

Además de contarnos todo esto, Verónica nos mostró un ejemplo de un análisis de comportamiento de usuarios para analizar todo el proceso.


Si queréis ver su presentación podéis hacerlo aquí.

Como conclusión, fue una agradable tarde con interesantes ponencias, evidentemente para unos unas charlas serían más interesantes que otras ;) pero en general estuvo muy bien, así que espero que haya una segunda edición del UX Zaragoza.