Cómo diseñar un botón y su prototipo en Figma

En el episodio nº 10 de nuestro Podcast de UX y UI vamos a diseñar y prototipar un botón en Figma con todas sus variantes de tamaños y estados.

Esta es otra clase en la que seguiremos trabajando con uno de los componentes básicos del design system del proyecto UX Fomo.

Crearemos las propiedades label, icono izquierdo e icono derecho y aprendemos a configurarlas para que el botón se vea bien y funcione correctamente en cualquier contexto.

También vamos a crear interacciones entre las distintas variantes que usaremos en los prototipos que vamos durante todo el proyecto para probar y conocer los flujos del usuario.

Por último vamos mejorar la organización de las Variables o tokens de diseño para luego aplicarlas en la estructura y construcción del botón.

Al pulsar «Cargar y reproducir vídeo», aceptas conectar con YouTube para mostrar este contenido. Recibirá tu IP y puede usar cookies y almacenamiento local según sus políticas. Más información. Puedes seguir leyendo sin cargarlo.

Ver en YouTube (se abre en otra pestaña)

En próximos vídeos aplicaremos la capa de UI, creando nuevos estilos y variantes.

Este tutorial es valioso para estudiantes y profesionales del UX y UI que quieren diseñar un sistema de diseño funcional que responda a las necesidades y expectativas de los usuarios.