A la hora de diseñar una web basada en la experiencia de usuario es necesario pensar en nuestro target, como normalmente no somos adivinos, la mejor forma de saber cómo piensan es a través de la investigación. De hecho, cualquier acción comunicativa parte siempre de una estrategia desarrollada a partir de la investigación, ya que siempre va dirigida a un público y debe cumplir unos objetivos específicos.
Hay muchas metodologías con las que podemos obtener datos necesarios para realizar un diseño centrado en el usuario óptimo en cuanto a usabilidad, identidad visual, estructura de la información, etc. La profundidad de la investigación dependerá sobre todo del presupuesto que tengamos para la evaluación de la web antes y después de su lanzamiento.
Estos son los pasos teóricos a seguir antes de desarrollar una web nueva centrada en el usuario. Lo ideal es poner en práctica la mayor parte de las acciones, pero como decíamos, dependerá en gran medida del presupuesto y de las necesidades de la web. No existe una regla fija.
Metodologías
1. Entrevistas por teléfono, email y personales: Son necesarias para conocer las necesidades de los usuarios finales. Con esta técnica podríamos saber qué tipo de productos prefiere nuestro público objetivo, cuál compraría, qué rasgo de identidad (del producto) tiene más importancia para ellos, cómo prefiere que sea el proceso de compra y la modalidad de pago, qué importancia le da a las imágenes, qué contenido es imprescindible que aparezca en los textos descriptivos de producto, etc…
Utilizaríamos el teléfono y el contacto personal para obtener datos cualitativos con el fin de entender bien los motivos y razones de las respuestas de los participantes y el email para la obtención de datos cuantitativos con los que podríamos elaborar estadísticas también útiles para el diseño y estructura de la web, además resulta un método más económico para llegar a un mayor número de personas y configurar así una muestra mayor.
2. Análisis de la competencia: Es imprescindible conocer tu competencia al empezar un nuevo negocio. Observar otras empresas puede inspirarnos para que se nos ocurran buenas ideas para la web y nos permite detectar y aprender de sus fallos. También nos ayuda a planificar nuestra estrategia de venta y comunicación y a definir nuestra diferenciación y promesa. Si somos idénticos a la competencia, ¿por qué el consumidor va a elegirnos a nosotros?
3. Personas: Es indispensable definir el público objetivo al que nos dirigimos para poder focalizar nuestros esfuerzos y presupuesto en una dirección coherente y eficaz. Así, todos los elementos y aspectos de la web se pensarán en función de esas personas y no de otras. Es la manera de conseguir que la página sea relevante para quienes nos interesan, así sentirán (experiencia) que están en el lugar adecuado para solucionar su “problema” y fomentaremos la conversión. Sedeben crear distintos perfiles en diferentes contextos.
Un ejemplo de una posible persona para una web de venta de quesos gourmet:
Sara Sanz, ama de casa, 45 años, clase social media, media-alta. Tiene estudios superiores pero decidió abandonar el mercado laboral para cuidar a sus hijos y ocuparse de la casa. Vive a las afueras de la ciudad, en una zona residencial de chalets y pisos grandes. Le interesa la gastronomía y valora positivamente los productos diferentes que le aporten nuevos sabores y experiencias a su paladar. En su compra y consumo diario, le da importancia a lo natural y a la procedencia de los productos. Le gusta organizar fiestas en su casa con familia y amigos y busca diferenciarse por los productos que les ofrece, evita la vulgaridad.
Sara es usuaria habitual de Internet, para navegar y comprar online utiliza indistintamente el móvil y el portátil. Constantemente busca ideas culinarias en la red ya sea para eventos o para su vida diaria y puede hacerlo casi a cualquier hora del día, ya que es libre de organizar sus tareas al ser ama de casa.
4. Inventario de contenidos: Es el resultado de evaluar y catalogar los contenidos que formarán parte de la web. Suele clasificarse según los siguientes parámetros: formatos (html, pdf, etc), títulos, palabras clave, descripciones, categorías, autores o responsables, fechas de actualización, etc. Si la web tiene muchos productos, utilizar este método nos ayudará a visualizar y recopilar todos los contenidos para que todo sea coherente y no nos encontremos posteriormente con que nos falta algo, lo que pudiera desequilibrar el desarrollo de la página.
5. Card Sorting: Se utiliza para estudiar la estructura de los contenidos y categorizarlos. El participante (usuario final) debe ordenar los contenidos según su criterio. Con este test comprobaremos cómo prefieren organizar la información los participantes, la similitud y diferencias entre las categorías que utilizan, qué categorías elijen como principales y cómo llamarían a cada categoría.
Es importante que los usuarios participen en la categorización y ordenación de contenidos, incluso en su nomenclatura para que resulte lo más identificable y coherente para ellos. Conocer la forma en que organizarían los productos y saber los nombres que pondrían a cada grupo, nos ayuda a estar más cerca de cómo piensan. Según las similitudes y diferencias en que organicen los productos y cómo nombren las categorías sabremos cuál es la forma que les resulta a la mayoría más sencilla, clara e intuitiva. Podría ocurrir que por darle ciertos nombres a las categorías más correctos dentro del sector resultaran menos atrayentes o más confusos para los consumidores o por ejemplo, volviendo al caso de los quesos gourmet, podríamos pensar que organizar los productos por su origen animal (vaca, cabra, oveja) es la opción más correcta, en cambio los consumidores potenciales prefieran según su grado de curación.
6. Diseño de la interacción (IxD): Es necesario diseñar un mapa previo (teniendo en cuenta los resultados de la Card Sorting) para ver de qué manera el usuario va a poder navegar (si habrá miga de pan, la facilidad de volver a la página inicio, si se pondrán productos relacionados…), cómo accederá a los contenidos, qué controles tendrá a su alcance (por ejemplo un buscador interno), cuántos pasos habrá en cada proceso (proceso de compra, de suscripción…). El diseñador de interacción debe realizar mapas que ilustren detalladamente cómo van a ser los procesos para que resulten fáciles y útiles de usar para el usuario. Además de definir todos los pasos de un proceso, hay que evaluar qué sucederá si se produce un error del sistema o el usuario no introduce correctamente los datos en un formulario, ya sea para suscribirse o al rellenar los datos de envío del producto, por si esto ocurre habrá que determinar cuál será el mensaje para qué este se dé cuenta y corrija el error.
7. Arquitectura de la información (IA): Este análisis nos servirá para determinar la colocación de los elementos de la página (imágenes, títulos, textos descriptivos, precio, botón para comprar……), se trata de la habilidad para colocar los elementos de forma clara, agradable, equilibrada, funcional y escalable.
Si nuestra macro-conversión es la venta, deberemos tener especial atención en la estructura de la información del proceso de compra para que al usuario le resulte lo más clara posible y no pueda equivocarse o le entren dudas sobre si continuar con ella.
La misión de un arquitecto de la información es estudiar el diseño de la interacción, establecer patrones de contenidos y navegación y preparar los esquemas necesarios para la elaboración de los prototipos.
8. Codiseño: Paralelamente al diseño de la interacción y a la arquitectura de la información se puede realizar un codiseño que consiste en hacer participar a los usuarios o stakeholders en el proceso de diseñar y realizar la arquitectura de una web. Con los resultados podemos detectar patrones comunes entre los participantes y compararlos con nuestro diseño para comprobar si las funcionalidades van a resultarles interesantes.
9. Prototipo: Crearemos un prototipo para que pueda ser probado por los usuarios y así comprobar si el trabajo realizado en interacción y arquitectura coincide con sus preferencias y necesidades, en ese caso vamos por el buen camino. Hay 2 tipos de prototipos:
- Prototipo de baja fidelidad: se suele realizar en papel y lápiz o herramientas de prototipado rápido como Balsamiq o iPlotz. Éste suele ofrecer una idea de los elementos que componen la web sin entrar en detalle.
- Prototipo de alta fidelidad: es más detallado que el de bajo nivel y está pensado para evaluar una arquitectura más elaborada, interacciones más precisas y respuestas del sistema más eficaces. Hay que evitar incluir demasiados elementos del diseño visual, para que los participantes no desvíen su atención hacia ellos y se centren en el funcionamiento de la web. Algunas herramientas útiles son Axure o JustInMind.
Una vez desarrollada la web según los hallazgos anteriores, necesitaremos poner en práctica:
Métodos de prueba y evaluación (en función de nuestras necesidades y presupuesto)
10. Test heurísticos: Consiste en que uno o dos expertos (si queremos comparar sus resultados) analicen los posibles problemas de usabilidad de la web según el diseño de interfaz, tareas y casos de uso. Así conseguimos un primer filtro para detectar problemas antes de hacer las pruebas finales con el usuario.
Los posibles problemas se categorizan según los principios de usabilidad (llamados heurísticos) y se les asigna una puntuación en función del impacto que tiene sobre el usuario o el caso de uso.
Entre los principios heurísticos o de usabilidad más conocidos están los principios de Nielsen, los principios cognitivos de ingeniería Gerhardt-Powals o la clasificación Weinschenk-Barker, entre otros.
Ejemplo siguiendo los principios de Nielsen:
- Principios heurísticos de Nielsen:
- Visibilidad del estado del Sistema.
- Adecuación entre el sistema y el mundo real.
- Control y libertad del usuario.
- Consistencia y estándares.
- Prevención de errores.
- Reconocer mejor que recordar.
- Flexibilidad y eficiencia de uso.
- Estética y diseño minimalista.
- Ayudar a los usuarios a reconocer, diagnosticar y solucionar errores.
- Ayuda y documentación.
Función | Principio | Hipótesis | Impacto (0-5) |
El sistema no indica posibles errores de formato antes de enviar el formulario | Prevención de errores | Para evitar que el usuario tenga que corregir datos del formulario, es recomendable que el sistema reconozca si el formato es correcto o no después de rellenar cada campo. | 3 |
11. Test de percepción: Este test nos revela la primera impresión que da nuestra web. Necesitamos que la web se vea relevante en función del resultado de búsqueda del usuario y del servicio y producto que ofrecemos.
En un primer vistazo el usuario debe captar que se encuentra ante una página que ofrece lo que busca, si no podría abandonarla creyendo que ésta no cubre sus necesidades. Además, a través de su percepción podremos saber si hemos conseguido con la identidad visual y el diseño que la web coincida con el posicionamiento e imagen de marca que queremos para la empresa.
El test consiste en mostrar una página al participante durante un periodo de tiempo corto (de 2 a 5 segundos) y realizarle una serie de preguntas sobre ella: si es agradable, cuál es su temática, la cantidad de contenido es adecuado, qué funciones cree que puede realizar…
12. Entrevistas en tareas (Voice of Customer): Esta técnica ofrece mucho feedback, consiste en hacerle una pequeña entrevista al usuario mientras realiza una tarea determinada. Las preguntas son:
¿Qué has venido a hacer?
¿Has conseguido hacer lo que pretendías?
Si lo has conseguido, ¿Cómo evaluarías tu experiencia?
Si no lo has conseguido, ¿Por qué no lo has conseguido?
13. Análisis de clics, mapas de recorrido y eye-tracking: Con estos análisis sabremos dónde hacen clics los usuarios o dónde centran su atención visual.
En el análisis de clic observaremos la eficacia de los elementos que componen una página, es decir los más clicados. Además, descubriremos si hay zonas en que los usuarios hacen clic pensando que hay un enlace que no existe realmente.
Con el mapa de recorrido vemos el movimiento del ratón por la web o la atención visual que sigue el usuario (mediante el eye-tracking), lo que nos ayuda a saber que elementos atraen más la atención del usuario y en qué orden, esto nos llevará a pensar si sucede lo que queremos o debemos hacer modificaciones para intentar cambiar ese recorrido.
También se puede estudiar el mapa de calor, en el cual veremos las zonas con las que el usuario interacciona más. Este mapa puede generarse a partir de clics, zonas de mayor recorrido con el ratón o de mayor atención visual a través de técnicas de eye-tracking y nos indica que áreas quedan ocultas para el usuario y por tanto donde no deberíamos poner ningún texto o acción importante.
14. Test A/B y multivariante: El primero consiste en presentar dos propuestas de diseño o arquitectura de una página a diferentes usuarios. En el test multivariante en cambio, se presenta la misma página con pequeñas variaciones: imágenes, tipografías, tamaños, colores, textos, posiciones…
En ambos test se analiza cuál de las propuestas ofrece un mejor ratio de conversión.
15. Test con usuarios: Se observa el comportamiento de los usuarios mientras navegan por la página a partir de unas tareas definidas. Pueden ser presenciales o remotos:
- Presenciales: observaremos cómo el usuario interactúa con el sistema y recogeremos sus opiniones o comentarios. En principio no debemos intervenir, si el usuario necesitará asistencia podríamos dársela apuntando el hecho y los motivos. Pueden ser informales (de forma improvisada mediante conocidos) o formales (con usuarios reales en un laboratorio preparado para la grabación de vídeo y audio). Los datos que se obtienen son cualitativos pues conoceremos las motivaciones y razones del comportamiento del usuario.
- Remotos: se hacen a distancia utilizando alguna herramienta. Se le indica al usuario qué debe hacer y se graban sus movimientos de ratón y teclado. Resultan más económicos, por lo que se puede conseguir una muestra de individuos más amplia y significativa, aunque tiene la desventaja de no poder recoger los comentarios de los usuarios. Algunas herramientas para realizar estos test son Loop11, Clicktale, Usertesting.com, Open Hallway, Userlytics, TryMyUI o Userzoom.
Este test se realiza al final del proyecto y nos aporta información de gran importancia (“la prueba de fuego”), pues es el usuario final al que nos dirigimos el que evalúa todo el trabajo realizado, detecta los problemas y nos comunica la experiencia que le suscita la página. Su comportamiento y opiniones nos interesan porque es el público que después tendrá que navegar por ella y comprar. Con la información podremos hacer ajustes o solucionar fallos.