Conozca cómo usar las herramientas de dibujo y texto de Adobe XD para crear objetos gráficos y de texto.

Puede dibujar rápidamente íconos y gráficos simples en Adobe XD CC utilizando las herramientas de dibujo de la barra de herramientas izquierda: herramientas de rectángulo, elipse, línea y pluma. La herramienta de selección le ayuda a seleccionar líneas, formas u objetos específicos para editarlos.

Luego puede combinar estas formas de diferentes maneras para crear formas y objetos compuestos, o enmascarar partes de la forma. Para obtener más información sobre técnicas de combinación y enmascaramiento, consulte Combinar objetos usando operaciones booleanas y enmascarar objetos con formas.

Dibujar rectángulos y cuadrados

  1. Seleccione la herramienta Rectángulo .

  2. Realice una de las siguientes acciones:

    • Para dibujar un rectángulo, arrastre en diagonal hasta que el rectángulo alcance el tamaño deseado.
    • Para dibujar un cuadrado, mantenga pulsada la tecla Mayús mientras arrastra en diagonal hasta que el cuadrado alcance el tamaño deseado.
  3. Para dibujar un rectángulo redondeado, dibuje un rectángulo y luego haga clic en él para ver los controles de edición del radio. Haga clic en cualquier controlador y arrastre hacia el centro del rectángulo. También puede usar el Inspector de propiedades para introducir un valor específico del radio de uno o más vértices.

    Dibujar rectángulos y cuadrados redondeados
    Dibujar rectángulos y cuadrados redondeados

  4. Para personalizar más su cuadrado o rectángulo, puede editar los radios de los vértices.

    • Para ajustar el radio de un solo vértice, realice una de las siguientes acciones:
      • Presione Opción + clic, haga clic en el controlador del vértice y arrastre el ratón.
      • Edite el valor del radio del vértice individualmente, después de seleccionar en el Inspector de propiedades.
    • Para ajustar el radio de todos los vértices simultáneamente, realice una de las siguientes acciones:
      • Haga clic en un radio de vértice y arrastre el ratón. 
      • Edite el valor del radio después de seleccionar  en el Inspector de propiedades.
    Ajuste simultáneo de los cuatro vértices
    Ajuste simultáneo de los cuatro vértices

    Ajuste de los vértices uno a uno
    Ajuste de los vértices uno a uno


Dibujar elipses y círculos

  1. Seleccione la herramienta Elipse .

  2. Realice una de las siguientes acciones:

    • Arrastre en diagonal hasta que la elipse tenga el tamaño deseado.
    • Para crear un círculo, mantenga presionada la tecla Mayús al arrastrar.
    Redimensionar una elipse
    Arrastre y redimensione la elipse.

    Arrastre y redimensione dando forma de círculo.
    Mantenga presionada la tecla Mayús y arrastre para redimensionar el círculo.

Dibujar líneas

  1. Seleccione la herramienta Línea .

  2. Sitúe el puntero donde desee que comience la línea y arrástrelo hasta donde desee que termine.

    Dibujar líneas
    Dibuje líneas usando la herramienta Línea.

Dibujar con la herramienta Pluma

Nota:

Tutorial: Dibujar iconos y formas para el diseño.

Conozca cómo usar la herramienta Pluma para dibujar imágenes en Adobe XD CC.

