Contenido del Curso
UI/UX con Figma
UI/UX con Figma
1. Herramientas Básicas de Figma
2. Creación y Organización de Objetos
Formas
Dibujando formas
Aprende a crear formas usando herramientas como el rectángulo, elipse, polígono, línea o estrella. Haz clic y arrastra para dibujar una forma libremente, manteniendo Shift para restringir las proporciones (por ejemplo, un cuadrado o círculo perfecto) o Alt/Opción para expandir la forma desde el centro.
Ajustando dimensiones y proporciones
- Usa el icono de cadena en el panel de diseño para restringir o desvincular proporciones al redimensionar formas;
- Ajusta la opacidad para cambiar la transparencia de la forma;
- Modifica el radio de las esquinas para bordes redondeados, con la capacidad de establecer valores separados para esquinas individuales si es necesario.
Añadiendo rellenos y trazos
Las formas pueden personalizarse con:
- Rellenos: aplica colores sólidos, degradados o ajusta la opacidad del relleno;
- Trazos (bordes): personaliza la posición (interior, centro, exterior), grosor (peso) y estilo (sólido, discontinuo, punteado). También puedes ajustar la configuración de guiones y espacios para patrones personalizados;
- Líneas: incluye opciones adicionales como puntos de inicio y fin (por ejemplo, flechas, círculos).
Efectos y mejoras
Añade efectos a las formas para mejorar los visuales:
- Sombras paralelas y sombras internas para profundidad;
- Desenfoque y desenfoque de fondo para un aspecto pulido.
Editando formas vectoriales
Para editar una forma vectorial:
- Haz doble clic en la forma o haz clic en el icono Editar objeto en el panel de diseño para entrar en modo de aislamiento;
- Usa la herramienta de curvatura para crear curvas y ajustar puntos vectoriales según sea necesario;
- Sal del modo de edición haciendo clic en un espacio vacío o el botón X.
Siguiendo estas técnicas, puedes crear y personalizar formas con precisión y creatividad.
Si quieres saber más sobre gráficos vectoriales e imágenes rasterizadas, te recomiendo revisar el capítulo Raster vs. Vector en el curso Fundamentos de Adobe Illustrator.
¿Todo estuvo claro?
¡Gracias por tus comentarios!
Sección 2. Capítulo 3