Saiba como criar ícones, ilustrações, protótipos e wireframes usando o Adobe XD CC.
O Adobe XD CC é uma ferramenta que utiliza vetores para criar designs e protótipos de experiências de usuário para Web e para aplicativos para dispositivos móveis. Alterne facilmente entre wireframes, design visual, design de interações, criação de protótipos, visualização e compartilhamento, tudo isso em uma só ferramenta avançada.
Quando você inicia o Adobe XD, é exibida uma tela inicial com acesso rápido às predefinições, aos arquivos de amostra, aos arquivos recentes e muito mais.
O fluxo de trabalho pode ser resumido nas seguintes etapas de alto nível:
Observação:
Continue lendo para obter mais detalhes sobre o fluxo de trabalho geral. Assista aos seguintes tutoriais em vídeo para ter uma prévia do que você pode fazer com o Adobe XD.
Inicie o Adobe XD.
A tela de boas-vindas é exibida.
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 não quiser especificar nenhum tamanho imediatamente, clique no ícone da opção Personalizado.
Reúna os ativos de uma das seguintes maneiras:
Aprimore os objetos em seu design. Alguns exemplos do que você pode fazer no Adobe XD incluem: combinar formas, mascarar, mover, redimensionar, girar, organizar, alinhar e distribuir objetos, definir propriedades de traçado e de preenchimento e muito mais.
Para obter mais informações, consulte:
Posicione seus elementos de design na prancheta. Use 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 repetição de elementos.
Adicione pranchetas a cada tela que você definirá no seu protótipo. Para obter mais informações, consulte Trabalhar com pranchetas.
Você pode criar protótipos ou wireframes criando vínculos entre pranchetas (telas) em um só arquivo do Adobe XD. A criação de protótipos ajuda os revisores a visualizar como os usuários navegarão pelas telas ou páginas. Você também pode gravar a interação como um arquivo .mp3.
Vincular pranchetas:
Para vincular uma prancheta a outra, selecione uma prancheta ou um objeto de uma prancheta e clique na seta à direita. Um fio aparecerá. Basta conectá-lo a outro objeto ou outra prancheta. Na janela pop-up, especifique as opções de transição e sua duração. Para obter mais informações, consulte Criar protótipos interativos.
Visualizar e gravar protótipos:
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 pelas páginas e salvá-la em formato .mp3.
Para obter mais informações, consulte Visualizar e gravar interações.
Não é possível fazer gravações de protótipos no Adobe XD para Windows.
Compartilhe protótipos com as partes interessadas do projeto de uma das seguintes maneiras:
Fazer logon em sua conta