El tipo de trazado más sencillo que se puede dibujar con la herramienta Pluma es una línea recta, que se crea haciendo clic en la herramienta Pluma para crear dos puntos de ancla. Al ir haciendo clic, se crea un trazado compuesto por segmentos rectilíneos conectados por puntos de vértice.

  1. Seleccione la herramienta Pluma .

  2. Sitúe la herramienta Pluma donde desee que empiece el segmento recto y haga clic para definir el primer punto de ancla.

  3. Haga clic de nuevo donde desee que termine el segmento (presione Mayús y haga clic para restringir el ángulo del segmento a un múltiplo de 45°).

  4. Continúe haciendo clic para definir puntos de ancla de más segmentos rectilíneos.

    Nota:

    Para convertir un punto de ancla de rectilíneo a curvo y viceversa, haga doble clic en el punto de ancla.

    El último punto de ancla añadido aparece siempre como un círculo sólido, lo que indica que está seleccionado. Los puntos de ancla definidos anteriormente se convierten en huecos y sin seleccionar, a medida que añade más puntos de ancla.

  5. Complete el trazado llevando a cabo uno de los procedimientos siguientes:

    • Para dejar el trazado abierto, haga clic en Esc.
    • Para cerrar el trazado, coloque la herramienta Pluma sobre el primer punto de ancla (hueco). Haga clic o arrastre para cerrar el trazado.
    • Para seleccionar y arrastrar el punto de inicio sin cerrar el trazado, mantenga presionada la tecla Cmd/Ctrl.
    Dibujar líneas rectas
    Dibuje líneas rectas usando la herramienta de pluma.

Dibujar curvas

Puede crear una curva añadiendo un punto de ancla donde la curva cambie de dirección y arrastrando las líneas de dirección que formen la curva. La longitud y la pendiente de las líneas de dirección determinan la forma de la curva.

Las curvas son fáciles de modificar y se pueden visualizar e imprimir más rápido si se las dibuja utilizando los menos puntos de ancla posibles. Usar demasiados puntos puede también introducir protuberancias no deseadas en una curva. En su lugar, dibuje puntos de ancla bien espaciados y practique la formación de curvas ajustando la longitud y los ángulos de las líneas de dirección.

  1. Seleccione la herramienta Pluma .

  2. Sitúe la herramienta Pluma donde desee que empiece la curva y mantenga pulsado el botón del ratón.

  3. Arrastre para definir la inclinación del segmento curvo que está creando y suelte el botón del ratón.

    Nota:

    Mantenga pulsada la tecla Mayús mientras arrastra, para restringir la herramienta a múltiplos de 15°.

  4. Sitúe la herramienta Pluma donde desea que termine el segmento curvo y, a continuación, lleve a cabo uno de los procedimientos siguientes:

    • Para crear una curva en forma de "C", arrastre en dirección opuesta a la línea de dirección anterior. Suelte el botón del ratón.
    • Para crear una curva en forma de "S", arrastre en la misma dirección que la línea de dirección anterior. Suelte el botón del ratón.
    Dibujar curvas
    Dibujo de curvas usando la herramienta Pluma.

  5. Para crear una serie de curvas suaves, continúe arrastrando la herramienta Pluma desde diferentes posiciones.

    Nota:

    Como opción, puede arrastrar las líneas de dirección para modificar las líneas de dirección de un punto de ancla.

  6. Complete el trazado llevando a cabo uno de los procedimientos siguientes:

    • Para cerrar el trazado, coloque la herramienta Pluma sobre el primer punto de ancla (hueco). Haga clic o arrastre para cerrar el trazado.
    • Para dejar el trazado abierto, presione Esc.

Dibujar líneas rectas seguidas de curvas

  1. Con la herramienta Pluma (), haga clic en los puntos de vértice de dos ubicaciones para crear un segmento rectilíneo.

  2. Coloque la herramienta Pluma sobre el punto final seleccionado. Para definir la pendiente del segmento curvo que creará a continuación, haga clic en el punto de ancla y arrastre la línea de dirección que aparecerá.

  3. Sitúe la pluma donde desee ubicar el siguiente punto de ancla y, a continuación, haga clic (y arrastre, si lo desea) el nuevo punto de ancla para completar la curva.

Dibujar curvas seguidas de líneas rectas

  1. Con la herramienta Pluma (), arrastre para crear el primer punto de suavizado del segmento curvo y suelte el botón del ratón.

  2. Vuelva a colocar la herramienta Pluma donde desea que termine el segmento curvo, arrastre para completar la curva y suelte el botón del ratón.

  3. Coloque la herramienta Pluma sobre el punto final seleccionado.

  4. Sitúe la herramienta Pluma donde desee que termine el segmento recto y haga clic para completar el segmento.

    Curvas seguidas por líneas rectas
    Dibujar curvas seguidas de líneas rectas

