Learn UX/UI

Try these UX and UI tutorials to learn the principles of user-centered design, prototyping, and wireframing. Learn to craft beautiful and intuitive user interfaces.

Getting started with UX/UI

  • 8 Usability Heuristics (Explained With Toasters)

    8 Usability Heuristics (Explained With Toasters)

    Maddy Beard
  • What is Information Architecture? (UX Tips and Examples)

    What is Information Architecture? (UX Tips and Examples)

    Andrea Eppy
  • All UX/UI tutorials:

    1. Mejores sistemas de diseño con Adobe XD para Visual Studio Code

      Mejores sistemas de diseño con Adobe XD para Visual Studio Code

      Tutorial Beginner

      En este consejo rápido voy a mostrarte cómo crear paquetes de sistema de diseño (o DSP) con Adobe XD y una nueva extensión para Visual Studio Code.

    2. Cómo usar las transformaciones 3D en Adobe XD

      Cómo usar las transformaciones 3D en Adobe XD

      Tutorial Beginner

      En este tutorial, explicaré cómo utilizar las transformaciones 3D en Adobe XD. Esta es una nueva función que ha sido presentada en Adobe MAX en octubre de...

    3. Cómo trabajar con componentes, Auto Layouts y contenido dinámico en Figma

      Cómo trabajar con componentes, Auto Layouts y contenido dinámico en Figma

      Tutorial Beginner

      Como diseñador de UI, Figma puede ahorrarte mucho tiempo. En este tutorial práctico, aprenderás cómo ahorrar tiempo y esfuerzo trabajando con componentes...

    4. Creación de un sistema de diseño en Figma: tipografía, espaciado y tamaño

      Creación de un sistema de diseño en Figma: tipografía, espaciado y tamaño

      Tutorial Beginner

      En este, el primero de una serie de tutoriales, aprenderás a crear un sistema de diseño en Figma. Hace poco diseñé este tema de jardinería para WordPress.

    5. Cómo crear pantallas de inicio de sesión para una plantilla de aplicación de citas en Figma

      Cómo crear pantallas de inicio de sesión para una plantilla de aplicación de citas en Figma

      Tutorial Beginner

      En este tutorial de Figma aprenderás a crear pantallas de acceso y de inicio de sesión para una plantilla de aplicación de citas. ¡Aquí hay una vista...

    6. Guía para principiantes sobre cómo hacer un wireframe

      Guía para principiantes sobre cómo hacer un wireframe

      Tutorial Beginner

      Los wireframes son vitales en cualquier proceso de diseño de pantallas. Aprende más de qué es un wireframe y cómo hacer uno con este artículo.

    7. Cómo cambiar varios colores al mismo tiempo en Figma

      Cómo cambiar varios colores al mismo tiempo en Figma

      Tutorial Beginner

      En este breve consejo de Figma, aprenderás a cambiar varios colores al mismo tiempo. Esto es un gran ahorro de tiempo y de hecho es una de mis funciones...

    8. Cómo corregir sombras recortadas o elementos desbordados en Figma

      Cómo corregir sombras recortadas o elementos desbordados en Figma

      Tutorial Beginner

      En este consejo rápido, te enseñaré cómo corregir las sombras recortadas y los elementos desbordados que en ocasiones ocurren en Figma. Esto puede ser un...

    9. Cómo auto-hospedar las fuentes de Google en tu propio servidor

      Cómo auto-hospedar las fuentes de Google en tu propio servidor

      Tutorial Beginner

      Como diseñadores web que vivimos en la era de la Internet de alta velocidad, hemos adquirido el hábito de añadir dependencias externas como servidores de...

    10. Atajos esenciales de Figma para trabajar eficientemente

      Atajos esenciales de Figma para trabajar eficientemente

      Tutorial Beginner

      Estos atajos esenciales de Figma aumentarán tu productividad y te permitirán trabajar de manera más eficiente. Son mis recomendaciones personales y las uso...

    11. Cómo crear un efecto de vidrio esmerilado en Figma

      Cómo crear un efecto de vidrio esmerilado en Figma

      Tutorial Beginner

      En este consejo breve, aprenderás a crear un efecto de vidrio esmerilado (o cubierto de escarcha) en Figma. Este es un efecto muy popular y en realidad es...

    12. Una guía rápida de los ajustes de relleno de imagen de Figma

      Una guía rápida de los ajustes de relleno de imagen de Figma

      Tutorial Beginner

      En este tutorial, aprenderás todos sobre los ajustes de relleno de imagen de Figma. Existen 4 en total, cada uno de los cuales te permite manipular la imagen...