Navegar em especificações de design

O link de compartilhamento para desenvolvimento ficou ainda mais completo com a inclusão de informações interativas de protótipo junto às especificações de design. Clique no ícone de alternância Exibir especificações  no link compartilhado para alternar entre a exibição das especificações de design e do protótipo. A nova experiência oferece as seguintes vantagens: 

• Agora, os designers podem informar com mais clareza o objetivo do projeto e fornecer aos desenvolvedores todos os recursos necessários em um único link compartilhado.
• Os desenvolvedores podem entender melhor as interações e os comportamentos esperados e poupar tempo, pois não é necessário alterar constantemente entre links separados de protótipos e de especificações de design. 
• Os desenvolvedores podem alternar facilmente entre as exibições de grade e de fluxo para exibir as especificações de design.

Para ter um panorama completo do fluxo de design com todas as informações de layout das pranchetas, você pode alternar entre as exibições de grade e de fluxo. 

Fácil de navegar, a Exibição de grade é um formato de grade simples das informações de layout das pranchetas, enquanto a Exibição de fluxo mantém o layout das pranchetas e sua arquitetura.

Para navegar usando a Exibição de grade, padrão, clique no nome do link ou no ícone de grade  no canto superior direito. Para alternar entre a Exibição de grade e a Exibição de fluxo, clique no ícone Exibição de fluxo no canto superior direito da tela. 

Fique à vontade para compartilhar seu feedback sobre essa nova experiência usando a voz do usuário do Adobe XD.

Exibição de especificações

A exibição de especificações mostra os detalhes, as cores, os estilos de caractere e os destinos usados da prancheta. Você pode usar a seta para expandir e recolher seções individuais.

No painel Propriedades, você pode exibir:

• Detalhes da prancheta, cores exclusivas e estilos de caractere usados nessa prancheta e a prancheta de destino à qual ela está vinculada.
• Os trechos de código CSS, que os desenvolvedores de design podem copiar e colar diretamente nos códigos.
• Instâncias nas quais as cores e estilos de caracteres foram usados quando você passa o ponteiro do mouse sobre elas.
• Códigos de cores hexadecimais e rótulos personalizados das cores usadas na prancheta.
• Detalhes de várias interações, como transições, propriedades do modo de mesclagem, sobreposições, voz, interações e animação automática. 
• Comentários relacionados à prancheta. 

Na parte inferior da tela, há várias teclas de setas e um ícone Inicial. A tecla de seta para a esquerda volta para a prancheta anterior, a tecla de seta para a direita avança para a próxima prancheta e o ícone Inicial direciona você para a prancheta inicial.

Para conhecer atalhos de teclado específicos para as especificações de design, consulte Atalhos de teclado.