seccion-8-blog-1

mbudo Blog

¿Qué son y en qué se diferencian el UX , UI e IxD?

por Silvia Martínez Pascual
0 Comments

Seguro que más de una vez te has encontrado con las siglas UX (User Experience), UI (User Interface) e IxD (Interaction Design) sin saber muy bien a qué se refieren. En el mejor de los casos, si eres de los que ya ha tenido un primer contacto con estos términos, es posible que no tengas muy claro donde radican sus diferencias...

Y es que, si bien es cierto que hablamos de conceptos del ámbito del diseño gráfico estrechamente relacionados entre sí, estos se utilizan en numerosas ocasiones indistintamente dando lugar a confusiones más que justificadas.

Si te gustaría poder implementar estas disciplinas en tu sitio web y quieres tener un primer acercamiento a las mismas, a continuación te enseñaremos todo lo que necesitas saber para lograrlo:

 

1.-UX / USER EXPERIENCE

UX
 

UX son las siglas en inglés de User Experience, o lo que es lo mismo, Experiencia de Usuario, y como su propio nombre indica, se refiere a la experiencia que un usuario tiene antes de haber visitado nuestro sitio web, durante el tiempo que ha estado visitando el mismo y una vez finalizada la interacción.

Por este motivo el usuario es una pieza clave fundamental dentro del UX y, una vez más, se convierte en el centro de la estrategia.

Su importancia radica en que todas las acciones llevadas a cabo dentro de User Experience tienen como objetivo conocer con exactitud las preferencias y los comportamientos de nuestros usuarios dentro de nuestra web, con la finalidad de poder ofrecerles nuestro contenido de una forma que les resulte cómoda y agradable. En última instancia, esto hará no solo que permanezcan en nuestra página durante más tiempo, sino que recurran a ella siempre que puedan.

Existen diversas formas de comprobar cuán satisfactoria es la experiencia que nuestros usuarios perciben en nuestra página, pudiendo ser estas directas, si se realizan cara a cara con el usuario, o indirectas si se permite que él mismo interactúe por su cuenta sin la intervención de un agente externo.

  • Comprobaciones internas: se realizan “en persona”, lo que nos permite poder preguntarle al usuario todo aquello que deseemos saber. De este modo no solo sabremos qué acciones realiza, también sabremos el porqué:
    • Entrevistas
    • Prueba de producto
  • Comprobaciones externas: nos permiten conocer qué acciones lleva a cabo un usuario, pero no las razones por las que las ejecuta:
    • Test A/B: consisten en realizar dos diseños exactamente iguales en los solo se modifica aquello que se quiere comprobar (por ejemplo, el botón de descargar en color verde o azul) y verificar cuál de las dos opciones ha generado mejores resultados.
    • Heat Maps: o lo que es lo mismo, mapas de calor. Son mapas en los cuales se representa, mediante colores, los lugares donde nuestros usuarios dirigen la mirada durante mas tiempo y los que menos.
      Generalmente los colores empleados van del rojo, para representar aquellas zonas donde los usuarios miran durante más tiempo, al azul, para representar los que no captan su atención, pasando por el naranja para los campos que cuentan con una atención moderada, amarillo para los que lo hacen con una atención media y verde para aquellos a los que el usuario les presta una atención baja.
    • Click maps: sirven para comprobar en qué lugares de nuestra página o sobre qué opciones tienden a clicar nuestros usuarios. Esto nos permitirá saber, por ejemplo, dónde deberemos ubicar el botón que lleve a realizar a nuestros usuarios la acción que más nos beneficie.


2.- UI / USER INTERFACE

UIEl acrónimo UI procede del concepto inglés User Interface, que en castellano significa Diseño de Interfaces.

Se centra en todo lo relacionado con lo que nuestro usuario ve en la pantalla más que en la experiencia que este experimenta al interactuar con lo que está observando.

Dicho de otro modo, para evaluar la experiencia de un usuario al interaccionar con algo, como por ejemplo nuestra interfaz, tiene que haber algo con lo que interactuar: de esto es de lo que se encarga el User Interface.

Cabe destacar que, el UI, más que centrarse en la parte estética de nuestro site, como los colores, formas y tipografías que utilizaremos, el estilo que emplearemos, las imágenes a incluir, etc, lo hace en la distribución de los elementos que conformarán nuestra web: ¿dónde podremos el encabezado? ¿En qué lugar colocaremos las imágenes? ¿Cuánto espacio ocuparán?

Una vez creada nuestra interfaz, nos serviremos del UX y los resultados de sus comprobaciones para modificar todo aquello que sea necesario.

 

3.- IxD / INTERACTION DESIGN

Las iniciales IxD hacen referencia al término Interaction Design, cuya traducción a nuestroIxD idioma sería Diseño de interacción.

Podríamos decir que el diseño de interacción sirve de conexión entre el User Experience y el User Interface, ya que es la disciplina encargada de concretar de qué forma se llevarán a cabo las interacciones realizadas a la hora de utilizar una determinada función, o lo que es lo mismo, se centra en cuestiones como, por ejemplo, de qué forma se pasa de una sección a otra (pasando el cursor por encima, clicando...), en qué momento aparecerá una ventana emergente, etc. En definitiva, es la respuesta que la interfaz dará a las acciones realizadas por el usuario.

Bien planteada, la combinación del User Experience, el User Interface y el Interaction Design, logrará que los usuarios de tu página tengan una experiencia satisfactoria al interactuar con tu sitio web, lo que se traducirá en un mayor tiempo de permanencia en el mismo y un aumento del número de veces que recurrirán a él cuando lo necesiten. De este modo, conseguirás un mejor posicionamiento orgánico para tu página, que te hará aparecer en los primeros puestos de los diferentes buscadores.



En mbudo contamos con un equipo de especialistas en diseño gráfico web con una dilatada experiencia en UX, UI e IxD que te ayudarán con todo aquello que necesites. Si estás interesado en mejorar tu site, no dudes en contactarnos.

New call-to-action

Design

Silvia Martínez Pascual

Silvia Martínez Pascual

Silvia es técnico superior en diseño gráfico y graduada en bellas artes. Cuenta con un máster master en marketing digital y varias certificaciones de HubSpot. Entre sus aficiones se encuentran, el arte, viajar y la naturaleza.