Dibujar dos segmentos curvos conectados por un vértice

  1. Con la herramienta Pluma (), arrastre para crear el primer punto de suavizado de un segmento curvo.

  2. Vuelva a situar la herramienta Pluma y arrastre para crear una curva con un segundo punto de suavizado.

  3. Vuelva a situar la herramienta Pluma donde desee que acabe el segundo segmento curvo y arrastre un nuevo punto de suavizado para finalizarlo.

Modo de dibujo frente a modo de edición

Para alternar entre el modo de dibujo y el modo de edición, presione la tecla Esc.

También puede entrar en el 'modo de edición de trazado' haciendo doble clic en la forma o el trazado. En este modo son visibles los puntos de ancla de la forma, pero al mover el ratón no se dibuja nada. Puede manipular los puntos de ancla/control existentes o insertar nuevos puntos de ancla en segmentos existentes del trazado.

Al dibujar con la herramienta pluma, puede realizar todas las ediciones descritas anteriormente, además de dibujar nuevos segmentos.

Prolongar trazados existentes

Al seleccionar la herramienta pluma, todos los trazados de la mesa de trabajo que queden debajo del cursor muestran controladores sobre sus puntos inicial y final. Haga clic en uno de los controladores para continuar dibujando el trazado desde ese punto.

La prolongación de un trazado cerrado vuelve a abrirlo y luego la herramienta pluma entra en modo de dibujo para el trazado en cuestión.

Seleccionar puntos de ancla

Haga doble clic en el dibujo para ver los puntos de ancla. A continuación, puede hacer clic en un punto de ancla para seleccionarlo. Para seleccionar varios puntos de ancla, mantenga presionada la tecla Mayús y seleccione los puntos de ancla, o seleccione mediante marco los puntos de ancla con la herramienta Selección.

Retoque los puntos de ancla seleccionados con el teclado, arrástrelos con el ratón o edite sus propiedades (coordenadas x e y) en el Inspector de propiedades.

Deshabilitar líneas de ajuste de puntos de ancla

Al colocar un nuevo punto de ancla o arrastrar uno existente, aparecen líneas de ajuste cuando un anclaje está, vertical u horizontalmente, cerca de otro punto de ancla. Mantenga pulsada la tecla Cmd/Ctrl para deshabilitar el ajuste de puntos de ancla.

Añadir y editar puntos de ancla

Haga doble clic en el dibujo para seleccionarlo y ver los puntos de ancla existentes. Haga clic en el trazado para añadir nuevos puntos de ancla en la posición del cursor.

Adición y eliminación de puntos de ancla
Adición y eliminación de puntos de ancla

Eliminar puntos de ancla

Seleccione los puntos de ancla y luego presione Eliminar.

Métodos abreviados de dibujo

Herramienta Dibujar Método abreviado de teclado en macOS Método abreviado de teclado en Windows
Seleccionar V V
Rectángulo R R
Elipse E E
Línea L L
Pluma P P
Zoom

Entrar en modo de zoom: Z

  • Aumentar: haga clic en cualquier lugar del lienzo de Adobe XD o haga clic en la mesa de trabajo requerida. O bien, seleccione mediante marco un área que aumentar.
  • Reducir: Opción + Clic

Para activar temporalmente las funciones de aumentar y reducir:

  • Presione Barra espaciadora + Cmd y haga clic o seleccione mediante marco un área de la mesa de trabajo a aumentar.
  • Espacio + Cmd + Opt para reducir

Entrar en modo de zoom: Z

  • Aumentar: haga clic en cualquier lugar del lienzo de Adobe XD o haga clic en la mesa de trabajo requerida. O bien, seleccione mediante marco un área que aumentar.
  • Reducir: Alt + Clic

Para activar temporalmente la función de aumentar:

  • Presione Barra espaciadora + Ctrl y haga clic o seleccione mediante marco un área de la mesa de trabajo a aumentar.
Zoom a la selección ⌘3 Ctrl+3

