Imagem do Curso gratuito Adobe XD para design de apps e sites

Curso online gratuitoAdobe XD para design de apps e sites

Duração do curso online: 13 horas e 50 minutos

4.53

EstrelaEstrelaEstrelaEstrelaMeia estrela

(19)

Crie layouts de apps e sites no Adobe XD, protótipos clicáveis e exportação para dev. Curso online gratuito com prática e certificado.

Neste curso gratuito, aprenda sobre

  • Instalar e configurar o Adobe XD para iniciar projetos de UI/UX
  • Navegar pela interface e usar a barra de ferramentas do XD
  • Criar artboards, ajustar grids e configurar fundo da prancheta
  • Desenhar com Pen Tool, formas, texto, guias, linhas e polígonos
  • Importar arquivos PSD, imagens e SVG; aplicar máscaras
  • Organizar Assets: cores, estilos de texto e componentes reutilizáveis
  • Usar Repeat Grid para replicar listas e elementos com rapidez
  • Criar protótipos navegáveis e interações (incl. auto-animate/hover)
  • Exportar telas e assets para entrega a devs e publicação
  • Usar UI Kits, plugins e integrações para acelerar o design
  • Projetar site completo (incl. barbearia) do layout ao protótipo
  • Aplicar responsividade e adaptar o design para diferentes telas
  • Compartilhar links para revisão, colaboração e handoff de desenvolvimento
  • Entender vantagens do XD e comparação/posicionamento vs Figma

Descrição do curso

Ganhe autonomia para desenhar interfaces modernas e transformar ideias em telas prontas para validação com este curso de Adobe XD para design de apps e sites. Você vai aprender a configurar o ambiente, organizar pranchetas e grids, dominar ferramentas essenciais de criação e ajustar cada detalhe visual para construir layouts consistentes, do primeiro rascunho ao refinamento final.

Ao longo das aulas, o foco é aprender fazendo: você entende como trabalhar com texto, formas e caneta, importar materiais externos e adaptar arquivos vindos de outros softwares, além de criar guias, elementos geométricos e estruturas que aceleram o dia a dia de UI. Também vai explorar recursos como ativos reutilizáveis, máscaras e repetição de componentes para manter padrão visual, reduzir retrabalho e dar escala ao design de páginas e telas.

Para levar o projeto além da estética, o curso mostra como criar um protótipo navegável, conectar telas, simular interações e microanimações, como estados de hover e transições, deixando a experiência mais próxima do produto final. Você aprende a exportar seus arquivos corretamente, preparar entregáveis e compartilhar o layout de um jeito prático para desenvolvimento e validação com outras pessoas.

Na parte prática, você acompanha a construção de um site completo (incluindo versão responsiva), entendendo decisões de estrutura, hierarquia e usabilidade típicas de projetos reais. Também conhece possibilidades de integração, plugins e kits de interface para acelerar o trabalho, além de caminhos para tirar o layout do XD e levá-lo para uma solução em WordPress com Elementor, aproximando design e implementação.

Indicado para quem quer entrar em UX/UI, aprimorar portfólio, testar fluxos com protótipos e melhorar a comunicação com times de produto e desenvolvimento, este curso gratuito ajuda você a construir uma base sólida em design de interfaces, do básico ao uso mais avançado do Adobe XD no dia a dia.

