Guia do Usuário Cancelar

Criar protótipos com teclados e controles

Pesquisar

Última atualização em 26/10/2021

Guia do usuário do Adobe XD
Introdução
Design
1. Pranchetas, guias e camadas
2. Formas, objetos e caminho
3. Texto e fontes
  1. Trabalhar com ferramentas de desenho e texto
  2. Fontes no Adobe XD
4. Componentes e estados
5. Mascaramento e efeitos
6. Layout
7. Vídeos e animações Lottie
Protótipo
Compartilhar, exportar e analisar
Sistemas de design
Documentos na nuvem
Integrações e plug-ins
XD para iOS e Android
1. Visualizar em dispositivos móveis
2. Perguntas frequentes sobre o Adobe XD para dispositivos móveis
Solução de problemas
1. Problemas conhecidos e corrigidos
  1. Problemas conhecidos
  2. Problemas corrigidos
2. Instalação e atualizações
3. Inicialização e falha
4. Documentos na nuvem e bibliotecas da Creative Cloud
5. Prototipagem, publicação e revisão
6. Importação, exportação e trabalho em outros aplicativos

Saiba como criar protótipos usando teclados e controles como acionadores.

O Adobe XD permite o uso de atalhos de teclado e botões de controle para simular aplicativos de desktop nativos e criar protótipos de experiências de jogo ou de design ainda melhores. Durante a vinculação de um protótipo, você pode selecionar Teclas e gamepad na lista suspensa Acionador e atribuir uma tecla ou botão. Depois, você pode reproduzir ou gravar essas animações na janela de visualização, no navegador ou em aplicativos para dispositivos móveis e compartilhá-las com os demais envolvidos no projeto para colaborarem na revisão. Isso ajuda a acompanhar melhor o progresso do protótipo, além de melhorar a experiência do usuário como um todo.

Você pode selecionar Teclas e gamepad para:

Vincular um objeto individual ou uma prancheta a outra prancheta.
Vincular dois estados de componente.
Vincular um estado de componente a outra prancheta.
Reproduzir fala, áudio, vídeo ou Lottie.

Trabalhar com acionadores de teclado

Ao criar determinados protótipos de aplicativos de desktop, recursos de acessibilidade, atalhos ou jogos, você precisa de um teclado para interagir com o protótipo. No protótipo, use os atalhos do teclado como acionadores para fazer a transição entre telas ou estados de componentes ou reproduzir fala, áudio, vídeo ou Lottie.

Durante a vinculação de um protótipo, selecione Teclas e gamepad. Em seguida, pressione qualquer tecla para defini-la como o acionador de um objeto individual, um estado de componente ou toda a prancheta, podendo ter vários acionadores em uma mesma prancheta.

Acionador de teclado — Acionadores de teclado

A. Acionador definido para o atalho de teclado B. Tecla de atalho C. Ação definida como animação automática D. Prancheta de destino ou estado de componente

Você também pode combinar uma tecla com um modificador para definir acionadores usando atalhos, como CMD+S e CTRL+R. No entanto, não é possível usar a barra de espaço e outras teclas de sistema, como as de função, repouso, volume e liga/desliga. Se você atribuir vários acionadores a um mesmo atalho na mesma prancheta, o último acionador será o único atribuído e funcional durante a visualização.

Trabalhar com acionadores de controle

A melhor maneira de testar um protótipo de jogo é usando um hardware real de controle de jogos. No protótipo, use gamepads como acionadores para fazer a transição entre telas ou estados de componentes ou reproduzir fala, áudio, vídeo ou Lottie. Em seguida, interaja com o protótipo em um executor de desktop ou navegador da Web usando um controlador de gamepad conectado.

Conecte um controle de Xbox (Series X/S ou One) por Bluetooth ou um controle de PlayStation (DualSense ou DualShock 4) por Bluetooth ou USB e selecione Teclas e gamepad. Em seguida, você poderá pressionar qualquer botão no controle conectado para defini-lo como o acionador de um objeto individual, um estado de componente ou toda a prancheta.

Acionador de controle — Acionadores de controle

A. Definir Acionador como Controle B. Botão de atalho do controle C. Ação definida como animação automática D. Prancheta de destino ou estado de componente

Use o mesmo controle para criar e testar o protótipo. Por exemplo, você só poderá testar um protótipo com um controle de Xbox no desktop ou na Web caso ele tenha sido criado usando um controle de Xbox.

Experiência em aplicativos e navegadores da Web para dispositivos móveis

O XD permite o uso de teclados e controles na visualização de protótipos da Web e aplicativos pelo desktop. Se você visualizar o protótipo em um aplicativo ou navegador para dispositivos móveis, poderá tocar para fazer a transição entre as pranchetas, já que não haverá um teclado ou controle conectado.

Controles e navegadores compatíveis

Compatibilidade com USB e Bluetooth:

Controle	Mac (USB)	Mac (Bluetooth)	Win (USB)	Windows (Bluetooth)
Xbox (Series X/S, One)	Não	Sim	Sim	Sim
PlayStation (DualSense, DualShock 4)	Sim	Sim	Sim	Sim

Compatibilidade com navegador:

Controle	Chrome (Mac)	Chrome (Windows)	Edge Chromium (Mac)	Edge Chromium (Windows)	Edge (antigo)	IE	Firefox (Mac e Windows)	Safari
Xbox (USB)	Não	Sim	Não	Sim	Não	Não	Não	Não
Xbox (Bluetooth)	Sim	Sim	Sim	Sim	Não	Não	Não	Não
PlayStation (USB)	Sim	Sim	Sim	Sim	Não	Não	Não	Não recomendado
PlayStation (Bluetooth)	Sim	Sim	Sim	Sim	Não	Não	Não	Não recomendado

Criar protótipos usando teclas de teclado ou botões de controle

Alterne para a guia Protótipo.
Para definir uma interação, clique no conector azul no objeto, estado de componente ou prancheta de origem. Defina as seguintes opções no Inspetor de propriedades:
- Acionador: defina o tipo de acionador como Teclas e gamepad e pressione uma tecla no teclado ou um botão no controle para definir um acionador, exceto a barra de espaço e outras teclas de sistema, como as de função, repouso, volume e liga/desliga.
- Tipo: selecione qualquer um dos tipos de ação disponíveis: Transição, Animação automática, Sobreposição, Rolar para, Prancheta anterior, Reprodução de áudio, Reprodução de fala, Reprodução de vídeo ou Reprodução do Lottie.
- Destino: defina a prancheta ou estado de componente de destino na lista suspensa (não disponível em alguns tipos de ação).
Assim que o tipo de ação for escolhido, defina as opções específicas para cada tipo de ação.
Para definir mais de uma interação para um objeto, estado de componente ou prancheta:
1. Selecione-o e clique no botão + na prancheta. Você também pode clicar no botão + no Inspetor de propriedades.
2. Defina as propriedades no Inspetor de propriedades.
Lembre-se de que você pode aplicar os acionadores Tocar, Arrastar, Focalizar e Tempo uma vez e Voz, Teclas e Controle várias vezes.
Para visualizar as alterações no desktop, selecione o ícone de Visualizar no desktop .
Para compartilhar seu protótipo com os envolvidos no projeto, no aplicativo de desktop do XD, selecione Compartilhar > Configurações de exibição > Revisão de design ou Desenvolvimento.