Guia do Usuário Cancelar

Criar designs e protótipos e compartilhar com o Adobe XD

  1. Guia do usuário do Adobe XD
  2. Introdução
    1. Novidades no Adobe XD
    2. Perguntas frequentes
    3. Criar designs e protótipos e compartilhar com o Adobe XD
    4. Gerenciamento de cores
    5. Requisitos de sistema
      1. Requisitos de hardware e software
      2. Adobe XD, Big Sur e Apple Silicon | macOS 11
    6. Noções básicas sobre a área de trabalho
    7. Alterar o idioma do aplicativo no Adobe XD
    8. Acessar kits de design de interface
    9. Acessibilidade no Adobe XD
    10. Atalhos de teclado
    11. Dicas e truques
  3. Design
    1. Pranchetas, guias e camadas
      1. Introdução às pranchetas
      2. Usar guias e grades
      3. Criar pranchetas com rolagem
      4. Trabalhar com camadas
      5. Criar grupos de rolagem
    2. Formas, objetos e caminho
      1. Selecionar, redimensionar e girar objetos
      2. Mover, alinhar, distribuir e organizar objetos
      3. Agrupar, bloquear, duplicar, copiar e virar objetos
      4. Definir traçado, preenchimento e sombra projetada para objetos
      5. Criar elementos de repetição
      6. Criar designs de perspectiva com transformações em 3D
      7. Editar objetos usando operações boolianas
    3. Texto e fontes
      1. Trabalhar com ferramentas de desenho e texto
      2. Fontes no Adobe XD
    4. Componentes e estados
      1. Trabalhar com componentes
      2. Trabalhar com componentes aninhados
      3. Adicionar vários estados aos componentes
    5. Mascaramento e efeitos
      1. Criar uma máscara com formas
      2. Trabalhar com efeitos de desfoque
      3. Criar e modificar degradês
      4. Aplicar efeitos de mesclagem
    6. Layout
      1. Redimensionamento responsivo e restrições
      2. Definir preenchimento fixo para componentes e grupos
      3. Criar designs dinâmicos com pilhas
    7. Vídeos e animações Lottie
      1. Trabalhar com vídeos
      2. Criar protótipos usando vídeos
      3. Trabalhar com animações Lottie
  4. Protótipo
    1. Criar protótipos interativos
    2. Animar protótipos
    3. Propriedades de objeto compatíveis com a Animação automática
    4. Criar protótipos com teclados e controles
    5. Criar protótipos usando reprodução e comandos de voz
    6. Criar transições temporizadas
    7. Adicionar sobreposições
    8. Criar protótipos de voz
    9. Criar links de âncora
    10. Criar hiperlinks
    11. Visualizar designs e protótipos
  5. Compartilhar, exportar e analisar
    1. Compartilhar pranchetas selecionadas
    2. Compartilhar designs e protótipos
    3. Definir permissões de acesso para links
    4. Trabalhar com protótipos
    5. Revisar protótipos
    6. Trabalhar com especificações de design
    7. Compartilhar especificações de design
    8. Inspecionar especificações de design
    9. Navegar em especificações de design
    10. Revisar e comentar especificações de design
    11. Exportar ativos de design
    12. Exportar e baixar ativos de especificações de design
    13. Compartilhamento em grupo para corporações
    14. Fazer backup ou transferir ativos do XD
  6. Sistemas de design
    1. Sistemas de design com as Bibliotecas da Creative Cloud
    2. Trabalhar com ativos de documento no Adobe XD
    3. Trabalhar com as Bibliotecas da Creative Cloud no Adobe XD
    4. Migrar de ativos vinculados para as Bibliotecas da Creative Cloud
    5. Trabalhar com tokens de design 
    6. Usar ativos das Bibliotecas da Creative Cloud
  7. Documentos na nuvem
    1. Documentos na nuvem no Adobe XD
    2. Colaborar e coeditar designs
    3. Coeditar documentos compartilhados com você
  8. Integrações e plug-ins
    1. Trabalhar com ativos externos
    2. Trabalhar com ativos de design do Photoshop
    3. Copiar e colar ativos do Photoshop
    4. Importar ou abrir designs do Photoshop
    5. Trabalhar com ativos do Illustrator no Adobe XD
    6. Abrir ou importar designs do Illustrator
    7. Copiar vetores do Illustrator para o XD
    8. Plug-ins para o Adobe XD
    9. Criar e gerenciar plug-ins
    10. Integração do JIRA com o XD
    11. Plug-in do Slack para XD
    12. Plug-in do Zoom para XD
    13. Publicar o design do XD no Behance
  9. XD para iOS e Android
    1. Visualizar em dispositivos móveis
    2. Perguntas frequentes sobre o Adobe XD para dispositivos móveis
  10. Solução de problemas
    1. Problemas conhecidos e corrigidos
      1. Problemas conhecidos
      2. Problemas corrigidos
    2. Instalação e atualizações
      1. O XD aparece como não compatível no Windows
      2. Código de erro 191
      3. Código de erro 183
      4. Problemas ao instalar plug-ins XD
      5.  Solicitação para instalar e reinstalar o XD no Windows 10
      6. Problemas com a migração de preferências
    3. Inicialização e falha
      1.  O XD trava ao ser iniciado no Windows 10
      2.  O XD fecha ao fazer logoff da Creative Cloud
      3. Problema com o status da assinatura no Windows
      4. Aviso de aplicativo bloqueado ao iniciar o XD no Windows
      5. Geração de dump de falha no Windows
      6. Coleta e compartilhamento de registros de falhas
    4. Documentos na nuvem e bibliotecas da Creative Cloud
      1. Problemas com os documentos na nuvem do XD
      2. Problemas com componentes vinculados
      3. Problemas com bibliotecas e links
    5. Prototipagem, publicação e revisão
      1. Não é possível gravar interações de protótipo no macOS Catalina
      2. Problemas com fluxos de trabalho de publicação
      3. Links publicados não são exibidos nos navegadores
      4. Protótipos não são renderizados corretamente nos navegadores
      5. Painel de comentários aparecendo repentinamente em links compartilhados
      6. Não é possível publicar bibliotecas
    6. Importação, exportação e trabalho em outros aplicativos
      1. Exportação e importação no XD
      2. Arquivos do Photoshop no XD
      3. Arquivos do Illustrator no XD
      4. Exportar do XD para o After Effects
      5. Arquivos do Sketch no XD
      6. Aplicativos de terceiros não visíveis na exportação