Introducir texto en un punto

Haga clic en la herramienta texto y luego en el lugar donde desee que comience el texto. Escriba el texto y presione Retorno.

Cuando escriba texto seleccionando un punto en el lienzo, obtendrá una línea horizontal de texto que comienza donde haga clic y se expande a medida que va introduciendo caracteres. Cada línea de texto es independiente: la línea se amplía o se reduce al editarla, pero no continúa por la línea siguiente. Este método de introducción de texto es útil para añadir unas pocas palabras a la ilustración.

Introducir texto en un punto
Introduzca texto en un punto.

Puede escribir texto sobre otros objetos y organizar el texto para que aparezca en la parte delantera utilizando las opciones Objeto > Organizar.

Introducir texto en un área

Haga clic en la herramienta Texto, haga clic en la ubicación donde desea que aparezca el texto en el lienzo y arrastre para definir el área de texto. Luego, haga clic dentro del área para comenzar a escribir texto.

Al definir un área de texto, los límites de los objetos controlan el flujo de los caracteres, ya sea horizontal o verticalmente. Cuando el texto llega a uno de los límites, se ajusta automáticamente a la forma del área definida. Este método de introducción de texto es útil si desea crear uno o varios párrafos, como para un folleto.

Introducir texto en Diseño de experiencias
Haga clic en la herramienta Texto y comience a escribir texto.

Importar texto desde archivos de texto

Puede incluir fácilmente texto escrito previamente en su mesa de trabajo, usando uno de los siguientes métodos:

  • Arrastre un archivo de texto a la mesa de trabajo.

Puede incluir fácilmente texto escrito previamente en el diseño, simplemente arrastrando un archivo de texto sin formato a la mesa de trabajo. Esta acción crea un área de texto en la mesa de trabajo con el contenido del archivo de texto.          

  • Arrastre un archivo de texto a una cuadrícula de repetición.

También puede arrastrar un archivo de texto (con nuevas líneas) y arrastrar ese archivo sobre un componente de texto en una cuadrícula de repetición. Todos los elementos de texto se rellenan con el texto de ese archivo.

Para obtener más información, consulte Agregar texto de un archivo de texto a una cuadrícula de repetición.

  • Copie y pegue el texto en la mesa de trabajo.

También puede copiar y pegar texto en la mesa de trabajo creando un elemento de texto de área que puede mover y editar fácilmente en Adobe XD.

Cambiar el tamaño de un área de texto

Haga clic en el texto y arrastre el controlador para cambiar el tamaño del tipo de letra. Esta función solo está disponible para texto de puntos.

Arrastrar el controlador y cambiar el tamaño del texto
Arrastre el controlador para cambiar el tamaño del texto.

Formatear texto

Haga clic en el texto y luego especifique el tipo, el tamaño de fuente y la alineación del texto, usando el Inspector de propiedades.

También puede seleccionar palabras o caracteres individuales de un bloque de texto y formatear solo esas secciones.

Formatear el objeto de texto completo o secciones individuales de texto
Formatear el objeto de texto completo o secciones individuales de texto

Cambiar el espaciado entre caracteres y líneas

Para cambiar el espaciado entre caracteres, haga clic en el objeto de texto y especifique el espaciado entre caracteres usando la opción Espaciado entre caracteres del Inspector de propiedades.

Para cambiar el espaciado entre caracteres para un subconjunto de texto, seleccione el texto y modifique el espaciado entre caracteres en milésimas usando el Inspector de propiedades.

Cambio del espaciado entre caracteres para texto dentro de un objeto de texto
Cambio del espaciado entre caracteres para texto dentro de un objeto de texto

Para cambiar el espaciado entre líneas, haga clic en el área de texto y especifique el espaciado entre líneas usando la opción Espaciado entre líneas del Inspector de propiedades.

Para restablecer la altura de línea al valor predeterminado, introduzca 0 en la opción Espaciado entre líneas del Inspector de propiedades.

Cambio del espaciado entre líneas
Cambio del espaciado entre líneas

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea