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.
Última atualização em
|
Também se aplica a Adobe XD
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
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
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:
- Selecionar, redimensionar e girar objetos
- Combinar objetos usando operações booleanas e mascarar objetos com formas
- Agrupar, bloquear e duplicar objetos
- Mover, alinhar, distribuir e organizar objetos
- Definir traçado, preenchimento e sombra projetada para objetos
- Usar redimensionamento responsivo e restrições
- Criar e gerenciar plug-ins
- Trabalhar com componentes
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.
Fazer logon em sua conta