Proyecto Master UX

La Salle- Universidad Ramón Llull

Case Study- Your Europe

Entrevista Stakeholder

Nuestro cliente “Everis”, nos encargó resolver y aportar soluciones ante las necesidades de la web de “Your Europe”.

Your Europe, es una web gubernamental que forma parte de la web madre de la Comunidad Europea. La función principal de la misma es acercar la información a los ciudadanos europeos.

¿Cuales fueron las necesidades y preocupaciones del cliente?

  • Simplificar la información.
  • Creatividad.
  • Incorporar recursos estacionales.
  • Crear engagement para atraer más tráfico.

¿Cuales serían las necesidades de los usuarios?

  • Encontrar y descubrir la información.
  • Mitigar su carga cognitiva durante el proceso.
  • Encontrar una jerarquía de la información para así poder categorizarla.

A partir de estos datos, el equipo procedió a realizar un Estudio de Usabilidad mediante una evaluación heurística de la web y “Test de Guerrilla” con 4 usuarios. Los cuales aportaron información de valor. Al priorizar por matriz, los resultados más relevantes obtenidos fueron:

  • Reducir a una sola página de entrada.
  • Incorporar un menú fijo y desplegable.
  • Destacar contenido clave.
  • Ofrecer una jerarquía visual en la arquitectura de la información.
  • Ofrecer libertad de uso durante la navegación.

 

 

El siguiente paso en el proceso de investigación se procedió a realizar un Análisis de accesibilidad.

Los resultados más relevantes muestran, que las páginas de contenido así como la página de resultados eran de vital importancia para los usuarios.

Se crearon “user persona” que aportarían valor al análisis durante la investigación. Se encontró que la afectación más importante para los usuarios es “la visión”, seguida de afectaciones motrices y temas relacionados con la vejez.

Breve estudio Benchmarking en accesibilidad.

Con lo que se procedió a ofrecer las siguientes propuestas de mejora:

  • Reducir la entrada a una página principal de menú fijo, con lo que se consigue una navegación completa desde el inicio.
  • Ofrecer libertad de uso, con tal de acelerar el aprendizaje y disminuir la carga cognitiva a los usuarios.
  • Añadir avisos de información como redireccionamiento en la salida hacia otras webs.

Durante el proceso de Evaluación con usuarios, la cual fue realizada en base a test de tareas predefinidas con 8 usuarios, según las necesidades halladas y basadas en los procesos de investigación anteriores y las preocupaciones del cliente. Los resultados indicaron que los usuarios:

  • Reconocen a Your Europe como una web gubernamental.
  • Realizan una valoración positiva en la interacción.

Sin embargo, quedaron algunas áreas de evolución como:

  • Buscador.
  • Vocabulario inclusivo.
  • Aviso de redirección.

En este proceso de investigación, también se realizó una evaluación con 50 usuarios a partir del uso de “Card Sorting”, donde estos en su mapa mental categorizaban la información por reconociminento y/o asociación, además según el estado de temporalidad. Con lo que se realizaron las siguientes propuestas de mejora:

  • Categorizar y jerarquizar la información.

Conceptualización de Producto

Primeramente se desarrolló un previo y extenso análisis de la competencia, con un simil de webs en cuanto al concepto de Your Europe.

 

 

Gov.uk, destacaba por su arquitectura de la información en árbol. Ofrecía la posilidad de navegar tanto por categorías como por buscador de manera alfabética. Buen uso práctico de las breadcrumbs. Lenguaje inclusivo, claro y natural asemejandose al mundo real (Nielsen). Uso de estética minimalista, predominando el blanco y así reducir la carga cognitiva.

Amarillo.gov, destacaba por su menú, ya que englobaba todas las categorías, teniendo acceso al mismo mediante distintas opciones de interacción por búsqueda, navegación y/o manual, esto permitió reconocer que a usuarios más inseguros les permitía reconocer la información. Además Amarillo, ofrecía aviso de redireccionamiento y/o error.