Conteúdo do curso

  • Aula em vídeo: Curso de Adobe XD - Como instalar o Adobe XD [Aula 01] 06m
  • Exercício: Qual é a principal vantagem do Adobe XD em comparação com outros softwares de design de interface de usuário?
  • Aula em vídeo: Curso de Adobe XD - Barra de Ferramentas [Aula 02] 08m
  • Exercício: Qual é o tamanho sugerido para criação de um layout de site no Adobe RGB, conforme o vídeo?
  • Aula em vídeo: Curso de Adobe XD - Como usar pranchetas artboards e grids [Aula03] 11m
  • Exercício: _Qual é a opção que permite customizar o fundo da prancheta no Adobe XD?
  • Aula em vídeo: Curso de Adobe XD - Pen tool, texto e formas [Aula 04] 08m
  • Exercício: Qual é a função principal da ferramenta "Pintou" mencionada na transcrição?
  • Aula em vídeo: Curso de Adobe XD - Importar um PSD no Adobe XD [Aula 05] 10m
  • Exercício: _Como é possível abrir um arquivo do Photoshop no Adobe XD?
  • Aula em vídeo: Curso de Adobe XD - Como criar linhas guias e polígonos [Aula 06] 10m
  • Exercício: Quais são as novas funcionalidades do Adobe XD apresentadas no vídeo?
  • Aula em vídeo: Curso de Adobe XD - Como criar e usar os Assets (Ativos) [Aula 07] 14m
  • Exercício: _Para que servem os ativos no Adobe XD?
  • Aula em vídeo: Curso de Adobe XD - Como criar e exportar um protótipo navegável [Aula 08] 15m
  • Exercício: Qual é a função da opção de protótipo no Adobe Flex mencionada na transcrição do vídeo?
  • Aula em vídeo: Curso de Adobe XD - Como exportar no Adobe XD [Aula 09] 21m
  • Exercício: _Qual é a função de exportar os arquivos criados no Adobe XD?
  • Aula em vídeo: Curso de Adobe XD - Como importar imagens, SVG e criar máscaras [Aula 10] 16m
  • Exercício: Quais são as formas de importar imagens mencionadas nesta aula?
  • Aula em vídeo: Curso de Adobe XD - Como usar o Repeat Grid [Aula 11] 12m
  • Exercício: _Qual é a função do Repeat Grid no Adobe XD?
  • Aula em vídeo: Curso de Adobe XD - UI kit, Plugins e Integrações (Recursos externos) 09m
  • Exercício: Qual é uma das funcionalidades dos arquivos fornecidos pelo Adobe Figma para designers?
  • Aula em vídeo: Como criar sites exportando do Adobe XD para o Elementor Wordpress? 2h09m
  • Exercício: _Como é possível compartilhar um layout criado no Adobe XD para desenvolvimento?
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - Parte 01 [Aula 13] 24m
  • Exercício: Quais são as partes fundamentais de um site mencionadas no vídeo?
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - Parte 02 [Aula 14] 22m
  • Exercício: Qual é o principal foco do vídeo mencionado na transcrição?
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - Parte 03 [Aula 15] 15m
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - Parte 04 [Aula 16] 16m
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - parte 05 [Aula 17] 15m
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - parte 06 [Aula 18] 17m
  • Exercício: Qual é a principal ação que o site de barbearia permite ao usuário realizar?
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - parte 07 [Aula 19] 17m
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - parte 08 [Aula 20] 20m
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - parte 09 [Aula 21] 13m
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - parte 10 [Aula 22] 14m
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site - parte 11[Aula 23] 17m
  • Aula em vídeo: Curso de Adobe XD - Tutorial de site responsivo - parte 12 [Aula 24] 13m
  • Aula em vídeo: Site de barbearia responsivo com Adobe XD - parte 01 1h42m
  • Aula em vídeo: Por que vale a pena usar o Adobe XD? 1h51m
  • Aula em vídeo: Adobe XD na prática - Criando o design do site 1h36m
  • Aula em vídeo: Estado hover do botão (Auto-Animation) - Curso de Adobe XD 13m
  • Exercício: _O que é possível fazer com o estado do botão no Adobe XD?
  • Aula em vídeo: Projeto colaborativo no Adobe XD - Curso de Adobe XD 06m
  • Aula em vídeo: O que aconteceu com o Adobe XD? Figma ou Adobe XD? 17m
  • Exercício: _Qual é a ferramenta indicada para prototipação de interfaces de apps e sites?

Este curso gratuito inclui:

13 horas e 50 minutos de curso online em vídeo

Certificado digital de conclusão de curso ( Gratuito )

Exercícios para treinar seus conhecimentos

100% gratuito, do conteúdo ao certificado

Pronto para começar?Baixe o app e comece hoje mesmo.

Instale o app agora

para ter acesso ao curso
Ícone representando cursos de tecnologia e negócios

+ de 5.000 cursos gratuitos

Programação, Inglês, Marketing Digital e muito mais! Aprenda o que quiser, gratuitamente.

Ícone de calendário com alvo representando planejamento de estudos

Plano de estudos com IA

A Inteligência Artificial do nosso aplicativo pode criar um cronograma de estudos para o curso que você escolher.

Ícone de profissional representando carreira e negócios

Do zero ao Sucesso profissional

Melhore seu currículo com nosso Certificado gratuito e depois utilize nossa Inteligência Artificial para buscar seu emprego dos sonhos.

Você também pode utilizar o QR Code ou os Links abaixo

QR Code - Baixar Cursa - Cursos Online

Mais cursos gratuitos em UX / UI - Experiência do usuário

Ebook + Áudiobooks gratuitos! Aprenda ouvindo ou lendo!

Baixe o Aplicativo agora para ter acesso a + de 5000 cursos gratuitos, exercícios, certificado e muito conteúdo sem pagar nada!

  • Cursos online 100% gratuitos do início ao fim

    Milhares de cursos online em vídeo, ebooks e áudiobooks.

  • Mais de 60 mil exercícios gratuitos

    Para testar seus conhecimentos no decorrer dos cursos online

  • Certificado Digital gratuito válido em todo o Brasil

    Gerado diretamente na galeria de fotos do seu celular e enviado ao seu e-mail

Aplicativo Cursa na tela de ebook, na tela de curso em vídeo e na tela de exercícios do curso, mais o certificado de conclusão de curso