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.

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.

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.

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.

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 Sí Las coordenadas donde comienza la esquina superior izquierda 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.

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 derecho
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 frontera
3. Agregar y modificar efectos de desenfoque a las imágenes desenfoque de objeto Aumente o disminuya la intensidad del desenfoque.

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.

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.
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.
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.

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.
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.
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.
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.