Cómo Crear Gráficos Con Adobe Xd: Una Guía Para Principiantes

¿No sabe por dónde empezar con Adobe XD? Estamos aquí para ayudar. Pronto podrá crear excelentes diseños de UI/UX.

Adobe XD es una poderosa herramienta para crear diseños de UI/UX para software, aplicaciones, sitios web y más. Esto también incluye la creación de maquetas, prototipos y componentes de interfaz de usuario personalizados para interfaces. Cree diseños simples y complejos con Adobe XD.

Aquí se explica cómo agregar gráficos simples, incluidas formas, imágenes y texto, a un nuevo proyecto de Adobe XD. A esto le sigue una guía sobre cómo convertir un grupo de formas en un componente y reutilizar ese componente en una página. Finalmente, este artículo también explica cómo exportar gráficos. Pasemos a la persecución.

Crear un proyecto de Adobe XD

Al crear un nuevo proyecto de Adobe XD, debe elegir un tamaño de diseño para el proyecto. Ofrecemos varias plantillas para elegir en función de algunos dispositivos populares.

Algunos ejemplos de esto son iPhone X/XS/11 Pro (375 px x 812 px), iPad (768 px x 1024 px) o Web 1920 (1920 px x 1080 px). Alternativamente, puede elegir un ancho y alto personalizados para su proyecto.

Crear un nuevo proyecto en Adobe

Cuando crea un nuevo proyecto, Adobe XD abre una página en blanco. Aquí puede agregar imágenes, formas, texto u otros elementos de diseño. Dependiendo de la versión de Adobe XD que esté utilizando, es posible que pueda explorar algunas de las nuevas funciones que ofrece Adobe XD.

RELACIONADO  Cómo Vectorizar Una Imagen En Adobe Illustrator

El elemento de diseño de nivel superior es la propia página de lienzo. Una vez resaltado, puede usar el panel derecho para modificar directamente algunas propiedades, como el ancho o el alto del lienzo.

Lienzo en blanco en el nuevo proyecto de Adobe XD

Cómo agregar una imagen

Hay varias formas de agregar imágenes a su proyecto de Adobe XD.

  • la primera opción es hamburguesa El ícono de menú en la parte superior de la columna izquierda. hacer clic ingreso, abra el archivo que desea agregar.
  • Otra opción es explorar la imagen en el Explorador de archivos y arrastrar el archivo directamente a Adobe XD.
  • Una tercera opción es copiar y pegar la imagen si está abierta en otro software como Microsoft Word.Agregar nueva imagen a la página de Adobe XD

Cómo cambiar el tamaño y la posición de una imagen

Puede reposicionar y cambiar el tamaño de la imagen directamente en el lienzo o modificando sus propiedades.

  1. Resalta la imagen. Cuando resalta un elemento de diseño en el lienzo, puede ver sus propiedades en el panel derecho.
  2. Cambia el ancho y alto de la imagen. estos son o y hora área.
  3. también puedes cambiar X y Las coordenadas donde comienza la esquina superior izquierda de la imagen.Cambiar el tamaño de la imagen
  4. Para mover una imagen, haga clic y arrastre la imagen en el lienzo.
  5. Arrastre los puntos en el borde de la imagen para cambiar su tamaño.

Cómo ajustar los bordes de una imagen

Puede cambiar la forma ajustando las esquinas de la imagen.

  1. Resalta la imagen.
  2. Aparecen algunos puntos alrededor de la imagen. También hay puntos dentro de las esquinas de la imagen.
  3. Haga clic y arrastre un punto dentro de la imagen. Esto transformará lentamente la imagen en una forma diferente.Arrastra las esquinas para cambiar la forma de la imagen.
RELACIONADO  Cómo Reducir El Tamaño De Un Jpeg: 5 Formas

Cómo agregar diferentes efectos a una imagen