Saiba como criar protótipos interativos, wireframes e gráficos usando o XD.

O Adobe XD permite que os designers de experiência de usuário criem experiências de usuário interativas para aplicativos da Web e para dispositivos móveis usando um único aplicativo.

Você pode criar designs rápidos e simples em pranchetas no XD. Em seguida, conecte as pranchetas para criar um protótipo interativo que você possa compartilhar e iterar com os envolvidos no projeto. Você também pode usar plug-ins para automatizar as operações repetidas ou partes do fluxo de trabalho do designer que são tediosas, complexas ou repetitivas. 

O Adobe XD integra-se bem ao Photoshop, ao Illustrator e ao After Effects.

Você pode continuar criando em seus aplicativos preferidos, reunir os ativos no XD e usar o XD para criar e compartilhar protótipos. O XD permite arquivos SVG e bitmap sem perda de fidelidade. Você pode aprimorar os ativos no Adobe XD ou usá-los para desenvolver protótipos interativos. 

Fluxo de trabalho geral

Criar designs e protótipos e compartilhar com o Adobe XD
Criar designs e protótipos e compartilhar com o Adobe XD

O fluxo de trabalho pode ser resumido nas seguintes etapas de alto nível:

  • Design: crie elementos de layout, adicione pranchetas e importe recursos de outros aplicativos, como o Adobe Illustrator, o Adobe Photoshop e o Adobe After Effects. Você também pode usar plug-ins para automatizar as operações repetidas ou partes do fluxo de trabalho do designer que são tediosas, complexas ou repetitivas. 
  • Protótipo: selecione objetos ou pranchetas no seu design e crie interações entre diferentes pranchetas.
  • Compartilhamento: uma vez que seu projeto esteja pronto para ser revisado, você pode compartilhar protótipos e especificações de design ou exportar o projeto ou ativos com os envolvidos no projeto.

