¿Qué es el diseño UX/UI?
UX/UI abarca dos trabajos conectados. El diseño de experiencia de usuario (UX) trata de toda la experiencia de usar un producto, dentro y fuera de la pantalla. El diseño de interfaz de usuario (UI) trata de cómo se ve y se comporta la interfaz.
A menudo los verás escritos juntos porque un producto necesita los dos. Pero cada uno tiene sus propias habilidades, así que los puestos y los equipos los reparten de formas distintas. Conocer la diferencia te ayuda a elegir por dónde empezar y a leer ofertas de empleo con seguridad.
¿Funciona para las personas?
- Investigación
- Flujos
- Estructura
- Pruebas
¿Es claro y agradable de usar?
- Tipografía
- Color
- Layout
- Componentes
Diseño de experiencia de usuario (UX)
El diseño UX consiste en entender qué necesitan los usuarios y luego dar forma a un producto que les facilite alcanzar su objetivo. Se centra en cómo se mueve la gente por una app, un sitio web o un servicio, y en lo fácil que les resulta.
En su libro The Elements of User Experience, Jesse James Garrett describe la UX como cinco planos apilados, como un iceberg. La mayor parte del trabajo está bajo la superficie, donde los usuarios nunca lo ven.
- Estrategia: investigación sobre los usuarios y el negocio. ¿Qué problema resolvemos y para quién?
- Alcance: convertir esas necesidades en funciones y contenidos concretos.
- Estructura: el mapa del sitio y los flujos. Cómo se organizan y conectan las páginas.
- Esqueleto: wireframes. Dónde va cada cosa en cada pantalla, antes del detalle visual.
- Superficie: el diseño visual que la gente realmente ve y toca.
- SuperficieUIEl diseño visual que la gente ve y toca.
- EsqueletoUIWireframes: dónde va cada cosa en cada pantalla.
- ↑ Los usuarios lo venLos usuarios nunca lo ven ↓EstructuraUX + UILos flujos y cómo se conectan las páginas.
- AlcanceUXLas funciones y el contenido que hay que crear.
- EstrategiaUXNecesidades de usuarios y objetivos del negocio.
Diseño de interfaz de usuario (UI)
El diseño UI se centra en la pantalla, los dos planos superiores del iceberg. Abarca el diseño visual (layout, color, tipografía y el espacio entre las cosas) y la elección de los componentes adecuados, guiada por historias de usuario y wireframes.
Los diseñadores UI suelen necesitar habilidades de diseño gráfico para iconos y tipografía, y nociones prácticas de cómo funciona el código front-end para poder hablar con los desarrolladores.
Las interfaces no son solo pantallas. Las interfaces gráficas son las visuales que tocamos y en las que hacemos clic. Las interfaces de voz, como hacerle una pregunta a un altavoz inteligente, funcionan con el habla. Las interfaces gestuales responden a cómo mueves el cuerpo. El objetivo de un diseñador UI es el mismo en todas: ayudar a la gente a alcanzar su meta con el menor esfuerzo posible.
Cómo trabajan juntos UX y UI
UX y UI se confunden con facilidad, y muchas ofertas de empleo los mezclan. Una interfaz preciosa sin pensamiento UX puede ser elegante pero confusa, y no dar a los usuarios lo que de verdad necesitan. UX sin UI puede resolver el problema correcto pero verse torpe y costar confiar en ella.
En un proyecto, el diseñador UX suele trazar el camino: investiga los problemas, prueba ideas y usa personas para que los usuarios estén representados en cada paso, de los primeros bocetos a los mapas del sitio, wireframes y prototipos. El diseñador UI da vida a ese camino: coloca los elementos, equilibra el espacio, elige combinaciones de color con suficiente contraste y se asegura de que el producto sea accesible e inclusivo.
- «Solo necesito ver mi semana».
- «¿Por qué me cierra la sesión todo el rato?»
- ¿Se habrá aceptado mi cambio de turno?
- No tengo tiempo para aprender esto.
- Hace capturas del cuadrante para mirarlo luego
- Abre la app en los descansos cortos
- Agobiada entre paciente y paciente
- Aliviada cuando todo está claro
Una mala UI puede arruinar una buena UX
Imagina una app que resuelve un problema real y común de una forma nueva. La investigación fue sólida, las funciones eran las correctas y el recorrido del usuario estaba mapeado. Cientos de personas la descargan el día del lanzamiento.
Luego la abren. El texto rojo sobre fondo negro se lee mal. No hay buscador, así que encontrar cualquier cosa obliga a recorrer todos los menús. La gente se rinde. Todo el buen trabajo de UX se pierde porque falló la interfaz.
Y una buena UI no salva una mala UX
Google Glass, lanzado para desarrolladores en 2013, es un ejemplo conocido. Gran parte de la interfaz funcionaba: podías enviar mensajes, hacer fotos y consultar información de un vistazo. Pero el producto nunca respondió a una necesidad clara de la gente, y llevar una cámara en la cara generó preocupaciones sociales y de privacidad muy reales.
La lección para los diseñadores: empieza por las personas y el problema. Una superficie pulida no puede arreglar un producto que nadie necesita.
El diseñador en forma de T
La mayoría de los diseñadores acaba teniendo forma de T: conocimientos amplios de investigación, interacción, contenido y diseño visual, y dominio profundo de una o dos áreas. No tienes que elegir tu especialidad el primer día. El curso te da primero la barra horizontal y luego te deja profundizar en una especialidad.
← Amplio: lo justo para colaborar →
- Investigación
- Interacción
- Contenido
- Visual
- Prototipado
- Nociones de código
Prueba esto: estudia grandes experiencias
Abre dos productos que uses a menudo, por ejemplo Airbnb y Uber. Para cada uno, anota tres cosas que lo hacen fácil de usar. Luego busca un momento que te frustre y escribe cómo lo arreglarías. Empieza una carpeta de ejemplos que te gustaría recrear a medida que crezcan tus habilidades.
