7 days of unlimited WordPress themes, plugins & graphics - for free!* Unlimited asset downloads! Start 7-Day Free Trial
Advertisement
  1. Web Design
  2. Tutorials

Más de 15 cursos y tutoriales gratuitos de Adobe XD

Scroll to top
Read Time: 6 mins

Spanish (Español) translation by Carlos (you can also view the original English article)

¿Estás empezando con Adobe XD, o estás buscando algunos consejos y trucos para mejorar tus habilidades? Esta colección de tutoriales y cursos gratuitos te enseñarán cómo utilizar esta herramienta y cómo convertirla en tu favorita para crear increíbles diseños de UI.

Introducción a Adobe XD

1. Adobe XD para principiantes

En este curso gratuito, el instructor Adi Purdila te enseñará cómo usar Adobe XD y todas las funciones y técnicas esenciales que alguien debería conocer. Si apenas estás comenzando con Adobe XD, esta debería ser tu primera parada.

Tutoriales populares de Adobe XD

2. Cómo crear el diseño de interfaz de usuario de una aplicación de finanzas en Adobe XD

Una vez que termines el curso para principiantes, esta podría ser una manera divertida y creativa de aprender las herramientas de Adobe XD.

En este tutorial, aprenderás cómo crear el diseño de una aplicación de finanzas y (lo más importante) cómo animar fácilmente partes de su interfaz de usuario. Aprenderás a utilizar la cuadrícula de Adobe XD, cómo guardar componentes, cómo crear una cuadrícula repetida y cómo crear prototipos interactivos.

Adobe XD TutorialAdobe XD TutorialAdobe XD Tutorial

3. Cómo crear el diseño de interfaz de usuario para una aplicación de reproductor de música en Adobe XD

Aprende a usar Adobe XD y prueba algunas de sus funciones mientras creas este sencillo diseño de UI de un reproductor de música. Aprenderás cómo crear tu propia maqueta, crear íconos y a configurar una cuadrícula sencilla, guardar componentes y a crear una cuadrícula repetida.

Adobe XD TutorialAdobe XD TutorialAdobe XD Tutorial

4. Cómo crear un diseño de interfaz de usuario para reservaciones de hotel en Adobe XD

Continúa con este divertido tutorial que te mostrará cómo crear el diseño de una aplicación para reservaciones de hotel. Con Adobe XD podremos crear mucho más que un diseño estático; crearemos un prototipo animado e interactivo. Para empezar, analizaremos algunos componentes comunes en el diseño de UI para reservaciones de hotel.

Adobe XD TutorialAdobe XD TutorialAdobe XD Tutorial

5. Cómo crear una plantilla para sitio web de currículum vitae en Adobe XD

Otra manera divertida para aprender Adobe XD es usando una plantilla para sitio web de currículum vitae. En este tutorial, aprenderás:

  • cómo animar elementos fácilmente
  • cómo enmascarar y agrupar objetos
  • cómo animar el desplazamiento horizontal y vertical
  • cómo guardar componentes
  • cómo crear animaciones al situar el puntero del mouse (hover)
  • cómo crear prototipos interactivos

Si apenas estás empezando, este tutorial te ayudará para que aprendas a usar Adobe XD y la mayoría de sus funciones.

Adobe XD TutorialAdobe XD TutorialAdobe XD Tutorial

Video tutoriales populares de Adobe XD

La siguiente sección ofrece una colección de video tutoriales del canal de Envato Tuts+ en YouTube, donde encontrarás tutoriales y cursos gratuitos sobre todo tipo de temas creativos.

6. Cómo usar transformaciones 3D en Adobe XD

En este tutorial, aprenderás a usar transformaciones 3D en Adobe XD, una función que se presentó en Adobe MAX en octubre de 2020. Las transformaciones 3D trabajan en armonía con la animación automática, lo que posibilita la creación de diseños aún más dinámicos.

7. Mejores sistemas de diseño con Adobe XD para Visual Studio Code

En este breve tutorial, aprenderás cómo crear paquetes de sistemas de diseño (o DSP, por sus siglas en inglés) con Adobe XD y una nueva extensión para Visual Studio Code.

8. Cómo usar el cambio de tamaño y las restricciones responsivas en Adobe XD

En este screencast de Adobe XD, podrás explorar la función de cambio de tamaño y restricciones responsivas. Estas características permiten el escalado real de los diseños dentro de Adobe XD, brindándote capacidades de diseño web verdaderamente responsivas.

Cursos populares de Adobe XD

9. Curso gratuito de Adobe XD: 15 atajos en Adobe XD que te ahorrarán tiempo

Una vez que te hayas acostumbrado a Adobe XD, aprenderás que los atajos pueden incrementar considerablemente tu velocidad de trabajo. Este curso gratuito te mostrará 15 accesos rápidos con el teclado que te ayudarán a ahorrar tiempo y ser más eficiente.

10. Curso gratuito de Adobe XD: diseño responsivo

¿Quieres aprender cómo usar Adobe XD para que tu diseño se vea bien en cualquier dispositivo? En este curso, la instructora Kezz Bracey te mostrará cómo utilizar mejor las funciones de XD para crear maquetas de diseño responsivo de manera eficiente.

11. Curso gratuito de Adobe XD: diseño compatible con el código

Crear un gran diseño web es una cosa, pero si no se lo entregas a un desarrollador de la manera correcta, quizá no se traduzca en código de la forma que esperas. Por suerte, con un programa como Adobe XD, puedes hacer que tu trabajo de diseño web sea fácil de codificar para los desarrolladores. Puedes aprender el proceso completo en este curso gratuito de Adobe XD.

Adobe XD CodeAdobe XD CodeAdobe XD Code

12. Curso gratuito de Adobe XD: Diseño de íconos

¿Qué te parece aprender a diseñar unos útiles íconos mientras aprendes a usar Adobe XD? En este breve curso gratuito de Adobe XD, el instructor Daniel White te mostrará todo el proceso de diseño de principio a fin, creando ocho íconos de uso común como búsqueda, teléfono, lápiz, nube, y más.

Adobe XD IconAdobe XD IconAdobe XD Icon

13. Curso gratuito de Adobe XD: Animación automática en Adobe XD

La animación automática es una característica simple pero poderosa en Adobe XD, la cual nos permite vincular mesas de trabajo en nuestro prototipo con una animación hermosa y auténtica. Aprende a usarla en nuestro curso breve y gratuito de Adobe XD.

Adobe XD vs Sketch vs Figma

Por último, puedes conocer algunas de las alternativas que tienes aparte de Adobe XD. En un campo tan volátil, es importante mantenerte informado y conocer las aplicaciones que podrían funcionar mejor para ti.

14. Sketch frente a Adobe XD

En este breve video, el instructor Adi Purdila intenta responder una pregunta que muchos diseñadores hacen: «¿Cuál es mejor, Sketch o Adobe XD?».

15. Figma frente a Adobe XD

Con la carrera entre Figma y Adobe XD cada vez más apretada, este tutorial hace una comparación completa y profunda entre estas dos aplicaciones.

Adobe XD FigmaAdobe XD FigmaAdobe XD Figma

Tutoriales en el mundo real

Aprende del resto de la comunidad XD y de los evangelists de Adobe con estos tutoriales gratuitos:

Aprende y crea con Envato

¡Con esto concluimos nuestra lista de recursos de aprendizaje gratuitos de Adobe XD! A continuación, revisa estas colecciones de kits de UI/UX que son compatibles con Adobe XD, y todos están disponibles con una sola suscripción a Envato Elements.

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Web Design tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.