¿Qué es el diseño UI?
UI significa interfaz de usuario (user interface): todo lo que una persona ve y toca para usar un producto. Un diseñador UI decide cómo se organiza cada pantalla, qué texto es el más grande, cómo se ve un botón y cómo responde cuando lo pulsas.
Una buena UI es casi invisible. La gente no se fija en la retícula ni en la escala tipográfica. Se fija en que encontró el botón, leyó el precio y terminó la tarea sin pensarlo.
Cada componente tiene estados
Quien empieza diseña un botón una vez. Un profesional diseña cada estado en el que puede estar. Los usuarios necesitan saber qué se puede pulsar, qué acaban de pulsar y qué no está disponible ahora mismo. Cada estado es una promesa que les haces.
- Reservar mesaPor defecto
- Reservar mesaHover
- Reservar mesaPulsado
- Reservar mesaFoco
- Reservar mesaDesactivado
- Reservar mesaCargando
Las piezas básicas de la UI
El curso dedica a cada una su propia unidad, con ejercicios y una pantalla real que diseñar.
- Tipografía: elegir y combinar fuentes, crear una escala tipográfica, fijar longitudes de línea legibles.
- Color: paletas, significado y un contraste que supere las comprobaciones de accesibilidad.
- Layout: retículas, sistemas de espaciado y jerarquía que funcionan del móvil al escritorio.
- Componentes: botones, campos, tarjetas y menús, con todos sus estados.
- Sistemas de diseño: tokens y librerías para que todo un equipo diseñe con coherencia.
- Accesibilidad: diseños que funcionan para personas con baja visión, daltonismo o que usan teclado.
Aprende mirando a los mejores
Las Human Interface Guidelines de Apple y Material Design de Google son gratuitas, detalladas y las escriben equipos que diseñan para miles de millones de personas. Leerás partes de ambas y luego usarás el auto layout y los componentes de Figma para construir bien tus propias pantallas.
Las herramientas de IA ya pueden bocetar una pantalla en segundos. Eso hace que el oficio de UI valga más, no menos: necesitas ver por qué un borrador no termina de funcionar y arreglarlo. ¿Está clara la jerarquía? ¿El texto pasa el contraste? ¿Las esquinas son coherentes? Esas son las preguntas que aprenderás a hacerte.
