Conozca cómo utilizar cuadrículas cuadradas en Adobe XD CC para colocar y alinear imágenes o elementos con precisión.

Las cuadrículas cuadradas ofrecen guías para alinear objetos y texto. Al dibujar, los objetos se ajustan a la cuadrícula automáticamente cuando los bordes del objeto están dentro de la zona de ajuste a cuadrícula. Las cuadrículas también le ayudarán a tener una idea rápida de las medidas al distribuir objetos o texto en las mesas de trabajo.

En Adobe XD CC, puede mostrar u ocultar cuadrículas seleccionando una mesa de trabajo y luego marcando o desmarcando la casilla del Inspector de propiedades. Las opciones de cuadrícula también le permiten cambiar el espaciado de una cuadrícula y su color. Puede guardar un conjunto de opciones de cuadrícula como predeterminado para usarlas rápidamente en el futuro.

Nota:

Adobe XD usa un píxel virtual para la mayoría de sus medidas y tamaños de fuente, que es la misma unidad de medida que un píxel CSS, o mediciones en iOS. El píxel virtual es aproximadamente igual a un píxel físico en un monitor de 72 ppp (e, incidentalmente, un punto). Actualmente, no se puede cambiar la unidad de medida en Adobe XD.

Mostrar u ocultar una cuadrícula

Seleccione una mesa de trabajo y lleve a cabo uno de los procedimientos siguientes:

  • En Mac: elija Ver > Mostrar cuadrícula de mesa de trabajo o use el método abreviado de teclado ⌘ '
  • En Mac o Windows: en el Inspector de propiedades, seleccione la casilla Cuadrícula.
Mostrar cuadrícula en mesa de trabajo
Mostrar cuadrícula en mesa de trabajo

Establecer preferencias de cuadrícula

Puede personalizar el color y la densidad de la cuadrícula usando el panel Cuadrícula del Inspector de propiedades.

Cambiar color de cuadrícula

Para cambiar el color de la cuadrícula:

  1. Haga clic en la casilla próxima a Cuadrada.

    Aparecerá el selector de color.

    Utilice el selector de color para elegir los colores.
    Selector de color
  2. Puede elegir lo siguiente:

    • Especifique los valores HSBA o hexadecimales de los campos HSBA o hexadecimal si conoce los valores exactos.
    • Ajuste el color usando el campo color y el regulador de color. Al hacerlo, los valores numéricos HSBA y hexadecimales se ajustarán en consecuencia.  
    • Establezca la opacidad del relleno utilizando el regulador de color o escribiendo un valor en porcentaje.

    Nota:

    Adobe XD también admite abreviaturas para códigos hexadecimales. Por ejemplo, si escribe 0 y presiona Retorno, Adobe XD muestra automáticamente el color con código #000000. Del mismo modo, puede escribir OA por #OAOAOA y OAF por #OOAAFF.

    Podrá ver que el color de la cuadrícula cambia a medida que vaya modificando las opciones en el cuadro de diálogo Colores.

  3. Una vez que haya decidido un color, guárdelo para acceder más fácilmente haciendo clic en el icono + de la parte inferior del selector de color. 

Cambiar el tamaño de cuadrícula

Para cambiar el tamaño de la cuadrícula, edite el valor del espaciado en el Inspector de propiedades. Cuanto menor sea el número, más densa será la cuadrícula. 

Establecer preferencias de cuadrícula predeterminadas

Vuelva al aspecto predeterminado de cuadrícula haciendo clic en Usar predeterminado en la sección Cuadrícula del Inspector de propiedades.

Configure sus preferencias de cuadrícula personalizadas como predeterminadas, haciendo clic en Convertir en predeterminadas, lo que establece la opción de cuadrícula predeterminada para el archivo.

Ajustar objetos a cuadrícula

Para ajustar un objeto a una cuadrícula, arrastre un objeto hacia una cuadrícula hasta que uno o más de los bordes del objeto estén dentro de la zona de ajuste de la cuadrícula.

Ajustar a cuadrícula al dibujar objetos
Ajustar a cuadrícula al dibujar objetos

Para evitar ajustar a la cuadrícula, presione la tecla Cmd (en Mac) o la tecla Ctrl (en Windows) mientras arrastra el ratón y dibuja un objeto.