Diseño UX, UI, grafico ¿Cuál es la diferencia?

El diseño es solucionar un problema a través de la creatividad. En primer lugar, tiende a considerar que los aspectos formales y de funcionalidad tienen la misma importancia y, por lo tanto, se tienen que plantear y estudiar conjuntamente. Una solución es bella porque satisface una necesidad y, también, porque presenta una forma que comunica su función y es visualmente atractiva para complacer al consumidor. Es indispensable la adecuación entre forma y función, es por eso que el arte y el diseño están relacionados pero no son lo mismo. Al tratarse de una amplia disciplina podemos lograr una buena comprensión incurriendo en los siguientes tipos diseños:

Diseñador gráfico

Este intentará solucionar el problema respecto a comunicar un mensaje a través de una pieza visual que incluye imágenes y texto. Es el encargado de comunicar un mensaje, más allá de lo artístico. Por ejemplo, armará pósters, comunicará campañas, investigará las características de la campaña, evaluará las piezas disponibles, paletas de colores, tipografías, etc.

Según los objetivos que tengas y estructuras, puedes utilizar varias herramientas. Las más conocidas son:

  • Adobe Photoshop
  • Adobe Illustrator
  • Affinity
  • Figma
  • Atomic
  • Gravit Designer
  • Entre otras miles más.

A continuación, los siguientes tipos de diseñadores van de la mano y se consideran inseparables…

Diseño UX

Se encargan de diseñar todo lo que está atrás de un programa o sistema, la capa de datos, la lógica, etc. Es la investigación que está detrás y que le da un porque a la UI, es decir, le da el orden y una razón a todas las cosas que hace el UI. Es principalmente el análisis y estudio de las cosas. Investiga para crear un producto más cercano al usuario que generé más conversiones. El problema que resuelve el diseño UX es el de hacer de puente entre el producto y lo que buscan los usuarios.

Alguna de las tareas más comunes para este tipo de diseñador son:

  • Task Flows: Son los flujos de tarea, es decir, todos los pasos que realiza un usuario para concretar una tarea (comprar un producto). Por lo tanto, el diseñador UX  será el encargado de detectar los posibles lugares en donde el usuario abandona el proceso, porque si lo abandona la empresa no vende. Entonces, ese es el trabajo, encontrar un momento de debilidad y mejorar ese proceso.
  • Usabilidad: Mejorar el uso analizando todo el producto.
  • Arquitectura de la información: Se encargarán de definir cómo organizar toda la información del producto. El usuario debe encontrar rápidamente lo que busca, sin que se sienta dentro de un laberinto. Mientras más productos tengamos más difícil será.
  • User journey: Es todo el proceso que sigue un usuario desde que llega al sitio o a la app hasta que se convierte en cliente. Una persona pasa por muchos momento hasta convertirse en cliente y es deber del diseñador UX seguirlo en todos los pasos para encontrar posibles puntos de dolor. Esos dolores son momentos confusos, como por ejemplo algo en que la app falle o cuando da un mensaje que no se entiende bien, etc. ya que pueden generar que el usuario salga de la app y no vuelva, o peor, la desinstale.
  • Accesibilidad: Afina el contraste, los atributos, la visión, etc.
  • User research: Investigación de lo que necesita o busca el usuario. Se investiga y se alinea las necesidades del producto para que encajen y se consigan más conversiones.

Diseño UI

Es lo que el usuario o la gente ve, las pantallas, colores, tipografías, animaciones que se ven y más. Es una parte del UX. Es el más conocido porque es la parte visible.

Se encarga de dibujar las pantallas. Su problema a resolver es el de que las pantallas sean amigables y atractivas, que la información esté bien organizada manteniendo una estética. Decide como mostrar los productos, como organizar servicios, etc.

  • Definen categorías, menú de navegación, buscadores, productos recomendados, filtros, etc.
  • Definen la arquitectura de la información pero plasmada en una interfaz.
  • Se encarga de dibujar esas pantallas, las cuales deben ser aprobadas para que se mande al equipo de desarrollo. Es decir, diseñan y luego lo mandan al equipo de desarrollo para que lleve ese diseño a código.
  • Las herramientas más comunes son:
    Web flow: Permite crear código a partir del diseño.
    XD: Existen plugins que se pueden exportar a código pero no del todo bien.
    Figma: Existen plugins que se pueden exportar a código pero no del todo bien. Permite exportar HTML.

Muchas gracias por haber llegado hasta acá ¡Esperamos que te haya servido este material! Si fue así no dudes en compartir el blog con tus colegas, darle like al post en redes o comentar tu devolución del mismo.