Cada vez es más frecuente encontrarse con las siglas UX y UI cuando hablamos de diseño web. Pero, ¿tienes claro qué es cada uno de los términos? y ¿por qué es importante tenerlos en cuenta a la hora de diseñar tu página web?
UX o experiencia de usuario
El término UX viene del inglés, user experience, literalmente experiencia de usuario. Y se refiere a la experiencia que tiene cualquier persona al utilizar un producto, un programa o una aplicación web por ejemplo. Aplicado a tu página web, se refiere a cómo se siente la persona que la utiliza durante su manejo, haciendo tareas como buscar información, comprar algo, suscribirse, enviarte un correo, etc.
Si yo entro en tu web, no me queda claro lo que haces desde el primer momento, no encuentro lo que busco fácilmente, tengo que hacer 4 clicks para encontrar tu información de contacto... y luego rellenar el formulario 3 veces porque es muy complejo y me equivoco fácilmente... mi experiencia será bastante negativa.
Pero si por el contrario, encuentro fácilmente la información y enseguida puedo enviarte un email a través del formulario, mi experiencia será bastante gratificante.
Y es que navegando por una página web podemos sentir todo tipo de sentimientos: frustración, enojo, impaciencia, satisfacción, empatía, alegría...
Obviamente una buena experiencia de usuario se asocia a una mayor consecución de tus objetivos: más visitas, visitas más duraderas, más suscripciones, más contactos y más ventas.
¿Y qué es UI?
Pues UI son las siglas de user interfaz, interfaz de usuario. Según Wikipedia, "la interfaz de usuario es el espacio donde se producen las interacciones entre seres humanos y máquinas.". Las interfaces básicas de usuario, como puede ser una página web, incluyen menús, ventanas, elementos gráfico (imágenes), el cursor moviéndose por la pantalla, los sonidos... y cualquier otro canal que permite la comunicación entre la persona y, en el caso de una página web, el programa.
El objetivo al diseñar una interfaz debe de ser que sea atractiva y que el aprendizaje de uso para una persona no experimentada, sea intuitivo y sencillo.
Y las principales diferencias entre ambas son:
UX
- Se aplica a productos digitales o físicos.
- Se refiere a la experiencia completa, durante toda la interacción, de principio a fin.
- Se centra en encontrar soluciones estructurales a las principales dificultades que encuentran las personas usuarias durante su viaje dentro de la aplicación.
- El resultado son aplicaciones que encantan al usuario porque producen satisfacción al usarlas por su efectividad. No se centra en la estética de las mismas.
- Su objetivo principal es resolver los problemas con los que se encuentran las personas usuarias.
UI
- UI se refiere al diseño de la primera experiencia estética de una persona usuaria con un producto.
- Se aplica solo a productos digitales.
- Implica elección de paletas de color, espaciados, combinaciones entre tipografías, diseño responsive.
- El resultado es un producto que encanta estéticamente a las personas usuarias.
- Su principal objetivo es crear interfaces interactivas que resulten atractivas y cuyo aprendizaje de uso sea intuitivo.
¿Cómo se combinan en un buen diseño UX y UI?
UX y UI deben de ir de la mano porque ambas son cruciales. Un buen diseño web parte de la UX y sigue con la UI para conseguir una página fácil y agradable durante el uso que además es estéticamente atractiva e intuitiva.
Una página web que estéticamente es muy atractiva pero que es muy complicada a la hora de usarla, sería un buen ejemplo de buen UI y mal UX. Mientras que una interfaz muy fácil de usar pero con una estética muy pobre, es un buen ejemplo de buen UX y mal UI. (Helga Moreno, The Gap Between UX And UI Design).
Así que al plantearse el diseño de una web, aplicamos los conocimientos de UX para diseñar los caminos que seguirán las personas para conseguir los objetivos dentro de la página de manera fácil y agradable (encontrar información, suscribirse, contactar, etc.) y luego usaremos los conocimientos de UI para que la estética acompañe y facilite esos procesos.
Algunos ejemplos
- La web de compra online de Mercadona. Es un claro ejemplo de mal UI y UX que deja mucho que desear. La estética deja mucho que desear, no es responsive y te encuentras con muchos obstáculos por el camino que te llevan a tener que repetir tareas porque es muy fácil equivocarse (y no solo la primera vez que lo usas).
- la web de compra online de Carrefour. Es un ejemplo de buen UX y UI. Perfecto para sus objetivos y funciones. Es fácil encontrar lo que buscas y el proceso es intuitivo, estéticamente agradable y libre de frustraciones.
- El proveedor de hosting Siteground. Un ejemplo de UI bueno pero UX que a veces resulta desesperante. Aunque está hecho deliberadamente. Ellos quieren que tú te soluciones los problemas sin recurrir a su equipo técnico. Así que intentan facilitar el camino para que encuentres soluciones por ti mismo, dificultando enormemente el que te puedas poner en contacto con ellos. Algo que es muy frustrante porque no está muy bien conseguido y la mayor parte de las veces necesitas contactar y encontrar el acceso a la ayuda es odioso.