Qué es UX/UI

¿Qué es UX UI?

UX UI son las siglas de dos trabajos que se hacen juntos sobre una web o una app. UX viene del inglés user experience, que significa experiencia de usuario, y UI de user interface, interfaz de usuario. Por eso al UX/UI también se le llama diseño de experiencia e interfaz de usuario, y preguntar qué es diseño UX UI es lo mismo que preguntar qué es UX UI.

Según el Nielsen Norman Group, la experiencia de usuario abarca todos los aspectos de la interacción de una persona con la empresa, sus servicios y sus productos. En una web eso va desde que la persona llega a tu página hasta que logra escribirte, reservar o comprar.

En un negocio, el UX/UI decide si quien llega entiende qué vendes, si encuentra tu precio o tu contacto y si puede enviarte un mensaje sin perderse en el camino.

¿Qué es UX en un sitio web?

El UX, o experiencia de usuario, es lo que vive una persona cuando usa tu web. Tiene que ver con si entiende para qué sirve, si encuentra lo que busca y si logra lo que vino a hacer, como pedir una cotización o reservar una fecha.

Una parte del UX es la usabilidad, que mide qué tan fácil es usar algo. El Nielsen Norman Group la define con cinco componentes, que se leen como cinco preguntas sobre tu web:

• Aprender. ¿Un cliente nuevo sabe qué hacer la primera vez que entra?
• Rapidez. Cuando ya sabe usarla, ¿cuánto demora en hacer lo que vino a hacer?
• Recordar. Si vuelve después de un tiempo, ¿se acuerda de cómo se usa?
• Errores. ¿Se equivoca seguido, por ejemplo al llenar un formulario, y puede corregirlo con facilidad?
• Agrado. ¿Le resulta cómodo usarla?

Esto pesa en un negocio porque, en internet, si una web es difícil de usar, la gente se va. El mismo grupo advierte que pasa igual cuando la página de inicio no dice con claridad qué ofrece la empresa ni qué se puede hacer ahí.

¿Qué es UI?

El UI, o interfaz de usuario, es todo lo que la persona ve y usa en la pantalla para interactuar con tu web. Son los botones, los enlaces, los formularios, los menús, los colores, el tamaño de las letras y las imágenes.

El W3C, que publica el estándar de accesibilidad WCAG, llama componentes de interfaz de usuario a las partes del contenido que la persona percibe como un solo control para una función, entre ellas los formularios y los enlaces.

Un buen UI hace que lo importante se vea. Un ejemplo es el contraste entre las letras y el fondo. En su nivel AA, la WCAG 2.2 pide una relación de contraste de al menos 4,5 a 1 para el texto normal, porque hay personas que no pueden leer un texto tenue. En el celular, además, cada elemento tiene que leerse y usarse bien en una pantalla pequeña.

¿Cuál es la diferencia entre UX y UI?

El UX es la experiencia completa de la persona con tu web, y el UI es la parte de esa experiencia que se ve y se usa en la pantalla. El Nielsen Norman Group pide distinguir la experiencia de usuario total de la interfaz, aunque la interfaz sea una parte muy importante del diseño.

Una web puede tener botones y letras muy bien cuidados, que es el UI, y aun así dejar a la persona sin lo que buscaba, que es el UX. El mismo grupo lo muestra con una web de reseñas de películas, donde aunque la interfaz para buscar una película sea perfecta, la experiencia es mala si el catálogo no incluye lo que la persona quiere ver.

¿Puedes darme un ejemplo de diseño UX UI?

Con esos cambios, quien organiza su matrimonio llega al botón de cotizar en pocos pasos y entiende qué pasa después. Con la medición, el negocio ve en qué paso se queda cada visita y qué ajustar primero.

¿Qué hace un diseñador UX UI?

Un diseñador UX UI se ocupa de que una web o una app se entienda, se use sin esfuerzo y se vea bien. Su trabajo sigue cuatro pasos que se repiten hasta que la web funciona como debe.

Según el Nielsen Norman Group, el método más básico y útil para probar es la prueba con usuarios. Se reúne a personas que se parezcan a tus clientes, se les pide que hagan tareas típicas con el diseño y se observa qué hacen y dónde tropiezan. El mismo grupo recomienda empezar a probar desde el inicio del diseño y seguir probando en cada paso.

El diseño UX UI trabaja sobre el diseño web. El diseño web arma las páginas de tu sitio, con su estructura, su aspecto y su programación. El diseño UX UI revisa cómo esas páginas se usan y se ven, y las ajusta para que más visitas terminen escribiéndote, reservando o comprando. Por eso en un proyecto suelen trabajar juntos quien diseña la experiencia y quien desarrolla la web.

¿Cómo mejorar la experiencia de usuario de tu web?

Mira tu web como la vería un cliente nuevo, desde el celular. Si empiezas hoy, este es un buen orden:

• Que se entienda qué vendes en la primera pantalla, con el nombre de tu servicio, para quién es y un botón claro para escribirte o cotizar. El Nielsen Norman Group advierte que si la página de inicio no dice con claridad qué ofreces ni qué se puede hacer ahí, la gente se va.
• Que lo principal se distinga del resto. Al evaluar la experiencia en la página, Google se pregunta si está diseñada para que los visitantes distingan fácilmente el contenido principal del resto.
• Menos opciones en cada pantalla. Según la ley de Hick, el tiempo para decidir aumenta con el número y la complejidad de las opciones. Un menú corto y un botón principal ayudan a decidir.
• Botones fáciles de usar con el dedo. La WCAG 2.2 pide que los controles midan al menos 24 por 24 píxeles CSS, con algunas excepciones. Y según la ley de Fitts, el tiempo para llegar a un objetivo depende de su distancia y de su tamaño.
• Un formulario corto, que pida solo lo necesario para responderte, como nombre, teléfono y qué necesita la persona.
• Prueba con clientes y mide. Pídele a algunos clientes que hagan una tarea en tu web, como cotizar, y mira dónde tropieza. Con la analítica de tu web ves en qué página se va cada visita.

La experiencia de tu página también cuenta para Google. Su documentación explica que no hay un solo aspecto que decida, y que conviene ofrecer una buena experiencia general en la página en muchos aspectos. Si quieres ver cómo se junta con tu posicionamiento, revisa qué es SEO.