Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprende Diseño de Cuadrículas Filas y Columnas | Prototipado
UI/UX con Figma
course content

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
3. Creando Visuales
4. Prototipado
5. Enviando Trabajo

book
Diseño de Cuadrículas Filas y Columnas

Añadir una Cuadrícula

Seleccione un marco y haga clic en el icono de más en la sección de Cuadrícula de Diseño del panel de diseño para añadir una cuadrícula. Por defecto, las cuadrículas están configuradas como una cuadrícula uniforme de 10 píxeles.

Personalizar Configuraciones de Cuadrícula

  • Tipo de Cuadrícula: elija entre columnas, filas o cuadrícula;
  • Cantidad/Número: ajuste el número de columnas o filas;
  • Apariencia: modifique el color y la opacidad;
  • Configuraciones de Tipo: configure las columnas para estirarse o fijarse a la izquierda, centro o derecha;
  • Márgenes y Canales: defina el espacio entre los bordes del marco (márgenes) y las columnas/filas (canales).

Opciones Avanzadas

  • Añada múltiples cuadrículas a un solo marco haciendo clic nuevamente en el icono de más.
  • Modifique o elimine cuadrículas usando el panel de configuraciones o el icono de menos.
  • Aplique estilos de cuadrícula preestablecidos a través del icono de cuatro puntos o importe cuadrículas desde la biblioteca del equipo.

Uso de reglas y guías en Figma

Habilitar reglas

Las reglas se pueden acceder a través de Ver > Reglas o usando el atajo Shift + R. Aparecen en los lados superior e izquierdo del marco, con unidades medidas en píxeles.

Añadir Guías

Para crear guías, arrastre desde la regla y colóquelas para la alineación. Las guías se pueden eliminar arrastrándolas de nuevo a la regla.

Mejores Prácticas

Combine cuadrículas y guías para precisión y para mantener diseños organizados. Las alineaciones limpias mejoran la claridad del diseño y mejoran la experiencia del usuario en general.

¿Todo estuvo claro?

¿Cómo podemos mejorarlo?

¡Gracias por tus comentarios!

Sección 4. Capítulo 1
We're sorry to hear that something went wrong. What happened?
some-alt