Hel.fi, destacaba por ofrecer un buscador de múltiples resultados ofreciendo sugerencias de búsqueda. El menú al adaptarse como responsive en mobile reducía dimensiones. Uso de menaú desplegables con clara diferenciación entre contenido. Resaltar como rompía esquema visual en cuanto a web gubernamental, haciendo uso del color, tipografía y formas, ofreciendo así a la web más dinamismo durante su uso.

Manchester.gov.uk, destacaba por su buscador a partir de sugerencias a modo de sitemap. No tiene menú, la landing ofrece la información categorizada a partir de tarjetas por temática haciendo uso de la iconografía como reconocimiento de la información desde donde el usuario podía acceder a todo tipo de contenido en relación a la ciudad. Resaltar su acceso a las herrramientas de accesibilidad y sus varias ubicaciones para ofrecer ayuda al usuario, además estas incorporan el cambio de idioma para todo el contenido de la web incluso en Catalan y/o Euskera.

Además de una evaluación con 10 usuarios a partir de “tree test” y haciendo uso de 4 “user persona” y sus respectivos “user flow”.

Durante este proceso, los principales objetivos a destacar fueron:

  • Agilizar procedimientos durante la navegación.
  • Ofrecer una información sencilla, clara y concisa.
  • Realizar mejoras en accesibilidad.
  • Destacar por un diseño minimalista y funcional.

WIREFRAMES

HOME

PÁGINA INTERMEDIA

PÁGINA DE CONTENIDO

 

Como resultado final, se procedió a definir lo que sería la nueva Identidad visual (UI) para Your Europe.

PROTOTYPES

La base del rediseño se apoya en un Look & Feel minimalista, donde los detalles han sido particularmente cuidados.

El uso del color y las tipografías juegan un papel importante, ya que el contenido, ofrecer información a los ciudadanos es la finalidad principal de Your Europe.

Se ha querido conseguir un engagement visual y así poder hacer partícipe al usuario desde la landing.

¿cómo?

Ofreciendo libertad de uso, proporcionando al usuario varios puntos de entrada al contenido, menú fijo desplegable y desde el uso del buscador a partir de palabras clave en caso de ser necesario.

Como solución al concepto de Your Europe, donde anteriormente no quedaba del todo claro a nuestros usuarios, se ha incorporado un mensaje de bienvenida, haciendo uso de un vocabulario inclusivo, sencillo y claro.

“Somos Your Europe”

Seguidamente es apoyado de “copywriting“, que sirve al usuario a modo de puerta de entrada hacia el contenido.

Your Europe Citizens / Your Europe Business

Se consideró que una manera de crear inclusividad es haciendo participe al usuario, incorporando elementos interactivos de temporalidad que propicien su curiosidad, como en el caso de la sección de “lo más visto” y “eventos” y así poder acceder al contenido de interés.

El objetivo principal, sin perder la identidad corporativa que define a Your Europe, era crear una imagen fresca y actual, manteniendo su gama cromática y sin romper radicalmente su estética corporativa.

El color “acento” informa al usuario que refiere a elementos de interacción, así como el ” amarillo corporativo” a elementos a destacar.  Estos han sido utilizados a su vez como puntos de luz que rompen con la monocromía.

Se ha incorporado el uso de la iconografía, como refuerzo visual de la información.

Los usuarios se encontraban con la dificultad en páginas de contenido de textos densos, con tal de seguir ofreciendo libertad de uso durante la navegación se ha incorporado la opción “ver más”. Esta acción sugiere al usuario la posibilidad de seguir con la lectura en caso de ser necesario o bien continuar en su búsqueda.

 

 

Una solución aportada tanto al cliente como a los usuarios en cuanto a accesibilidad se refiere, es hacer uso del buscador al actual estea modo de sugerencias incluyendo palabras clave, como apoyo de reconocimiento y ayuda al usuario en su búsqueda de la información. Mejorando a su vez la usabilidad, destacando enlaces externos, que informan al usuario que va a ser redirigido hacia otro portal web.

 

 

¡Gracias!

 

 

 

 

 

© Design índica. All rights reserved.