Continue lendo para obter mais detalhes sobre criação de design, criação de protótipos e compartilhamento no XD.

Design

Introdução ao Adobe XD

Introdução ao Adobe XD

Por Dani Beaumont

Selecione um tamanho predefinido para a prancheta. Se você deseja trabalhar com um tamanho personalizado, digite a largura e a altura em pixels nos campos de texto abaixo da opção Personalizado. Se você quiser especificar um tamanho personalizado, clique no ícone Personalizado.

Reúna os ativos de uma das seguintes maneiras:

  • Use as ferramentas de design do Adobe XD para criar ativos do zero. Para obter mais informações, consulte Ferramentas de desenho e Ferramentas de texto.
  • Copie seus designs do Photoshop, do Sketch, do After Effects ou do Illustrator e cole-os na prancheta no Adobe XD. Você também pode importar, arrastar ou copiar e colar um arquivo JPG, SVG, PNG ou GIF de:
    • Explorador de Arquivos (no Windows)
    • Finder (no Mac) 
    • Navegador da Web
    • Área de transferência do SO

 

Aprimore os objetos em seu design. Por exemplo, combinar ou mascarar objetos, alterar as propriedades de traçado e preenchimento, usar sobreposição para sobrepor uma prancheta base com conteúdo, mover ou girar objetos ou usar o redimensionamento responsivo para criar ativos para vários tamanhos e layouts de tela. Use ativos vinculados para criar e manter uma única versão de kits de interface do usuário, folhas de adesivos ou guias de estilo e compartilhe-os em documentos para obter uma escalabilidade consistente de design. Use também plug-ins para automatizar operações repetidas ou partes de fluxos de trabalho tediosas, complexas ou repetitivas para o designer.

Para obter mais informações, consulte:

Disponha elementos repetidos sem esforço usando o recurso Repetição de grade para criar uma grade a partir do conteúdo existente sem precisar duplicá-lo manualmente. Para obter mais informações, consulte Criar elementos de repetição.

Use plug-ins para automatizar as operações repetidas ou partes do fluxo de trabalho do designer que são tediosas, complexas ou repetitivas. Para obter mais informações, consulte Criar e gerenciar plug-ins.

Adicione mais pranchetas para cada uma das telas necessárias no seu protótipo. Para obter mais informações, consulte Trabalhar com pranchetas.

Protótipo

Você pode criar protótipos interativos usando recursos de voz, animação automática, gestos de arrastar e transições temporizadas. Para obter mais informações, consulte Design de voz e protótipos no XD, Criar protótipos usando animação automática e gestos de arrastar e Usar transições temporizadas.

Você pode visualizar a interatividade em protótipos e, ao visualizar, registrar a interação como um arquivo MP4.

Para vincular pranchetas ou configurar a interatividade, selecione a prancheta ou um objeto e clique na seta à direita. Um fio aparecerá. Basta arrastar e conectar o fio a outro objeto ou prancheta. Na janela pop-up, especifique as opções de transição e sua duração.

Você também pode usar a sobreposição para simular o conceito de transições sem duplicar o conteúdo em várias pranchetas. Para obter informações detalhadas, consulte Criar protótipos interativos.

Clique no ícone Visualização no canto superior direito do aplicativo. O XD exibe uma tela de exibição que permite visualizar e navegar pelas diferentes páginas. A tela de visualização tem um ícone de gravação que permite gravar o fluxo entre as páginas e salvá-lo em formato MP4. 

Para obter mais informações, consulte Visualizar e gravar interações.

Compartilhamento

Compartilhe protótipos para revisar designs, fazer apresentações ou testes de usuário. Você também pode publicar protótipos e especificações de design para desenvolvimento ou personalizar a experiência de exibição conforme sua preferência. Para obter mais informações, consulte Compartilhar designs e protótipos.

Receba ajuda com mais rapidez e facilidade

Novo usuário?