UX vs UI: cuál es la diferencia

UX y UI suelen aparecer juntas, pero no significan lo mismo.

UI viene de user interface, o interfaz de usuario. UX viene de user experience, o experiencia de usuario.

La diferencia más simple es esta: UI se ocupa de la interfaz; UX se ocupa de la experiencia completa al utilizar un producto.

Qué es UI

La interfaz es la parte visible e interactiva de una aplicación o sitio web.

Incluye elementos como:

• botones;
• menús;
• formularios;
• colores;
• iconos;
• tipografías;
• tarjetas;
• espacios y jerarquías visuales.

El diseño de UI busca que esos elementos sean claros, consistentes y apropiados para el producto.

Qué es UX

UX observa una pregunta más amplia: ¿qué ocurre desde que una persona llega hasta que consigue lo que necesita?

Puede incluir:

• si entiende dónde empezar;
• si encuentra la información;
• si el proceso tiene pasos innecesarios;
• si sabe qué ocurrió después de pulsar un botón;
• si puede corregir un error;
• si la experiencia funciona bien en su dispositivo.

La interfaz influye en todo esto, pero no es el único factor.

Un ejemplo sencillo

Imagina una web para pedir una cita médica.

La UI incluye el aspecto del calendario, los botones y los campos del formulario.

La UX incluye también si hay horarios disponibles, si la persona entiende qué información debe introducir, si recibe confirmación y si puede modificar la cita después.

Un calendario bonito puede tener una UI cuidada y una UX mala si el proceso obliga a repetir datos o esconde los horarios disponibles.

No son disciplinas aisladas

En un proyecto real, UX y UI se influyen constantemente.

Una decisión de experiencia puede exigir un nuevo componente visual. Una decisión visual puede hacer más fácil o más difícil entender una función.

Por eso ambas suelen formar parte de un proceso mayor de diseño web, producto y desarrollo.

También importa el contexto

Una interfaz no se evalúa solo por si es moderna o atractiva.

El público, el dispositivo y la tarea cambian lo que funciona. Una aplicación utilizada durante unos segundos en la calle necesita decisiones distintas de una herramienta administrativa utilizada ocho horas al día.

Lo mismo ocurre con la tipografía: no existe una fuente correcta para todos los contextos. El caso de Comic Sans es un buen ejemplo de cómo una elección visual puede interpretarse de manera distinta según dónde aparezca.

Cómo recordar la diferencia

Una forma práctica es pensar así:

UI: ¿cómo se ve y cómo se controla?

UX: ¿cómo funciona la experiencia para la persona?

Una buena interfaz ayuda a una buena experiencia, pero la experiencia depende de muchas decisiones que van más allá de lo visual.