Puede manipular aún más la imagen agregando efectos. Esto incluye opacidad, bordes, desenfoque y más.

  1. Resalta una imagen y cámbiala o Velocidad en el panel derechoCambiar la opacidad de una imagen
  2. Todavía cambia el color en el panel derecho. lluvia Encargar. También puedes cambiarlo aquí espesor, estilo guión, y estilo cuña de la fronteraCambiar el borde de la imagen
  3. Agregar y modificar efectos de desenfoque a las imágenes desenfoque de objeto Aumente o disminuya la intensidad del desenfoque.Agregar desenfoque a la imagen

Cómo agregar formas

El panel izquierdo le permite agregar formas en Adobe XD.

  1. En el panel izquierdo, puede optar por crear varias formas básicas, incluidos rectángulos, círculos, triángulos y líneas. Seleccione la forma que desea dibujar.
  2. Haga clic en cualquier parte del lienzo y arrastre el cursor para comenzar a crear la forma.Crea una nueva apariencia en tu página

Cómo agregar formas personalizadas

Puede utilizar las herramientas de formas personalizadas para crear sus propias formas.

  1. en el panel izquierdo lápiz otorgar.
  2. Haga clic en cualquier parte del lienzo para agregar el primer punto o "borde" de la forma. Para cada punto de la forma, haga clic en el lienzo sobre el área deseada.Crea un aspecto personalizado para tu página
  3. Cuando haya terminado de crear la forma, presione la tecla. mi otro Presione la tecla.

Cómo cambiar el color de una forma

Puede cambiar el color de la forma usando el panel derecho.

  1. Resalta la forma.
  2. Cambiar en el panel derecho F Herir.Rellene el color de fondo de color/forma
  3. También puede agregar bordes, desenfoques y cambiar la opacidad de las formas similares a las imágenes.

Cómo agregar texto

También puede agregar y editar texto de la misma manera que agrega formas.

  1. hacer clic texto Haga clic en el icono.
  2. Haga clic en cualquier parte del lienzo para agregar un nuevo cuadro de texto. Introduzca el texto deseado en el cuadro de texto.
  3. Cambiar usando el panel derecho Corte, Familia tipográfica, y ajustamiento área.Agregar texto y editar propiedades
RELACIONADO  Cómo Hacer Sonidos En Tiktok

Como hacer un componente

Un componente es un grupo de elementos de diseño reutilizables. Antes de poder crear y usar un componente, debe tener un grupo de formas u otros objetos de diseño.

  1. Resalte un grupo de formas en el lienzo. Haga clic derecho en el grupo y selecciónelo. Crear un componente.Haga clic derecho y seleccione Crear componente.
  2. en la parte inferior del panel izquierdo Activos. Se abrirá un nuevo menú con una lista de todos los activos que tiene, incluido el componente que acaba de agregar.Haga clic en Activos en el menú de la izquierda para abrir la lista de componentes.
  3. Haga clic en un componente de la lista de componentes y arrástrelo al lienzo. Esto creará exactamente el mismo grupo de entidades.

Cómo exportar artículos

Puede exportar elementos individuales y páginas completas.

  1. Para exportar un solo elemento, resalte el elemento que desea exportar.
  2. hacer clic hamburguesa menú El icono en la parte superior de la columna izquierda.
  3. Elegir mandar luego haga clic seleccionado.
  4. Para exportar una página completa (o todas las páginas) todos los bancos de trabajo en su lugar.Exportar gráficos a Adobe
  5. Puede especificar el formato de archivo (PNG, JPG, SVG o PDF), el propósito del elemento exportado (como web o iOS) y dónde guardar el archivo.

Domina Adobe XD

Estos son solo los conceptos básicos. Algunas otras características incluyen la capacidad de agregar hipervínculos, símbolos, integraciones de aplicaciones y kits de interfaz de usuario. Adobe XD también lanza nuevas funciones de vez en cuando para ayudar a mejorar y agilizar la creación de maquetas y diseños de interfaz de usuario personalizados.

Hay varios cursos disponibles en línea para ayudarlo a llevar sus nuevas habilidades de diseño al siguiente nivel.

Si quieres conocer otros artículos parecidos a Cómo Crear Gráficos Con Adobe Xd: Una Guía Para Principiantes puedes visitar la categoría Creativo.

Subir